@slkiser/opencode-quota 4.9.0 → 4.10.1

package/dist/tui.tsx

@@ -7,15 +7,19 @@ import type {
   TuiPromptRef,
 } from "@opencode-ai/plugin/tui";
 import type { JSX } from "@opentui/solid";
-import { createEffect, createSignal, onCleanup, Show } from "solid-js";
-import { formatDisplayedPercentLabel, formatResetCountdown } from "./lib/format-utils.js";
+import { createEffect, createSignal, Index, onCleanup, Show } from "solid-js";
+import {
+  formatQuotaModeHeading,
+  formatResetCountdown,
+  isResetTimeDecimals,
+  resolveDisplayedPercent,
+} from "./lib/format-utils.js";
 import {
   buildQuotaDialogCommandOutput,
   QUOTA_DIALOG_COMMANDS,
   type QuotaDialogCommandId,
   type QuotaDialogCommandSpec,
 } from "./lib/quota-dialog-commands.js";
-import { extractSingleWindowWindowLabel } from "./lib/quota-entry-display.js";
 import type { SessionTokenError } from "./lib/quota-status.js";
 import { disposeQuotaTelemetryOwner } from "./lib/quota-telemetry.js";
 import { getSidebarBodyLineColor } from "./lib/tui-line-style.js";
@@ -34,6 +38,11 @@ import {
   shouldRenderHomeBottom,
   shouldRenderSidebarPanel,
 } from "./lib/tui-panel-state.js";
+import {
+  formatPromptBarPercentMeta,
+  PROMPT_BAR_WIDTH,
+  resolvePromptBarLabel,
+} from "./lib/tui-prompt-bar-format.js";
 import { createTuiRefreshLifecycle } from "./lib/tui-refresh-lifecycle.js";
 import {
   createTuiQuotaClient,
@@ -47,6 +56,7 @@ import {
   type TuiSurfaceRegistration,
   writeTuiQuotaExportIfEnabled,
 } from "./lib/tui-runtime.js";
+import { buildSidebarContentRows, type SidebarContentRow } from "./lib/tui-sidebar-content.js";
 import type { TuiCommandDisplay } from "./lib/types.js";
 
 const id = "@slkiser/opencode-quota";
@@ -371,27 +381,46 @@ function SidebarContentView(props: {
     return collapsed() ? lines() : getSidebarPanelLinesExpanded(panel());
   };
 
-  const toggleIcon = () => (collapsed() ? "▶" : "▼");
-  const providerCount = () => panel().providerCount ?? 0;
+  const contentRows = (): SidebarContentRow[] => {
+    const heading = panel().headerPercentMode
+      ? formatQuotaModeHeading(panel().headerPercentMode)
+      : "Quota";
+    return buildSidebarContentRows({
+      collapsed: collapsed(),
+      heading,
+      hasDetailLines: hasDetailLines(),
+      providerCount: panel().providerCount ?? 0,
+      lines: displayLines(),
+    });
+  };
 
   return (
     <Show when={shouldRenderSidebarPanel(panel())}>
-      <box gap={0}>
-        <box flexDirection="row">
-          <text fg={props.api.theme.current.text} onMouseDown={toggleCollapsed}>
-            <b>{hasDetailLines() ? `${toggleIcon()} Quota` : "Quota"}</b>
-          </text>
-          <Show when={collapsed() && providerCount() > 0}>
-            <text fg={props.api.theme.current.textMuted}> ({providerCount()} providers)</text>
-          </Show>
-        </box>
-        <box gap={0}>
-          {displayLines().map((line) => (
-            <text fg={getSidebarBodyLineColor(line, props.api.theme.current)} wrapMode="none">
-              {line || " "}
+      <box gap={0} width="100%">
+        <Index each={contentRows()}>
+          {(row: () => SidebarContentRow) => (
+            <text
+              fg={
+                row().kind === "header"
+                  ? props.api.theme.current.text
+                  : getSidebarBodyLineColor(row().text, props.api.theme.current)
+              }
+              wrapMode="none"
+              width="100%"
+              onMouseDown={row().kind === "header" ? toggleCollapsed : undefined}
+            >
+              {row().kind === "header"
+                ? row().segments.map((segment) =>
+                    segment.style === "muted" ? (
+                      <span fg={props.api.theme.current.textMuted}>{segment.text}</span>
+                    ) : (
+                      <b>{segment.text}</b>
+                    ),
+                  )
+                : row().text || " "}
             </text>
-          ))}
-        </box>
+          )}
+        </Index>
       </box>
     </Show>
   );
@@ -455,8 +484,6 @@ function SessionPromptWithCompactStatus(props: {
   );
 }
 
-const PROMPT_BAR_WIDTH = 12;
-
 function shouldRenderPromptBar(
   bar: PromptBarState,
 ): bar is Extract<PromptBarState, { status: "ready" }> {
@@ -515,28 +542,24 @@ function buildPromptBarParts(params: {
   if (!shouldRenderPromptBar(bar)) return undefined;
   const entry = bar.entry;
   if (!entry) return undefined;
-  const reset = entry.resetTimeIso
-    ? formatResetCountdown(entry.resetTimeIso, {
-        compactRounded: true,
-        decimals: bar.resetTimeDecimals,
-      })
-    : "";
 
   const hasPercent = Number.isFinite(entry.percentRemaining);
   if (entry.semanticSegment && !hasPercent) {
-    return { label: entry.semanticSegment, barText: "", meta: reset };
+    const reset = entry.resetTimeIso
+      ? formatResetCountdown(
+          entry.resetTimeIso,
+          isResetTimeDecimals(bar.resetTimeDecimals)
+            ? { compactRounded: true, decimals: bar.resetTimeDecimals }
+            : { spaced: bar.resetTimeSpaced },
+        )
+      : "";
+    return { label: resolvePromptBarLabel(entry), barText: "", meta: reset };
   }
 
-  const windowLabel =
-    entry.semanticSegment ??
-    extractSingleWindowWindowLabel(entry.label ?? "") ??
-    extractSingleWindowWindowLabel(entry.name ?? "") ??
-    "Quota";
-  const percent = formatDisplayedPercentLabel(
-    entry.percentRemaining ?? 0,
-    bar.percentDisplayMode ?? "remaining",
+  const p = Math.min(
+    100,
+    resolveDisplayedPercent(entry.percentRemaining ?? 0, bar.percentDisplayMode ?? "remaining"),
   );
-  const p = Math.max(0, Math.min(100, Math.round(entry.percentRemaining ?? 0)));
   const filled = Math.round((p / 100) * PROMPT_BAR_WIDTH);
   const empty = PROMPT_BAR_WIDTH - filled;
   let barText = "█".repeat(filled) + "░".repeat(empty);
@@ -551,11 +574,16 @@ function buildPromptBarParts(params: {
     barText = cells.join("") + "░".repeat(empty);
   }
   return {
-    label: windowLabel,
+    label: resolvePromptBarLabel(entry),
     barText,
-    meta: entry.semanticSegment
-      ? reset
-      : [percent.replace(/\s+left$/u, ""), reset].filter(Boolean).join(" | "),
+    meta: formatPromptBarPercentMeta({
+      percentRemaining: entry.percentRemaining ?? 0,
+      percentDisplayMode: bar.percentDisplayMode,
+      resetTimeIso: entry.resetTimeIso,
+      resetTimeDecimals: bar.resetTimeDecimals,
+      resetTimeSpaced: bar.resetTimeSpaced,
+      runway: entry.runway,
+    }),
   };
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@slkiser/opencode-quota",
-  "version": "4.9.0",
+  "version": "4.10.1",
   "description": "OpenCode quota & tokens usage with zero context window pollution. Supports GitHub Copilot, OpenAI (Plus/Pro), Qwen Code, Chutes AI, Synthetic, Google Antigravity, Z.ai coding plan and more.",
   "type": "module",
   "main": "./dist/index.js",
@@ -109,6 +109,10 @@
     "typecheck": "tsc --noEmit",
     "test": "vitest run",
     "test:watch": "vitest",
+    "test:stabilization:tui": "node scripts/test-stabilization-connected.mjs --tui",
+    "test:stabilization:tui:prompt-bar": "node scripts/test-stabilization-connected.mjs --tui --prompt-bar",
+    "test:stabilization:web": "node scripts/test-stabilization-connected.mjs --web",
+    "test:stabilization:fixtures": "node scripts/test-stabilization-fixtures.mjs",
     "verify": "pnpm run check && pnpm run verify:typescript-version && pnpm run verify:v4-history && pnpm run typecheck && pnpm run build && pnpm test && pnpm run test:four-surfaces && pnpm run verify:package-contents"
   }
 }