From 6c0f983f67dd810f90932f2c7ce089aeb3ac5e09 Mon Sep 17 00:00:00 2001
From: Robert Dailey <git@rdailey.me>
Date: Tue, 10 Feb 2026 10:36:14 -0600
Subject: [PATCH] feat(tui): show thinking indicator when reasoning is hidden

This adds a collapsed "Thinking..." spinner in the chat area when
the user has toggled thinking visibility off via `/thinking`. The
indicator uses the same braille spinner as tools/subagents and
disappears when reasoning finishes or the session is interrupted.
---
 .../src/cli/cmd/tui/routes/session/index.tsx  | 58 ++++++++++++-------
 1 file changed, 37 insertions(+), 21 deletions(-)

diff --git a/packages/opencode/src/cli/cmd/tui/routes/session/index.tsx b/packages/opencode/src/cli/cmd/tui/routes/session/index.tsx
index 70ff5eaf9fb6..8440b03c93d1 100644
--- a/packages/opencode/src/cli/cmd/tui/routes/session/index.tsx
+++ b/packages/opencode/src/cli/cmd/tui/routes/session/index.tsx
@@ -1327,28 +1327,44 @@ function ReasoningPart(props: { last: boolean; part: ReasoningPart; message: Ass
     // OpenRouter sends encrypted reasoning data that appears as [REDACTED]
     return props.part.text.replace("[REDACTED]", "").trim()
   })
+  const pending = createMemo(() => !props.part.time.end && !props.message.time.completed)
+  const color = createMemo(() =>
+    RGBA.fromInts(
+      Math.round(theme.markdownEmph.r * 255),
+      Math.round(theme.markdownEmph.g * 255),
+      Math.round(theme.markdownEmph.b * 255),
+      Math.round(theme.thinkingOpacity * 255),
+    ),
+  )
   return (
-    <Show when={content() && ctx.showThinking()}>
-      <box
-        id={"text-" + props.part.id}
-        paddingLeft={2}
-        marginTop={1}
-        flexDirection="column"
-        border={["left"]}
-        customBorderChars={SplitBorder.customBorderChars}
-        borderColor={theme.backgroundElement}
-      >
-        <code
-          filetype="markdown"
-          drawUnstyledText={false}
-          streaming={true}
-          syntaxStyle={subtleSyntax()}
-          content={"_Thinking:_ " + content()}
-          conceal={ctx.conceal()}
-          fg={theme.textMuted}
-        />
-      </box>
-    </Show>
+    <Switch>
+      <Match when={content() && ctx.showThinking()}>
+        <box
+          id={"text-" + props.part.id}
+          paddingLeft={2}
+          marginTop={1}
+          flexDirection="column"
+          border={["left"]}
+          customBorderChars={SplitBorder.customBorderChars}
+          borderColor={theme.backgroundElement}
+        >
+          <code
+            filetype="markdown"
+            drawUnstyledText={false}
+            streaming={true}
+            syntaxStyle={subtleSyntax()}
+            content={"_Thinking:_ " + content()}
+            conceal={ctx.conceal()}
+            fg={theme.textMuted}
+          />
+        </box>
+      </Match>
+      <Match when={!ctx.showThinking() && pending()}>
+        <box paddingLeft={3} marginTop={1}>
+          <Spinner color={color()}>Thinking...</Spinner>
+        </box>
+      </Match>
+    </Switch>
   )
 }