pi-cliproxy-usage 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Villoh
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,64 @@
+# pi-cliproxy-usage
+
+Compact CLIProxyAPI account usage meters for Pi Coding Agent.
+
+Code layout:
+
+- `index.ts` — Pi lifecycle and command wiring
+- `src/settings.ts` / `src/settings-ui.ts` — persisted and interactive settings
+- `src/usage.ts` / `src/parsers.ts` — account discovery, provider requests, response mapping
+- `src/ui.ts` — widget rendering and text formatting
+
+Shows one colored line below editor per enabled account:
+
+```text
+◆ Claude user  S ███████░░░ 70%  │  W ████░░░░░░ 40%
+◆ Codex user   S █████████░ 90%
+◆ Grok user    W █████░░░░░ 50%
+```
+
+Percentages and filled bars show usage **consumed**. Colors shift green → yellow at 70% → red at 90%. Codex intentionally shows Session only; weekly meter is omitted.
+
+## Install
+
+```bash
+pi install ./path/to/pi-cliproxy-usage
+```
+
+Or test directly:
+
+```bash
+pi -e ./index.ts
+```
+
+## Settings
+
+User file: `<getAgentDir()>/pi-cliproxy-usage.json` (normally `~/.pi/agent/pi-cliproxy-usage.json`). Missing file uses defaults. Changes from interactive UI apply immediately. Settings reload on session start and `/reload`.
+
+Older `~/.pi/agent/extensions/pi-cliproxy-usage/config.json` files migrate automatically when canonical file does not exist.
+
+```json
+{
+  "accountsDir": "~/.cli-proxy-api",
+  "refreshMinutes": 5,
+  "providers": {
+    "claude": true,
+    "codex": true,
+    "grok": true
+  }
+}
+```
+
+Extension reads top-level CLIProxyAPI auth JSON files with `type` equal to `claude`, `codex`, or `xai`. Disabled auth files are skipped. Credentials stay local and are sent only to official provider usage endpoints documented by OpenUsage.
+
+Accepted values: `accountsDir` is a non-empty string, `refreshMinutes` is an integer of at least `1`, and provider values are booleans. Invalid values are ignored with a warning. Unknown fields are preserved when saving.
+
+## Commands
+
+- `/cliproxy-usage` — refresh and show detailed percentages
+- `/cliproxy-usage settings` — interactively edit refresh interval and provider toggles
+- `/cliproxy-usage status` — show effective values, source, and settings path
+- `/cliproxy-usage help` — show commands and manual settings path
+- `/cliproxy-usage config` — compatibility alias for `settings`
+
+Token refresh is deliberately left to CLIProxyAPI. If provider returns `401`/`403`, let CLIProxyAPI refresh account or log in again.

package/index.ts

@@ -0,0 +1,129 @@
+import {
+	type ExtensionAPI,
+	type ExtensionCommandContext,
+	type ExtensionContext,
+	getAgentDir,
+} from "@earendil-works/pi-coding-agent";
+import { join } from "node:path";
+import { loadSettings } from "./src/settings.js";
+import { showSettings } from "./src/settings-ui.js";
+import { readAccounts } from "./src/usage.js";
+import { clearUsage, formatDetails, renderUsage } from "./src/ui.js";
+import type { Settings } from "./src/types.js";
+
+const commands = ["settings", "status", "help", "config"];
+const SETTINGS_PATH = join(getAgentDir(), "pi-cliproxy-usage.json");
+const LEGACY_SETTINGS_PATH = join(
+	getAgentDir(),
+	"extensions",
+	"pi-cliproxy-usage",
+	"config.json",
+);
+
+export default function (pi: ExtensionAPI) {
+	let timer: ReturnType<typeof setInterval> | undefined;
+	let refreshing: Promise<void> | undefined;
+
+	const refresh = (ctx: ExtensionContext, notify = false) =>
+		(refreshing ??= (async () => {
+			const loaded = await loadSettings(SETTINGS_PATH, LEGACY_SETTINGS_PATH);
+			if (loaded.warnings.length && ctx.hasUI) {
+				ctx.ui.notify(loaded.warnings.join("; "), "warning");
+			}
+			const items = await readAccounts(loaded.settings);
+			renderUsage(ctx, items);
+			if (notify) {
+				ctx.ui.notify(
+					formatDetails(items),
+					items.some((item) => item.error) ? "warning" : "info",
+				);
+			}
+		})().finally(() => {
+			refreshing = undefined;
+		}));
+
+	const scheduleRefresh = (ctx: ExtensionContext, minutes: number) => {
+		if (timer) clearInterval(timer);
+		timer = setInterval(() => void refresh(ctx), minutes * 60_000);
+		timer.unref?.();
+	};
+
+	const applySettings = async (ctx: ExtensionContext, settings: Settings) => {
+		scheduleRefresh(ctx, settings.refreshMinutes);
+		await refresh(ctx);
+	};
+
+	const showStatus = async (ctx: ExtensionCommandContext) => {
+		const loaded = await loadSettings(SETTINGS_PATH, LEGACY_SETTINGS_PATH);
+		const providers = Object.entries(loaded.settings.providers)
+			.filter(([, enabled]) => enabled)
+			.map(([name]) => name)
+			.join(", ");
+		ctx.ui.notify(
+			[
+				`Settings: ${loaded.path}`,
+				`Accounts: ${loaded.settings.accountsDir}`,
+				`Refresh: ${loaded.settings.refreshMinutes} min`,
+				`Providers: ${providers || "none"}`,
+				`Source: ${Object.keys(loaded.raw).length ? "settings file" : "defaults"}`,
+			].join("\n"),
+			loaded.warnings.length ? "warning" : "info",
+		);
+	};
+
+	pi.on("session_start", async (_event, ctx) => {
+		const loaded = await loadSettings(SETTINGS_PATH, LEGACY_SETTINGS_PATH);
+		if (loaded.warnings.length && ctx.hasUI) {
+			ctx.ui.notify(loaded.warnings.join("; "), "warning");
+		}
+		await refresh(ctx);
+		scheduleRefresh(ctx, loaded.settings.refreshMinutes);
+	});
+
+	pi.on("session_shutdown", (_event, ctx) => {
+		if (timer) clearInterval(timer);
+		timer = undefined;
+		clearUsage(ctx);
+	});
+
+	pi.registerCommand("cliproxy-usage", {
+		description: "Refresh usage or manage extension settings",
+		getArgumentCompletions: (prefix) => {
+			const value = prefix.trim().toLowerCase();
+			const matches = commands
+				.filter((command) => command.startsWith(value))
+				.map((command) => ({ value: command, label: command }));
+			return matches.length ? matches : null;
+		},
+		handler: async (args, ctx) => {
+			const action = args.trim().toLowerCase();
+			if (!action) return refresh(ctx, true);
+			if (action === "settings" || action === "config") {
+				return showSettings(
+					ctx,
+					SETTINGS_PATH,
+					LEGACY_SETTINGS_PATH,
+					(settings) => applySettings(ctx, settings),
+				);
+			}
+			if (action === "status") return showStatus(ctx);
+			if (action === "help") {
+				ctx.ui.notify(
+					[
+						"/cliproxy-usage — refresh usage",
+						"/cliproxy-usage settings — edit settings",
+						"/cliproxy-usage status — show effective settings",
+						"/cliproxy-usage help — show this help",
+						`Manual settings: ${SETTINGS_PATH}`,
+					].join("\n"),
+					"info",
+				);
+				return;
+			}
+			ctx.ui.notify(
+				`Usage: /cliproxy-usage [${commands.join("|")}]`,
+				"warning",
+			);
+		},
+	});
+}

package/package.json

@@ -0,0 +1,28 @@
+{
+  "name": "pi-cliproxy-usage",
+  "version": "0.1.0",
+  "description": "Compact CLIProxyAPI account usage meters for Pi Coding Agent",
+  "type": "module",
+  "keywords": ["pi-package", "cliproxyapi", "usage"],
+  "license": "MIT",
+  "files": ["index.ts", "src", "README.md"],
+  "pi": {
+    "extensions": ["./index.ts"]
+  },
+  "peerDependencies": {
+    "@earendil-works/pi-coding-agent": "*"
+  },
+  "devDependencies": {
+    "@earendil-works/pi-agent-core": "0.80.10",
+    "@earendil-works/pi-ai": "0.80.10",
+    "@earendil-works/pi-coding-agent": "0.80.10",
+    "@earendil-works/pi-tui": "0.80.10",
+    "@types/node": "^24.10.0",
+    "tsx": "^4.20.6",
+    "typescript": "^5.9.3"
+  },
+  "scripts": {
+    "check": "tsc --noEmit",
+    "test": "node --import tsx --test test/**/*.test.ts"
+  }
+}

package/src/parsers.ts

@@ -0,0 +1,82 @@
+import type { AccountUsage, UsageWindow } from "./types.js";
+
+export function toNumber(value: unknown): number | undefined {
+	if (typeof value === "number" && Number.isFinite(value)) return value;
+	if (typeof value === "string" && value.trim()) {
+		const parsed = Number(value);
+		if (Number.isFinite(parsed)) return parsed;
+	}
+	return undefined;
+}
+
+function toDate(value: unknown): Date | undefined {
+	if (typeof value === "string") {
+		const parsed = new Date(value);
+		return Number.isNaN(parsed.getTime()) ? undefined : parsed;
+	}
+	const raw = toNumber(value);
+	if (raw === undefined) return undefined;
+	return new Date(raw < 1e10 ? raw * 1000 : raw);
+}
+
+export function parseClaude(
+	body: unknown,
+): Pick<AccountUsage, "session" | "weekly"> {
+	const root = body as Record<string, unknown>;
+	const window = (value: unknown): UsageWindow | undefined => {
+		const item = value as Record<string, unknown> | undefined;
+		const used = toNumber(item?.utilization);
+		return used === undefined
+			? undefined
+			: { used, resetsAt: toDate(item?.resets_at) };
+	};
+	return { session: window(root?.five_hour), weekly: window(root?.seven_day) };
+}
+
+function codexWindow(
+	value: unknown,
+): (UsageWindow & { seconds?: number }) | undefined {
+	const item = value as Record<string, unknown> | undefined;
+	const used = toNumber(item?.used_percent);
+	if (used === undefined) return undefined;
+	const resetAfter = toNumber(item?.reset_after_seconds);
+	return {
+		used,
+		seconds: toNumber(item?.limit_window_seconds),
+		resetsAt:
+			toDate(item?.reset_at) ??
+			(resetAfter === undefined
+				? undefined
+				: new Date(Date.now() + resetAfter * 1000)),
+	};
+}
+
+export function parseCodex(body: unknown): Pick<AccountUsage, "session"> {
+	const rate = (body as Record<string, unknown>)?.rate_limit as
+		| Record<string, unknown>
+		| undefined;
+	const windows = [
+		codexWindow(rate?.primary_window),
+		codexWindow(rate?.secondary_window),
+	].filter(Boolean) as Array<UsageWindow & { seconds?: number }>;
+	return {
+		session:
+			windows.find((item) => item.seconds === 18_000) ??
+			windows.find((item) => item.seconds !== 604_800) ??
+			windows[0],
+	};
+}
+
+export function parseGrok(body: unknown): Pick<AccountUsage, "weekly"> {
+	const config = (body as Record<string, unknown>)?.config as
+		| Record<string, unknown>
+		| undefined;
+	const period = config?.currentPeriod as Record<string, unknown> | undefined;
+	if (period?.type !== "USAGE_PERIOD_TYPE_WEEKLY") return {};
+	return {
+		weekly: {
+			used: toNumber(config?.creditUsagePercent) ?? 0,
+			resetsAt: toDate(period.end),
+		},
+	};
+}

package/src/settings-ui.ts

@@ -0,0 +1,136 @@
+import {
+	type ExtensionCommandContext,
+	getSettingsListTheme,
+} from "@earendil-works/pi-coding-agent";
+import {
+	Container,
+	Input,
+	type SettingItem,
+	SettingsList,
+	Text,
+} from "@earendil-works/pi-tui";
+import { loadSettings, saveSettings } from "./settings.js";
+import type { ProviderName, Settings } from "./types.js";
+
+const providerIds = new Set<ProviderName>(["claude", "codex", "grok"]);
+
+export async function showSettings(
+	ctx: ExtensionCommandContext,
+	settingsPath: string,
+	legacySettingsPath: string,
+	onChange: (settings: Settings) => Promise<void>,
+): Promise<void> {
+	if (ctx.mode !== "tui") {
+		if (ctx.hasUI)
+			ctx.ui.notify(`Edit settings manually: ${settingsPath}`, "info");
+		return;
+	}
+
+	const loaded = await loadSettings(settingsPath, legacySettingsPath);
+	if (!loaded.writable) {
+		ctx.ui.notify(
+			`Cannot edit invalid settings: ${loaded.warnings.join(", ")}`,
+			"error",
+		);
+		return;
+	}
+	let settings = loaded.settings;
+	let raw = loaded.raw;
+	let saveQueue = Promise.resolve();
+
+	await ctx.ui.custom((tui, theme, _keybindings, done) => {
+		const items: SettingItem[] = [
+			{
+				id: "accountsDir",
+				label: "Accounts directory",
+				description: "Directory containing CLIProxyAPI account JSON files",
+				currentValue: settings.accountsDir,
+				submenu: (currentValue, close) => {
+					const input = new Input();
+					input.setValue(currentValue);
+					input.onSubmit = (value) => close(value.trim() || undefined);
+					input.onEscape = () => close(undefined);
+					return input;
+				},
+			},
+			{
+				id: "refreshMinutes",
+				label: "Refresh interval",
+				description: "Minutes between automatic usage refreshes",
+				currentValue: String(settings.refreshMinutes),
+				values: ["1", "5", "10", "15", "30", "60"],
+			},
+			...(["claude", "codex", "grok"] as const).map((provider) => ({
+				id: provider,
+				label: `${provider[0]?.toUpperCase()}${provider.slice(1)}`,
+				description: `Show ${provider} accounts`,
+				currentValue: settings.providers[provider] ? "enabled" : "disabled",
+				values: ["enabled", "disabled"],
+			})),
+		];
+		const container = new Container();
+		container.addChild(
+			new Text(
+				theme.fg("accent", theme.bold("CLIProxyAPI Usage Settings")),
+				1,
+				1,
+			),
+		);
+		const list = new SettingsList(
+			items,
+			Math.min(items.length + 2, 15),
+			getSettingsListTheme(),
+			(id, value) => {
+				const previous = structuredClone(settings);
+				if (id === "accountsDir") settings.accountsDir = value;
+				if (id === "refreshMinutes") settings.refreshMinutes = Number(value);
+				if (providerIds.has(id as ProviderName)) {
+					settings.providers[id as ProviderName] = value === "enabled";
+				}
+				const next = structuredClone(settings);
+				saveQueue = saveQueue
+					.then(async () => {
+						raw = await saveSettings(next, raw, settingsPath);
+						await onChange(next);
+					})
+					.catch((error) => {
+						settings = previous;
+						let previousValue: string;
+						if (id === "accountsDir") previousValue = previous.accountsDir;
+						else if (id === "refreshMinutes") {
+							previousValue = String(previous.refreshMinutes);
+						} else {
+							previousValue = previous.providers[id as ProviderName]
+								? "enabled"
+								: "disabled";
+						}
+						list.updateValue(id, previousValue);
+						ctx.ui.notify(`Failed to save settings: ${error.message}`, "error");
+						tui.requestRender();
+					});
+			},
+			() => done(undefined),
+			{ enableSearch: true },
+		);
+		container.addChild(list);
+		container.addChild(
+			new Text(
+				theme.fg(
+					"dim",
+					`Accounts directory: ${settings.accountsDir}\n${settingsPath}`,
+				),
+				1,
+				1,
+			),
+		);
+		return {
+			render: (width: number) => container.render(width),
+			invalidate: () => container.invalidate(),
+			handleInput(data: string) {
+				list.handleInput?.(data);
+				tui.requestRender();
+			},
+		};
+	});
+	await saveQueue;
+}

package/src/settings.ts

@@ -0,0 +1,151 @@
+import { mkdir, readFile, rename, rm, stat, writeFile } from "node:fs/promises";
+import { dirname } from "node:path";
+import type { Settings } from "./types.js";
+
+export const DEFAULT_SETTINGS: Settings = {
+	accountsDir: "~/.cli-proxy-api",
+	refreshMinutes: 5,
+	providers: { claude: true, codex: true, grok: true },
+};
+
+type JsonObject = Record<string, unknown>;
+
+export type LoadedSettings = {
+	settings: Settings;
+	raw: JsonObject;
+	path: string;
+	warnings: string[];
+	writable: boolean;
+};
+
+function isObject(value: unknown): value is JsonObject {
+	return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+
+export function normalizeSettings(value: unknown): {
+	settings: Settings;
+	raw: JsonObject;
+	warnings: string[];
+} {
+	if (!isObject(value))
+		throw new Error("settings file must contain a JSON object");
+	const warnings: string[] = [];
+	const providers = isObject(value.providers) ? value.providers : {};
+	const settings: Settings = structuredClone(DEFAULT_SETTINGS);
+
+	if (typeof value.accountsDir === "string" && value.accountsDir.trim()) {
+		settings.accountsDir = value.accountsDir.trim();
+	} else if (value.accountsDir !== undefined) {
+		warnings.push("ignored invalid accountsDir");
+	}
+	if (
+		typeof value.refreshMinutes === "number" &&
+		Number.isInteger(value.refreshMinutes) &&
+		value.refreshMinutes >= 1
+	) {
+		settings.refreshMinutes = value.refreshMinutes;
+	} else if (value.refreshMinutes !== undefined) {
+		warnings.push("ignored invalid refreshMinutes");
+	}
+	for (const provider of ["claude", "codex", "grok"] as const) {
+		if (typeof providers[provider] === "boolean") {
+			settings.providers[provider] = providers[provider];
+		} else if (providers[provider] !== undefined) {
+			warnings.push(`ignored invalid providers.${provider}`);
+		}
+	}
+	return { settings, raw: value, warnings };
+}
+
+async function migrateLegacyFile(
+	settingsPath: string,
+	legacyPath: string,
+): Promise<void> {
+	try {
+		await stat(settingsPath);
+		return;
+	} catch (error) {
+		if ((error as NodeJS.ErrnoException).code !== "ENOENT") throw error;
+	}
+
+	let bytes: Buffer;
+	try {
+		bytes = await readFile(legacyPath);
+		normalizeSettings(JSON.parse(bytes.toString("utf8")));
+	} catch {
+		return;
+	}
+
+	await mkdir(dirname(settingsPath), { recursive: true });
+	try {
+		await writeFile(settingsPath, bytes, { flag: "wx", mode: 0o600 });
+	} catch (error) {
+		if ((error as NodeJS.ErrnoException).code !== "EEXIST") throw error;
+		return;
+	}
+	const current = await readFile(legacyPath).catch(() => undefined);
+	if (current?.equals(bytes)) await rm(legacyPath);
+}
+
+export async function loadSettings(
+	settingsPath: string,
+	legacyPath: string,
+): Promise<LoadedSettings> {
+	await migrateLegacyFile(settingsPath, legacyPath);
+	let text: string;
+	try {
+		text = await readFile(settingsPath, "utf8");
+	} catch (error) {
+		if ((error as NodeJS.ErrnoException).code === "ENOENT") {
+			return {
+				settings: structuredClone(DEFAULT_SETTINGS),
+				raw: {},
+				path: settingsPath,
+				warnings: [],
+				writable: true,
+			};
+		}
+		throw error;
+	}
+	try {
+		return {
+			...normalizeSettings(JSON.parse(text)),
+			path: settingsPath,
+			writable: true,
+		};
+	} catch (error) {
+		return {
+			settings: structuredClone(DEFAULT_SETTINGS),
+			raw: {},
+			path: settingsPath,
+			warnings: [(error as Error).message],
+			writable: false,
+		};
+	}
+}
+
+export async function saveSettings(
+	settings: Settings,
+	raw: JsonObject,
+	settingsPath: string,
+): Promise<JsonObject> {
+	const next: JsonObject = {
+		...raw,
+		...settings,
+		providers: {
+			...(isObject(raw.providers) ? raw.providers : {}),
+			...settings.providers,
+		},
+	};
+	await mkdir(dirname(settingsPath), { recursive: true });
+	const temporaryPath = `${settingsPath}.${process.pid}.${Date.now()}.tmp`;
+	try {
+		await writeFile(temporaryPath, `${JSON.stringify(next, null, 2)}\n`, {
+			mode: 0o600,
+		});
+		await rename(temporaryPath, settingsPath);
+	} finally {
+		await rm(temporaryPath, { force: true });
+	}
+	return next;
+}

package/src/types.ts

@@ -0,0 +1,42 @@
+export type ProviderName = "claude" | "codex" | "grok";
+
+export type Settings = {
+	accountsDir: string;
+	refreshMinutes: number;
+	providers: Record<ProviderName, boolean>;
+};
+
+export type Config = Settings;
+
+export type UsageWindow = {
+	used: number;
+	resetsAt?: Date;
+};
+
+export type AccountUsage = {
+	provider: ProviderName;
+	label: string;
+	session?: UsageWindow;
+	weekly?: UsageWindow;
+	error?: string;
+};
+
+export type Theme = {
+	fg(color: string, text: string): string;
+};
+
+export type UiContext = {
+	mode: string;
+	ui: {
+		theme: Theme;
+		setStatus(id: string, text: string | undefined): void;
+		setWidget(
+			id: string,
+			content: unknown,
+			options?: { placement: "belowEditor" },
+		): void;
+		notify(message: string, level: "info" | "warning" | "error"): void;
+		select(title: string, options: string[]): Promise<string | undefined>;
+		input(title: string, placeholder?: string): Promise<string | undefined>;
+	};
+};

package/src/ui.ts

@@ -0,0 +1,131 @@
+import type {
+	AccountUsage,
+	ProviderName,
+	Theme,
+	UiContext,
+	UsageWindow,
+} from "./types.js";
+
+const PROVIDER_LABELS: Record<ProviderName, string> = {
+	claude: "Claude",
+	codex: "Codex",
+	grok: "Grok",
+};
+
+function accountLabel(label: string): string {
+	const local = label.includes("@") ? label.split("@")[0] : label;
+	return local.slice(0, 18);
+}
+
+export function usageBar(used: number, width = 10): string {
+	const percent = Math.max(0, Math.min(100, used));
+	const filled = Math.round((percent / 100) * width);
+	return "█".repeat(filled) + "░".repeat(width - filled);
+}
+
+export function formatCompact(items: AccountUsage[]): string {
+	return items
+		.map((item) => {
+			if (item.error) {
+				return `${PROVIDER_LABELS[item.provider]} ${accountLabel(item.label)}: ! ${item.error}`;
+			}
+			const windows = [
+				item.session &&
+					`S ${usageBar(item.session.used)} ${Math.round(item.session.used)}%`,
+				item.weekly &&
+					`W ${usageBar(item.weekly.used)} ${Math.round(item.weekly.used)}%`,
+			].filter(Boolean);
+			return `${PROVIDER_LABELS[item.provider]} ${accountLabel(item.label)}  ${windows.join("  ") || "–"}`;
+		})
+		.join("\n");
+}
+
+export function formatDetails(items: AccountUsage[]): string {
+	if (!items.length) return "No enabled CLIProxyAPI accounts found.";
+	return items
+		.map((item) => {
+			if (item.error) return `${item.provider}/${item.label}: ${item.error}`;
+			const windows = [
+				item.session && `Session ${item.session.used.toFixed(0)}% used`,
+				item.weekly && `Weekly ${item.weekly.used.toFixed(0)}% used`,
+			].filter(Boolean);
+			return `${item.provider}/${item.label}: ${windows.join(" · ") || "No usage window"}`;
+		})
+		.join("\n");
+}
+
+function truncateAnsi(text: string, width: number): string {
+	let visible = 0;
+	let result = "";
+	for (let index = 0; index < text.length && visible < width; ) {
+		if (text[index] === "\u001b") {
+			const match = text.slice(index).match(/^\u001b\[[0-?]*[ -/]*[@-~]/);
+			if (match) {
+				result += match[0];
+				index += match[0].length;
+				continue;
+			}
+		}
+		const point = text.codePointAt(index);
+		if (point === undefined) break;
+		result += String.fromCodePoint(point);
+		index += point > 0xffff ? 2 : 1;
+		visible++;
+	}
+	return `${result}\u001b[0m`;
+}
+
+export function clearUsage(ctx: UiContext): void {
+	ctx.ui.setStatus("cliproxy-usage", undefined);
+	ctx.ui.setWidget("cliproxy-usage", undefined);
+}
+
+export function renderUsage(ctx: UiContext, items: AccountUsage[]): void {
+	ctx.ui.setStatus("cliproxy-usage", undefined);
+	if (!items.length) {
+		ctx.ui.setWidget("cliproxy-usage", undefined);
+		return;
+	}
+	ctx.ui.setWidget(
+		"cliproxy-usage",
+		(_tui: unknown, theme: Theme) => ({
+			invalidate() {},
+			render(width: number): string[] {
+				return items.map((item) => {
+					const providerColor =
+						item.provider === "claude"
+							? "warning"
+							: item.provider === "codex"
+								? "success"
+								: "accent";
+					const prefix =
+						theme.fg(providerColor, `◆ ${PROVIDER_LABELS[item.provider]}`) +
+						theme.fg("muted", ` ${accountLabel(item.label)}`);
+					if (item.error) {
+						return truncateAnsi(
+							`${prefix}  ${theme.fg("error", `! ${item.error}`)}`,
+							width,
+						);
+					}
+					const meter = (name: string, usage: UsageWindow) => {
+						const used = Math.max(0, Math.min(100, usage.used));
+						const color =
+							used >= 90 ? "error" : used >= 70 ? "warning" : "success";
+						const filled = usageBar(used).replace(/░+$/, "");
+						const empty = "░".repeat(10 - filled.length);
+						return `${theme.fg("muted", name)} ${theme.fg(color, filled)}${theme.fg("dim", empty)} ${theme.fg(color, `${Math.round(used)}%`)}`;
+					};
+					const windows = [
+						item.session && meter("S", item.session),
+						item.weekly && meter("W", item.weekly),
+					].filter(Boolean);
+					return truncateAnsi(
+						`${prefix}  ${windows.join(theme.fg("dim", "  │  "))}`,
+						width,
+					);
+				});
+			},
+		}),
+		{ placement: "belowEditor" },
+	);
+}

package/src/usage.ts

@@ -0,0 +1,131 @@
+import { readFile, readdir } from "node:fs/promises";
+import { homedir } from "node:os";
+import { basename, join, resolve } from "node:path";
+import { parseClaude, parseCodex, parseGrok, toNumber } from "./parsers.js";
+import type { AccountUsage, Config, ProviderName } from "./types.js";
+
+type AuthFile = {
+	type?: string;
+	email?: string;
+	access_token?: string;
+	account_id?: string;
+	disabled?: boolean;
+};
+
+const PROVIDERS = new Set<ProviderName>(["claude", "codex", "grok"]);
+const USAGE_URLS = {
+	claude: "https://api.anthropic.com/api/oauth/usage",
+	codex: "https://chatgpt.com/backend-api/wham/usage",
+	grok: "https://cli-chat-proxy.grok.com/v1/billing?format=credits",
+} as const;
+
+function expandHome(path: string): string {
+	if (path === "~") return homedir();
+	if (path.startsWith("~/") || path.startsWith("~\\")) {
+		return join(homedir(), path.slice(2));
+	}
+	return resolve(path);
+}
+
+function providerName(type?: string): ProviderName | undefined {
+	const provider = type === "xai" ? "grok" : type;
+	return PROVIDERS.has(provider as ProviderName)
+		? (provider as ProviderName)
+		: undefined;
+}
+
+async function request(
+	url: string,
+	token: string,
+	headers: Record<string, string> = {},
+): Promise<{ body: unknown; headers: Headers }> {
+	const response = await fetch(url, {
+		headers: {
+			Authorization: `Bearer ${token}`,
+			Accept: "application/json",
+			"User-Agent": "pi-cliproxy-usage",
+			...headers,
+		},
+		signal: AbortSignal.timeout(10_000),
+	});
+	if (!response.ok) throw new Error(`HTTP ${response.status}`);
+	return { body: await response.json(), headers: response.headers };
+}
+
+async function fetchUsage(
+	provider: ProviderName,
+	auth: AuthFile,
+	file: string,
+): Promise<AccountUsage> {
+	const label =
+		auth.email || basename(file, ".json").replace(/^(claude|codex|xai)-/, "");
+	try {
+		if (!auth.access_token) throw new Error("missing access_token");
+		if (provider === "claude") {
+			const { body } = await request(USAGE_URLS.claude, auth.access_token, {
+				"anthropic-beta": "oauth-2025-04-20",
+				"Content-Type": "application/json",
+			});
+			return { provider, label, ...parseClaude(body) };
+		}
+		if (provider === "codex") {
+			const headers: Record<string, string> = {};
+			if (auth.account_id) headers["ChatGPT-Account-Id"] = auth.account_id;
+			const response = await request(
+				USAGE_URLS.codex,
+				auth.access_token,
+				headers,
+			);
+			const parsed = parseCodex(response.body);
+			if (!parsed.session) {
+				const used = toNumber(
+					response.headers.get("x-codex-primary-used-percent"),
+				);
+				if (used !== undefined) parsed.session = { used };
+			}
+			return { provider, label, ...parsed };
+		}
+		const { body } = await request(USAGE_URLS.grok, auth.access_token, {
+			"X-XAI-Token-Auth": "xai-grok-cli",
+		});
+		return { provider, label, ...parseGrok(body) };
+	} catch (error) {
+		return {
+			provider,
+			label,
+			error: error instanceof Error ? error.message : String(error),
+		};
+	}
+}
+
+async function readAccount(
+	dir: string,
+	name: string,
+	config: Config,
+): Promise<AccountUsage | undefined> {
+	try {
+		const file = join(dir, name);
+		const auth = JSON.parse(await readFile(file, "utf8")) as AuthFile;
+		const provider = providerName(auth.type);
+		if (!provider || auth.disabled || !config.providers[provider])
+			return undefined;
+		return fetchUsage(provider, auth, file);
+	} catch {
+		return undefined;
+	}
+}
+
+export async function readAccounts(config: Config): Promise<AccountUsage[]> {
+	const dir = expandHome(config.accountsDir);
+	try {
+		const names = (await readdir(dir)).filter((name) =>
+			name.toLowerCase().endsWith(".json"),
+		);
+		const accounts = await Promise.all(
+			names.map((name) => readAccount(dir, name, config)),
+		);
+		return accounts.filter(Boolean) as AccountUsage[];
+	} catch {
+		return [];
+	}
+}