@aaroncarry/pi-usage 0.1.0

package/src/ui/card.ts

@@ -0,0 +1,82 @@
+/**
+ * /usage result card: a custom session entry rendered inline in the chat
+ * transcript (pi convention for info commands — no focus capture, survives
+ * reload/session restore). Content mirrors what the old overlay showed:
+ * per-account plan, usage window bars, monetary balances, and errors, with
+ * the active account first.
+ */
+
+import { Box, Text, type Component } from "@earendil-works/pi-tui";
+import { formatBar, formatMoney, formatResetSuffix } from "../format.ts";
+import type { AccountBalance } from "../types.ts";
+import type { ThemeLike } from "./statusline.ts";
+
+export interface UsageCardData {
+	balances: AccountBalance[];
+	activeProviderId?: string;
+	/** Epoch ms when the snapshot was taken. */
+	generatedAt: number;
+}
+
+function displayTitle(balance: AccountBalance): string {
+	return balance.plan ? `${balance.label} (${balance.plan})` : balance.label;
+}
+
+export function buildUsageCard(data: UsageCardData, theme: ThemeLike): Component {
+	const box = new Box(1, 1, (text) => theme.bg("customMessageBg", text));
+	const time = new Date(data.generatedAt).toLocaleTimeString(undefined, { hour: "2-digit", minute: "2-digit" });
+	box.addChild(new Text(`${theme.fg("accent", theme.bold("Usage"))} ${theme.fg("dim", `· ${time}`)}`, 0, 0));
+
+	const ids = data.balances.map((balance) => balance.providerId);
+	if (ids.length === 0) {
+		box.addChild(new Text(theme.fg("muted", "No configured accounts (nothing usable in auth.json)"), 0, 1));
+	}
+	const ordered = orderActiveFirst(data.balances, data.activeProviderId);
+	for (const balance of ordered) {
+		const marker = balance.providerId === data.activeProviderId ? theme.fg("accent", "●") : theme.fg("dim", "○");
+		const titleText =
+			balance.providerId === data.activeProviderId
+				? theme.fg("accent", theme.bold(displayTitle(balance)))
+				: theme.fg("muted", displayTitle(balance));
+		box.addChild(new Text(`${marker} ${titleText}`, 0, 1));
+		for (const line of renderAccount(balance, theme)) {
+			box.addChild(line);
+		}
+	}
+	return box;
+}
+
+function orderActiveFirst(balances: AccountBalance[], activeProviderId?: string): AccountBalance[] {
+	if (!activeProviderId) return [...balances];
+	const active = balances.filter((balance) => balance.providerId === activeProviderId);
+	const rest = balances.filter((balance) => balance.providerId !== activeProviderId);
+	return [...active, ...rest];
+}
+
+function renderAccount(balance: AccountBalance, theme: ThemeLike): Text[] {
+	if (balance.error) {
+		return [new Text(theme.fg("error", `  ${balance.error}`), 0, 0)];
+	}
+	const children: Text[] = [];
+	for (const window of balance.windows) {
+		const color = window.usedPercent >= 90 ? "error" : window.usedPercent >= 70 ? "warning" : "accent";
+		const barLine =
+			`  ${theme.fg("dim", window.label.padEnd(8))}${theme.fg(color, formatBar(window.usedPercent))}` +
+			` ${String(Math.round(window.usedPercent)).padStart(3)}%${theme.fg("dim", formatResetSuffix(window.resetsAt))}`;
+		children.push(new Text(barLine, 0, 0));
+	}
+	if (balance.balance) {
+		const note = balance.balance.note ? `  ${theme.fg("dim", balance.balance.note)}` : "";
+		children.push(
+			new Text(
+				`  ${theme.fg("dim", "Balance")}${theme.fg("success", ` ${formatMoney(balance.balance)}`)}${note}`,
+				0,
+				0,
+			),
+		);
+	}
+	for (const noteEntry of balance.notes) {
+		children.push(new Text(theme.fg("dim", `  ${noteEntry}`), 0, 0));
+	}
+	return children;
+}

package/src/ui/statusline.ts

@@ -0,0 +1,77 @@
+/**
+ * Footer status line rendering: one dense row injected via
+ * ctx.ui.setStatus("usage", ...). The default ("all") shows every configured
+ * account on that row — active account first and unstyled, the rest dimmed —
+ * so the dedicated footer line carries full value. "active" shows only the
+ * active account with all of its windows; "off" hides the row.
+ */
+
+import type { StatusMode } from "../config.ts";
+import { formatMoney } from "../format.ts";
+import { formatTokens, type SessionUsageTotals } from "../session-usage.ts";
+import type { AccountBalance } from "../types.ts";
+
+/** Structural subset of pi's Theme used by the status line/panel. */
+export interface ThemeLike {
+	fg(color: "dim" | "muted" | "accent" | "success" | "warning" | "error", text: string): string;
+	bold(text: string): string;
+	bg(color: "customMessageBg", text: string): string;
+}
+
+const MAX_STATUS_SEGMENTS = 6;
+
+export function orderActiveFirst(balances: AccountBalance[], activeProviderId?: string): AccountBalance[] {
+	if (!activeProviderId) return [...balances];
+	const active = balances.filter((balance) => balance.providerId === activeProviderId);
+	const rest = balances.filter((balance) => balance.providerId !== activeProviderId);
+	return [...active, ...rest];
+}
+
+/** Compact per-account summary, e.g. "Codex 5h 13%" or "GLM ¥21.46". */
+export function accountSummary(balance: AccountBalance, options?: { allWindows?: boolean }): string {
+	if (balance.error) return `${balance.label} !`;
+	const parts: string[] = [];
+	const windows = options?.allWindows ? balance.windows : balance.windows.slice(0, 1);
+	for (const window of windows) {
+		parts.push(`${window.label} ${Math.round(window.usedPercent)}%`);
+	}
+	if (balance.balance) parts.push(formatMoney(balance.balance));
+	return parts.length > 0 ? `${balance.label} ${parts.join(" · ")}` : balance.label;
+}
+
+/**
+ * Consumption segment (plan B): session totals, tokens always and real cost
+ * only when non-zero, e.g. "session 87k tok · $0.020".
+ */
+export function formatConsumptionSegment(consumption: SessionUsageTotals | undefined, theme: ThemeLike): string | undefined {
+	if (!consumption || (consumption.tokens === 0 && consumption.cost === 0)) return undefined;
+	let text = theme.fg("dim", `session ${formatTokens(consumption.tokens)} tok`);
+	if (consumption.cost > 0) {
+		text += ` ${theme.fg("success", `$${consumption.cost.toFixed(3)}`)}`;
+	}
+	return text;
+}
+
+export function formatStatusLine(options: {
+	balances: AccountBalance[];
+	mode: StatusMode;
+	activeProviderId?: string;
+	theme: ThemeLike;
+	consumption?: SessionUsageTotals;
+}): string | undefined {
+	if (options.mode === "off") return undefined;
+	const ordered = orderActiveFirst(options.balances, options.activeProviderId);
+	const selected =
+		options.mode === "active"
+			? ordered.filter((balance) => balance.providerId === options.activeProviderId)
+			: ordered;
+	const segments = selected.slice(0, MAX_STATUS_SEGMENTS).map((balance) => {
+		const text = accountSummary(balance, { allWindows: options.mode === "active" });
+		if (balance.error) return options.theme.fg("error", text);
+		return balance.providerId === options.activeProviderId ? text : options.theme.fg("dim", text);
+	});
+	const consumptionSegment = formatConsumptionSegment(options.consumption, options.theme);
+	if (consumptionSegment) segments.push(consumptionSegment);
+	if (segments.length === 0) return undefined;
+	return segments.join(options.theme.fg("dim", " · "));
+}