json viewer: updated size display

This commit is contained in:
dswbx
2025-08-28 19:35:32 +02:00
parent dcf88cf587
commit 8f471a29b0
2 changed files with 6 additions and 4 deletions

View File

@@ -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];
},

View File

@@ -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 && (