From 303ff8137de6ef680af1d7ab1746a0efc97df28d Mon Sep 17 00:00:00 2001
From: lc6464 <64722907+lc6464@users.noreply.github.com>
Date: Sun, 26 Apr 2026 00:50:18 +0800
Subject: [PATCH] feat(chat): unify reasoning and tool call visibility

---
 .../src/components/chat/chat-page.tsx         | 19 ++++++++++++-------
 web/frontend/src/i18n/locales/en.json         |  2 +-
 web/frontend/src/i18n/locales/zh.json         |  2 +-
 web/frontend/src/store/chat.ts                |  7 ++++---
 4 files changed, 18 insertions(+), 12 deletions(-)

diff --git a/web/frontend/src/components/chat/chat-page.tsx b/web/frontend/src/components/chat/chat-page.tsx
index 03d1a8a36..3ad811dae 100644
--- a/web/frontend/src/components/chat/chat-page.tsx
+++ b/web/frontend/src/components/chat/chat-page.tsx
@@ -23,7 +23,7 @@ import { usePicoChat } from "@/hooks/use-pico-chat"
 import { useSessionHistory } from "@/hooks/use-session-history"
 import type { ConnectionState } from "@/store/chat"
 import type { ChatAttachment } from "@/store/chat"
-import { showThoughtsAtom } from "@/store/chat"
+import { showAssistantDetailsAtom } from "@/store/chat"
 import type { GatewayState } from "@/store/gateway"
 
 const MAX_IMAGE_SIZE_BYTES = 7 * 1024 * 1024
@@ -112,7 +112,9 @@ export function ChatPage() {
   const [hasScrolled, setHasScrolled] = useState(false)
   const [input, setInput] = useState("")
   const [attachments, setAttachments] = useState<ChatAttachment[]>([])
-  const [showThoughts, setShowThoughts] = useAtom(showThoughtsAtom)
+  const [showAssistantDetails, setShowAssistantDetails] = useAtom(
+    showAssistantDetailsAtom,
+  )
 
   const {
     messages,
@@ -271,12 +273,12 @@ export function ChatPage() {
       >
         <div className="border-border/60 hidden items-center gap-2 rounded-lg border px-3 py-1.5 sm:flex">
           <span className="text-muted-foreground text-sm">
-            {t("chat.showThoughts")}
+            {t("chat.showAssistantDetails")}
           </span>
           <Switch
-            checked={showThoughts}
-            onCheckedChange={setShowThoughts}
-            aria-label={t("chat.showThoughts")}
+            checked={showAssistantDetails}
+            onCheckedChange={setShowAssistantDetails}
+            aria-label={t("chat.showAssistantDetails")}
             size="sm"
           />
         </div>
@@ -323,7 +325,10 @@ export function ChatPage() {
           )}
 
           {messages.map((msg) => {
-            if (msg.kind === "thought" && !showThoughts) {
+            if (
+              !showAssistantDetails &&
+              (msg.kind === "thought" || msg.kind === "tool_calls")
+            ) {
               return null
             }
 
diff --git a/web/frontend/src/i18n/locales/en.json b/web/frontend/src/i18n/locales/en.json
index e29a4ccdf..a30dc0471 100644
--- a/web/frontend/src/i18n/locales/en.json
+++ b/web/frontend/src/i18n/locales/en.json
@@ -63,7 +63,7 @@
     "toolCallsLabel": "Tool calls",
     "toolCallExplanationLabel": "Call note",
     "toolCallFunctionLabel": "Call summary",
-    "showThoughts": "Show reasoning",
+    "showAssistantDetails": "Show reasoning and tool calls",
     "toolLabel": "Tool",
     "history": "History",
     "noHistory": "No chat history yet",
diff --git a/web/frontend/src/i18n/locales/zh.json b/web/frontend/src/i18n/locales/zh.json
index d9698c65e..efe3dc32a 100644
--- a/web/frontend/src/i18n/locales/zh.json
+++ b/web/frontend/src/i18n/locales/zh.json
@@ -63,7 +63,7 @@
     "toolCallsLabel": "工具调用",
     "toolCallExplanationLabel": "调用提示",
     "toolCallFunctionLabel": "调用摘要",
-    "showThoughts": "展示思考过程",
+    "showAssistantDetails": "展示思考过程与工具调用",
     "toolLabel": "工具",
     "history": "历史记录",
     "noHistory": "暂无对话历史",
diff --git a/web/frontend/src/store/chat.ts b/web/frontend/src/store/chat.ts
index 43e39d938..7a078d097 100644
--- a/web/frontend/src/store/chat.ts
+++ b/web/frontend/src/store/chat.ts
@@ -65,7 +65,8 @@ export interface ChatStoreState {
 
 type ChatStorePatch = Partial<ChatStoreState>
 
-const SHOW_THOUGHTS_STORAGE_KEY = "picoclaw:chat-show-thoughts"
+// Keep the legacy storage value so existing user preferences survive the rename.
+const SHOW_ASSISTANT_DETAILS_STORAGE_KEY = "picoclaw:chat-show-thoughts"
 
 const DEFAULT_CHAT_STATE: ChatStoreState = {
   messages: [],
@@ -76,8 +77,8 @@ const DEFAULT_CHAT_STATE: ChatStoreState = {
 }
 
 export const chatAtom = atom<ChatStoreState>(DEFAULT_CHAT_STATE)
-export const showThoughtsAtom = atomWithStorage<boolean>(
-  SHOW_THOUGHTS_STORAGE_KEY,
+export const showAssistantDetailsAtom = atomWithStorage<boolean>(
+  SHOW_ASSISTANT_DETAILS_STORAGE_KEY,
   true,
 )