feat(tui): expose subagent cost breakdown in sidebar

Author: Integralist

FORK.md

@@ -47,6 +47,7 @@ git push -u origin <your-custom-branch>
 
 ### 2026-07-17
 
+- **Exposed Sub-agent Cost Calculations in TUI Sidebar:** Added recursive cost-summing for sub-agent threads. Updates the TUI Context sidebar to display a detailed breakdown of Main Agent cost, Sub-agent total cost, and combined Total Cost under the active session ID.
 - **Ported PR #23262 (File Cycling in Permission Prompt):** Ported the file cycling feature from upstream PR #23262 to [packages/tui/src/routes/session/permission.tsx](file:///Users/mmcdonnell/code/opencode/packages/tui/src/routes/session/permission.tsx). This enables cycling through multiple files inside the TUI permission dialog using `[` and `]` keys.
 - **Added [FORK.md](file:///Users/mmcdonnell/code/opencode/FORK.md):** Outlines branching, syncing, and custom workspace strategy.
 - **Added [Makefile](file:///Users/mmcdonnell/code/opencode/Makefile):** Standard checkmake-compliant targets for building, cleaning, testing, and syncing with automatic Bun dependency management.

packages/opencode/test/fixture/tui-plugin.ts

@@ -314,6 +314,7 @@ export function createTuiPluginApi(opts: Opts = {}): HostPluginApi {
       },
       session: {
         count: opts.state?.session?.count ?? (() => 0),
+        list: opts.state?.session?.list ?? (() => []),
         get: opts.state?.session?.get ?? (() => undefined),
         diff: opts.state?.session?.diff ?? (() => []),
         todo: opts.state?.session?.todo ?? (() => []),

packages/plugin/src/tui.ts

@@ -385,6 +385,7 @@ export type TuiState = {
   readonly vcs: { branch?: string; default_branch?: string } | undefined
   session: {
     count: () => number
+    list: () => ReadonlyArray<Session>
     get: (sessionID: string) => Session | undefined
     diff: (sessionID: string) => ReadonlyArray<TuiSidebarFileItem>
     todo: (sessionID: string) => ReadonlyArray<TuiSidebarTodoItem>

packages/tui/src/feature-plugins/sidebar/context.tsx

@@ -1,7 +1,7 @@
 import type { AssistantMessage } from "@opencode-ai/sdk/v2"
 import type { TuiPlugin, TuiPluginApi } from "@opencode-ai/plugin/tui"
 import type { BuiltinTuiPlugin } from "../builtins"
-import { createMemo } from "solid-js"
+import { createMemo, Show } from "solid-js"
 
 const id = "internal:sidebar-context"
 
@@ -15,6 +15,31 @@ function View(props: { api: TuiPluginApi; session_id: string }) {
   const msg = createMemo(() => props.api.state.session.messages(props.session_id))
   const session = createMemo(() => props.api.state.session.get(props.session_id))
   const cost = createMemo(() => session()?.cost ?? 0)
+  const allSessions = createMemo(() => props.api.state.session.list())
+
+  const subagentCost = createMemo(() => {
+    const list = allSessions()
+    let total = 0
+    const queue = [props.session_id]
+    const visited = new Set<string>()
+
+    while (queue.length > 0) {
+      const currentID = queue.shift()!
+      if (visited.has(currentID)) continue
+      visited.add(currentID)
+
+      for (const s of list) {
+        if (s.parentID === currentID && s.id !== props.session_id) {
+          total += s.cost ?? 0
+          queue.push(s.id)
+        }
+      }
+    }
+    return total
+  })
+
+  const hasSubagents = createMemo(() => subagentCost() > 0)
+  const totalCost = createMemo(() => cost() + subagentCost())
 
   const state = createMemo(() => {
     const last = msg().findLast((item): item is AssistantMessage => item.role === "assistant" && item.tokens.output > 0)
@@ -41,7 +66,22 @@ function View(props: { api: TuiPluginApi; session_id: string }) {
       </text>
       <text fg={theme().textMuted}>{state().tokens.toLocaleString()} tokens</text>
       <text fg={theme().textMuted}>{state().percent ?? 0}% used</text>
-      <text fg={theme().textMuted}>{money.format(cost())} spent</text>
+      <Show
+        when={hasSubagents()}
+        fallback={<text fg={theme().textMuted}>{money.format(cost())} spent</text>}
+      >
+        <box marginTop={1}>
+          <text fg={theme().textMuted}>
+            Main Agent: <span style={{ fg: theme().text }}>{money.format(cost())}</span>
+          </text>
+          <text fg={theme().textMuted}>
+            Sub-agents: <span style={{ fg: theme().text }}>{money.format(subagentCost())}</span>
+          </text>
+          <text fg={theme().textMuted}>
+            Total Cost: <span style={{ fg: theme().warning }}>{money.format(totalCost())}</span>
+          </text>
+        </box>
+      </Show>
     </box>
   )
 }

packages/tui/src/plugin/adapters.tsx

@@ -120,6 +120,9 @@ function stateApi(sync: ReturnType<typeof useSync>): TuiPluginApi["state"] {
       count() {
         return sync.data.session.length
       },
+      list() {
+        return sync.data.session
+      },
       get(sessionID) {
         return sync.session.get(sessionID)
       },