fix(web): tool call args missing — show input from result detail

Transport SDK tool.call events arrive at content_block_start before
input is streamed, so payload.input is undefined. The complete input
only appears in the tool.result's detail.input (from content_block_stop).

The consolidation and render code only checked the call's input,
resulting in "> Agent ✓" with no args visible.

Fix: fall back to result detail.input when the call has no input,
in both the consolidation merge and the render path.

Also default tool detail <details> to open so args are always visible.

Add 3 tests:
- Transport SDK tool.call with no input → args from result detail
- Normal tool.call with input → args shown directly
- Agent tool → prompt from result detail.input

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Author: IM.codes

web/src/components/ChatView.tsx

@@ -232,7 +232,10 @@ function buildViewItems(events: TimelineEvent[]): ViewItem[] {
         const next = visible[resultIdx];
         consumedIds.add(next.eventId); // mark tool.result as consumed
         const toolName = String(ev.payload.tool ?? 'tool');
-        const inputText = summarizeToolInput(ev.payload.input, ev.payload.detail);
+        // tool.call from transport SDK may have no input yet (streamed incrementally).
+        // Fall back to the result's detail.input which has the complete args.
+        const inputText = summarizeToolInput(ev.payload.input, ev.payload.detail)
+          || summarizeToolInput((next.payload.detail as any)?.input, next.payload.detail);
         const input = inputText ? ` ${inputText}` : '';
         const status = next.payload.error ? `✗ ${String(next.payload.error)}` : '✓';
         const output = !next.payload.error && next.payload.output ? String(next.payload.output) : undefined;
@@ -1193,9 +1196,11 @@ const ChatEvent = memo(function ChatEvent({
 
     case 'tool.call': {
       const callDetail = event.payload._callDetail ?? event.payload.detail;
-      const toolInput = summarizeToolInput(event.payload.input, callDetail);
-      const toolOutput = event.payload._output ? String(event.payload._output) : undefined;
       const resultDetail = event.payload._resultDetail;
+      // Fall back to result detail for input — transport SDK tool.call may arrive without input
+      const toolInput = summarizeToolInput(event.payload.input, callDetail)
+        || summarizeToolInput((resultDetail as any)?.input, resultDetail);
+      const toolOutput = event.payload._output ? String(event.payload._output) : undefined;
       return (
         <ToolBlockFold>
           <div class="chat-event chat-tool">
@@ -1209,7 +1214,7 @@ const ChatEvent = memo(function ChatEvent({
             </div>
           )}
           {(callDetail || resultDetail) && (
-            <details class="chat-tool-detail">
+            <details class="chat-tool-detail" open>
               <summary class="chat-tool-detail-summary">{t('chat.tool_detail_toggle')}</summary>
               <ToolDetailSection label={t('chat.tool_detail_input')} value={(callDetail as any)?.input} />
               <ToolDetailSection label={t('chat.tool_detail_output')} value={(resultDetail as any)?.output} />
@@ -1239,7 +1244,7 @@ const ChatEvent = memo(function ChatEvent({
             )}
           </div>
           {detail && (
-            <details class="chat-tool-detail">
+            <details class="chat-tool-detail" open>
               <summary class="chat-tool-detail-summary">{t('chat.tool_detail_toggle')}</summary>
               <ToolDetailSection label={t('chat.tool_detail_output')} value={(detail as any).output} />
               <ToolDetailSection label={t('chat.tool_detail_meta')} value={(detail as any).meta} />

web/test/components/ChatView.test.tsx

@@ -404,4 +404,98 @@ describe('ChatView', () => {
     });
     expect(onLoadOlder).not.toHaveBeenCalled();
   });
+
+  it('shows tool input args from result detail when tool.call has no input (transport SDK)', async () => {
+    // Transport SDK: tool.call arrives at content_block_start with NO input,
+    // tool.result arrives at content_block_stop with input in detail.input.
+    const events = [
+      {
+        eventId: 'tc-1',
+        type: 'tool.call',
+        ts: 1000,
+        payload: { tool: 'Read' },
+      },
+      {
+        eventId: 'tr-1',
+        type: 'tool.result',
+        ts: 1001,
+        payload: {
+          output: 'file contents...',
+          detail: {
+            kind: 'tool_use_complete',
+            summary: 'Read',
+            input: { file_path: '/home/user/project/src/index.ts' },
+          },
+        },
+      },
+    ] as any;
+
+    const { container } = render(
+      <ChatView events={events} loading={false} sessionId="test" />,
+    );
+
+    const toolEl = container.querySelector('.chat-tool');
+    expect(toolEl).not.toBeNull();
+    const text = toolEl!.textContent ?? '';
+    // Must contain the file path from result detail, not just "Read ✓"
+    expect(text).toContain('/home/user/project/src/index.ts');
+    expect(text).toContain('✓');
+  });
+
+  it('shows tool input inline when tool.call already has input (tmux agent)', async () => {
+    const events = [
+      {
+        eventId: 'tc-2',
+        type: 'tool.call',
+        ts: 2000,
+        payload: { tool: 'Bash', input: 'npm test' },
+      },
+      {
+        eventId: 'tr-2',
+        type: 'tool.result',
+        ts: 2001,
+        payload: { output: 'all tests passed' },
+      },
+    ] as any;
+
+    const { container } = render(
+      <ChatView events={events} loading={false} sessionId="test" />,
+    );
+
+    const toolEl = container.querySelector('.chat-tool');
+    const text = toolEl!.textContent ?? '';
+    expect(text).toContain('npm test');
+    expect(text).toContain('✓');
+  });
+
+  it('shows Agent tool prompt from result detail.input', async () => {
+    const events = [
+      {
+        eventId: 'tc-3',
+        type: 'tool.call',
+        ts: 3000,
+        payload: { tool: 'Agent' },
+      },
+      {
+        eventId: 'tr-3',
+        type: 'tool.result',
+        ts: 3001,
+        payload: {
+          detail: {
+            kind: 'tool_use_complete',
+            input: { prompt: 'Find the bug in auth module', description: 'Auth bug search' },
+          },
+        },
+      },
+    ] as any;
+
+    const { container } = render(
+      <ChatView events={events} loading={false} sessionId="test" />,
+    );
+
+    const toolEl = container.querySelector('.chat-tool');
+    const text = toolEl!.textContent ?? '';
+    // Must show the prompt, not just "Agent ✓"
+    expect(text).toContain('Find the bug in auth module');
+  });
 });