myagent-ai 1.10.8 → 1.11.0

package/agents/main_agent.py

@@ -1137,6 +1137,10 @@ class MainAgent(BaseAgent):
                 code_lang = params.get("language", "python")
                 code_text = params.get("code", parms_str)
                 if self.executor:
+                    # 注入权限检查器（V1 路径在 api_server 中设置，V2 路径需要在此设置）
+                    self.executor.set_permission_checker(
+                        self.check_permission, self.name
+                    )
                     exec_result = await self.executor.execute(
                         language=code_lang,
                         code=code_text,
@@ -1149,6 +1153,10 @@ class MainAgent(BaseAgent):
             elif tool_name == "command" or tool_name == "command_run":
                 code_text = params.get("command", parms_str)
                 if self.executor:
+                    # 注入权限检查器（V1 路径在 api_server 中设置，V2 路径需要在此设置）
+                    self.executor.set_permission_checker(
+                        self.check_permission, self.name
+                    )
                     exec_result = await self.executor.execute(
                         language="shell",
                         code=code_text,

package/main.py

@@ -218,6 +218,10 @@ class MyAgentApp:
             max_retries=exe_cfg.max_retries,
             auto_fix=exe_cfg.auto_fix,
             max_output_length=exe_cfg.max_output_length,
+            execution_mode=exe_cfg.execution_mode,
+            sandbox_image=exe_cfg.sandbox_image,
+            sandbox_network=exe_cfg.sandbox_network,
+            sandbox_memory=exe_cfg.sandbox_memory,
         )
         self.logger.info(f"执行引擎: timeout={exe_cfg.timeout}s, auto_fix={exe_cfg.auto_fix}")
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "myagent-ai",
-  "version": "1.10.8",
+  "version": "1.11.0",
   "description": "本地桌面端执行型AI助手 - Open Interpreter 风格 | Local Desktop Execution-Oriented AI Assistant",
   "main": "main.py",
   "bin": {

package/web/api_server.py

@@ -2358,7 +2358,7 @@ class ApiServer:
         return web.json_response({**agent_info, "sessions": sessions})
 
     # Internal keys that should not appear in chat history UI
-    _HIDDEN_KEYS = {"llm_output", "tool_call", "tool_result"}
+    _HIDDEN_KEYS = {"llm_output"}
 
     async def handle_get_messages(self, request):
         sid = request.match_info["sid"]
@@ -3280,6 +3280,15 @@ class ApiServer:
         context.metadata["agent_override_path"] = agent_path
         context.metadata["chat_mode"] = chat_mode
 
+        # ── 根据 Agent 配置设置执行引擎参数（execution_mode 等）──
+        agent_cfg_for_exec = self._read_agent_config(agent_path)
+        _original_exec_mode = None
+        if agent_cfg_for_exec and agent.executor:
+            _exec_mode = agent_cfg_for_exec.get("execution_mode")
+            if _exec_mode:
+                _original_exec_mode = agent.executor.execution_mode
+                agent.executor.set_execution_mode(_exec_mode)
+
         # Clear execution events from previous runs
         agent.clear_execution_events()
 
@@ -3358,6 +3367,9 @@ class ApiServer:
             finally:
                 # 无论成功或异常，都清理 active_contexts
                 agent.active_contexts.pop(session_id, None)
+                # 恢复执行引擎原始模式（防止影响后续 Agent 请求）
+                if _original_exec_mode is not None and agent.executor:
+                    agent.executor.set_execution_mode(_original_exec_mode)
 
             # V2 结束后：如果 task_list_store 中有任务，确保最终推送一次
             if chat_mode == "exec" and session_id in self._task_list_store:

package/web/ui/chat/chat.css

@@ -242,6 +242,9 @@ input,textarea,select{font:inherit}
   border-bottom-left-radius:4px;
   max-width:95%;
 }
+/* Unified bubble wrapper for timeline content — always full width */
+.msg-bubble-wrapper{max-width:95%!important;width:100%}
+.msg-bubble-wrapper>.msg-timeline{gap:10px}
 .message-bubble p{margin-bottom:8px}
 .message-bubble p:last-child{margin-bottom:0}
 .message-bubble code{
@@ -466,7 +469,7 @@ input,textarea,select{font:inherit}
 }
 
 /* ── Thought Block (Agent Thinking) ── */
-.thought-block{margin:0 0 10px 0;border:1px solid var(--border-light);border-radius:var(--radius-sm);overflow:hidden;background:linear-gradient(135deg,var(--accent-light),var(--bg2));animation:thoughtFadeIn .4s ease-out}
+.thought-block{width:100%;display:block;margin:0 0 10px 0;border:1px solid var(--border-light);border-radius:var(--radius-sm);overflow:hidden;background:linear-gradient(135deg,var(--accent-light),var(--bg2));animation:thoughtFadeIn .4s ease-out}
 .thought-block.streaming{border-color:var(--accent);box-shadow:0 0 12px rgba(99,102,241,.15)}
 @keyframes thoughtFadeIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
 .thought-block summary{display:flex;align-items:center;gap:8px;padding:8px 14px;cursor:pointer;font-size:12px;font-weight:600;color:var(--text2);user-select:none;transition:var(--transition);text-transform:uppercase;letter-spacing:.3px}
@@ -478,7 +481,12 @@ input,textarea,select{font:inherit}
 .thought-block summary .thought-badge{font-size:10px;padding:2px 8px;border-radius:10px;background:var(--accent);color:#fff;font-weight:500;animation:badgePulse 1.2s ease-in-out infinite}
 @keyframes badgePulse{0%,100%{opacity:1}50%{opacity:.6}}
 .thought-block:not(.streaming) summary .thought-badge{background:var(--bg4);color:var(--text3);animation:none}
-.thought-content{padding:10px 14px 14px;font-size:13px;line-height:1.7;color:var(--text2);border-top:1px solid var(--border-light);max-height:300px;overflow-y:auto;overflow-x:hidden;word-break:break-word;overflow-wrap:break-word}
+.thought-content{width:100%;padding:10px 14px 14px;font-size:13px;line-height:1.7;color:var(--text2);border-top:1px solid var(--border-light);max-height:300px;overflow-y:auto;overflow-x:hidden;word-break:break-word;overflow-wrap:break-word}
+/* Reasoning (模型推理过程): limit to ~5 lines, scrollable */
+.thought-block .thought-content.reasoning-content{max-height:calc(1.7em * 5 + 28px);min-height:0}
+.thought-block .thought-content.reasoning-content::-webkit-scrollbar{width:4px}
+.thought-block .thought-content.reasoning-content::-webkit-scrollbar-thumb{background:var(--bg4);border-radius:2px}
+.thought-block .thought-content.reasoning-content::-webkit-scrollbar-track{background:transparent}
 .thought-content p{margin:4px 0}
 .thought-content p:first-child{margin-top:0}
 .thought-content p:last-child{margin-bottom:0}
@@ -2050,7 +2058,22 @@ input,textarea,select{font:inherit}
 .exec-event-result-btn svg{width:12px;height:12px}
 
 /* ── Inline Exec Events (Timeline Interleaved) ── */
-.msg-timeline{display:flex;flex-direction:column;gap:6px;overflow:hidden}
+.msg-timeline{display:flex;flex-direction:column;gap:10px;overflow:hidden}
+/* Text segment inside the unified bubble */
+.timeline-segment{word-break:break-word;overflow-wrap:break-word}
+.timeline-segment p{margin-bottom:8px}
+.timeline-segment p:last-child{margin-bottom:0}
+.timeline-segment code{background:rgba(0,0,0,.06);padding:2px 6px;border-radius:4px;font-family:'SF Mono','Fira Code','Cascadia Code',monospace;font-size:12.5px}
+.timeline-segment pre{background:#1e1e2e;color:#cdd6f4;padding:14px 16px;border-radius:var(--radius-sm);overflow-x:auto;margin:8px 0;font-size:12.5px;line-height:1.5;max-width:100%;white-space:pre-wrap;word-break:break-all}
+.timeline-segment strong{font-weight:600}
+.timeline-segment em{font-style:italic}
+.timeline-segment ul,.timeline-segment ol{padding-left:20px;margin:6px 0}
+.timeline-segment li{margin:3px 0}
+.timeline-segment blockquote{border-left:3px solid var(--accent);padding-left:12px;color:var(--text2);margin:6px 0}
+/* Exec events inside a message-bubble need distinct background for contrast */
+.message-bubble > .msg-timeline > .inline-exec-event{background:var(--bg);border-left-color:var(--accent)}
+[data-theme="dark"] .message-bubble > .msg-timeline > .inline-exec-event{background:var(--bg)}
+[data-theme="dark"] .message-bubble > .msg-timeline > .inline-exec-code{background:var(--bg2)}
 .inline-exec-event{margin:2px 0;padding:8px 12px;background:var(--bg2);border-left:3px solid var(--border);border-radius:6px;font-size:13px;animation:execEventSlide .3s ease-out}
 .inline-exec-header{display:flex;align-items:center;gap:6px;margin-bottom:4px}
 .inline-exec-icon{font-size:14px}

package/web/ui/chat/chat_main.js

@@ -1600,6 +1600,7 @@ async function clearSessionFromMenu(id) {
 }
 
 function formatSessionName(id) {
+  if (!id) return '新会话';
   if (id.startsWith('web_')) return id.replace('web_', '').replace(/_/g, ' ');
   if (id.startsWith('cli_')) return 'CLI: ' + id.replace('cli_', '');
   // Strip agent prefix if present (e.g., "default_web_2024..." -> "web_2024...")
@@ -1777,7 +1778,9 @@ async function selectSession(id) {
         key: m.key || '',
       };
     });
-    state.messages = loaded;
+    // Group consecutive non-user messages into single assistant messages with parts[]
+    // This creates the interleaved speak→tool→speak pattern matching streaming display
+    state.messages = groupHistoryMessages(loaded);
     state._msgLoadOffset = loaded.length;
     state._msgLoadTotal = loaded.length;
   } catch (e) {
@@ -1838,11 +1841,14 @@ async function loadMoreMessages() {
         role: m.role || 'assistant',
         content: content,
         time: m.time || m.created_at || '',
+        key: m.key || '',
       };
     });
 
+    // Group consecutive non-user messages for the loaded batch
+    const grouped = groupHistoryMessages(loaded);
     // 追加到现有消息前面（保持滚动位置）
-    state.messages = loaded.concat(state.messages);
+    state.messages = grouped.concat(state.messages);
     state._msgLoadOffset += loaded.length;
     state._msgLoadTotal = state.messages.length;
 
@@ -1995,6 +2001,165 @@ async function clearCurrentChat() {
   }
 }
 
+// ── Group History Messages ──
+// Groups consecutive non-user messages (assistant + tool) into single assistant messages
+// with parts[] for timeline rendering, matching the streaming display format.
+// This creates: user → [assistant (speak → tool → speak → tool)] → user → ...
+function groupHistoryMessages(messages) {
+  if (!Array.isArray(messages) || messages.length === 0) return messages;
+
+  const grouped = [];
+  let i = 0;
+
+  while (i < messages.length) {
+    const msg = messages[i];
+
+    if (msg.role === 'user') {
+      // User message: pass through as-is
+      grouped.push({ role: 'user', content: msg.content, time: msg.time || '' });
+      i++;
+    } else if (msg.role === 'assistant') {
+      // Start of a new agent group: collect all consecutive non-user messages
+      const parts = [];
+      let lastAssistantTime = msg.time || '';
+
+      // If assistant has content, add as text part
+      if (msg.content && msg.content.trim() && msg.content !== '(无回复)') {
+        parts.push({ type: 'text', content: msg.content });
+      }
+
+      i++; // Move to next message
+
+      // Collect following tool messages
+      while (i < messages.length && messages[i].role === 'tool') {
+        const toolMsg = messages[i];
+        const isResult = toolMsg.key === 'tool_result';
+        const isCall = toolMsg.key === 'tool_call';
+
+        if (isCall) {
+          // Extract tool name from content
+          const toolName = (toolMsg.content.match(/^调用工具:\s*(\S+)/) || [])[1] || '';
+          parts.push({
+            type: 'exec',
+            data: {
+              id: 'hist_tool_' + i,
+              type: 'tool_call',
+              title: toolMsg.content.substring(0, 100) || ('调用工具: ' + toolName),
+              tool_name: toolName,
+              status: 'done',
+            }
+          });
+        } else if (isResult) {
+          // Determine success/failure from content
+          const isOk = !toolMsg.content.includes('失败');
+          parts.push({
+            type: 'exec',
+            data: {
+              id: 'hist_tool_' + i,
+              type: 'tool_result',
+              title: (toolMsg.content.substring(0, 80) || '工具执行结果'),
+              success: isOk,
+              summary: toolMsg.content.substring(0, 500),
+            }
+          });
+        } else {
+          // Generic tool message
+          parts.push({
+            type: 'exec',
+            data: {
+              id: 'hist_tool_' + i,
+              type: 'tool_call',
+              title: toolMsg.content.substring(0, 100) || '工具调用',
+              status: 'done',
+            }
+          });
+        }
+
+        i++;
+
+        // If next message is an assistant message, add its content as a text part and continue
+        // This handles the pattern: text → tool → text → tool
+        if (i < messages.length && messages[i].role === 'assistant') {
+          const nextAssistant = messages[i];
+          if (nextAssistant.content && nextAssistant.content.trim() && nextAssistant.content !== '(无回复)') {
+            parts.push({ type: 'text', content: nextAssistant.content });
+            lastAssistantTime = nextAssistant.time || lastAssistantTime;
+          }
+          i++;
+        }
+      }
+
+      // Create grouped assistant message with parts
+      // Assemble content from text parts for backward compat
+      const textParts = parts.filter(p => p.type === 'text');
+      const assembledContent = textParts.map(p => p.content).join('\n\n');
+
+      grouped.push({
+        role: 'assistant',
+        content: assembledContent || '',
+        time: lastAssistantTime,
+        parts: parts.length > 0 ? parts : undefined,
+        // Also collect exec_events for backward compat display
+        exec_events: parts.filter(p => p.type === 'exec').map(p => p.data),
+      });
+    } else if (msg.role === 'tool') {
+      // Orphan tool message (no preceding assistant) — wrap in an assistant group
+      const parts = [];
+      const isResult = msg.key === 'tool_result';
+      const isCall = msg.key === 'tool_call';
+
+      if (isCall) {
+        const toolName = (msg.content.match(/^调用工具:\s*(\S+)/) || [])[1] || '';
+        parts.push({
+          type: 'exec',
+          data: {
+            id: 'hist_tool_' + i,
+            type: 'tool_call',
+            title: msg.content.substring(0, 100) || ('调用工具: ' + toolName),
+            tool_name: toolName,
+            status: 'done',
+          }
+        });
+      } else if (isResult) {
+        const isOk = !msg.content.includes('失败');
+        parts.push({
+          type: 'exec',
+          data: {
+            id: 'hist_tool_' + i,
+            type: 'tool_result',
+            title: msg.content.substring(0, 80) || '工具执行结果',
+            success: isOk,
+            summary: msg.content.substring(0, 500),
+          }
+        });
+      }
+
+      i++;
+      // Check if next is assistant (to include its content)
+      if (i < messages.length && messages[i].role === 'assistant') {
+        const nextAssistant = messages[i];
+        if (nextAssistant.content && nextAssistant.content.trim() && nextAssistant.content !== '(无回复)') {
+          parts.push({ type: 'text', content: nextAssistant.content });
+        }
+        i++;
+      }
+
+      grouped.push({
+        role: 'assistant',
+        content: parts.filter(p => p.type === 'text').map(p => p.content).join('\n\n'),
+        time: msg.time || '',
+        parts: parts.length > 0 ? parts : undefined,
+        exec_events: parts.filter(p => p.type === 'exec').map(p => p.data),
+      });
+    } else {
+      // Skip unknown roles
+      i++;
+    }
+  }
+
+  return grouped;
+}
+
 // ── Messages ──
 function renderMessages() {
   try {
@@ -2072,31 +2237,9 @@ function _renderMessagesInner() {
   for (let i = 0; i < state.messages.length; i++) {
     const msg = state.messages[i];
     const isUser = msg.role === 'user';
-    const isTool = msg.role === 'tool';
 
-    // ── 工具消息：根据 key 区分 tool_call / tool_result ──
-    if (isTool) {
-      const isResult = msg.key === 'tool_result';
-      const isCall = msg.key === 'tool_call';
-      const icon = isResult ? '📋' : (isCall ? '⚙️' : '🔧');
-      const label = isResult ? '工具执行结果' : (isCall ? '工具调用' : '工具调用过程');
-      // 提取工具名称
-      const toolName = msg.content.match(/^调用工具:\s*(\S+)/) ? msg.content.match(/^调用工具:\s*(\S+)/)[1]
-        : msg.content.match(/^\[([^\]]+)\]/) ? msg.content.match(/^\[([^\]]+)\]/)[1] : '';
-      const titleExtra = toolName ? ' — ' + escapeHtml(toolName) : '';
-      // 判断成功/失败
-      const isOk = isResult && !msg.content.includes('失败');
-      const badge = isResult ? `<span class="thought-badge" style="${isOk ? 'background:var(--ok)' : 'background:var(--danger)'}">${isOk ? '成功' : '失败'}</span>` : '';
-      html += `<details class="thought-block">
-        <summary>
-          <span class="thought-icon">${icon}</span>
-          <span class="thought-label">${label}${titleExtra}</span>
-          ${badge}
-        </summary>
-        <div class="thought-content"><pre style="white-space:pre-wrap;word-break:break-word;margin:0;font-size:12px;line-height:1.6">${escapeHtml(msg.content)}</pre></div>
-      </details>`;
-      continue;
-    }
+    // Skip standalone tool messages (now grouped into assistant parts via groupHistoryMessages)
+    if (msg.role === 'tool') continue;
 
     const avatar = isUser ? '👤' : botEmoji;
     const content = renderMarkdown(msg.content);
@@ -2119,7 +2262,7 @@ function _renderMessagesInner() {
           <span class="thought-label">模型推理过程</span>
           ${isStreaming ? '<span class="thought-badge">推理中...</span>' : '<span class="thought-badge">已完成</span>'}
         </summary>
-        <div class="thought-content">${renderMarkdown(msg.reasoning)}</div>
+        <div class="thought-content reasoning-content">${renderMarkdown(msg.reasoning)}</div>
       </details>`;
     })() : '';
     const actionBtns = (!isUser && msg.content) ? `
@@ -2147,36 +2290,41 @@ function _renderMessagesInner() {
         <span style="font-weight:500">Agent 正在思考...</span>
       </div>` : '';
 
-    // ── Timeline rendering for interleaved text + exec events ──
+    // ── Timeline rendering: all parts in ONE unified bubble ──
     let timelineHtml = '';
     if (hasParts || hasStreamingText) {
-      let partsHtml = '';
+      let partsInner = '';
       for (const part of (msg.parts || [])) {
         if (part.type === 'text' && part.content.trim()) {
-          partsHtml += '<div class="message-bubble">' + renderMarkdown(part.content) + '</div>';
+          partsInner += '<div class="timeline-segment">' + renderMarkdown(part.content) + '</div>';
         } else if (part.type === 'exec') {
-          partsHtml += renderInlineExecEvent(part.data, i);
+          partsInner += renderInlineExecEvent(part.data, i);
+        } else if (part.type === 'v2_tool') {
+          partsInner += renderInlineExecEvent(part, i);
+        } else if (part.type === 'v2_ask') {
+          partsInner += '<div class="v2-ask-user"><div class="v2-ask-icon">❓</div><div class="v2-ask-content">' + renderMarkdown(part.data.question) + '</div></div>';
         }
       }
       if (hasStreamingText) {
         const _cursor = msg.streaming ? '<span class="streaming-cursor"></span>' : '';
-        partsHtml += '<div class="message-bubble">' + renderMarkdown(msg._streamingText) + _cursor + '</div>';
+        partsInner += '<div class="timeline-segment">' + renderMarkdown(msg._streamingText) + _cursor + '</div>';
       }
-      if (partsHtml) {
-        timelineHtml = '<div class="msg-timeline">' + partsHtml + '</div>';
+      if (partsInner) {
+        // All parts (text segments + tool calls) wrapped in ONE message-bubble
+        timelineHtml = '<div class="message-bubble"><div class="msg-timeline">' + partsInner + '</div></div>';
       }
     }
 
     // Backward compat: single bubble for messages without parts
     const singleBubbleHtml = (!hasParts && !hasStreamingText)
-      ? ((content || streamingIndicator) ? `<div class="message-bubble">${content}${ttsIndicator}</div>` : '')
+      ? (content ? `<div class="message-bubble">${content}${ttsIndicator}</div>` : '')
       : '';
 
     // Exec events panel: only for backward compat (messages without parts loaded from DB)
     const execEventsHtml = (!isUser && !hasParts && msg.exec_events && msg.exec_events.length > 0)
       ? renderExecEvents(msg.exec_events, i) : '';
     html += `
-      <div class="message-row ${msg.role}">
+      <div class="message-row ${msg.role}${msg.streaming ? ' streaming' : ''}">
         <div class="message-avatar">${avatar}</div>
         <div class="message-content" style="flex:1;min-width:0">
           ${reasoningHtml}
@@ -2294,6 +2442,21 @@ function formatTime(timeStr) {
 function scrollToBottom(force) {
   const c = document.getElementById('messagesContainer');
   if (!c) return;
+  // During streaming: pin the active assistant message to the top of the chat window
+  // so the user can see the full response content below
+  const isStreaming = state.isGenerating;
+  if (isStreaming && !force) {
+    const activeRow = c.querySelector('.message-row.assistant.streaming, .message-row.assistant:last-of-type');
+    if (activeRow) {
+      requestAnimationFrame(() => {
+        const rowTop = activeRow.offsetTop;
+        // Scroll so the assistant row sits at the very top of the visible area
+        c.scrollTop = rowTop;
+        updateScrollToBottomBtn(c.scrollHeight - c.scrollTop - c.clientHeight);
+      });
+      return;
+    }
+  }
   requestAnimationFrame(() => {
     // Smart scroll: only auto-scroll if user is near bottom (within 120px)
     // or if force is true

package/web/ui/chat/flow_engine.js

@@ -377,7 +377,7 @@ function updateStreamingMessage(msgIdx) {
           <span class="thought-label">模型推理过程${reasoningWordCount}</span>
           ${msg.streaming ? '<span class="thought-badge">推理中...</span>' : '<span class="thought-badge">已完成</span>'}
         </summary>
-        <div class="thought-content">${renderMarkdown(msg.reasoning)}</div>
+        <div class="thought-content reasoning-content">${renderMarkdown(msg.reasoning)}</div>
       </details>`;
       contentArea.insertAdjacentHTML('afterbegin', reasoningHtml);
       // Set initial length tracking
@@ -494,114 +494,116 @@ function updateStreamingMessage(msgIdx) {
   // Update content - timeline (interleaved text + exec events) or single bubble (backward compat)
   const hasParts = Array.isArray(msg.parts);
   if (hasParts) {
-    // ── Timeline rendering for interleaved text + exec events ──
-    let timeline = contentArea.querySelector('.msg-timeline');
-    if (!timeline) {
+    // ── Timeline rendering: all parts in ONE unified bubble ──
+    // Structure: .message-bubble > .msg-timeline > (.timeline-segment | .inline-exec-event | .streaming-segment)
+    let bubbleWrapper = contentArea.querySelector(':scope > .msg-bubble-wrapper');
+    let timeline = bubbleWrapper ? bubbleWrapper.querySelector('.msg-timeline') : null;
+
+    if (!bubbleWrapper || !timeline) {
       // Remove old single bubble if exists
-      const oldBubble = contentArea.querySelector(':scope > .message-bubble');
+      const oldBubble = contentArea.querySelector(':scope > .message-bubble:not(.msg-bubble-wrapper .message-bubble)');
       if (oldBubble) oldBubble.remove();
-      // Create timeline container
+      // Remove old standalone timeline if exists
+      const oldTimeline = contentArea.querySelector(':scope > .msg-timeline');
+      if (oldTimeline) oldTimeline.remove();
+      // Create unified bubble wrapper
+      bubbleWrapper = document.createElement('div');
+      bubbleWrapper.className = 'message-bubble msg-bubble-wrapper';
       timeline = document.createElement('div');
       timeline.className = 'msg-timeline';
+      bubbleWrapper.appendChild(timeline);
       // Insert after thought blocks or at beginning
       const allThoughts = contentArea.querySelectorAll(':scope > .thought-block');
       if (allThoughts.length > 0) {
-        allThoughts[allThoughts.length - 1].insertAdjacentElement('afterend', timeline);
+        allThoughts[allThoughts.length - 1].insertAdjacentElement('afterend', bubbleWrapper);
       } else {
-        contentArea.appendChild(timeline);
+        contentArea.appendChild(bubbleWrapper);
       }
     }
 
     // Update completed parts only when count changes (avoid rebuilding DOM)
     const partsCount = msg.parts.length;
     if (!msg._lastPartsCount || msg._lastPartsCount !== partsCount) {
-      if (!timeline) {
-        timeline = contentArea.querySelector('.msg-timeline');
-      }
-      if (timeline) {
-        // Only append new parts (don't rebuild existing)
-        const prevCount = msg._lastPartsCount || 0;
-        for (let pi = prevCount; pi < msg.parts.length; pi++) {
-          const part = msg.parts[pi];
-          let partHtml = '';
-          if (part.type === 'text' && part.content.trim()) {
-            partHtml = '<div class="message-bubble">' + renderMarkdown(part.content) + '</div>';
-          } else if (part.type === 'exec') {
-            partHtml = renderInlineExecEvent(part.data, msgIdx);
-          } else if (part.type === 'v2_tool') {
-            partHtml = renderInlineExecEvent(part, msgIdx);
-          } else if (part.type === 'v2_ask') {
-            partHtml = '<div class="v2-ask-user"><div class="v2-ask-icon">❓</div><div class="v2-ask-content">' + renderMarkdown(part.data.question) + '</div></div>';
-          }
-          if (partHtml) {
-            // Insert before streaming bubble if it exists
-            const existingStreaming = timeline.querySelector('.streaming-bubble');
-            if (existingStreaming) {
-              existingStreaming.insertAdjacentHTML('beforebegin', partHtml);
-            } else {
-              timeline.insertAdjacentHTML('beforeend', partHtml);
-            }
+      // Only append new parts (don't rebuild existing)
+      const prevCount = msg._lastPartsCount || 0;
+      for (let pi = prevCount; pi < msg.parts.length; pi++) {
+        const part = msg.parts[pi];
+        let partHtml = '';
+        if (part.type === 'text' && part.content.trim()) {
+          partHtml = '<div class="timeline-segment">' + renderMarkdown(part.content) + '</div>';
+        } else if (part.type === 'exec') {
+          partHtml = renderInlineExecEvent(part.data, msgIdx);
+        } else if (part.type === 'v2_tool') {
+          partHtml = renderInlineExecEvent(part, msgIdx);
+        } else if (part.type === 'v2_ask') {
+          partHtml = '<div class="v2-ask-user"><div class="v2-ask-icon">❓</div><div class="v2-ask-content">' + renderMarkdown(part.data.question) + '</div></div>';
+        }
+        if (partHtml) {
+          // Insert before streaming segment if it exists
+          const existingStreaming = timeline.querySelector('.streaming-segment');
+          if (existingStreaming) {
+            existingStreaming.insertAdjacentHTML('beforebegin', partHtml);
+          } else {
+            timeline.insertAdjacentHTML('beforeend', partHtml);
           }
         }
-        msg._lastPartsCount = partsCount;
       }
+      msg._lastPartsCount = partsCount;
     }
 
-    // Incrementally update streaming bubble only (not entire timeline)
+    // Incrementally update streaming segment (inside the same bubble)
     const streamingText = msg._streamingText || '';
     const cursorHtml = msg.streaming ? '<span class="streaming-cursor"></span>' : '';
-    let streamingBubble = timeline.querySelector('.streaming-bubble');
+    let streamingSeg = timeline.querySelector('.streaming-segment');
     if (streamingText.trim()) {
-      if (!streamingBubble) {
-        // Append streaming bubble at the end of timeline
-        streamingBubble = document.createElement('div');
-        streamingBubble.className = 'message-bubble streaming-bubble';
-        timeline.appendChild(streamingBubble);
+      if (!streamingSeg) {
+        // Append streaming segment at the end of timeline (inside the unified bubble)
+        streamingSeg = document.createElement('div');
+        streamingSeg.className = 'timeline-segment streaming-segment';
+        timeline.appendChild(streamingSeg);
       }
       // Lightweight incremental text update during streaming to avoid flicker
       const prevStreamLen = msg._lastStreamRenderedLen || 0;
       const nowMs = performance.now();
       if (msg.streaming && streamingText.length > prevStreamLen && prevStreamLen > 0) {
         const newChars = streamingText.length - prevStreamLen;
-        // Always use fast path (text node append) to avoid innerHTML rebuilds
-        if (newChars < 200 && streamingBubble._lastFullHtml) {
+        if (newChars < 200 && streamingSeg._lastFullHtml) {
           // Fast path: append new text node (smooth, no reflow)
           const textNode = document.createTextNode(streamingText.substring(prevStreamLen));
-          const oldCursor = streamingBubble.querySelector('.streaming-cursor');
+          const oldCursor = streamingSeg.querySelector('.streaming-cursor');
           if (oldCursor) oldCursor.remove();
-          streamingBubble.appendChild(textNode);
+          streamingSeg.appendChild(textNode);
           const cursor = document.createElement('span');
           cursor.className = 'streaming-cursor';
-          streamingBubble.appendChild(cursor);
+          streamingSeg.appendChild(cursor);
           msg._lastStreamRenderedLen = streamingText.length;
         } else {
           // Full markdown render — only when newChars >= 200 or every 1.5s
           const timeSinceFullRender = nowMs - (_fullMdTimer.last || 0);
           if (newChars >= 200 || timeSinceFullRender > 1500) {
-            streamingBubble.innerHTML = renderMarkdown(streamingText) + cursorHtml;
-            streamingBubble._lastFullHtml = streamingBubble.innerHTML;
+            streamingSeg.innerHTML = renderMarkdown(streamingText) + cursorHtml;
+            streamingSeg._lastFullHtml = streamingSeg.innerHTML;
             msg._lastStreamRenderedLen = streamingText.length;
             _fullMdTimer.last = nowMs;
           } else {
-            // Still use fast path even for larger chunks if within 2s cooldown
             const textNode = document.createTextNode(streamingText.substring(prevStreamLen));
-            const oldCursor = streamingBubble.querySelector('.streaming-cursor');
+            const oldCursor = streamingSeg.querySelector('.streaming-cursor');
             if (oldCursor) oldCursor.remove();
-            streamingBubble.appendChild(textNode);
+            streamingSeg.appendChild(textNode);
             const cursor = document.createElement('span');
             cursor.className = 'streaming-cursor';
-            streamingBubble.appendChild(cursor);
+            streamingSeg.appendChild(cursor);
             msg._lastStreamRenderedLen = streamingText.length;
           }
         }
       } else {
         // Full render
-        streamingBubble.innerHTML = renderMarkdown(streamingText) + cursorHtml;
-        streamingBubble._lastFullHtml = streamingBubble.innerHTML;
+        streamingSeg.innerHTML = renderMarkdown(streamingText) + cursorHtml;
+        streamingSeg._lastFullHtml = streamingSeg.innerHTML;
         msg._lastStreamRenderedLen = streamingText.length;
       }
-    } else if (streamingBubble) {
-      streamingBubble.remove();
+    } else if (streamingSeg) {
+      streamingSeg.remove();
       msg._lastStreamRenderedLen = 0;
     }
 
@@ -1064,29 +1066,32 @@ function _stripXmlTags(xml) {
 // ══════════════════════════════════════════════════════
 
 function _assembleV2Content(msg, msgParts) {
-  // Priority 1: V2 reasoning text (user-facing response from v2_reasoning events)
+  // Priority 1: Text parts from msgParts (now includes flushed V2 reasoning segments)
+  // In the new interleaved model, reasoning text is flushed into text parts at tool boundaries
+  if (msgParts && Array.isArray(msgParts) && msgParts.length > 0) {
+    var textParts = msgParts.filter(function(p) { return p.type === 'text'; });
+    if (textParts.length > 0) {
+      // Return only the LAST text part as content (the final response)
+      // This avoids showing intermediate reasoning text as the message content
+      var lastText = textParts[textParts.length - 1].content;
+      if (lastText && lastText.trim()) return lastText.trim();
+    }
+  }
+  // Priority 2: V2 reasoning text (may still be present during streaming before flush)
   if (msg._v2Reasoning && msg._v2Reasoning.trim()) {
     return msg._v2Reasoning.trim();
   }
-  // Priority 2: V2 ask user text
+  // Priority 3: V2 ask user text
   if (msg._askUser && msg._askUser.trim()) {
     return msg._askUser.trim();
   }
-  // Priority 3: V2 raw XML stripped of tags (fallback when v2_reasoning not sent)
+  // Priority 4: V2 raw XML stripped of tags (fallback when v2_reasoning not sent)
   if (msg._v2RawXml && msg._v2RawXml.trim()) {
     var strippedText = _stripXmlTags(msg._v2RawXml);
     if (strippedText && strippedText.trim()) {
       return strippedText.trim();
     }
   }
-  // Priority 4: V1 text parts (backward compat — non-V2 mode)
-  // Guard: msgParts may be undefined after page refresh (only role/content/time persisted)
-  if (msgParts && Array.isArray(msgParts) && msgParts.length > 0) {
-    var textParts = msgParts.filter(function(p) { return p.type === 'text'; });
-    if (textParts.length > 0) {
-      return textParts.map(function(p) { return p.content; }).join('\n\n');
-    }
-  }
   // Priority 5: raw content from message (server-stored response)
   if (msg.content && msg.content.trim() && msg.content !== '(无回复)') {
     return msg.content.trim();
@@ -1199,6 +1204,15 @@ async function sendMessage() {
       }
       currentText = '';
     }
+    // Flush accumulated V2 reasoning text as a text part into msgParts
+    // This creates the interleaved speak→tool→speak pattern
+    function flushV2Reasoning() {
+      if (_v2ReasoningText && _v2ReasoningText.trim()) {
+        msgParts.push({type: 'text', content: _v2ReasoningText.trim()});
+        _v2ReasoningText = '';
+        state.messages[msgIdx]._v2Reasoning = _v2ReasoningText;
+      }
+    }
 
     // Add placeholder for streaming response
     state.messages.push({ role: 'assistant', content: '', thought: '', parts: [], time: new Date().toISOString(), streaming: true });
@@ -1297,6 +1311,8 @@ async function sendMessage() {
             scrollToBottom(true); // Force scroll for new message
           } else if (evt.type === 'clear_text') {
             // Clear intermediate text from previous agent loop iterations
+            // Flush V2 reasoning as text part before clearing
+            flushV2Reasoning();
             flushCurrentText();
             state.messages[msgIdx].parts = [...msgParts];
             state.messages[msgIdx]._streamingText = '';
@@ -1388,10 +1404,13 @@ async function sendMessage() {
                 callback: evt.tool.callback
               });
             }
+            // Flush reasoning text BEFORE tool call to create speak→tool pattern
+            flushV2Reasoning();
             flushCurrentText();
             var toolEvent = {
               type: 'v2_tool',
               data: {
+                id: 'v2tool_' + Date.now() + '_' + allExecEvents.length,
                 type: 'tool_start',
                 title: (evt.tool.beforecalltext || '调用工具: ' + (evt.tool.toolname || '')),
                 tool_name: evt.tool.toolname,
@@ -1419,24 +1438,29 @@ async function sendMessage() {
             // evt.result contains: {success, output, error, ...}
             // 记录到调试控制台
             if (window.addDebugLog) {
-              window.addDebugLog(evt.result && evt.result.success ? 'tool' : 'error',
-                (evt.tool.toolname || '工具') + ' 执行' + (evt.result && evt.result.success ? '成功' : '失败'), {
-                tool: evt.tool.toolname,
-                success: evt.result && evt.result.success,
-                error: evt.result && evt.result.error,
-                result: evt.result && (evt.result.output || evt.result.error)
+              var _toolResult = evt.result || {};
+              var _toolInfo = evt.tool || {};
+              window.addDebugLog(_toolResult.success ? 'tool' : 'error',
+                (_toolInfo.toolname || '工具') + ' 执行' + (_toolResult.success ? '成功' : '失败'), {
+                tool: _toolInfo.toolname,
+                success: _toolResult.success,
+                error: _toolResult.error,
+                result: _toolResult.output || _toolResult.error
               });
             }
+            var _r = evt.result || {};
+            var _t = evt.tool || {};
             var resultEvent = {
               type: 'v2_tool',
               data: {
+                id: 'v2tool_' + Date.now() + '_' + allExecEvents.length,
                 type: 'tool_result',
-                title: (evt.tool.toolname || '工具') + ' 执行完成',
-                tool_name: evt.tool.toolname,
-                success: evt.result.success,
-                summary: (evt.result.output || evt.result.error || '').substring(0, 500),
-                result: evt.result,
-                callback: evt.tool.callback
+                title: (_t.toolname || '工具') + ' 执行完成',
+                tool_name: _t.toolname,
+                success: !!_r.success,
+                summary: (_r.output || _r.error || '').substring(0, 500),
+                result: _r,
+                callback: _t.callback
               }
             };
             msgParts.push(resultEvent);
@@ -1504,6 +1528,8 @@ async function sendMessage() {
               ttsManager.streamDelta(evt.content);
             }
           } else if (evt.type === 'done') {
+            // Flush remaining V2 reasoning as final text part
+            flushV2Reasoning();
             flushCurrentText();
             // 记录到调试控制台
             if (window.addDebugLog) {
@@ -1547,6 +1573,7 @@ async function sendMessage() {
     }
     
     // Finalize message
+    flushV2Reasoning();
     flushCurrentText();
     // Stop all running tool timers
     for (var tid in _toolTimers) {