mirror of
https://github.com/shishantbiswas/bknd.git
synced 2026-03-15 20:17:22 +00:00
json viewer: updated size display
This commit is contained in:
@@ -14,10 +14,10 @@ export function ensureInt(value?: string | number | null | undefined): number {
|
||||
|
||||
export const formatNumber = {
|
||||
fileSize: (bytes: number, decimals = 2): string => {
|
||||
if (bytes === 0) return "0 Bytes";
|
||||
if (bytes === 0) return "0 B";
|
||||
const k = 1024;
|
||||
const dm = decimals < 0 ? 0 : decimals;
|
||||
const sizes = ["Bytes", "KB", "MB", "GB", "TB"];
|
||||
const sizes = ["B", "KB", "MB", "GB", "TB"];
|
||||
const i = Math.floor(Math.log(bytes) / Math.log(k));
|
||||
return Number.parseFloat((bytes / k ** i).toFixed(dm)) + " " + sizes[i];
|
||||
},
|
||||
|
||||
@@ -4,6 +4,7 @@ import { twMerge } from "tailwind-merge";
|
||||
import { IconButton } from "../buttons/IconButton";
|
||||
import ErrorBoundary from "ui/components/display/ErrorBoundary";
|
||||
import { forwardRef, useImperativeHandle, useState } from "react";
|
||||
import { formatNumber } from "bknd/utils";
|
||||
|
||||
export type JsonViewerProps = {
|
||||
json: object | null;
|
||||
@@ -41,7 +42,8 @@ export const JsonViewer = ({
|
||||
copyIconProps = {},
|
||||
className,
|
||||
}: JsonViewerProps) => {
|
||||
const size = showSize ? (json === null ? 0 : (JSON.stringify(json)?.length ?? 0)) : undefined;
|
||||
const size = showSize ? (json === null ? 0 : JSON.stringify(json).length) : undefined;
|
||||
const formattedSize = formatNumber.fileSize(size ?? 0);
|
||||
const showContext = size || title || showCopy;
|
||||
|
||||
function onCopy() {
|
||||
@@ -55,7 +57,7 @@ export const JsonViewer = ({
|
||||
{(title || size !== undefined) && (
|
||||
<div className="flex flex-row">
|
||||
{title && <span>{title}</span>}{" "}
|
||||
{size !== undefined && <span>({size} Bytes)</span>}
|
||||
{size !== undefined && <span>({formattedSize})</span>}
|
||||
</div>
|
||||
)}
|
||||
{showCopy && (
|
||||
|
||||
Reference in New Issue
Block a user