feat(status-bar): compact large token counts with K/M units in usage popover

This commit is contained in:
xintaofei
2026-04-18 11:57:52 +08:00
parent 0e60216345
commit 6e477661f8

View File

@@ -16,14 +16,14 @@ const ICON_CENTER = 8
const ICON_VIEWBOX = 16 const ICON_VIEWBOX = 16
const ICON_CIRCUMFERENCE = 2 * Math.PI * ICON_RADIUS const ICON_CIRCUMFERENCE = 2 * Math.PI * ICON_RADIUS
function formatNumber(n: number): string {
return n.toLocaleString()
}
function formatTokenCount(n: number): string { function formatTokenCount(n: number): string {
if (n >= 1_000_000) return `${(n / 1_000_000).toFixed(1)}M` if (n >= 1_000_000) {
if (n >= 1_000) return `${(n / 1_000).toFixed(1)}K` return `${(n / 1_000_000).toFixed(1).replace(/\.0$/, "")}M`
return String(n) }
if (n >= 1_000) {
return `${(n / 1_000).toFixed(1).replace(/\.0$/, "")}K`
}
return n.toLocaleString()
} }
function formatPercent(percent: number | null): string { function formatPercent(percent: number | null): string {
@@ -192,7 +192,7 @@ export function StatusBarTokens() {
<span className="tabular-nums"> <span className="tabular-nums">
{contextUsed == null || contextMax == null {contextUsed == null || contextMax == null
? "--" ? "--"
: `${formatNumber(contextUsed)} / ${formatNumber(contextMax)}`} : `${formatTokenCount(contextUsed)} / ${formatTokenCount(contextMax)}`}
</span> </span>
</div> </div>
</div> </div>
@@ -214,7 +214,7 @@ export function StatusBarTokens() {
> >
<span>{t(row.key)}</span> <span>{t(row.key)}</span>
<span className="tabular-nums"> <span className="tabular-nums">
{formatNumber(row.value)} {formatTokenCount(row.value)}
</span> </span>
</div> </div>
))} ))}