@xcanwin/manyoyo 6.1.1 → 6.2.0

package/lib/web/frontend/app.js

@@ -47,7 +47,8 @@
         loadingMessages: false,
         loadingSessionDetail: false,
         mobileSidebarOpen: false,
-        mobileActionsOpen: false,
+        workspaceSwitcherOpen: false,
+        composerOptionsOpen: false,
         configModalOpen: false,
         createModalOpen: false,
         agentTemplateModalOpen: false,
@@ -122,20 +123,18 @@
     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');
     const viewTerminalBtn = document.getElementById('viewTerminalBtn');
     const viewFilesBtn = document.getElementById('viewFilesBtn');
     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');
@@ -178,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');
@@ -196,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');
@@ -215,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;
@@ -318,6 +311,40 @@
         bubble.appendChild(pre);
     }
 
+    function copyTextToClipboard(text) {
+        if (navigator.clipboard && typeof navigator.clipboard.writeText === 'function') {
+            return navigator.clipboard.writeText(text);
+        }
+        return Promise.reject(new Error('clipboard unavailable'));
+    }
+
+    function appendMessageCopyActions(container, items) {
+        const actions = document.createElement('div');
+        actions.className = 'msg-actions';
+        items.forEach(function (item) {
+            const btn = document.createElement('button');
+            btn.type = 'button';
+            btn.className = 'msg-copy-btn';
+            btn.textContent = item.label;
+            btn.addEventListener('click', function () {
+                const text = String(item.getText() || '');
+                if (!text) {
+                    return;
+                }
+                copyTextToClipboard(text).then(function () {
+                    btn.textContent = '已复制';
+                    btn.classList.add('is-copied');
+                    window.setTimeout(function () {
+                        btn.textContent = item.label;
+                        btn.classList.remove('is-copied');
+                    }, 1200);
+                }).catch(function () {});
+            });
+            actions.appendChild(btn);
+        });
+        container.appendChild(actions);
+    }
+
     function stringifyPrettyJson(value) {
         if (value === undefined || value === null) {
             return '';
@@ -545,6 +572,8 @@
         return card;
     }
 
+    const traceFlowExpandedState = new Map();
+
     function appendStructuredTraceContent(bubble, message) {
         bubble.classList.add('trace-bubble');
         const container = document.createElement('div');
@@ -555,10 +584,33 @@
         buildStructuredTraceResidualLines(message).forEach(function (line) {
             flow.appendChild(createResidualTraceCard(line));
         });
-        (Array.isArray(message && message.traceEvents) ? message.traceEvents : []).forEach(function (traceEvent) {
+        const traceEvents = Array.isArray(message && message.traceEvents) ? message.traceEvents : [];
+        traceEvents.forEach(function (traceEvent) {
             flow.appendChild(createTraceEventCard(traceEvent));
         });
-        container.appendChild(flow);
+
+        const messageId = message && message.id ? message.id : '';
+        const pending = Boolean(state.agentRun.active && state.agentRun.traceMessageId === messageId);
+        const summaryInfo = window.ManyoyoChatBehavior.summarizeTraceFlow(traceEvents, { pending });
+        const hasError = traceEvents.some(function (event) {
+            return event && event.kind === 'error';
+        });
+        const defaultOpen = hasError;
+        const toggle = document.createElement('details');
+        toggle.className = 'trace-flow-toggle';
+        toggle.open = traceFlowExpandedState.has(messageId) ? traceFlowExpandedState.get(messageId) : defaultOpen;
+        toggle.addEventListener('toggle', function () {
+            if (messageId) {
+                traceFlowExpandedState.set(messageId, toggle.open);
+            }
+        });
+
+        const summary = document.createElement('summary');
+        summary.className = 'trace-flow-toggle-summary';
+        summary.textContent = summaryInfo.label;
+        toggle.appendChild(summary);
+        toggle.appendChild(flow);
+        container.appendChild(toggle);
 
         bubble.appendChild(container);
     }
@@ -570,7 +622,7 @@
                 return 'AGENT 实时回复';
             }
             if (message && message.streamTrace) {
-                return 'AGENT 过程';
+                return 'AGENT 回复';
             }
             if (message && message.mode === 'agent') {
                 return 'AGENT 回复';
@@ -1573,17 +1625,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);
@@ -1918,16 +1959,34 @@
         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 setWorkspaceSwitcherMenu(open) {
+        state.workspaceSwitcherOpen = Boolean(open);
+        document.body.classList.toggle('workspace-switcher-open', state.workspaceSwitcherOpen);
+        if (workspaceSwitcherToggle) {
+            workspaceSwitcherToggle.setAttribute('aria-expanded', state.workspaceSwitcherOpen ? 'true' : 'false');
+        }
+        if (workspaceSwitcherPanel) {
+            workspaceSwitcherPanel.hidden = !state.workspaceSwitcherOpen;
+        }
+    }
+
+    function closeWorkspaceSwitcherMenu() {
+        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 closeMobileActionsMenu() {
-        setMobileActionsMenu(false);
+    function closeComposerOptionsMenu() {
+        setComposerOptionsMenu(false);
     }
 
     const VIEW_LABELS = {
@@ -2199,15 +2258,15 @@
 
     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';
@@ -2253,6 +2312,7 @@
         if (viewDetailBtn) viewDetailBtn.classList.toggle('is-active', detailTab);
         if (viewConfigBtn) viewConfigBtn.classList.toggle('is-active', configTab);
         if (viewCheckBtn) viewCheckBtn.classList.toggle('is-active', checkTab);
+        if (workspaceSwitcherToggle) workspaceSwitcherToggle.classList.toggle('is-active', !activityTab);
         if (messagesNode) {
             messagesNode.hidden = !activityTab;
         }
@@ -2285,16 +2345,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;
@@ -2305,17 +2364,9 @@
                 ? '输入提示词，例如：请帮我分析当前项目结构并给出重构建议'
                 : '输入容器命令，例如: ls -la';
         }
-        if (composerHint) {
-            composerHint.textContent = agentMode
-                ? 'Enter 发送提示词 · Shift/Alt + Enter 换行 · 执行中可停止'
-                : 'Enter 发送 · Shift/Alt + Enter 换行';
-        }
         if (openCreateBtn) {
             openCreateBtn.disabled = state.createLoading || state.createSubmitting;
         }
-        if (openCreateMenuBtn) {
-            openCreateMenuBtn.disabled = state.createLoading || state.createSubmitting;
-        }
         if (openConfigBtn) {
             openConfigBtn.disabled = state.configLoading || state.configSaving;
         }
@@ -2342,24 +2393,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;
         }
@@ -2400,25 +2433,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();
     }
 
@@ -3041,6 +3059,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';
@@ -3179,18 +3313,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',
@@ -3201,18 +3338,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);
+                                        }
+                                    }
+                                ])
                             };
                         })
                     };
@@ -3376,9 +3523,13 @@
     }
 
     function isMessagesNearBottom(thresholdPx) {
-        const threshold = Number.isFinite(thresholdPx) ? thresholdPx : 40;
         if (!messagesNode) return true;
-        return (messagesNode.scrollHeight - (messagesNode.scrollTop + messagesNode.clientHeight)) <= threshold;
+        return window.ManyoyoChatBehavior.isNearBottom(
+            messagesNode.scrollTop,
+            messagesNode.scrollHeight,
+            messagesNode.clientHeight,
+            thresholdPx
+        );
     }
 
     function scrollMessagesToBottomImmediate() {
@@ -3396,18 +3547,21 @@
     }
 
     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) : '';
             const timestamp = msg.timestamp ? String(msg.timestamp) : '';
-            return `id:${msg.id}|trace|${timestamp}|${content}`;
+            const running = (state.agentRun.active && state.agentRun.traceMessageId === msg.id) ? '1' : '0';
+            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) : '';
@@ -3415,7 +3569,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) {
@@ -3452,13 +3606,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');
@@ -3498,11 +3651,20 @@
             if (renderedMarkdown) {
                 markdownNode.innerHTML = renderedMarkdown;
                 bubble.appendChild(markdownNode);
+                appendMessageCopyActions(bubble, [
+                    { label: '复制文本', getText: function () { return markdownNode.innerText || markdownNode.textContent || ''; } },
+                    { label: '复制 Markdown', getText: function () { return msg.content; } }
+                ]);
             } else {
                 appendPlainMessageContent(bubble, msg.content);
             }
         } else {
             appendPlainMessageContent(bubble, msg.content);
+            if (msg.role === 'user') {
+                appendMessageCopyActions(bubble, [
+                    { label: '复制', getText: function () { return msg.content; } }
+                ]);
+            }
         }
 
         row.appendChild(meta);
@@ -3510,7 +3672,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);
 
@@ -3932,7 +4095,7 @@
             traceLines.push(line);
             updateAgentTraceMessageLocal(sessionName, traceMessageId, traceLines.join('\n'), traceEvent);
             if (state.active === sessionName) {
-                renderMessages(state.messages, { stickToBottom: true });
+                renderMessages(state.messages);
             }
         }
 
@@ -3971,7 +4134,7 @@
                         }
                         updateStreamingReplyLocal(sessionName, streamingReplyId, content);
                         if (state.active === sessionName) {
-                            renderMessages(state.messages, { stickToBottom: true });
+                            renderMessages(state.messages);
                         }
                         return;
                     }
@@ -4007,6 +4170,9 @@
                 }
             }
             finalizeAgentRunState();
+            if (state.active === sessionName) {
+                renderMessages(state.messages);
+            }
             syncUi();
         }
 
@@ -4019,7 +4185,7 @@
 
         appendAssistantMessageLocal(sessionName, finalResult, 'agent');
         if (state.active === sessionName) {
-            renderMessages(state.messages, { stickToBottom: true });
+            renderMessages(state.messages);
         }
         bumpSessionMetaAfterSend(sessionName);
         refreshSessionsSilent({ preferredName: sessionName }).catch(function () {
@@ -4039,15 +4205,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 模板失败');
             });
@@ -4239,10 +4399,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;
@@ -4285,7 +4464,7 @@
                 }
                 appendAssistantMessageLocal(submitSession, runResult, mode);
                 if (state.active === submitSession) {
-                    renderMessages(state.messages, { stickToBottom: true });
+                    renderMessages(state.messages);
                 }
                 bumpSessionMetaAfterSend(submitSession);
                 refreshSessionsSilent({ preferredName: submitSession }).catch(function () {
@@ -4303,37 +4482,16 @@
                     state.messages = state.messages.filter(function (message) {
                         return !(message && message.id === pendingMessage.id);
                     });
-                    renderMessages(state.messages, { stickToBottom: true });
+                    renderMessages(state.messages);
                 }
                 alert(e.message);
             }
         } 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();
-            }
-        });
-    }
-
     commandInput.addEventListener('keydown', function (event) {
         if (event.key !== 'Enter' || event.isComposing) {
             return;
@@ -4356,6 +4514,7 @@
         activityCommandBtn.addEventListener('click', function () {
             state.mode = 'command';
             renderMessages(state.messages, { forceFullRender: true });
+            closeComposerOptionsMenu();
             syncUi();
             commandInput.focus();
         });
@@ -4365,13 +4524,21 @@
         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();
             setActiveTab('activity');
             commandInput.focus();
         });
@@ -4379,39 +4546,39 @@
 
     if (viewTerminalBtn) {
         viewTerminalBtn.addEventListener('click', function () {
+            closeWorkspaceSwitcherMenu();
             setActiveTab('terminal');
         });
     }
 
     if (viewFilesBtn) {
         viewFilesBtn.addEventListener('click', function () {
+            closeWorkspaceSwitcherMenu();
             setActiveTab('files');
         });
     }
 
     if (viewDetailBtn) {
         viewDetailBtn.addEventListener('click', function () {
+            closeWorkspaceSwitcherMenu();
             setActiveTab('detail');
         });
     }
 
     if (viewConfigBtn) {
         viewConfigBtn.addEventListener('click', function () {
+            closeWorkspaceSwitcherMenu();
             setActiveTab('config');
         });
     }
 
     if (viewCheckBtn) {
         viewCheckBtn.addEventListener('click', function () {
+            closeWorkspaceSwitcherMenu();
             setActiveTab('check');
         });
     }
 
-    refreshBtn.addEventListener('click', function () {
-        closeMobileActionsMenu();
-        loadSessions(state.active).catch(function (e) { alert(e.message); });
-    });
-
     const TERM_KEY_SEQUENCES = {
         esc: '\x1b',
         tab: '\x09',
@@ -4453,9 +4620,9 @@
         });
     }
 
-    if (mobileActionsToggle) {
-        mobileActionsToggle.addEventListener('click', function () {
-            setMobileActionsMenu(!state.mobileActionsOpen);
+    if (workspaceSwitcherToggle) {
+        workspaceSwitcherToggle.addEventListener('click', function () {
+            setWorkspaceSwitcherMenu(!state.workspaceSwitcherOpen);
         });
     }
 
@@ -4471,18 +4638,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) {
@@ -4550,14 +4705,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);
         }
@@ -4601,59 +4761,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();