agentgui 1.0.714 → 1.0.715

package/lib/jsonl-watcher.js

@@ -4,7 +4,6 @@ import os from 'os';
 
 const PROJECTS_DIR = path.join(os.homedir(), '.claude', 'projects');
 const DEBOUNCE_MS = 16;
-const genId = (p) => `${p}-${Date.now()}-${Math.random().toString(36).slice(2, 10)}`;
 
 export class JsonlWatcher {
   constructor({ broadcastSync, queries, ownedSessionIds }) {
@@ -16,12 +15,13 @@ export class JsonlWatcher {
     this._frags = new Map();
     this._timers = new Map();
     this._seqs = new Map();
+    this._streaming = new Set();
     this._watcher = null;
   }
 
   start() {
     if (!fs.existsSync(PROJECTS_DIR)) return;
-    this._scan();
+    this._scanDir(PROJECTS_DIR, 0);
     try {
       this._watcher = fs.watch(PROJECTS_DIR, { recursive: true }, (_, f) => {
         if (f && f.endsWith('.jsonl')) this._debounce(path.join(PROJECTS_DIR, f));
@@ -41,34 +41,32 @@ export class JsonlWatcher {
     for (const sid of sids) {
       this._convMap.delete(sid);
       this._seqs.delete(sid);
+      this._streaming.delete(sid);
       for (const key of [...this._frags.keys()]) if (key.startsWith(`${sid}:`)) this._frags.delete(key);
-      const fp = path.join(PROJECTS_DIR, sid + '.jsonl');
-      const s = this._tails.get(fp);
-      if (s?.fd !== null) try { fs.closeSync(s.fd); } catch (_) {}
-      this._tails.delete(fp);
-      const t = this._timers.get(fp);
-      if (t) { clearTimeout(t); this._timers.delete(fp); }
+      for (const [fp, s] of this._tails.entries()) {
+        if (!fp.includes(sid)) continue;
+        if (s.fd !== null) try { fs.closeSync(s.fd); } catch (_) {}
+        this._tails.delete(fp);
+        const t = this._timers.get(fp);
+        if (t) { clearTimeout(t); this._timers.delete(fp); }
+      }
     }
   }
 
   removeAllConversations() {
     for (const s of this._tails.values()) if (s.fd !== null) try { fs.closeSync(s.fd); } catch (_) {}
     for (const t of this._timers.values()) clearTimeout(t);
-    this._tails.clear();
-    this._convMap.clear();
-    this._frags.clear();
-    this._timers.clear();
-    this._seqs.clear();
+    this._tails.clear(); this._convMap.clear(); this._frags.clear();
+    this._timers.clear(); this._seqs.clear(); this._streaming.clear();
   }
 
-  _scan() {
+  _scanDir(dir, depth) {
+    if (depth > 4) return;
     try {
-      for (const d of fs.readdirSync(PROJECTS_DIR, { withFileTypes: true })) {
-        if (!d.isDirectory()) continue;
-        try {
-          for (const f of fs.readdirSync(path.join(PROJECTS_DIR, d.name)))
-            if (f.endsWith('.jsonl')) this._debounce(path.join(PROJECTS_DIR, d.name, f));
-        } catch (_) {}
+      for (const d of fs.readdirSync(dir, { withFileTypes: true })) {
+        const fp = path.join(dir, d.name);
+        if (d.isFile() && d.name.endsWith('.jsonl')) this._debounce(fp);
+        else if (d.isDirectory()) this._scanDir(fp, depth + 1);
       }
     } catch (_) {}
   }
@@ -112,7 +110,7 @@ export class JsonlWatcher {
     if (cid) this._route(cid, e.sessionId, e);
   }
 
-  _conv(sid, e, fp) {
+  _conv(sid, e) {
     if (this._convMap.has(sid)) return this._convMap.get(sid);
     const found = this._q.getConversations().find(c => c.claudeSessionId === sid);
     if (found) { this._convMap.set(sid, found.id); return found.id; }
@@ -130,39 +128,67 @@ export class JsonlWatcher {
 
   _seq(sid) { const n = (this._seqs.get(sid) || 0) + 1; this._seqs.set(sid, n); return n; }
 
+  _emit(cid, sid, block, role, extra) {
+    this._bc({ type: 'streaming_progress', sessionId: sid, conversationId: cid, block, blockRole: role, seq: this._seq(sid), timestamp: Date.now(), ...extra });
+  }
+
+  _startStreaming(cid, sid) {
+    if (this._streaming.has(sid)) return;
+    this._streaming.add(sid);
+    this._bc({ type: 'streaming_start', sessionId: sid, conversationId: cid, agentId: 'cli-claude', timestamp: Date.now() });
+  }
+
+  _endStreaming(cid, sid) {
+    if (!this._streaming.has(sid)) return;
+    this._streaming.delete(sid);
+    this._bc({ type: 'streaming_complete', sessionId: sid, conversationId: cid, agentId: 'cli-claude', eventCount: 0, seq: this._seq(sid), timestamp: Date.now() });
+  }
+
   _route(cid, sid, e) {
     if (e.type === 'queue-operation' || (e.type === 'user' && e.isMeta)) return;
 
     if (e.type === 'system') {
-      if (e.subtype === 'init') { this._bc({ type: 'streaming_start', sessionId: sid, conversationId: cid, agentId: 'cli-claude', timestamp: Date.now() }); return; }
-      if (e.subtype === 'turn_duration') { this._bc({ type: 'streaming_complete', sessionId: sid, conversationId: cid, agentId: 'cli-claude', eventCount: 0, seq: this._seq(sid), timestamp: Date.now() }); return; }
-      const b = { type: 'system', subtype: e.subtype, model: e.model, cwd: e.cwd, tools: e.tools, preTokens: e.compactMetadata?.preTokens };
-      this._bc({ type: 'streaming_progress', sessionId: sid, conversationId: cid, block: b, blockRole: 'system', seq: this._seq(sid), timestamp: Date.now() });
+      if (e.subtype === 'init') { this._startStreaming(cid, sid); return; }
+      if (e.subtype === 'turn_duration' || e.subtype === 'stop_hook_summary') { this._endStreaming(cid, sid); return; }
+      this._emit(cid, sid, { type: 'system', subtype: e.subtype, model: e.model, cwd: e.cwd, tools: e.tools, preTokens: e.compactMetadata?.preTokens }, 'system');
       return;
     }
 
     if (e.type === 'assistant' && e.message?.content) {
+      this._startStreaming(cid, sid);
       const key = `${sid}:${e.message.id}`;
-      if (e.message.stop_reason === null || e.message.stop_reason === undefined) { this._frags.set(key, e); return; }
-      this._frags.delete(key);
-      for (const b of e.message.content) this._bc({ type: 'streaming_progress', sessionId: sid, conversationId: cid, block: b, blockRole: 'assistant', seq: this._seq(sid), timestamp: Date.now() });
+      const prevCount = this._frags.get(key)?.message?.content?.length || 0;
+      const newBlocks = e.message.content.slice(prevCount);
+      if (e.message.stop_reason === null || e.message.stop_reason === undefined) this._frags.set(key, e);
+      else this._frags.delete(key);
+      for (const b of newBlocks) this._emit(cid, sid, b, 'assistant');
       return;
     }
 
     if (e.type === 'user' && e.message?.content) {
-      if (e.isCompactSummary) { this._bc({ type: 'streaming_progress', sessionId: sid, conversationId: cid, block: { type: 'compact_summary', content: e.message.content }, seq: this._seq(sid), timestamp: Date.now() }); return; }
-      for (const b of e.message.content) if (b.type === 'tool_result') this._bc({ type: 'streaming_progress', sessionId: sid, conversationId: cid, block: b, blockRole: 'tool_result', seq: this._seq(sid), timestamp: Date.now() });
+      if (e.isCompactSummary) { this._emit(cid, sid, { type: 'compact_summary', content: e.message.content }, 'system'); return; }
+      this._startStreaming(cid, sid);
+      const blocks = Array.isArray(e.message.content) ? e.message.content : [];
+      for (const b of blocks) if (b.type === 'tool_result') this._emit(cid, sid, b, 'tool_result');
       return;
     }
 
-    if (e.type === 'progress') { this._bc({ type: 'streaming_progress', sessionId: sid, conversationId: cid, block: { type: e.subtype || 'progress', content: e.content }, seq: this._seq(sid), timestamp: Date.now() }); return; }
+    if (e.type === 'progress') {
+      this._startStreaming(cid, sid);
+      const dataType = e.data?.type || e.subtype || 'progress';
+      const content = dataType === 'agent_progress' ? e.data?.message : (e.data || e.content);
+      this._emit(cid, sid, { type: dataType, agentId: e.agentId, content }, 'progress');
+      return;
+    }
 
-    if (e.isApiErrorMessage && e.error === 'rate_limit') { this._bc({ type: 'streaming_error', sessionId: sid, conversationId: cid, error: 'Rate limit hit', recoverable: true, timestamp: Date.now() }); return; }
+    if (e.isApiErrorMessage && e.error === 'rate_limit') {
+      this._bc({ type: 'streaming_error', sessionId: sid, conversationId: cid, error: 'Rate limit hit', recoverable: true, timestamp: Date.now() });
+      return;
+    }
 
     if (e.type === 'result') {
-      const b = { type: 'result', result: e.result, subtype: e.subtype, duration_ms: e.duration_ms, total_cost_usd: e.total_cost_usd, is_error: e.is_error || false };
-      this._bc({ type: 'streaming_progress', sessionId: sid, conversationId: cid, block: b, blockRole: 'result', isResult: true, seq: this._seq(sid), timestamp: Date.now() });
-      this._bc({ type: 'streaming_complete', sessionId: sid, conversationId: cid, agentId: 'cli-claude', eventCount: 0, seq: this._seq(sid), timestamp: Date.now() });
+      this._emit(cid, sid, { type: 'result', result: e.result, subtype: e.subtype, duration_ms: e.duration_ms, total_cost_usd: e.total_cost_usd, is_error: e.is_error || false }, 'result', { isResult: true });
+      this._endStreaming(cid, sid);
     }
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "agentgui",
-  "version": "1.0.714",
+  "version": "1.0.715",
   "description": "Multi-agent ACP client with real-time communication",
   "type": "module",
   "main": "server.js",

package/static/js/client.js

@@ -910,7 +910,12 @@ class AgentGUIClient {
                   if (chunk.block.type === 'tool_result') {
                     const lastInFrag = bFrag.lastElementChild;
                     if (lastInFrag?.classList?.contains('block-tool-use')) {
-                      this.renderer.mergeResultIntoToolUse(lastInFrag, chunk.block);
+                      lastInFrag.classList.remove('has-success', 'has-error');
+                      lastInFrag.classList.add(chunk.block.is_error ? 'has-error' : 'has-success');
+                      const parentIsOpen = lastInFrag.hasAttribute('open');
+                      const contextWithParent = { ...chunk, parentIsOpen };
+                      const el = this.renderer.renderBlock(chunk.block, contextWithParent, bFrag);
+                      if (el) { lastInFrag.appendChild(el); }
                       return;
                     }
                   }
@@ -1582,13 +1587,10 @@ class AgentGUIClient {
       let html = '<div class="message-blocks">';
       if (content.blocks && Array.isArray(content.blocks)) {
         let pendingToolUseClose = false;
-        let pendingHasInput = false;
         content.blocks.forEach((block, blockIdx, blocks) => {
           if (block.type !== 'tool_result' && pendingToolUseClose) {
-            if (pendingHasInput) html += '</div>';
             html += '</details>';
             pendingToolUseClose = false;
-            pendingHasInput = false;
           }
           if (block.type === 'text') {
             const parts = this.parseMarkdownCodeBlocks(block.text);
@@ -1619,11 +1621,10 @@ class AgentGUIClient {
               html += `<div class="message-code"><details class="collapsible-code"><summary class="collapsible-code-summary">${this.escapeHtml(block.language || 'code')} - ${blkLineCount} line${blkLineCount !== 1 ? 's' : ''}</summary><pre style="margin:0;border-radius:0 0 0.375rem 0.375rem">${this.escapeHtml(block.code)}</pre></details></div>`;
             }
           } else if (block.type === 'tool_use') {
-            let inputContentHtml = '';
-            const hasInput = block.input && Object.keys(block.input).length > 0;
-            if (hasInput) {
+            let inputHtml = '';
+            if (block.input && Object.keys(block.input).length > 0) {
               const inputStr = JSON.stringify(block.input, null, 2);
-              inputContentHtml = `<pre class="tool-input-pre">${this.escapeHtml(inputStr)}</pre>`;
+              inputHtml = `<div class="folded-tool-body"><pre class="tool-input-pre">${this.escapeHtml(inputStr)}</pre></div>`;
             }
             const tn = block.name || 'unknown';
             const hasRenderer = typeof StreamingRenderer !== 'undefined';
@@ -1633,40 +1634,27 @@ class AgentGUIClient {
             const typeClass = hasRenderer && this.renderer ? this.renderer._getBlockTypeClass('tool_use') : 'block-type-tool_use';
             const toolColorClass = hasRenderer && this.renderer ? this.renderer._getToolColorClass(tn) : 'tool-color-default';
             const nextBlock = blocks[blockIdx + 1];
-            const resultClass = nextBlock?.type === 'tool_result' ? (nextBlock.is_error ? 'has-error tool-result-error' : 'has-success tool-result-success') : '';
-            const resultStatusIcon = nextBlock?.type === 'tool_result'
-              ? `<span class="folded-tool-status">${nextBlock.is_error
-                ? '<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z" clip-rule="evenodd"/></svg>'
-                : '<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"/></svg>'
-              }</span>` : '';
-            if (hasInput) {
-              html += `<details class="block-tool-use folded-tool ${typeClass} ${toolColorClass} ${resultClass}"><summary class="folded-tool-bar">${iconHtml}<span class="folded-tool-name">${this.escapeHtml(dName)}</span>${tTitle ? `<span class="folded-tool-desc">${this.escapeHtml(tTitle)}</span>` : ''}${resultStatusIcon}</summary><div class="folded-tool-body">${inputContentHtml}`;
-              pendingHasInput = true;
-            } else {
-              html += `<details class="block-tool-use folded-tool ${typeClass} ${toolColorClass} ${resultClass}"><summary class="folded-tool-bar">${iconHtml}<span class="folded-tool-name">${this.escapeHtml(dName)}</span>${tTitle ? `<span class="folded-tool-desc">${this.escapeHtml(tTitle)}</span>` : ''}${resultStatusIcon}</summary>`;
-              pendingHasInput = false;
-            }
+            const resultClass = nextBlock?.type === 'tool_result' ? (nextBlock.is_error ? 'has-error' : 'has-success') : '';
+            html += `<details class="block-tool-use folded-tool ${typeClass} ${toolColorClass} ${resultClass}"><summary class="folded-tool-bar">${iconHtml}<span class="folded-tool-name">${this.escapeHtml(dName)}</span>${tTitle ? `<span class="folded-tool-desc">${this.escapeHtml(tTitle)}</span>` : ''}</summary>${inputHtml}`;
             pendingToolUseClose = true;
           } else if (block.type === 'tool_result') {
             const content = typeof block.content === 'string' ? block.content : JSON.stringify(block.content);
             const smartHtml = typeof StreamingRenderer !== 'undefined' ? StreamingRenderer.renderSmartContentHTML(content, this.escapeHtml.bind(this), true) : `<pre class="tool-result-pre">${this.escapeHtml(content.length > 2000 ? content.substring(0, 2000) + '\n... (truncated)' : content)}</pre>`;
-            const resultContentHtml = `<div class="folded-tool-result-content">${smartHtml}</div>`;
+            const resultPreview = content.length > 80 ? content.substring(0, 77).replace(/\n/g, ' ') + '...' : content.replace(/\n/g, ' ');
+            const resultIcon = block.is_error
+              ? '<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z" clip-rule="evenodd"/></svg>'
+              : '<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"/></svg>';
+            const resultTypeClass = hasRenderer && this.renderer ? this.renderer._getBlockTypeClass('tool_result') : 'block-type-tool_result';
+            const resultHtml = `<div class="tool-result-inline${block.is_error ? ' tool-result-error' : ' tool-result-success'} ${resultTypeClass}"><div class="tool-result-status"><span class="folded-tool-icon">${resultIcon}</span><span class="folded-tool-name">${block.is_error ? 'Error' : 'Success'}</span></div><div class="folded-tool-body">${smartHtml}</div></div>`;
             if (pendingToolUseClose) {
-              if (pendingHasInput) {
-                html += resultContentHtml + '</div></details>';
-              } else {
-                html += `<div class="folded-tool-body">${resultContentHtml}</div></details>`;
-              }
+              html += resultHtml + '</details>';
               pendingToolUseClose = false;
             } else {
-              html += resultContentHtml;
+              html += resultHtml;
             }
           }
         });
-        if (pendingToolUseClose) {
-          if (pendingHasInput) html += '</div>';
-          html += '</details>';
-        }
+        if (pendingToolUseClose) html += '</details>';
       }
       html += '</div>';
       return html;
@@ -2151,8 +2139,12 @@ class AgentGUIClient {
       const lastEl = blocksEl.lastElementChild;
       const toolUseEl = matchById || (lastEl?.classList?.contains('block-tool-use') ? lastEl : null);
       if (toolUseEl) {
-        this.renderer.mergeResultIntoToolUse(toolUseEl, chunk.block);
-        this.scrollToBottom();
+        toolUseEl.classList.remove('has-success', 'has-error');
+        toolUseEl.classList.add(chunk.block.is_error ? 'has-error' : 'has-success');
+        const parentIsOpen = toolUseEl.hasAttribute('open');
+        const contextWithParent = { ...chunk, parentIsOpen };
+        const element = this.renderer.renderBlock(chunk.block, contextWithParent, blocksEl);
+        if (element) { toolUseEl.appendChild(element); this.scrollToBottom(); }
         return;
       }
     }
@@ -2893,7 +2885,14 @@ class AgentGUIClient {
                 ? blocksEl.querySelector(`.block-tool-use[data-tool-use-id="${toolUseId}"]`)
                 : blocksEl.lastElementChild?.classList?.contains('block-type-tool_use') ? blocksEl.lastElementChild : null;
               if (!toolUseEl) return;
-              this.renderer.mergeResultIntoToolUse(toolUseEl, chunk.block);
+              toolUseEl.classList.remove('has-success', 'has-error');
+              toolUseEl.classList.add(chunk.block.is_error ? 'has-error' : 'has-success');
+              const contextWithParent = { ...chunk, parentIsOpen: toolUseEl.hasAttribute('open') };
+              const element = this.renderer.renderBlock(chunk.block, contextWithParent, toolUseEl);
+              if (element) {
+                element.classList.add('block-loaded');
+                toolUseEl.appendChild(element);
+              }
             });
 
             if (isCurrentActiveSession) {

package/static/js/streaming-renderer.js

@@ -1261,17 +1261,33 @@ class StreamingRenderer {
     const contentStr = typeof content === 'string' ? content : JSON.stringify(content, null, 2);
     const isError = (block.is_error || false) && !contentStr.trimStart().startsWith('exec ran successfully.');
 
-    const container = document.createElement('div');
-    container.className = 'tool-result-pending';
-    container.dataset.eventType = 'tool_result';
-    container.dataset.isError = isError ? '1' : '0';
-    if (block.tool_use_id) container.dataset.toolUseId = block.tool_use_id;
-    container.style.display = 'none';
+    const details = document.createElement('details');
+    details.className = 'folded-tool' + (isError ? ' folded-tool-error' : ' folded-tool-success');
+    details.dataset.eventType = 'tool_result';
+    // Only open by default if the content is an image and it's not an error
+    const isImageContent = contentStr.includes('data:image/') || (block.content && block.content.type === 'base64');
+    if (!isError && isImageContent) details.open = true;
+    if (block.tool_use_id) details.dataset.toolUseId = block.tool_use_id;
+    details.classList.add(this._getBlockTypeClass('tool_result'));
+
+    const summary = document.createElement('summary');
+    summary.className = 'folded-tool-bar';
+    const iconSvg = isError
+      ? '<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z" clip-rule="evenodd"/></svg>'
+      : '<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"/></svg>';
+    summary.innerHTML = `
+      <span class="folded-tool-icon">${iconSvg}</span>
+      <span class="folded-tool-name">${isError ? 'Error' : 'Success'}</span>
+    `;
+    details.appendChild(summary);
 
     const renderedContent = StreamingRenderer.renderSmartContentHTML(contentStr, this.escapeHtml.bind(this), true);
-    container.innerHTML = renderedContent;
+    const body = document.createElement('div');
+    body.className = 'folded-tool-body';
+    body.innerHTML = renderedContent;
+    details.appendChild(body);
 
-    return container;
+    return details;
   }
 
   /**
@@ -2143,14 +2159,14 @@ class StreamingRenderer {
     if (!this.outputContainer) return;
 
     const toolUseBlocks = this.outputContainer.querySelectorAll('details.block-tool-use[data-tool-use-id]');
-    const toolResultBlocks = this.outputContainer.querySelectorAll('.tool-result-pending[data-tool-use-id]');
+    const toolResultBlocks = this.outputContainer.querySelectorAll('details[data-event-type="tool_result"][data-tool-use-id]');
 
     toolResultBlocks.forEach(resultBlock => {
       const toolUseId = resultBlock.dataset.toolUseId;
-      const isError = resultBlock.dataset.isError === '1';
       const toolUseBlock = Array.from(toolUseBlocks).find(b => b.dataset.toolUseId === toolUseId);
 
-      if (toolUseBlock) {
+      if (toolUseBlock && toolUseBlock.parentElement === resultBlock.parentElement) {
+        const isError = resultBlock.classList.contains('folded-tool-error');
         const toolUseSummary = toolUseBlock.querySelector(':scope > summary');
 
         if (toolUseSummary && !toolUseSummary.querySelector('.folded-tool-status')) {
@@ -2164,7 +2180,8 @@ class StreamingRenderer {
           toolUseBlock.classList.add(isError ? 'tool-result-error' : 'tool-result-success');
         }
 
-        if (resultBlock.innerHTML.trim()) {
+        const resultBody = resultBlock.querySelector('.folded-tool-body');
+        if (resultBody && resultBody.innerHTML.trim()) {
           let toolUseBody = toolUseBlock.querySelector(':scope > .folded-tool-body');
           if (!toolUseBody) {
             toolUseBody = document.createElement('div');
@@ -2173,12 +2190,10 @@ class StreamingRenderer {
           }
           const resultContent = document.createElement('div');
           resultContent.className = 'folded-tool-result-content';
-          resultContent.innerHTML = resultBlock.innerHTML;
+          resultContent.innerHTML = resultBody.innerHTML;
           toolUseBody.appendChild(resultContent);
         }
 
-        resultBlock.remove();
-      } else {
         resultBlock.remove();
       }
     });
@@ -2187,40 +2202,6 @@ class StreamingRenderer {
   /**
    * Auto-scroll to bottom of container
    */
-  mergeResultIntoToolUse(toolUseEl, block) {
-    const content = block.content || '';
-    const contentStr = typeof content === 'string' ? content : JSON.stringify(content, null, 2);
-    const isError = (block.is_error || false) && !contentStr.trimStart().startsWith('exec ran successfully.');
-
-    toolUseEl.classList.remove('has-success', 'has-error');
-    toolUseEl.classList.add(isError ? 'has-error tool-result-error' : 'has-success tool-result-success');
-
-    const summary = toolUseEl.querySelector(':scope > summary');
-    if (summary && !summary.querySelector('.folded-tool-status')) {
-      const statusSvg = isError
-        ? '<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z" clip-rule="evenodd"/></svg>'
-        : '<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"/></svg>';
-      const statusSpan = document.createElement('span');
-      statusSpan.className = 'folded-tool-status';
-      statusSpan.innerHTML = statusSvg;
-      summary.appendChild(statusSpan);
-    }
-
-    const renderedContent = StreamingRenderer.renderSmartContentHTML(contentStr, this.escapeHtml.bind(this), true);
-    if (renderedContent && renderedContent.trim()) {
-      let toolUseBody = toolUseEl.querySelector(':scope > .folded-tool-body');
-      if (!toolUseBody) {
-        toolUseBody = document.createElement('div');
-        toolUseBody.className = 'folded-tool-body';
-        toolUseEl.appendChild(toolUseBody);
-      }
-      const resultContent = document.createElement('div');
-      resultContent.className = 'folded-tool-result-content';
-      resultContent.innerHTML = renderedContent;
-      toolUseBody.appendChild(resultContent);
-    }
-  }
-
   autoScroll() {
     if (this._scrollRafPending || this._userScrolledUp) return;
     this._scrollRafPending = true;