@xcanwin/manyoyo 6.1.3 → 6.2.1

package/lib/web/frontend/app.js

@@ -47,8 +47,8 @@
         loadingMessages: false,
         loadingSessionDetail: false,
         mobileSidebarOpen: false,
-        mobileActionsOpen: false,
         workspaceSwitcherOpen: false,
+        composerOptionsOpen: false,
         configModalOpen: false,
         createModalOpen: false,
         agentTemplateModalOpen: false,
@@ -123,8 +123,6 @@
     const sessionList = document.getElementById('sessionList');
     const sessionCount = document.getElementById('sessionCount');
     const mobileSessionToggle = document.getElementById('mobileSessionToggle');
-    const mobileActionsToggle = document.getElementById('mobileActionsToggle');
-    const headerActions = document.getElementById('headerActions');
     const viewActivityBtn = document.getElementById('viewActivityBtn');
     const workspaceSwitcherToggle = document.getElementById('workspaceSwitcherToggle');
     const workspaceSwitcherPanel = document.getElementById('workspaceSwitcherPanel');
@@ -133,12 +131,10 @@
     const viewDetailBtn = document.getElementById('viewDetailBtn');
     const viewConfigBtn = document.getElementById('viewConfigBtn');
     const viewCheckBtn = document.getElementById('viewCheckBtn');
-    const addAgentBtn = document.getElementById('addAgentBtn');
     const mobileSidebarClose = document.getElementById('mobileSidebarClose');
     const sidebarBackdrop = document.getElementById('sidebarBackdrop');
     const openConfigBtn = document.getElementById('openConfigBtn');
     const openCreateBtn = document.getElementById('openCreateBtn');
-    const openCreateMenuBtn = document.getElementById('openCreateMenuBtn');
     const configModal = document.getElementById('configModal');
     const configModalTitle = document.getElementById('configModalTitle');
     const configPath = document.getElementById('configPath');
@@ -181,12 +177,12 @@
     const directoryPickerError = document.getElementById('directoryPickerError');
     const directoryPickerCancelBtn = document.getElementById('directoryPickerCancelBtn');
     const directoryPickerSelectBtn = document.getElementById('directoryPickerSelectBtn');
-    const activeTitle = document.getElementById('activeTitle');
-    const activeMeta = document.getElementById('activeMeta');
     const activityCommandBtn = document.getElementById('activityCommandBtn');
     const activityAgentBtn = document.getElementById('activityAgentBtn');
     const agentTemplateBtn = document.getElementById('agentTemplateBtn');
     const activityModelChip = document.getElementById('activityModelChip');
+    const composerOptionsToggle = document.getElementById('composerOptionsToggle');
+    const composerOptionsPanel = document.getElementById('composerOptionsPanel');
     const messagesNode = document.getElementById('messages');
     const terminalPanel = document.getElementById('terminalPanel');
     const filesPanel = document.getElementById('filesPanel');
@@ -199,10 +195,7 @@
     const terminalScreen = document.getElementById('terminalScreen');
     const composer = document.getElementById('composer');
     const commandInput = document.getElementById('commandInput');
-    const composerHint = document.getElementById('composerHint');
-    const sendState = document.getElementById('sendState');
     const sendBtn = document.getElementById('sendBtn');
-    const stopBtn = document.getElementById('stopBtn');
     const agentTemplateModal = document.getElementById('agentTemplateModal');
     const agentTemplatePrimary = document.getElementById('agentTemplatePrimary');
     const containerCliSelect = document.getElementById('containerCliSelect');
@@ -218,9 +211,6 @@
     const externalLinkUrl = document.getElementById('externalLinkUrl');
     const externalLinkCancelBtn = document.getElementById('externalLinkCancelBtn');
     const externalLinkOpenBtn = document.getElementById('externalLinkOpenBtn');
-    const refreshBtn = document.getElementById('refreshBtn');
-    const removeBtn = document.getElementById('removeBtn');
-    const removeAllBtn = document.getElementById('removeAllBtn');
     const MOBILE_LAYOUT_MEDIA = window.matchMedia('(max-width: 980px)');
     const MOBILE_COMPACT_MEDIA = window.matchMedia('(max-width: 640px)');
     const TERMINAL_FIT_DEBOUNCE_MS = 60;
@@ -328,7 +318,7 @@
         return Promise.reject(new Error('clipboard unavailable'));
     }
 
-    function appendMessageCopyActions(meta, items) {
+    function appendMessageCopyActions(container, items) {
         const actions = document.createElement('div');
         actions.className = 'msg-actions';
         items.forEach(function (item) {
@@ -352,7 +342,7 @@
             });
             actions.appendChild(btn);
         });
-        meta.appendChild(actions);
+        container.appendChild(actions);
     }
 
     function stringifyPrettyJson(value) {
@@ -605,7 +595,7 @@
         const hasError = traceEvents.some(function (event) {
             return event && event.kind === 'error';
         });
-        const defaultOpen = hasError || traceEvents.length === 0;
+        const defaultOpen = hasError;
         const toggle = document.createElement('details');
         toggle.className = 'trace-flow-toggle';
         toggle.open = traceFlowExpandedState.has(messageId) ? traceFlowExpandedState.get(messageId) : defaultOpen;
@@ -632,7 +622,7 @@
                 return 'AGENT 实时回复';
             }
             if (message && message.streamTrace) {
-                return 'AGENT 过程';
+                return 'AGENT 回复';
             }
             if (message && message.mode === 'agent') {
                 return 'AGENT 回复';
@@ -961,17 +951,6 @@
         return base.replace(/\/+$/, '') + '/' + child.replace(/^\/+/, '');
     }
 
-    function envMapToText(envMap) {
-        if (!envMap || typeof envMap !== 'object') {
-            return '';
-        }
-        return Object.entries(envMap)
-            .map(function (entry) {
-                return entry[0] + '=' + String(entry[1] == null ? '' : entry[1]);
-            })
-            .join('\n');
-    }
-
     function textToLineArray(text) {
         return String(text || '')
             .split('\n')
@@ -1635,17 +1614,6 @@
         return '自动';
     }
 
-    function buildActiveMeta(session) {
-        if (!session) {
-            return '会话不可用';
-        }
-        const status = sessionStatusInfo(session.status);
-        const messageCount = safeMessageCount(session.messageCount);
-        const updatedAt = formatDateTime(session.updatedAt) || '暂无更新';
-        const containerName = session.containerName || '未绑定容器';
-        return `${containerName} · ${status.label} · ${messageCount} 条对话 · ${updatedAt}`;
-    }
-
     function buildMessageMetaLines(message) {
         const lines = [];
         const timeText = formatDateTime(message && message.timestamp);
@@ -1980,18 +1948,6 @@
         setMobileSessionPanel(false);
     }
 
-    function setMobileActionsMenu(open) {
-        state.mobileActionsOpen = Boolean(open);
-        document.body.classList.toggle('mobile-actions-open', state.mobileActionsOpen);
-        if (mobileActionsToggle) {
-            mobileActionsToggle.setAttribute('aria-expanded', state.mobileActionsOpen ? 'true' : 'false');
-        }
-    }
-
-    function closeMobileActionsMenu() {
-        setMobileActionsMenu(false);
-    }
-
     function setWorkspaceSwitcherMenu(open) {
         state.workspaceSwitcherOpen = Boolean(open);
         document.body.classList.toggle('workspace-switcher-open', state.workspaceSwitcherOpen);
@@ -2007,6 +1963,21 @@
         setWorkspaceSwitcherMenu(false);
     }
 
+    function setComposerOptionsMenu(open) {
+        state.composerOptionsOpen = Boolean(open);
+        document.body.classList.toggle('composer-options-open', state.composerOptionsOpen);
+        if (composerOptionsToggle) {
+            composerOptionsToggle.setAttribute('aria-expanded', state.composerOptionsOpen ? 'true' : 'false');
+        }
+        if (composerOptionsPanel) {
+            composerOptionsPanel.hidden = !state.composerOptionsOpen;
+        }
+    }
+
+    function closeComposerOptionsMenu() {
+        setComposerOptionsMenu(false);
+    }
+
     const VIEW_LABELS = {
         activity: '活动',
         terminal: '终端',
@@ -2274,31 +2245,17 @@
         }
     }
 
-    function syncComposerExpanded() {
-        if (!composer || !commandInput) {
-            return;
-        }
-        // 判定条件必须是"焦点是否还在 composer 内部"而不是"是否等于 commandInput"：
-        // 点击 Agent/命令 切换或 CLI/模型 按钮时，commandInput 会先 blur，
-        // 若立刻按 commandInput 是否聚焦来收起，会在 mousedown 与 click 之间把工具栏收起，
-        // 导致按钮的点击事件因布局变化而落空（点了没反应）。
-        const focused = composer.contains(document.activeElement);
-        const hasDraft = Boolean(commandInput.value && commandInput.value.trim());
-        const expanded = window.ManyoyoChatBehavior.shouldExpandComposer({ focused, hasDraft });
-        composer.classList.toggle('is-expanded', expanded);
-    }
-
     function syncUi() {
         if (!state.active) {
-            activeTitle.textContent = '未选择会话';
-            activeMeta.textContent = '请选择左侧会话';
+            document.title = window.ManyoyoChatBehavior.buildDocumentTitle('');
             if (isComposerMode()) {
                 commandInput.value = '';
             }
         } else {
             const activeSession = getActiveSession();
-            activeTitle.textContent = activeSession && activeSession.agentName ? activeSession.agentName : state.active;
-            activeMeta.textContent = buildActiveMeta(activeSession);
+            document.title = window.ManyoyoChatBehavior.buildDocumentTitle(
+                activeSession && activeSession.agentName ? activeSession.agentName : state.active
+            );
         }
 
         const activityTab = state.activeTab === 'activity';
@@ -2377,16 +2334,15 @@
 
         const activeAgentRunning = isAgentRunActiveForSession(state.active) || hasPendingAgentMessagesForSession(state.active);
         const busy = state.loadingSessions || state.loadingMessages || state.sending || state.creatingAgent;
-        refreshBtn.disabled = busy;
-        if (addAgentBtn) {
-            addAgentBtn.disabled = !state.active || busy;
-            addAgentBtn.textContent = state.creatingAgent ? '新建中...' : '新建 AGENT';
-        }
-        removeBtn.disabled = !state.active || busy;
-        removeAllBtn.disabled = !state.active || busy;
-        sendBtn.disabled = !activityTab || !state.active || busy || (agentMode && (!agentEnabled || activeAgentRunning));
-        if (stopBtn) {
-            stopBtn.disabled = !activityTab || !agentMode || !activeAgentRunning || state.agentRun.stopping;
+        const showStop = agentMode && activeAgentRunning;
+        if (showStop) {
+            sendBtn.disabled = !activityTab || !state.active || state.agentRun.stopping;
+            sendBtn.textContent = state.agentRun.stopping ? '停止中…' : '停止';
+            sendBtn.classList.add('danger-outline');
+        } else {
+            sendBtn.disabled = !activityTab || !state.active || busy || (agentMode && !agentEnabled);
+            sendBtn.textContent = '发送';
+            sendBtn.classList.remove('danger-outline');
         }
         if (agentTemplateBtn) {
             agentTemplateBtn.disabled = !state.active || state.agentTemplateSaving;
@@ -2397,18 +2353,9 @@
                 ? '输入提示词，例如：请帮我分析当前项目结构并给出重构建议'
                 : '输入容器命令，例如: ls -la';
         }
-        if (composerHint) {
-            composerHint.textContent = agentMode
-                ? 'Enter 发送提示词 · Shift/Alt + Enter 换行 · 执行中可停止'
-                : 'Enter 发送 · Shift/Alt + Enter 换行';
-        }
-        syncComposerExpanded();
         if (openCreateBtn) {
             openCreateBtn.disabled = state.createLoading || state.createSubmitting;
         }
-        if (openCreateMenuBtn) {
-            openCreateMenuBtn.disabled = state.createLoading || state.createSubmitting;
-        }
         if (openConfigBtn) {
             openConfigBtn.disabled = state.configLoading || state.configSaving;
         }
@@ -2435,24 +2382,6 @@
         if (createCancelBtn) {
             createCancelBtn.disabled = state.createSubmitting;
         }
-        if (sendState) {
-            if (!state.active) {
-                sendState.textContent = '未选择会话';
-                sendState.classList.remove('is-active');
-            } else if (state.creatingAgent) {
-                sendState.textContent = '正在新建 AGENT…';
-                sendState.classList.add('is-active');
-            } else if (activeAgentRunning && agentMode) {
-                sendState.textContent = state.agentRun.stopping ? '正在停止 Agent…' : 'Agent 执行中';
-                sendState.classList.add('is-active');
-            } else if (busy) {
-                sendState.textContent = '处理中';
-                sendState.classList.add('is-active');
-            } else {
-                sendState.textContent = agentMode ? 'Agent 就绪' : '命令就绪';
-                sendState.classList.remove('is-active');
-            }
-        }
         if (configModal) {
             configModal.hidden = !state.configModalOpen;
         }
@@ -2493,25 +2422,10 @@
             'modal-open',
             state.configModalOpen || state.createModalOpen || state.directoryPicker.open || state.agentTemplateModalOpen || state.externalLinkModalOpen
         );
-        if (!state.active) {
-            sendState.textContent = '未选择会话';
-        } else if (state.creatingAgent) {
-            sendState.textContent = '正在新建 AGENT…';
-        } else if (agentMode && !agentEnabled) {
-            sendState.textContent = '当前会话未配置 AGENT 模板';
-        } else if (state.sending) {
-            sendState.textContent = '发送中...';
-        } else if (state.loadingSessions || state.loadingMessages) {
-            sendState.textContent = '加载中...';
-        } else {
-            sendState.textContent = '就绪';
-        }
-        sendState.classList.toggle('is-active', state.sending || state.creatingAgent);
         if (composer) {
             composer.hidden = !activityTab;
         }
         setMobileSessionPanel(state.mobileSidebarOpen);
-        setMobileActionsMenu(state.mobileActionsOpen);
         renderSessionDetailPanels();
     }
 
@@ -3028,10 +2942,6 @@
         });
     }
 
-    function createTreeMetaText(parts) {
-        return (parts || []).filter(Boolean).join(' · ');
-    }
-
     function getSessionCreatedTime(session) {
         if (session && session.createdAt) {
             const time = new Date(session.createdAt).getTime();
@@ -3134,6 +3044,122 @@
         return findLatestCreatedSessionName(remaining, removedRef.containerName);
     }
 
+    let openTreeNodeMenu = null;
+
+    function closeOpenTreeNodeMenu() {
+        if (openTreeNodeMenu) {
+            const menu = openTreeNodeMenu;
+            openTreeNodeMenu = null;
+            menu.close();
+        }
+    }
+
+    function createTreeNodeMenu(items) {
+        const wrap = document.createElement('div');
+        wrap.className = 'tree-node-menu';
+
+        const trigger = document.createElement('button');
+        trigger.type = 'button';
+        trigger.className = 'secondary tree-node-menu-trigger';
+        trigger.setAttribute('aria-haspopup', 'true');
+        trigger.setAttribute('aria-expanded', 'false');
+        trigger.setAttribute('aria-label', '更多操作');
+        trigger.innerHTML = '<svg viewBox="0 0 16 16" aria-hidden="true" focusable="false"><circle cx="3" cy="8" r="1.4"></circle><circle cx="8" cy="8" r="1.4"></circle><circle cx="13" cy="8" r="1.4"></circle></svg>';
+
+        const panel = document.createElement('div');
+        panel.className = 'tree-node-menu-panel';
+        panel.hidden = true;
+
+        function close() {
+            panel.hidden = true;
+            trigger.setAttribute('aria-expanded', 'false');
+            wrap.classList.remove('is-open');
+        }
+
+        trigger.addEventListener('click', function (event) {
+            event.stopPropagation();
+            if (panel.hidden) {
+                closeOpenTreeNodeMenu();
+                panel.hidden = false;
+                trigger.setAttribute('aria-expanded', 'true');
+                wrap.classList.add('is-open');
+                openTreeNodeMenu = { wrap, close };
+            } else {
+                close();
+                openTreeNodeMenu = null;
+            }
+        });
+
+        (Array.isArray(items) ? items : []).forEach(function (item) {
+            const itemBtn = document.createElement('button');
+            itemBtn.type = 'button';
+            itemBtn.className = 'tree-node-menu-panel-item' + (item.danger ? ' is-danger' : '');
+            itemBtn.textContent = item.label;
+            itemBtn.addEventListener('click', function (event) {
+                event.stopPropagation();
+                close();
+                openTreeNodeMenu = null;
+                if (typeof item.onClick === 'function') {
+                    item.onClick();
+                }
+            });
+            panel.appendChild(itemBtn);
+        });
+
+        wrap.appendChild(trigger);
+        wrap.appendChild(panel);
+        return wrap;
+    }
+
+    async function removeContainerByName(containerName) {
+        const target = String(containerName || '').trim();
+        if (!target) return;
+        const yes = confirm('确认删除容器 ' + target + ' ?');
+        if (!yes) return;
+        try {
+            const wasActiveContainer = parseSessionKey(state.active).containerName === target;
+            if (parseSessionKey(state.terminal.sessionName).containerName === target
+                && (state.terminal.connected || state.terminal.connecting)) {
+                disconnectTerminal('容器删除，终端已断开', true);
+            }
+            await api('/api/sessions/' + encodeURIComponent(target) + '/remove', {
+                method: 'POST'
+            });
+            await refreshSessions({
+                preferredName: wasActiveContainer ? target : (state.active || ''),
+                withLoading: true,
+                reloadMessages: wasActiveContainer
+            });
+        } catch (e) {
+            alert(e.message);
+        }
+    }
+
+    async function removeAgentSessionByName(sessionName, agentLabel) {
+        const target = String(sessionName || '').trim();
+        if (!target) return;
+        const yes = confirm('确认删除 AGENT ' + (agentLabel || target) + ' ?');
+        if (!yes) return;
+        const isActive = target === state.active;
+        try {
+            const containerName = parseSessionKey(target).containerName;
+            const fallbackSessionName = isActive
+                ? findPreferredSessionNameAfterRemoval(state.sessions, target)
+                : '';
+            await api('/api/sessions/' + encodeURIComponent(target) + '/remove-with-history', {
+                method: 'POST'
+            });
+            await refreshSessions({
+                preferredName: isActive ? (fallbackSessionName || '') : (state.active || ''),
+                preferredContainerName: containerName,
+                withLoading: true,
+                reloadMessages: isActive
+            });
+        } catch (e) {
+            alert(e.message);
+        }
+    }
+
     function createDisclosureButton(expanded, label) {
         const button = document.createElement('button');
         button.type = 'button';
@@ -3272,18 +3298,21 @@
                     const status = sessionStatusInfo(containerGroup && containerGroup.status);
                     const historyClassName = status.tone === 'history' ? 'tree-node-tone-history' : '';
                     const containerName = String(containerGroup && containerGroup.containerName ? containerGroup.containerName : '').trim() || '未命名容器';
-                    const hoverMenu = document.createElement('div');
-                    hoverMenu.className = 'tree-node-hover-menu';
-
-                    const addAgentBtn = document.createElement('button');
-                    addAgentBtn.type = 'button';
-                    addAgentBtn.className = 'secondary tree-node-menu-item';
-                    addAgentBtn.textContent = '新建 AGENT';
-                    addAgentBtn.addEventListener('click', function (event) {
-                        event.stopPropagation();
-                        createAgentSession(containerName);
-                    });
-                    hoverMenu.appendChild(addAgentBtn);
+                    const containerMenu = createTreeNodeMenu([
+                        {
+                            label: '新建 AGENT',
+                            onClick: function () {
+                                createAgentSession(containerName);
+                            }
+                        },
+                        {
+                            label: '删除容器',
+                            danger: true,
+                            onClick: function () {
+                                removeContainerByName(containerName);
+                            }
+                        }
+                    ]);
 
                     return {
                         kind: 'container',
@@ -3294,18 +3323,28 @@
                         disclosureLabel: containerName,
                         expanded: isContainerExpanded(containerGroup),
                         hasActive: containerContainsActiveSession(containerGroup),
-                        overlayNode: hoverMenu,
+                        overlayNode: containerMenu,
                         onToggle: function (expanded) {
                             setSidebarContainerExpanded(containerGroup.containerName, expanded);
                         },
                         children: (Array.isArray(containerGroup.sessions) ? containerGroup.sessions : []).map(function (session) {
+                            const agentTitle = session.agentName || session.name;
                             return {
                                 kind: 'agent',
-                                title: session.agentName || session.name,
+                                title: agentTitle,
                                 meta: formatDateTime(session.updatedAt) || '暂无更新',
                                 className: historyClassName,
                                 active: state.active === session.name,
-                                sessionName: session.name
+                                sessionName: session.name,
+                                overlayNode: createTreeNodeMenu([
+                                    {
+                                        label: '删除 AGENT',
+                                        danger: true,
+                                        onClick: function () {
+                                            removeAgentSessionByName(session.name, agentTitle);
+                                        }
+                                    }
+                                ])
                             };
                         })
                     };
@@ -3314,7 +3353,7 @@
         });
     }
 
-    function renderSessionTreeNodes(nodes, parentNode, ancestorHasNext, itemCounter) {
+    function renderSessionTreeNodes(nodes, parentNode, ancestorHasNext) {
         (Array.isArray(nodes) ? nodes : []).forEach(function (node, index) {
             const isLastSibling = index === nodes.length - 1;
             const item = createTreeItem({
@@ -3336,8 +3375,6 @@
 
             if (node.kind === 'agent') {
                 item.button.dataset.sessionName = node.sessionName || '';
-                item.button.style.setProperty('--item-index', String(itemCounter.value));
-                itemCounter.value += 1;
                 state.sessionNodeMap.set(node.sessionName, item.button);
                 item.button.addEventListener('click', function () {
                     handleSessionItemClick(node.sessionName || '');
@@ -3355,7 +3392,7 @@
             childrenNode.className = `tree-node-children tree-node-children-${node.kind}`;
             childrenNode.setAttribute('role', 'group');
             childrenNode.hidden = !node.expanded;
-            renderSessionTreeNodes(node.children || [], childrenNode, ancestorHasNext.concat(!isLastSibling), itemCounter);
+            renderSessionTreeNodes(node.children || [], childrenNode, ancestorHasNext.concat(!isLastSibling));
             block.appendChild(childrenNode);
             parentNode.appendChild(block);
 
@@ -3451,8 +3488,7 @@
 
         const grouped = groupSessionsByDirectory(state.sessions);
         const treeNodes = buildSessionTreeNodes(grouped);
-        const itemCounter = { value: 0 };
-        renderSessionTreeNodes(treeNodes, sessionList, [], itemCounter);
+        renderSessionTreeNodes(treeNodes, sessionList, []);
         updateSidebarActiveSelection();
 
         scrollActiveSessionIntoView();
@@ -3493,10 +3529,12 @@
     }
 
     function getMessageRenderKey(msg, index) {
+        const pairedTrace = msg && msg.pairedTrace ? msg.pairedTrace : null;
+        const tracePart = pairedTrace ? `|paired:${String(pairedTrace.content || '')}` : '';
         if (msg && msg.id && msg.streamingReply) {
             const content = msg.content ? String(msg.content) : '';
             const timestamp = msg.timestamp ? String(msg.timestamp) : '';
-            return `id:${msg.id}|streaming|${timestamp}|${content}`;
+            return `id:${msg.id}|streaming|${timestamp}|${content}${tracePart}`;
         }
         if (msg && msg.id && msg.streamTrace) {
             const content = msg.content ? String(msg.content) : '';
@@ -3505,7 +3543,7 @@
             return `id:${msg.id}|trace|${timestamp}|${content}|${running}`;
         }
         if (msg && msg.id) {
-            return `id:${msg.id}`;
+            return `id:${msg.id}${tracePart}`;
         }
         const role = msg && msg.role ? String(msg.role) : '';
         const mode = msg && msg.mode ? String(msg.mode) : '';
@@ -3513,7 +3551,7 @@
         const exitCode = msg && typeof msg.exitCode === 'number' ? String(msg.exitCode) : '';
         const pending = msg && msg.pending ? '1' : '0';
         const content = msg && msg.content ? String(msg.content) : '';
-        return `idx:${index}|${role}|${mode}|${timestamp}|${exitCode}|${pending}|${content}`;
+        return `idx:${index}|${role}|${mode}|${timestamp}|${exitCode}|${pending}|${content}${tracePart}`;
     }
 
     function resolveMessageOrigin(msg) {
@@ -3550,13 +3588,12 @@
         const bubble = document.createElement('div');
         bubble.className = 'bubble';
 
+        if (msg && msg.pairedTrace) {
+            appendStructuredTraceContent(bubble, msg.pairedTrace);
+        }
+
         const isStreamingReply = Boolean(msg && msg.streamingReply);
-        const shouldRenderStructuredTrace = Boolean(
-            msg
-            && msg.streamTrace
-            && Array.isArray(msg.traceEvents)
-            && msg.traceEvents.length
-        );
+        const shouldRenderStructuredTrace = Boolean(msg && msg.streamTrace);
         const shouldRenderMarkdown = Boolean(!msg.streamTrace && !msg.streamingReply && markdownRenderer && markdownRenderer.shouldRenderMessage(msg));
         if (isStreamingReply) {
             bubble.classList.add('streaming-reply');
@@ -3596,7 +3633,7 @@
             if (renderedMarkdown) {
                 markdownNode.innerHTML = renderedMarkdown;
                 bubble.appendChild(markdownNode);
-                appendMessageCopyActions(meta, [
+                appendMessageCopyActions(bubble, [
                     { label: '复制文本', getText: function () { return markdownNode.innerText || markdownNode.textContent || ''; } },
                     { label: '复制 Markdown', getText: function () { return msg.content; } }
                 ]);
@@ -3606,7 +3643,7 @@
         } else {
             appendPlainMessageContent(bubble, msg.content);
             if (msg.role === 'user') {
-                appendMessageCopyActions(meta, [
+                appendMessageCopyActions(bubble, [
                     { label: '复制', getText: function () { return msg.content; } }
                 ]);
             }
@@ -3617,7 +3654,8 @@
         return row;
     }
 
-    function renderMessages(messages, options) {
+    function renderMessages(rawMessages, options) {
+        const messages = window.ManyoyoChatBehavior.mergeTraceIntoReply(rawMessages);
         const renderOptions = options && typeof options === 'object' ? options : {};
         const stickToBottom = renderOptions.stickToBottom === true || isMessagesNearBottom(40);
 
@@ -4149,15 +4187,9 @@
         });
     }
 
-    if (openCreateMenuBtn) {
-        openCreateMenuBtn.addEventListener('click', function () {
-            closeMobileActionsMenu();
-            openCreateModal();
-        });
-    }
-
     if (agentTemplateBtn) {
         agentTemplateBtn.addEventListener('click', function () {
+            closeComposerOptionsMenu();
             openAgentTemplateModal().catch(function (e) {
                 alert(e && e.message ? e.message : '加载 Agent 模板失败');
             });
@@ -4349,10 +4381,29 @@
     composer.addEventListener('submit', async function (event) {
         event.preventDefault();
         if (!state.active) return;
-        if (state.sending) return;
-        if (state.loadingSessions || state.loadingMessages) return;
         if (state.activeTab !== 'activity') return;
+
         const mode = state.mode === 'agent' ? 'agent' : 'command';
+        const activeAgentRunning = isAgentRunActiveForSession(state.active) || hasPendingAgentMessagesForSession(state.active);
+        if (mode === 'agent' && activeAgentRunning) {
+            if (state.agentRun.stopping) return;
+            state.agentRun.stopping = true;
+            syncUi();
+            try {
+                await api('/api/sessions/' + encodeURIComponent(state.active) + '/agent/stop', {
+                    method: 'POST',
+                    body: JSON.stringify({})
+                });
+            } catch (e) {
+                alert(e.message);
+                state.agentRun.stopping = false;
+                syncUi();
+            }
+            return;
+        }
+
+        if (state.sending) return;
+        if (state.loadingSessions || state.loadingMessages) return;
         if (mode === 'agent' && !isActiveAgentEnabled()) {
             syncUi();
             return;
@@ -4420,40 +4471,9 @@
         } finally {
             state.sending = false;
             syncUi();
-            commandInput.focus();
         }
     });
 
-    if (stopBtn) {
-        stopBtn.addEventListener('click', async function () {
-            if (!state.active || !isAgentRunActiveForSession(state.active) || state.agentRun.stopping) {
-                return;
-            }
-            state.agentRun.stopping = true;
-            syncUi();
-            try {
-                await api('/api/sessions/' + encodeURIComponent(state.active) + '/agent/stop', {
-                    method: 'POST',
-                    body: JSON.stringify({})
-                });
-            } catch (e) {
-                alert(e.message);
-                state.agentRun.stopping = false;
-                syncUi();
-            }
-        });
-    }
-
-    if (composer) {
-        composer.addEventListener('focusin', syncComposerExpanded);
-        composer.addEventListener('focusout', function () {
-            // 延后到下一个宏任务再判断，让浏览器先把焦点落到新的目标元素上
-            // （比如 composer 内的 CLI/Agent 按钮），避免过早收起导致点击落空。
-            window.setTimeout(syncComposerExpanded, 0);
-        });
-    }
-    commandInput.addEventListener('input', syncComposerExpanded);
-
     commandInput.addEventListener('keydown', function (event) {
         if (event.key !== 'Enter' || event.isComposing) {
             return;
@@ -4476,6 +4496,7 @@
         activityCommandBtn.addEventListener('click', function () {
             state.mode = 'command';
             renderMessages(state.messages, { forceFullRender: true });
+            closeComposerOptionsMenu();
             syncUi();
             commandInput.focus();
         });
@@ -4485,11 +4506,18 @@
         activityAgentBtn.addEventListener('click', function () {
             state.mode = 'agent';
             renderMessages(state.messages, { forceFullRender: true });
+            closeComposerOptionsMenu();
             syncUi();
             commandInput.focus();
         });
     }
 
+    if (composerOptionsToggle) {
+        composerOptionsToggle.addEventListener('click', function () {
+            setComposerOptionsMenu(!state.composerOptionsOpen);
+        });
+    }
+
     if (viewActivityBtn) {
         viewActivityBtn.addEventListener('click', function () {
             closeWorkspaceSwitcherMenu();
@@ -4533,11 +4561,6 @@
         });
     }
 
-    refreshBtn.addEventListener('click', function () {
-        closeMobileActionsMenu();
-        loadSessions(state.active).catch(function (e) { alert(e.message); });
-    });
-
     const TERM_KEY_SEQUENCES = {
         esc: '\x1b',
         tab: '\x09',
@@ -4579,12 +4602,6 @@
         });
     }
 
-    if (mobileActionsToggle) {
-        mobileActionsToggle.addEventListener('click', function () {
-            setMobileActionsMenu(!state.mobileActionsOpen);
-        });
-    }
-
     if (workspaceSwitcherToggle) {
         workspaceSwitcherToggle.addEventListener('click', function () {
             setWorkspaceSwitcherMenu(!state.workspaceSwitcherOpen);
@@ -4603,18 +4620,6 @@
         });
     }
 
-    if (addAgentBtn) {
-        addAgentBtn.addEventListener('click', function () {
-            const activeSession = getActiveSession();
-            const targetContainer = activeSession ? getSessionContainerName(activeSession) : '';
-            if (!targetContainer) {
-                return;
-            }
-            closeMobileActionsMenu();
-            createAgentSession(targetContainer);
-        });
-    }
-
     if (configModal) {
         configModal.addEventListener('click', function (event) {
             if (event.target === configModal && !state.configSaving) {
@@ -4682,17 +4687,19 @@
         if (event.key === 'Escape' && state.mobileSidebarOpen) {
             closeMobileSessionPanel();
         }
-        if (event.key === 'Escape' && state.mobileActionsOpen) {
-            closeMobileActionsMenu();
-        }
         if (event.key === 'Escape' && state.workspaceSwitcherOpen) {
             closeWorkspaceSwitcherMenu();
         }
+        if (event.key === 'Escape' && state.composerOptionsOpen) {
+            closeComposerOptionsMenu();
+        }
+        if (event.key === 'Escape' && openTreeNodeMenu) {
+            closeOpenTreeNodeMenu();
+        }
     });
 
     function onLayoutMediaChange() {
         setMobileSessionPanel(state.mobileSidebarOpen);
-        setMobileActionsMenu(state.mobileActionsOpen);
         if (state.activeTab === 'terminal' && state.terminal.terminalReady) {
             scheduleTerminalFit(false);
         }
@@ -4736,64 +4743,22 @@
 
     document.addEventListener('click', function (event) {
         const target = event.target;
-        if (state.mobileActionsOpen) {
-            if (mobileActionsToggle && mobileActionsToggle.contains(target)) return;
-            if (headerActions && headerActions.contains(target)) return;
-            closeMobileActionsMenu();
-        }
         if (state.workspaceSwitcherOpen) {
             if (workspaceSwitcherToggle && workspaceSwitcherToggle.contains(target)) return;
             if (workspaceSwitcherPanel && workspaceSwitcherPanel.contains(target)) return;
             closeWorkspaceSwitcherMenu();
         }
-    });
-
-    removeBtn.addEventListener('click', async function () {
-        if (!state.active) return;
-        closeMobileActionsMenu();
-        const activeSession = getActiveSession();
-        const targetContainer = activeSession && activeSession.containerName ? activeSession.containerName : state.active;
-        const yes = confirm('确认删除容器 ' + targetContainer + ' ?');
-        if (!yes) return;
-        try {
-            const current = state.active;
-            if (state.terminal.sessionName === current && (state.terminal.connected || state.terminal.connecting)) {
-                disconnectTerminal('容器删除，终端已断开', true);
-            }
-            await api('/api/sessions/' + encodeURIComponent(current) + '/remove', {
-                method: 'POST'
-            });
-            await loadSessions(current);
-        } catch (e) {
-            alert(e.message);
+        if (state.composerOptionsOpen) {
+            if (composerOptionsToggle && composerOptionsToggle.contains(target)) return;
+            if (composerOptionsPanel && composerOptionsPanel.contains(target)) return;
+            closeComposerOptionsMenu();
         }
-    });
-
-    removeAllBtn.addEventListener('click', async function () {
-        if (!state.active) return;
-        closeMobileActionsMenu();
-        const activeSession = getActiveSession();
-        const targetAgent = activeSession && activeSession.agentName ? activeSession.agentName : state.active;
-        const yes = confirm('确认删除 AGENT ' + targetAgent + ' ?');
-        if (!yes) return;
-        try {
-            const current = state.active;
-            const targetContainerName = activeSession && activeSession.containerName ? activeSession.containerName : '';
-            const fallbackSessionName = findPreferredSessionNameAfterRemoval(state.sessions, current);
-            await api('/api/sessions/' + encodeURIComponent(state.active) + '/remove-with-history', {
-                method: 'POST'
-            });
-            await refreshSessions({
-                preferredName: fallbackSessionName || '',
-                preferredContainerName: targetContainerName,
-                withLoading: true,
-                reloadMessages: true
-            });
-        } catch (e) {
-            alert(e.message);
+        if (openTreeNodeMenu && !openTreeNodeMenu.wrap.contains(target)) {
+            closeOpenTreeNodeMenu();
         }
     });
 
+
     if (externalLinkCancelBtn) {
         externalLinkCancelBtn.addEventListener('click', function () {
             closeExternalLinkModalView();