@rejacky/opencode-insights 0.1.10 → 0.1.12

package/README.md

@@ -92,11 +92,14 @@ The `uninstall` command removes plugin config entries and local Insights data; i
 ## What You Get
 
 - Configurable live metrics in the OpenCode session prompt zone.
+- A collapsible session-wide `Token Usage` sidebar showing total tokens, response count, input/output/reasoning usage, cache read/write usage, and aggregate cache rate. It loads completed responses already present in the session and continues updating live.
 - Subagent status (running, done, failed, elapsed time, and token/context usage) in the sidebar.
 - Local capture of OpenCode hook/event data without redaction.
 - A local web viewer for reconstructed sessions, user turns, hidden request context, system/messages transforms, and assistant thinking/response sequences.
 - Native OpenCode footer components (project directory and version) remain visible — the plugin does not override `sidebar_footer` or `home_prompt_right` slots.
 
+The right sidebar contains two independent plugin sections: `Token Usage` and `Subagents`. Click either section header to collapse or expand it. Token usage is aggregated across the full session; prompt-right `used` and `cache` values continue to represent the latest completed assistant response.
+
 ## TUI Metrics Configuration
 
 On TUI startup, Insights creates a configuration file beside its database:

package/dist/{capture-D7z7hS72.d.ts → capture-BIiGg2nW.d.ts}

@@ -24,6 +24,15 @@ type AssistantResponseUsage = {
     cacheWriteTokens?: number | undefined;
     finish?: string | undefined;
 };
+type SessionTokenUsage = {
+    inputTokens: number;
+    outputTokens: number;
+    reasoningTokens: number;
+    cacheReadTokens: number;
+    cacheWriteTokens: number;
+    totalTokens: number;
+    responseCount: number;
+};
 type PromptRightMetric = "tps" | "avg" | "ttft" | "used" | "cache" | "input" | "output" | "reasoning";
 declare const DEFAULT_PROMPT_RIGHT_METRICS: PromptRightMetric[];
 type MetricsState = {
@@ -31,6 +40,11 @@ type MetricsState = {
     messageTimingByID: Record<string, MessageTiming>;
     sessionAverageByID: Record<string, SessionAverage>;
     latestResponseUsageBySession: Record<string, AssistantResponseUsage>;
+    responseUsageByMessageID: Record<string, {
+        sessionID: string;
+        usage: AssistantResponseUsage;
+    }>;
+    sessionTokenUsageByID: Record<string, SessionTokenUsage>;
 };
 declare function createMetricsState(): MetricsState;
 declare function estimateStreamTokens(delta: string): number;
@@ -63,6 +77,8 @@ declare function renderPromptRightMetricsText(state: MetricsState, sessionID: st
     idle?: boolean;
     metrics?: PromptRightMetric[];
 }): string;
+declare function getSessionTokenUsage(state: MetricsState, sessionID: string): SessionTokenUsage | undefined;
+declare function renderSessionTokenUsage(state: MetricsState, sessionID: string): string;
 
 type CaptureKind = "chat.message" | "chat.params" | "chat.headers" | "experimental.chat.messages.transform" | "experimental.chat.system.transform" | "event" | "tool.execute.before" | "tool.execute.after";
 type CaptureRecord = {
@@ -129,4 +145,4 @@ declare class SqliteCaptureStore implements CaptureStore {
 declare function createCaptureStore(options?: InsightsOptions): CaptureStore;
 declare function resolveRetentionDays(value: unknown): number;
 
-export { type AssistantResponseUsage as A, renderResponseMetricsText as B, type CaptureRecord as C, DEFAULT_PROMPT_RIGHT_METRICS as D, resolveCapturePath as E, resolveInsightsConfigPath as F, resolveRetentionDays as G, type InsightsConfig as I, JsonlCaptureStore as J, type MessageTiming as M, type PromptRightMetric as P, type SessionAverage as S, type CaptureKind as a, type CaptureStore as b, type InsightsOptions as c, type MetricsState as d, SqliteCaptureStore as e, type SqliteDb as f, type StreamSample as g, createCaptureStore as h, createMetricsState as i, defaultDataDir as j, estimateStreamTokens as k, extractEventType as l, normalizeChatMessageCapture as m, normalizeChatHeadersCapture as n, normalizeChatParamsCapture as o, normalizeEventCapture as p, normalizeExperimentalChatMessagesTransformCapture as q, normalizeExperimentalChatSystemTransformCapture as r, normalizeToolCapture as s, openDatabase as t, readInsightsConfig as u, recordAssistantDelta as v, recordAssistantMessage as w, recordToolActivity as x, renderMetricsText as y, renderPromptRightMetricsText as z };
+export { type AssistantResponseUsage as A, renderMetricsText as B, type CaptureRecord as C, DEFAULT_PROMPT_RIGHT_METRICS as D, renderPromptRightMetricsText as E, renderResponseMetricsText as F, renderSessionTokenUsage as G, resolveCapturePath as H, type InsightsConfig as I, JsonlCaptureStore as J, resolveInsightsConfigPath as K, resolveRetentionDays as L, type MessageTiming as M, type PromptRightMetric as P, type SessionAverage as S, type CaptureKind as a, type CaptureStore as b, type InsightsOptions as c, type MetricsState as d, type SessionTokenUsage as e, SqliteCaptureStore as f, type SqliteDb as g, type StreamSample as h, createCaptureStore as i, createMetricsState as j, defaultDataDir as k, estimateStreamTokens as l, extractEventType as m, getSessionTokenUsage as n, normalizeChatHeadersCapture as o, normalizeChatMessageCapture as p, normalizeChatParamsCapture as q, normalizeEventCapture as r, normalizeExperimentalChatMessagesTransformCapture as s, normalizeExperimentalChatSystemTransformCapture as t, normalizeToolCapture as u, openDatabase as v, readInsightsConfig as w, recordAssistantDelta as x, recordAssistantMessage as y, recordToolActivity as z };

package/dist/{chunk-TGCIHODI.js → chunk-3YLLHABZ.js}

@@ -8,7 +8,9 @@ function createMetricsState() {
     streamSamplesBySession: {},
     messageTimingByID: {},
     sessionAverageByID: {},
-    latestResponseUsageBySession: {}
+    latestResponseUsageBySession: {},
+    responseUsageByMessageID: {},
+    sessionTokenUsageByID: {}
   };
 }
 function estimateStreamTokens(delta) {
@@ -35,7 +37,11 @@ function recordAssistantMessage(state, input) {
     cacheWriteTokens: input.cacheWriteTokens,
     finish: input.finish
   });
-  if (hasTokenUsage(usage)) state.latestResponseUsageBySession[input.sessionID] = usage;
+  if (hasTokenUsage(usage)) {
+    state.latestResponseUsageBySession[input.sessionID] = usage;
+    state.responseUsageByMessageID[input.messageID] = { sessionID: input.sessionID, usage };
+    rebuildSessionTokenUsage(state, input.sessionID);
+  }
   const timing = state.messageTimingByID[input.messageID];
   if (timing?.sessionID === input.sessionID && typeof timing.firstResponseAt === "number") {
     const totalTokens = (input.outputTokens ?? 0) + (input.reasoningTokens ?? 0);
@@ -127,6 +133,25 @@ function renderPromptRightMetricsText(state, sessionID, options = {}) {
   };
   return (options.metrics?.length ? options.metrics : DEFAULT_PROMPT_RIGHT_METRICS).map((metric) => values[metric]).join(" | ");
 }
+function getSessionTokenUsage(state, sessionID) {
+  return state.sessionTokenUsageByID[sessionID];
+}
+function renderSessionTokenUsage(state, sessionID) {
+  const usage = getSessionTokenUsage(state, sessionID);
+  if (!usage) return "";
+  const cachePromptTokens = usage.inputTokens + usage.cacheReadTokens;
+  const cacheRate = cachePromptTokens > 0 ? usage.cacheReadTokens / cachePromptTokens * 100 : void 0;
+  return [
+    "Token Usage",
+    `${formatTokenCount(usage.totalTokens)} total \xB7 ${usage.responseCount} responses`,
+    `${formatTokenCount(usage.inputTokens)} input`,
+    `${formatTokenCount(usage.outputTokens)} output`,
+    `${formatTokenCount(usage.reasoningTokens)} reasoning`,
+    `${formatTokenCount(usage.cacheReadTokens)} cache read`,
+    `${formatTokenCount(usage.cacheWriteTokens)} cache write`,
+    `${cacheRate === void 0 ? "-" : formatPercent(cacheRate)} cache rate`
+  ].join("\n");
+}
 function pruneSamples(state, now = Date.now()) {
   for (const [sessionID, samples] of Object.entries(state.streamSamplesBySession)) {
     const next = samples.filter((sample) => now - sample.at <= STREAM_WINDOW_MS);
@@ -134,6 +159,28 @@ function pruneSamples(state, now = Date.now()) {
     else delete state.streamSamplesBySession[sessionID];
   }
 }
+function rebuildSessionTokenUsage(state, sessionID) {
+  const usage = {
+    inputTokens: 0,
+    outputTokens: 0,
+    reasoningTokens: 0,
+    cacheReadTokens: 0,
+    cacheWriteTokens: 0,
+    totalTokens: 0,
+    responseCount: 0
+  };
+  for (const response of Object.values(state.responseUsageByMessageID)) {
+    if (response.sessionID !== sessionID) continue;
+    usage.inputTokens += response.usage.inputTokens ?? 0;
+    usage.outputTokens += response.usage.outputTokens ?? 0;
+    usage.reasoningTokens += response.usage.reasoningTokens ?? 0;
+    usage.cacheReadTokens += response.usage.cacheReadTokens ?? 0;
+    usage.cacheWriteTokens += response.usage.cacheWriteTokens ?? 0;
+    usage.responseCount += 1;
+  }
+  usage.totalTokens = usage.inputTokens + usage.outputTokens + usage.reasoningTokens + usage.cacheReadTokens + usage.cacheWriteTokens;
+  state.sessionTokenUsageByID[sessionID] = usage;
+}
 function sessionAverage(state, sessionID) {
   const totals = state.sessionAverageByID[sessionID];
   if (!totals || totals.totalTokens <= 0 || totals.totalDurationMs <= 0) return void 0;
@@ -208,7 +255,7 @@ function formatTokenCount(value) {
   return String(Math.round(value));
 }
 function formatPercent(value) {
-  return `${(Math.round(value * 10) / 10).toFixed(1).replace(/\.0$/u, "")}%`;
+  return `${(Math.round(value * 100) / 100).toFixed(2)}%`;
 }
 function formatAbbreviatedTokenCount(value, divisor) {
   return (Math.round(value / divisor * 10) / 10).toFixed(1);
@@ -640,6 +687,8 @@ export {
   renderMetricsText,
   renderResponseMetricsText,
   renderPromptRightMetricsText,
+  getSessionTokenUsage,
+  renderSessionTokenUsage,
   defaultDataDir,
   resolveCapturePath,
   resolveInsightsConfigPath,

package/dist/cli.d.ts

@@ -1,5 +1,5 @@
 #!/usr/bin/env node
-import { C as CaptureRecord } from './capture-D7z7hS72.js';
+import { C as CaptureRecord } from './capture-BIiGg2nW.js';
 
 type HistoryMessage = {
     id: string;

package/dist/cli.js

@@ -2,7 +2,7 @@
 import {
   openDatabase,
   resolveCapturePath
-} from "./chunk-TGCIHODI.js";
+} from "./chunk-3YLLHABZ.js";
 
 // src/cli.ts
 import { execFile as execFile2 } from "child_process";
@@ -12,6 +12,7 @@ import { dirname, join, resolve } from "path";
 import { homedir } from "os";
 import { pathToFileURL } from "url";
 import { promisify as promisify2 } from "util";
+import { applyEdits, modify, parse } from "jsonc-parser";
 
 // src/inspect.ts
 import { readFile } from "fs/promises";
@@ -1727,8 +1728,10 @@ async function configureOpenCodeDebug(options) {
   if (!existsSync2(localServerEntry) || !existsSync2(localTuiEntry)) {
     throw new Error("Missing dist output. Run npm run build before opencode-insights debug.");
   }
-  const opencodeConfig = await readJsonConfig(opencodePath, { plugin: [] });
-  const tuiConfig = await readJsonConfig(tuiPath, { plugin: [] });
+  const opencodeSource = await readJsonConfigSource(opencodePath);
+  const tuiSource = await readJsonConfigSource(tuiPath);
+  const opencodeConfig = await readJsonConfig(opencodePath, { plugin: [] }, opencodeSource);
+  const tuiConfig = await readJsonConfig(tuiPath, { plugin: [] }, tuiSource);
   setSinglePluginSpec(opencodeConfig, SERVER_PLUGIN_SPEC, [localServerEntry, debugServerOptions(options)], localServerEntry);
   setSinglePluginSpec(tuiConfig, TUI_PLUGIN_SPEC, localTuiEntry);
   removePlugin(tuiConfig, SUBPATH_TUI_PLUGIN_SPEC);
@@ -1745,8 +1748,8 @@ async function configureOpenCodeDebug(options) {
     return lines.join("\n");
   }
   await mkdir(configDir, { recursive: true });
-  await writeJsonConfig(opencodePath, opencodeConfig);
-  await writeJsonConfig(tuiPath, tuiConfig);
+  await writeJsonConfig(opencodePath, opencodeConfig, opencodeSource);
+  await writeJsonConfig(tuiPath, tuiConfig, tuiSource);
   lines.push("Debug configuration written. Restart OpenCode to load the local build.");
   return lines.join("\n");
 }
@@ -1763,18 +1766,23 @@ function resolveOpenCodeConfigPath(configDir) {
   if (existsSync2(jsonPath)) return jsonPath;
   return jsonPath;
 }
-async function readJsonConfig(path, fallback) {
-  if (!existsSync2(path)) return { ...fallback };
-  const content = await readFile2(path, "utf8");
+async function readJsonConfig(path, fallback, source) {
+  const content = source ?? (existsSync2(path) ? await readFile2(path, "utf8") : void 0);
+  if (content === void 0) return { ...fallback };
   const trimmed = content.trim();
   if (!trimmed) return { ...fallback };
   try {
-    const parsed = JSON.parse(stripJsonCommentsAndTrailingCommas(trimmed));
+    const parseErrors = [];
+    const parsed = parse(trimmed, parseErrors, { allowTrailingComma: true });
+    if (parseErrors.length > 0) throw new Error("invalid JSONC syntax");
     return isJsonObject(parsed) ? parsed : { ...fallback };
   } catch (error) {
     throw new Error(`Could not parse ${path}: ${error instanceof Error ? error.message : String(error)}`);
   }
 }
+async function readJsonConfigSource(path) {
+  return existsSync2(path) ? readFile2(path, "utf8") : void 0;
+}
 function stripJsonCommentsAndTrailingCommas(input) {
   let output = "";
   let inString = false;
@@ -1888,11 +1896,12 @@ async function uninstallOpenCode(options) {
 }
 async function removePluginFromConfig(path, plugin, options) {
   if (!existsSync2(path)) return "config not found";
-  const config = await readJsonConfig(path, { plugin: [] });
+  const source = await readJsonConfigSource(path);
+  const config = await readJsonConfig(path, { plugin: [] }, source);
   const changed = removePlugin(config, plugin);
   if (!changed) return `not present (${plugin})`;
   if (options.dryRun) return `would remove (${plugin})`;
-  await writeJsonConfig(path, config);
+  await writeJsonConfig(path, config, source);
   return `removed (${plugin})`;
 }
 async function removeDataFiles(paths, options) {
@@ -1904,8 +1913,15 @@ async function removeDataFiles(paths, options) {
   }
   return existing;
 }
-async function writeJsonConfig(path, config) {
+async function writeJsonConfig(path, config, source) {
   await mkdir(dirname(path), { recursive: true });
+  if (source !== void 0) {
+    const edits = modify(source, ["plugin"], config.plugin, {
+      formattingOptions: { insertSpaces: true, tabSize: 2, eol: "\n" }
+    });
+    await writeFile(path, applyEdits(source, edits), "utf8");
+    return;
+  }
   await writeFile(path, `${JSON.stringify(config, null, 2)}
 `, "utf8");
 }

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import { Plugin } from '@opencode-ai/plugin';
 import { TuiPlugin } from '@opencode-ai/plugin/tui';
-export { A as AssistantResponseUsage, a as CaptureKind, C as CaptureRecord, b as CaptureStore, D as DEFAULT_PROMPT_RIGHT_METRICS, I as InsightsConfig, c as InsightsOptions, J as JsonlCaptureStore, M as MessageTiming, d as MetricsState, P as PromptRightMetric, S as SessionAverage, e as SqliteCaptureStore, f as SqliteDb, g as StreamSample, h as createCaptureStore, i as createMetricsState, j as defaultDataDir, k as estimateStreamTokens, l as extractEventType, n as normalizeChatHeadersCapture, m as normalizeChatMessageCapture, o as normalizeChatParamsCapture, p as normalizeEventCapture, q as normalizeExperimentalChatMessagesTransformCapture, r as normalizeExperimentalChatSystemTransformCapture, s as normalizeToolCapture, t as openDatabase, u as readInsightsConfig, v as recordAssistantDelta, w as recordAssistantMessage, x as recordToolActivity, y as renderMetricsText, z as renderPromptRightMetricsText, B as renderResponseMetricsText, E as resolveCapturePath, F as resolveInsightsConfigPath, G as resolveRetentionDays } from './capture-D7z7hS72.js';
+export { A as AssistantResponseUsage, a as CaptureKind, C as CaptureRecord, b as CaptureStore, D as DEFAULT_PROMPT_RIGHT_METRICS, I as InsightsConfig, c as InsightsOptions, J as JsonlCaptureStore, M as MessageTiming, d as MetricsState, P as PromptRightMetric, S as SessionAverage, e as SessionTokenUsage, f as SqliteCaptureStore, g as SqliteDb, h as StreamSample, i as createCaptureStore, j as createMetricsState, k as defaultDataDir, l as estimateStreamTokens, m as extractEventType, n as getSessionTokenUsage, o as normalizeChatHeadersCapture, p as normalizeChatMessageCapture, q as normalizeChatParamsCapture, r as normalizeEventCapture, s as normalizeExperimentalChatMessagesTransformCapture, t as normalizeExperimentalChatSystemTransformCapture, u as normalizeToolCapture, v as openDatabase, w as readInsightsConfig, x as recordAssistantDelta, y as recordAssistantMessage, z as recordToolActivity, B as renderMetricsText, E as renderPromptRightMetricsText, F as renderResponseMetricsText, G as renderSessionTokenUsage, H as resolveCapturePath, K as resolveInsightsConfigPath, L as resolveRetentionDays } from './capture-BIiGg2nW.js';
 
 type SubagentStatus = "running" | "done" | "error";
 type SubagentInfo = {

package/dist/index.js

@@ -18,6 +18,7 @@ import {
   defaultDataDir,
   estimateStreamTokens,
   extractEventType,
+  getSessionTokenUsage,
   normalizeChatHeadersCapture,
   normalizeChatMessageCapture,
   normalizeChatParamsCapture,
@@ -33,10 +34,11 @@ import {
   renderMetricsText,
   renderPromptRightMetricsText,
   renderResponseMetricsText,
+  renderSessionTokenUsage,
   resolveCapturePath,
   resolveInsightsConfigPath,
   resolveRetentionDays
-} from "./chunk-TGCIHODI.js";
+} from "./chunk-3YLLHABZ.js";
 
 // src/cli-shim.ts
 import { existsSync } from "fs";
@@ -150,6 +152,7 @@ export {
   defaultDataDir,
   estimateStreamTokens,
   extractEventType,
+  getSessionTokenUsage,
   getSubagentItems,
   getSubagentSidebarModel,
   getSubagentSidebarRowAtLine,
@@ -170,6 +173,7 @@ export {
   renderMetricsText,
   renderPromptRightMetricsText,
   renderResponseMetricsText,
+  renderSessionTokenUsage,
   renderSubagentFooter,
   renderSubagentSidebar,
   renderSubagentStatus,

package/dist/tui.js

@@ -10,24 +10,50 @@ import {
   recordAssistantDelta,
   recordAssistantMessage,
   recordToolActivity,
-  renderPromptRightMetricsText
-} from "./chunk-TGCIHODI.js";
+  renderPromptRightMetricsText,
+  renderSessionTokenUsage
+} from "./chunk-3YLLHABZ.js";
 
 // src/tui.tsx
 import { createTextAttributes, StyledText } from "@opentui/core";
 import { createSignal, onCleanup } from "solid-js";
-import { jsx } from "@opentui/solid/jsx-runtime";
+
+// src/listeners.ts
+function createListenerRegistry() {
+  const listeners = /* @__PURE__ */ new Set();
+  return {
+    notify() {
+      for (const listener of listeners) listener();
+    },
+    subscribe(listener) {
+      listeners.add(listener);
+      return () => listeners.delete(listener);
+    }
+  };
+}
+
+// src/render-state.ts
+function hasRenderStateChanged(previous, next) {
+  return !previous || previous.content !== next.content || previous.visible !== next.visible || previous.height !== next.height;
+}
+
+// src/tui.tsx
+import { Fragment, jsx, jsxs } from "@opentui/solid/jsx-runtime";
 function isSessionID(value) {
   return typeof value === "string" && value.startsWith("ses");
 }
 function PromptRightMetrics(props) {
   let text;
+  let previous;
   const sync = () => {
     if (!text) return;
     const content = props.text();
-    text.content = content;
-    text.visible = content.length > 0;
-    text.height = content.length > 0 ? 1 : 0;
+    const next = { content, visible: content.length > 0, height: content.length > 0 ? 1 : 0 };
+    if (!hasRenderStateChanged(previous, next)) return;
+    previous = next;
+    text.content = next.content;
+    text.visible = next.visible;
+    text.height = next.height;
     props.api.renderer.requestRender();
   };
   const unsubscribe = props.subscribe(sync);
@@ -52,15 +78,57 @@ function PromptRightMetrics(props) {
     }
   );
 }
+function TokenUsageSidebar(props) {
+  let text;
+  let previous;
+  const [collapsed, setCollapsed] = createSignal(false);
+  const titleAttributes = createTextAttributes({ bold: true });
+  const toggleTokenUsage = (event) => {
+    if (!text || event.y !== text.y) return;
+    setCollapsed((prev) => !prev);
+    sync();
+  };
+  const sync = () => {
+    if (!text) return;
+    const content = renderSessionTokenUsage(props.state, props.sessionID);
+    const next = {
+      content: `${collapsed()}|${content}`,
+      visible: content.length > 0,
+      height: content.length > 0 ? "auto" : 0
+    };
+    if (!hasRenderStateChanged(previous, next)) return;
+    previous = next;
+    text.visible = next.visible;
+    text.height = next.height;
+    text.content = content ? renderTokenUsageSidebar(content, props.api, titleAttributes, collapsed()) : "";
+    props.api.renderer.requestRender();
+  };
+  const unsubscribe = props.subscribe(sync);
+  onCleanup(unsubscribe);
+  props.hydrate();
+  return /* @__PURE__ */ jsx(
+    "text",
+    {
+      ref: (ref) => {
+        text = ref;
+        sync();
+      },
+      onMouseDown: toggleTokenUsage,
+      fg: props.api.theme.current.textMuted,
+      children: ""
+    }
+  );
+}
 function SubagentSidebar(props) {
   let text;
   const [collapsed, setCollapsed] = createSignal(false);
   const [hoveredRowID, setHoveredRowID] = createSignal();
   const titleAttributes = createTextAttributes({ bold: true });
+  let previous;
   const toggle = (event) => {
     if (!text || event.y !== text.y) return;
     setCollapsed((prev) => !prev);
-    props.api.renderer.requestRender();
+    sync();
   };
   const openSubagent = (event) => {
     if (!text || collapsed()) return;
@@ -87,9 +155,17 @@ function SubagentSidebar(props) {
   const sync = () => {
     if (!text) return;
     const model = getSubagentSidebarModel(props.state, props.sessionID);
-    text.visible = !!model;
-    text.height = model ? "auto" : 0;
-    text.content = model ? renderSubagentStyledSidebar(props.state, props.sessionID, props.api, titleAttributes, collapsed(), hoveredRowID()) : "";
+    const content = model ? renderSubagentStyledSidebar(model, props.api, titleAttributes, collapsed(), hoveredRowID()) : "";
+    const next = {
+      content: model ? contentSignature(model, collapsed(), hoveredRowID()) : "",
+      visible: !!model,
+      height: model ? "auto" : 0
+    };
+    if (!hasRenderStateChanged(previous, next)) return;
+    previous = next;
+    text.visible = next.visible;
+    text.height = next.height;
+    text.content = model ? content : "";
     props.api.renderer.requestRender();
   };
   const unsubscribe = props.subscribe(sync);
@@ -114,9 +190,7 @@ function SubagentSidebar(props) {
     }
   );
 }
-function renderSubagentStyledSidebar(state, sessionID, api, titleAttributes, collapsed, hoveredRowID) {
-  const model = getSubagentSidebarModel(state, sessionID);
-  if (!model) return "";
+function renderSubagentStyledSidebar(model, api, titleAttributes, collapsed, hoveredRowID) {
   const indicator = collapsed ? "\u25B6 " : "\u25BC ";
   const chunks = [
     textChunk(`${indicator}${model.title}
@@ -137,6 +211,18 @@ function renderSubagentStyledSidebar(state, sessionID, api, titleAttributes, col
   }
   return new StyledText(chunks);
 }
+function renderTokenUsageSidebar(content, api, titleAttributes, collapsed) {
+  const [title, ...details] = content.split("\n");
+  const visibleDetails = collapsed ? details.slice(0, 1) : details;
+  return new StyledText([
+    textChunk(`${collapsed ? "\u25B6" : "\u25BC"} ${title}
+`, api.theme.current.text, titleAttributes),
+    textChunk(visibleDetails.join("\n"), api.theme.current.textMuted)
+  ]);
+}
+function contentSignature(model, collapsed, hoveredRowID) {
+  return JSON.stringify({ collapsed, hoveredRowID, title: model.title, summary: model.summary, rows: model.rows });
+}
 function textChunk(text, fg, attributes, bg) {
   return {
     __isChunk: true,
@@ -150,13 +236,35 @@ var tui = async (api, options) => {
   const config = await readInsightsConfig(options ?? {});
   const metrics = createMetricsState();
   const subagents = createSubagentState();
-  const listeners = /* @__PURE__ */ new Set();
-  const bump = () => {
-    for (const listener of listeners) listener();
-  };
-  const subscribe = (listener) => {
-    listeners.add(listener);
-    return () => listeners.delete(listener);
+  const metricListeners = createListenerRegistry();
+  const subagentListeners = createListenerRegistry();
+  const hydratedSessions = /* @__PURE__ */ new Set();
+  const hydrateSessionMetrics = async (sessionID) => {
+    if (!isSessionID(sessionID) || hydratedSessions.has(sessionID)) return;
+    hydratedSessions.add(sessionID);
+    try {
+      const response = await api.client.session.messages({ sessionID });
+      const messages = response.data ?? [];
+      for (const message of messages) {
+        const info = message.info;
+        if (info.role !== "assistant" || typeof info.time.completed !== "number") continue;
+        const input = {
+          sessionID: info.sessionID,
+          messageID: info.id,
+          createdAt: info.time.created,
+          completedAt: info.time.completed,
+          inputTokens: info.tokens.input,
+          outputTokens: info.tokens.output,
+          reasoningTokens: info.tokens.reasoning,
+          cacheReadTokens: info.tokens.cache.read,
+          cacheWriteTokens: info.tokens.cache.write
+        };
+        recordAssistantMessage(metrics, typeof info.finish === "string" ? { ...input, finish: info.finish } : input);
+      }
+      metricListeners.notify();
+    } catch {
+      hydratedSessions.delete(sessionID);
+    }
   };
   const offDelta = api.event.on("message.part.delta", (evt) => {
     if (evt.properties.field !== "text") return;
@@ -166,11 +274,11 @@ var tui = async (api, options) => {
       delta: evt.properties.delta,
       at: Date.now()
     });
-    bump();
+    metricListeners.notify();
   });
   const offMessage = api.event.on("message.updated", (evt) => {
     const info = evt.properties.info;
-    if (applySubagentEvent(subagents, evt)) bump();
+    if (applySubagentEvent(subagents, evt)) subagentListeners.notify();
     if (info.role !== "assistant") return;
     const messageInput = {
       sessionID: info.sessionID ?? evt.properties.sessionID,
@@ -185,30 +293,30 @@ var tui = async (api, options) => {
     if (typeof info.time.completed === "number") messageInput.completedAt = info.time.completed;
     if (typeof info.finish === "string") messageInput.finish = info.finish;
     recordAssistantMessage(metrics, messageInput);
-    bump();
+    metricListeners.notify();
   });
   const offPart = api.event.on("message.part.updated", (evt) => {
     const part = evt.properties.part;
     if (part.type === "tool") {
       recordToolActivity(metrics, part.sessionID ?? evt.properties.sessionID, part.messageID, Date.now());
     }
-    applySubagentEvent(subagents, evt);
-    bump();
+    if (applySubagentEvent(subagents, evt)) subagentListeners.notify();
+    metricListeners.notify();
   });
   const offSessionCreated = api.event.on("session.created", (evt) => {
-    if (applySubagentEvent(subagents, evt)) bump();
+    if (applySubagentEvent(subagents, evt)) subagentListeners.notify();
   });
   const offSessionUpdated = api.event.on("session.updated", (evt) => {
-    if (applySubagentEvent(subagents, evt)) bump();
+    if (applySubagentEvent(subagents, evt)) subagentListeners.notify();
   });
   const offSessionStatus = api.event.on("session.status", (evt) => {
-    if (applySubagentEvent(subagents, evt)) bump();
+    if (applySubagentEvent(subagents, evt)) subagentListeners.notify();
   });
   const offSessionIdle = api.event.on("session.idle", (evt) => {
-    if (applySubagentEvent(subagents, evt)) bump();
+    if (applySubagentEvent(subagents, evt)) subagentListeners.notify();
   });
   const offSessionError = api.event.on("session.error", (evt) => {
-    if (applySubagentEvent(subagents, evt)) bump();
+    if (applySubagentEvent(subagents, evt)) subagentListeners.notify();
   });
   const offSlots = api.slots.register({
     slots: {
@@ -217,7 +325,7 @@ var tui = async (api, options) => {
         {
           api,
           sessionID: props.session_id,
-          subscribe,
+          subscribe: metricListeners.subscribe,
           text: () => {
             if (!isSessionID(props.session_id)) return "";
             const status = api.state.session.status(props.session_id);
@@ -228,15 +336,27 @@ var tui = async (api, options) => {
           }
         }
       ),
-      sidebar_content: (_ctx, props) => /* @__PURE__ */ jsx(
-        SubagentSidebar,
-        {
-          api,
-          sessionID: props.session_id,
-          state: subagents,
-          subscribe
-        }
-      )
+      sidebar_content: (_ctx, props) => /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(
+          TokenUsageSidebar,
+          {
+            api,
+            sessionID: props.session_id,
+            state: metrics,
+            subscribe: metricListeners.subscribe,
+            hydrate: () => void hydrateSessionMetrics(props.session_id)
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          SubagentSidebar,
+          {
+            api,
+            sessionID: props.session_id,
+            state: subagents,
+            subscribe: subagentListeners.subscribe
+          }
+        )
+      ] })
     }
   });
   api.lifecycle.onDispose(() => {

package/package.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://json.schemastore.org/package.json",
   "name": "@rejacky/opencode-insights",
-  "version": "0.1.10",
+  "version": "0.1.12",
   "description": "OpenCode plugin for local request capture, TPS metrics, and subagent status visibility.",
   "type": "module",
   "author": "opencode-insights contributors",
@@ -68,24 +68,25 @@
   },
   "peerDependencies": {
     "@opencode-ai/plugin": ">=1.15.0 <2",
-    "@opentui/core": ">=0.4.0 <0.5",
-    "@opentui/solid": ">=0.4.0 <0.5",
-    "solid-js": "1.9.12"
+    "@opentui/core": ">=0.4.0 <0.6",
+    "@opentui/solid": ">=0.4.0 <0.6",
+    "solid-js": "^1.9.12"
   },
   "devDependencies": {
     "@opencode-ai/plugin": "^1.17.13",
-    "@opentui/core": "^0.4.3",
-    "@opentui/solid": "^0.4.3",
+    "@opentui/core": "^0.5.1",
+    "@opentui/solid": "^0.5.1",
     "@types/better-sqlite3": "^7.6.13",
     "@types/node": "^24.12.2",
     "@types/sql.js": "^1.4.11",
-    "solid-js": "1.9.12",
+    "solid-js": "^1.9.12",
     "tsup": "^8.5.1",
     "typescript": "^6.0.3",
     "vitest": "^4.1.10"
   },
   "dependencies": {
     "better-sqlite3": "^12.11.1",
+    "jsonc-parser": "^3.3.1",
     "sql.js": "^1.14.1"
   }
 }