opencode-usage-report 0.3.0 → 0.4.1

package/src/providers/opencode-go.ts

@@ -10,9 +10,8 @@ import type {
 import { AdapterError } from "../types";
 import { toISODate, toNumber } from "../normalize";
 import { redact } from "../auth";
+import { asRecord, handleError, readBody, request } from "./http";
 
-const VERSION = "0.3.0";
-const USER_AGENT = "opencode-usage-report/" + VERSION;
 const ENDPOINT = "https://opencode.ai/zen/go/v1/usage";
 
 /** Additive options: `sessionId` is optional, so the adapter still satisfies `ProviderAdapter`. */
@@ -28,12 +27,6 @@ function mapStatus(v: unknown): WindowStatus {
   return v === "ok" || v === "rate-limited" ? v : "unknown";
 }
 
-function asRecord(v: unknown): Record<string, unknown> | null {
-  return v !== null && typeof v === "object" && !Array.isArray(v)
-    ? (v as Record<string, unknown>)
-    : null;
-}
-
 function buildWindow(kind: WindowKind, label: string, src: unknown): UsageWindow | null {
   const record = asRecord(src);
   if (!record) return null;
@@ -49,91 +42,42 @@ function buildWindow(kind: WindowKind, label: string, src: unknown): UsageWindow
   };
 }
 
-/** Reads the body once as text and best-effort parses JSON, so error and success paths share it. */
-async function readBody(res: Response): Promise<{ text: string; json: unknown }> {
-  const text = await res.text().catch(() => "");
-  let json: unknown = null;
-  try {
-    json = JSON.parse(text);
-  } catch {
-    json = null;
-  }
-  return { text, json };
-}
-
-async function attempt(cred: Credential, opts: OpenCodeGoFetchOptions): Promise<Response> {
-  return fetch(ENDPOINT, {
-    method: "GET",
-    headers: {
-      Authorization: "Bearer " + cred.key,
-      Accept: "application/json",
-      "User-Agent": USER_AGENT,
-      "x-opencode-session": opts.sessionId ?? "unknown",
-    },
-    signal: AbortSignal.timeout(opts.timeoutMs),
-  });
-}
-
-/** Exactly one retry on a network throw or 5xx; 4xx is returned immediately (never retried). */
-async function request(cred: Credential, opts: OpenCodeGoFetchOptions): Promise<Response> {
-  try {
-    const first = await attempt(cred, opts);
-    if (first.status < 500) return first;
-  } catch {
-    // fall through to the single retry
-  }
-
-  try {
-    return await attempt(cred, opts);
-  } catch (err) {
-    throw new AdapterError(
-      "network",
-      redact(
-        `OpenCode Go request failed: ${err instanceof Error ? err.message : String(err)}`,
-        cred.key,
-      ),
-    );
-  }
-}
-
-async function handleError(res: Response, cred: Credential): Promise<never> {
-  const { text, json } = await readBody(res);
-
-  if (res.status === 401) {
-    throw new AdapterError("auth", redact("invalid OpenCode Go API key", cred.key));
-  }
-  if (res.status === 403) {
-    const record = asRecord(json);
-    const error = record ? asRecord(record.error) : null;
-    if (error && error.type === "EntitlementError") {
-      throw new AdapterError(
-        "no-plan",
-        redact("OpenCode Go subscription not active on this key", cred.key),
-      );
-    }
-    throw new AdapterError(
-      "network",
-      redact("OpenCode Go request blocked (check User-Agent)", cred.key),
-    );
-  }
-  if (res.status === 429) {
-    throw new AdapterError("rate-limited", redact("OpenCode Go rate limit reached", cred.key));
-  }
-  if (res.status >= 500) {
-    throw new AdapterError("network", redact(`OpenCode Go server error ${res.status}`, cred.key));
-  }
-  throw new AdapterError(
-    "bad-response",
-    redact(`OpenCode Go unexpected status ${res.status}: ${text.slice(0, 200)}`, cred.key),
-  );
-}
-
 export const opencodeGoAdapter: ProviderAdapter = {
   id: "opencode-go",
   displayName: "OpenCode Go",
   async fetch(cred: Credential, opts: OpenCodeGoFetchOptions): Promise<AdapterResult> {
-    const res = await request(cred, opts);
-    if (!res.ok) return handleError(res, cred);
+    const res = await request(cred, opts, {
+      endpoint: ENDPOINT,
+      label: "OpenCode Go request failed",
+      headers: { "x-opencode-session": opts.sessionId ?? "unknown" },
+    });
+
+    if (!res.ok) {
+      return handleError(res, cred, (status, { text, json }) => {
+        if (status === 401) return { kind: "auth", message: "invalid OpenCode Go API key" };
+        if (status === 403) {
+          const record = asRecord(json);
+          const error = record ? asRecord(record.error) : null;
+          if (error && error.type === "EntitlementError") {
+            return {
+              kind: "no-plan",
+              message: "OpenCode Go subscription not active on this key",
+            };
+          }
+          return { kind: "network", message: "OpenCode Go request blocked (check User-Agent)" };
+        }
+        if (status === 429) {
+          return { kind: "rate-limited", message: "OpenCode Go rate limit reached" };
+        }
+        if (status >= 500) {
+          return { kind: "network", message: `OpenCode Go server error ${status}` };
+        }
+        return {
+          kind: "bad-response",
+          message: `OpenCode Go unexpected status ${status}: ${text.slice(0, 200)}`,
+        };
+      });
+    }
 
     const { json } = await readBody(res);
     const body = asRecord(json);

package/src/quota-lines.ts

@@ -0,0 +1,99 @@
+/**
+ * Pure line-building for the sidebar quota panel, extracted verbatim from
+ * `src/tui.tsx` so the formatting can be unit-tested and later reused by the
+ * `/usage` dialog. No JSX and no Solid imports (only the shared formatting
+ * helpers and types).
+ */
+import type { TuiPluginApi } from "@opencode-ai/plugin/tui";
+import type { ProviderReport, WindowKind } from "./types";
+import { bar, clip, countdown, padLabel, percentText, toneFor, windowLabel } from "./tui-format";
+
+type Theme = TuiPluginApi["theme"]["current"];
+type ThemeColor = Theme["text"];
+
+export interface Segment {
+  text: string;
+  fg: ThemeColor;
+  bold?: boolean;
+}
+
+export interface Line {
+  segments: Segment[];
+}
+
+export const NAMED_WIDTH = 14;
+export const EXTRAS_MAX_LENGTH = 80;
+
+/** Order windows for display; unknown kinds sort last. */
+const WINDOW_ORDER: Record<WindowKind, number> = {
+  "5h": 0,
+  weekly: 1,
+  monthly: 2,
+  daily: 3,
+  other: 4,
+};
+
+/** Flattens provider reports into plain, pre-colored text lines. */
+export function buildLines(
+  theme: Theme,
+  reports: ProviderReport[],
+  busy: boolean,
+  error: string | null,
+  now: Date,
+  barWidth: number,
+): Line[] {
+  const lines: Line[] = [];
+
+  if (error !== null) {
+    lines.push({
+      segments: [{ text: `api error: ${clip(error)}`, fg: theme.error }],
+    });
+  }
+
+  if (reports.length === 0 && busy) {
+    lines.push({
+      segments: [{ text: "loading…", fg: theme.textMuted }],
+    });
+  }
+
+  for (const report of reports) {
+    const nameColor = report.source === "error" ? theme.textMuted : theme.accent;
+    const segments: Segment[] = [{ text: report.displayName, fg: nameColor, bold: true }];
+    if (report.stale) segments.push({ text: " (stale)", fg: theme.textMuted });
+    if (report.source === "local-estimate") {
+      segments.push({ text: " (est)", fg: theme.textMuted });
+    }
+    lines.push({ segments });
+
+    if (report.source === "error") {
+      lines.push({
+        segments: [{ text: clip(report.error ?? "unknown error"), fg: theme.error }],
+      });
+      continue;
+    }
+
+    const windows = report.windows.toSorted((a, b) => WINDOW_ORDER[a.kind] - WINDOW_ORDER[b.kind]);
+    for (const w of windows) {
+      const tone = toneFor(w.usedPercent, w.status);
+      const row: Segment[] = [
+        { text: padLabel(windowLabel(w.kind, w.label), NAMED_WIDTH), fg: theme.textMuted },
+        { text: bar(w.usedPercent, barWidth), fg: theme[tone] },
+        { text: " ", fg: theme.text },
+        { text: percentText(w), fg: theme.text },
+      ];
+      const reset = countdown(w.resetsAt, now);
+      if (reset !== null) {
+        row.push({ text: ` resets in ${reset}`, fg: theme.textMuted });
+      }
+      lines.push({ segments: row });
+    }
+
+    for (const [key, value] of Object.entries(report.extras)) {
+      lines.push({
+        segments: [{ text: clip(`${key}: ${value}`, EXTRAS_MAX_LENGTH), fg: theme.textMuted }],
+      });
+    }
+  }
+
+  return lines;
+}

package/src/render.ts

@@ -1,39 +1,36 @@
 import type { ProviderReport, UsageWindow } from "./types";
-
-const WEEKDAYS = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
-const MONTHS = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
+import { formatAge } from "./tui-format";
 
 const DAY_MS = 24 * 60 * 60 * 1000;
 const LABEL_WIDTH = 8;
 const PERCENT_WIDTH = 10;
 const ABSOLUTES_WIDTH = 24;
 
+const RESET_DATE = new Intl.DateTimeFormat("en-US", {
+  weekday: "short",
+  month: "short",
+  day: "numeric",
+});
+
 function formatNumber(n: number): string {
   return n.toLocaleString("en-US");
 }
 
-/** "14:05" for a same-day reset, "Wed Sep 16" otherwise. */
+/** "14:05" for a same-day reset, "Wed, Sep 16" otherwise. */
 export function formatReset(resetsAt: string, now: Date): string | null {
   const d = new Date(resetsAt);
   if (Number.isNaN(d.getTime())) return null;
   const within24h = Math.abs(d.getTime() - now.getTime()) < DAY_MS;
   if (within24h) {
-    return `${String(d.getHours()).padStart(2, "0")}:${String(d.getMinutes()).padStart(2, "0")}`;
+    return d.toLocaleTimeString("en-US", { hour: "2-digit", minute: "2-digit", hour12: false });
   }
-  return `${WEEKDAYS[d.getDay()]} ${MONTHS[d.getMonth()]} ${d.getDate()}`;
-}
-
-function formatAge(fetchedAt: string, now: Date): string {
-  const then = new Date(fetchedAt).getTime();
-  const minutes = Number.isNaN(then) ? 0 : Math.max(0, Math.floor((now.getTime() - then) / 60000));
-  if (minutes < 60) return `${minutes}m`;
-  return `${Math.floor(minutes / 60)}h`;
+  return RESET_DATE.format(d);
 }
 
 function header(report: ProviderReport, now: Date): string {
   const parts: string[] = [report.source];
   if (report.stale) {
-    parts.push(`stale ${formatAge(report.fetchedAt, now)} old`);
+    parts.push(`stale ${formatAge(report.fetchedAt, now) ?? "0m"} old`);
   }
   return `${report.displayName} (${parts.join(", ")})`;
 }

package/src/tui-format.ts

@@ -13,6 +13,18 @@ export const MIN_REFRESH_INTERVAL_SECONDS = 5;
 export const MAX_REFRESH_INTERVAL_SECONDS = 3600;
 export const DEFAULT_REFRESH_INTERVAL_SECONDS = 60;
 
+/** Collapses whitespace and truncates to a single-line label. */
+export function clip(value: string, max = 60): string {
+  const single = value.replace(/\s+/g, " ").trim();
+  if (single.length <= max) return single;
+  return single.slice(0, Math.max(0, max - 1)) + "…";
+}
+
+/** Pads a label to a fixed width, truncating with an ellipsis when long. */
+export function padLabel(label: string, width: number): string {
+  return clip(label, width).padEnd(width);
+}
+
 /**
  * Renders a fixed-width progress bar. `percent` is clamped to 0-100 and rounded
  * to the nearest filled cell; `null` (or any non-finite value) renders an empty

package/src/tui.tsx

@@ -7,114 +7,19 @@ import type {
 } from "@opencode-ai/plugin/tui";
 import { For, createSignal } from "solid-js";
 import { DEFAULT_OPTIONS, collectReports } from "./report";
-import { bar, coerceTuiOptions, countdown, percentText, toneFor, windowLabel } from "./tui-format";
-import type { ProviderReport, WindowKind } from "./types";
-
-type Theme = TuiPluginApi["theme"]["current"];
-type ThemeColor = Theme["text"];
-
-interface Segment {
-  text: string;
-  fg: ThemeColor;
-  bold?: boolean;
-}
-
-interface Line {
-  segments: Segment[];
-}
-
-const NAMED_WIDTH = 14;
-const EXTRAS_MAX_LENGTH = 80;
-
-/** Order windows for display; unknown kinds sort last. */
-const WINDOW_ORDER: Record<WindowKind, number> = {
-  "5h": 0,
-  weekly: 1,
-  monthly: 2,
-  daily: 3,
-  other: 4,
-};
-
-function windowRank(kind: WindowKind): number {
-  return WINDOW_ORDER[kind] ?? WINDOW_ORDER.other;
-}
-
-/** Collapses whitespace and truncates to a single-line label. */
-function clip(value: string, max = 60): string {
-  const single = value.replace(/\s+/g, " ").trim();
-  if (single.length <= max) return single;
-  return single.slice(0, Math.max(0, max - 1)) + "…";
-}
-
-/** Pads a label to a fixed width, truncating (with a trailing space) when long. */
-function alignLabel(label: string): string {
-  const text = label.length > NAMED_WIDTH ? label.slice(0, NAMED_WIDTH - 1) + " " : label;
-  return text.padEnd(NAMED_WIDTH);
-}
-
-/** Flattens the current signal state into plain, pre-colored text lines. */
-function buildLines(
-  theme: Theme,
-  reports: ProviderReport[],
-  busy: boolean,
-  error: string | null,
-  now: Date,
-  barWidth: number,
-): Line[] {
-  const lines: Line[] = [];
-
-  if (error !== null) {
-    lines.push({
-      segments: [{ text: `api error: ${clip(error)}`, fg: theme.error }],
-    });
-  }
-
-  if (reports.length === 0 && busy) {
-    lines.push({
-      segments: [{ text: "loading…", fg: theme.textMuted }],
-    });
-  }
-
-  for (const report of reports) {
-    const nameColor = report.source === "error" ? theme.textMuted : theme.accent;
-    const segments: Segment[] = [{ text: report.displayName, fg: nameColor, bold: true }];
-    if (report.stale) segments.push({ text: " (stale)", fg: theme.textMuted });
-    if (report.source === "local-estimate") {
-      segments.push({ text: " (est)", fg: theme.textMuted });
-    }
-    lines.push({ segments });
-
-    if (report.source === "error") {
-      lines.push({
-        segments: [{ text: clip(report.error ?? "unknown error"), fg: theme.error }],
-      });
-      continue;
-    }
-
-    const windows = report.windows.toSorted((a, b) => windowRank(a.kind) - windowRank(b.kind));
-    for (const w of windows) {
-      const tone = toneFor(w.usedPercent, w.status);
-      const row: Segment[] = [
-        { text: alignLabel(windowLabel(w.kind, w.label)), fg: theme.textMuted },
-        { text: bar(w.usedPercent, barWidth), fg: theme[tone] },
-        { text: " ", fg: theme.text },
-        { text: percentText(w), fg: theme.text },
-      ];
-      const reset = countdown(w.resetsAt, now);
-      if (reset !== null) {
-        row.push({ text: ` resets in ${reset}`, fg: theme.textMuted });
-      }
-      lines.push({ segments: row });
-    }
-
-    for (const [key, value] of Object.entries(report.extras)) {
-      lines.push({
-        segments: [{ text: clip(`${key}: ${value}`, EXTRAS_MAX_LENGTH), fg: theme.textMuted }],
-      });
-    }
-  }
-
-  return lines;
+import { coerceTuiOptions } from "./tui-format";
+import { buildLines } from "./quota-lines";
+import { UsageDialog } from "./context/dialog";
+import { readCapture } from "./context/system";
+import type { SystemCapture } from "./context/types";
+import type { ProviderReport } from "./types";
+
+/** Resolves the session the `/usage` dialog should describe, if any. */
+function activeSessionID(api: TuiPluginApi): string | null {
+  const route = api.route.current;
+  if (route.name !== "session") return null;
+  const id: unknown = route.params?.sessionID;
+  return typeof id === "string" ? id : null;
 }
 
 export const tui: TuiPlugin = async (api, rawOptions) => {
@@ -124,11 +29,13 @@ export const tui: TuiPlugin = async (api, rawOptions) => {
   const [inFlight, setInFlight] = createSignal(0);
   const [error, setError] = createSignal<string | null>(null);
   const [tick, setTick] = createSignal(Date.now());
+  const [capture, setCapture] = createSignal<SystemCapture | null>(null);
+  const [scope, setScope] = createSignal(0);
+  const [showJson, setShowJson] = createSignal(false);
 
   const busy = (): boolean => inFlight() > 0;
 
   let disposed = false;
-
   const load = async (refresh = false): Promise<void> => {
     if (disposed) return;
     setInFlight((n) => n + 1);
@@ -153,24 +60,58 @@ export const tui: TuiPlugin = async (api, rawOptions) => {
     }
   };
 
-  // Single timer: refreshes data and advances countdowns.
+  // Single timer: refreshes data, advances countdowns, reloads the capture.
+  const refreshCapture = async (): Promise<void> => {
+    if (disposed) return;
+    const sessionID = activeSessionID(api);
+    if (sessionID === null) {
+      setCapture(null);
+      return;
+    }
+    setCapture(await readCapture(sessionID));
+  };
+
   const intervalMs = Math.max(1, Math.floor(options.refreshIntervalSeconds)) * 1000;
-  const timer = setInterval(() => {
+  const refresh = (): void => {
     setTick(Date.now());
     void load();
-  }, intervalMs);
+    void refreshCapture();
+  };
+  const timer = setInterval(refresh, intervalMs);
 
   api.lifecycle.onDispose(() => {
     disposed = true;
     clearInterval(timer);
   });
 
-  const offIdle = api.event.on("session.idle", () => {
-    setTick(Date.now());
-    void load();
-  });
+  const offIdle = api.event.on("session.idle", refresh);
   api.lifecycle.onDispose(offIdle);
 
+  const openDialog = (): void => {
+    const sessionID = activeSessionID(api);
+    void refreshCapture().finally(() => {
+      if (disposed) return;
+      setScope(0);
+      setShowJson(false);
+      api.ui.dialog.replace(() => (
+        <UsageDialog
+          api={api}
+          sessionID={sessionID}
+          reports={reports}
+          busy={busy}
+          error={error}
+          now={() => new Date(tick())}
+          system={capture}
+          scope={scope}
+          showJson={showJson}
+          barWidth={options.barWidth}
+        />
+      ));
+      // Must follow replace(): the stack resets the size to "medium".
+      api.ui.dialog.setSize("xlarge");
+    });
+  };
+
   api.lifecycle.onDispose(
     api.keymap.registerLayer({
       commands: [
@@ -183,11 +124,47 @@ export const tui: TuiPlugin = async (api, rawOptions) => {
             void load(true);
           },
         },
+        {
+          name: "usage.open",
+          title: "Usage: open report",
+          description: "Context usage and provider quota windows",
+          category: "Plugin",
+          namespace: "palette",
+          slashName: "usage",
+          run: openDialog,
+        },
       ],
       bindings: [{ key: "ctrl+shift+u", cmd: "usage.refresh", desc: "Refresh usage panel" }],
     }),
   );
 
+  // Scoped to the dialog's "modal" mode so these keys only fire while it is open.
+  api.lifecycle.onDispose(
+    api.keymap.registerLayer({
+      mode: "modal",
+      commands: [
+        { name: "usage.dialog.refresh", run: () => void load(true) },
+        {
+          name: "usage.dialog.scope",
+          run: () => {
+            setScope((n) => (n + 1) % Math.max(1, reports().length + 1));
+          },
+        },
+        {
+          name: "usage.dialog.json",
+          run: () => {
+            setShowJson((v) => !v);
+          },
+        },
+      ],
+      bindings: [
+        { key: "r", cmd: "usage.dialog.refresh", desc: "Refresh usage report" },
+        { key: "tab", cmd: "usage.dialog.scope", desc: "Cycle provider scope" },
+        { key: "j", cmd: "usage.dialog.json", desc: "Toggle raw JSON" },
+      ],
+    }),
+  );
+
   const slot: TuiSlotPlugin = {
     order: 150,
     slots: {