@co0ontty/wand 1.36.0 → 1.39.0

package/dist/web-ui/content/scripts.js

@@ -370,6 +370,10 @@
         sessionsManageMode: false,
         selectedSessionIds: {},
         selectedClaudeHistoryIds: {},
+        codexHistory: [],
+        codexHistoryLoaded: false,
+        codexHistoryExpandedDirs: {},
+        selectedCodexHistoryIds: {},
         askUserSelections: {},  // { toolUseId: { 0: [optIdx...], submitted: false } }
         queueEpoch: 0,  // Monotonic counter for queue state freshness
         pendingAttachments: [],  // [{ file, previewUrl, name, size }]
@@ -384,6 +388,81 @@
         })()
       };
 
+      // ── 前端 i18n（最小化）──
+      // 后端 config.language 是给 Claude 用的"回答语言"偏好（"中文" / "English" / 任意字符串），
+      // 之前 frontend 完全没收 → UI label 一直 hardcoded 中文 + 个别英文（"SUBAGENT" 那个 tag）。
+      // 用户设的是中文时，"SUBAGENT" 这类英文残留就和"配置语言不一致"。
+      //
+      // 设计取舍：
+      //   - 只维护两套：中文（默认） + 英文。其它取值（"日本語"、"Français"等）回退到英文，
+      //     因为 Claude 会按用户语言回答，UI 至少不卡在中文上让英语圈用户看不懂。
+      //   - 不引入 i18n 库，几十个 key 用平铺对象，t(key, params) 是个十行 helper。
+      //   - params 支持 "{name}" 占位符替换，避免在调用点拼字符串。
+      //   - 缺 key 时回退到中文表，再没有就返回 key 本身（debug 友好）。
+      var I18N_DEFAULT_LANG = "中文";
+      var I18N = {
+        "中文": {
+          "subagent.tag": "子代理",
+          "subagent.handoff": "{parent} 让 {sub} 帮忙",
+          "subagent.handoff.with_desc": "{parent} 让 {sub} 帮忙：",
+          "subagent.continued": "继续输出",
+          "subagent.task.done": "任务完成",
+          "subagent.task.failed": "任务失败",
+          "subagent.running": "运行中",
+          "subagent.no_output": "（无输出）",
+          "subagent.helper_fallback_prefix": "协作猫·",
+          "subagent.title_aria": "点击展开 / 收起子代理输出",
+          "subagent.tag_title": "子代理 / subagent",
+          "ui.expand": "展开",
+          "ui.collapse": "收起",
+          "ui.expand_panel_aria": "展开子代理输出",
+          "ui.collapse_panel_aria": "收起子代理输出"
+        },
+        "English": {
+          "subagent.tag": "Subagent",
+          "subagent.handoff": "{parent} asked {sub} for help",
+          "subagent.handoff.with_desc": "{parent} asked {sub} for help with: ",
+          "subagent.continued": "continued",
+          "subagent.task.done": "Task complete",
+          "subagent.task.failed": "Task failed",
+          "subagent.running": "Running",
+          "subagent.no_output": "(no output)",
+          "subagent.helper_fallback_prefix": "Helper·",
+          "subagent.title_aria": "Click to expand / collapse subagent output",
+          "subagent.tag_title": "Subagent",
+          "ui.expand": "Expand",
+          "ui.collapse": "Collapse",
+          "ui.expand_panel_aria": "Expand subagent output",
+          "ui.collapse_panel_aria": "Collapse subagent output"
+        }
+      };
+      function getActiveLang() {
+        var raw = state.config && typeof state.config.language === "string" ? state.config.language.trim() : "";
+        if (!raw) return I18N_DEFAULT_LANG;
+        if (I18N[raw]) return raw;
+        // 模糊匹配：用户可能写 "english" / "en" / "ENG"
+        var lower = raw.toLowerCase();
+        if (lower === "english" || lower === "en" || lower.indexOf("english") === 0 || lower.indexOf("英") === 0) return "English";
+        if (lower === "中文" || lower === "zh" || lower.indexOf("zh") === 0 || lower.indexOf("中") === 0 || lower.indexOf("chinese") === 0) return "中文";
+        return "English"; // 其它语言走英文 fallback（Claude 会按 raw 回答，UI 至少英文不卡）
+      }
+      function t(key, params) {
+        var lang = getActiveLang();
+        var table = I18N[lang] || I18N[I18N_DEFAULT_LANG];
+        var template = table && key in table ? table[key] : null;
+        if (template == null) {
+          var def = I18N[I18N_DEFAULT_LANG];
+          template = def && key in def ? def[key] : key;
+        }
+        if (params && typeof template === "string") {
+          for (var k in params) {
+            if (!Object.prototype.hasOwnProperty.call(params, k)) continue;
+            template = template.split("{" + k + "}").join(params[k]);
+          }
+        }
+        return template;
+      }
+
       // ── 统一线性图标库 ──
       // 替代页面里散落的 emoji（🛡 / ⌨ / 📁 / 🔔 …）。这些 emoji 在系统字体里渲染成
       // 彩色卡通形态，与项目温暖米色 + 棕橙的复古主题视觉冲突明显。这里集中维护
@@ -1070,6 +1149,10 @@
           }
           case "tool-group":
             return el.getAttribute("data-expanded") === "true";
+          case "subagent-reply":
+            return el.getAttribute("data-expanded") === "true";
+          case "subagent-panel":
+            return el.getAttribute("data-expanded") === "true";
           default:
             return false;
         }
@@ -1118,6 +1201,35 @@
             if (chevron) chevron.style.transform = expanded ? "rotate(180deg)" : "";
             break;
           }
+          case "subagent-reply": {
+            el.setAttribute("data-expanded", expanded ? "true" : "false");
+            var subLabel = el.querySelector(".subagent-reply-toggle-label");
+            if (subLabel) subLabel.textContent = expanded ? "收起" : "展开";
+            var subToggleBtn = el.querySelector(".subagent-reply-toggle");
+            if (subToggleBtn) {
+              subToggleBtn.setAttribute("aria-expanded", expanded ? "true" : "false");
+              subToggleBtn.setAttribute("aria-label", expanded ? "收起子代理回复" : "展开子代理回复全文");
+            }
+            break;
+          }
+          case "subagent-panel": {
+            el.setAttribute("data-expanded", expanded ? "true" : "false");
+            // 头/尾两个按钮都得同步——label、aria-expanded、aria-label
+            var panelBtns = el.querySelectorAll(".subagent-panel-toggle");
+            for (var pbi = 0; pbi < panelBtns.length; pbi++) {
+              var pb = panelBtns[pbi];
+              pb.setAttribute("aria-expanded", expanded ? "true" : "false");
+              pb.setAttribute("aria-label", expanded ? "收起子代理输出" : "展开子代理输出");
+              var pblbl = pb.querySelector(".subagent-panel-toggle-label");
+              if (pblbl) pblbl.textContent = expanded ? "收起" : "展开";
+            }
+            // 展开时把 body 滚到顶，避免延续上次的滚动位置造成"展开后看到一半"
+            if (expanded) {
+              var pbody = el.querySelector(".subagent-panel-body");
+              if (pbody) pbody.scrollTop = 0;
+            }
+            break;
+          }
         }
       }
 
@@ -2250,6 +2362,10 @@
           state.quickCommitForm.makeTag = tagCb.checked;
           var row = document.getElementById("quick-commit-tag-row");
           if (row) row.classList.toggle("hidden", !tagCb.checked);
+          if (tagCb.checked) {
+            var input = document.getElementById("quick-commit-tag");
+            if (input) setTimeout(function() { input.focus(); }, 0);
+          }
         });
         var tagInput = document.getElementById("quick-commit-tag");
         if (tagInput) tagInput.addEventListener("input", function() {
@@ -2377,9 +2493,8 @@
               state.quickCommitForm.customMessage = aiMessage;
             }
             var currentTag = (state.quickCommitForm.tag || "").trim();
-            if (!currentTag && aiTag) {
+            if (state.quickCommitForm.makeTag && !currentTag && aiTag) {
               state.quickCommitForm.tag = aiTag;
-              state.quickCommitForm.makeTag = true;
             }
           })
           .catch(function(error) {
@@ -2740,19 +2855,21 @@
             '<div class="qc-files-wrap">' + fileRows + '</div>' +
             '<div class="qc-message-row" id="quick-commit-message-row">' +
               '<div class="qc-message-header"><label class="field-label" for="quick-commit-message">commit message</label>' +
-                '<button type="button" id="quick-commit-ai-btn" class="btn btn-ghost btn-sm"' + (state.quickCommitGenerating ? ' disabled' : '') + '>' + (state.quickCommitGenerating ? '生成中…' : 'AI 生成') + '</button>' +
+                '<div class="qc-ai-controls">' +
+                  '<button type="button" id="quick-commit-ai-btn" class="btn btn-ghost btn-sm"' + (state.quickCommitGenerating ? ' disabled' : '') + '>' + (state.quickCommitGenerating ? '生成中…' : 'AI 生成') + '</button>' +
+                  '<label class="qc-ai-tag-toggle" title="开启后，AI 会一并建议 tag，提交时会为本次 commit 打 tag">' +
+                    '<span class="qc-ai-tag-label">含 tag</span>' +
+                    '<span class="qc-switch qc-switch--compact">' +
+                      '<input type="checkbox" id="quick-commit-make-tag" class="switch-toggle" aria-label="同时为本次 commit 打 tag"' + (f.makeTag ? ' checked' : '') + ((state.quickCommitSubmitting || state.quickCommitGenerating) ? ' disabled' : '') + '>' +
+                      '<span class="switch-slider"></span>' +
+                    '</span>' +
+                  '</label>' +
+                '</div>' +
               '</div>' +
               '<textarea id="quick-commit-message" class="field-input" rows="2" placeholder="输入 commit message 或点击 AI 生成"' + (state.quickCommitSubmitting ? ' disabled' : '') + '>' + escapeHtml(f.customMessage || "") + '</textarea>' +
             '</div>' +
-            '<div class="qc-checkbox-row">' +
-              '<label class="qc-checkbox-label" for="quick-commit-make-tag">同时为本次 commit 打 tag</label>' +
-              '<label class="qc-switch">' +
-                '<input type="checkbox" id="quick-commit-make-tag" class="switch-toggle"' + (f.makeTag ? ' checked' : '') + '>' +
-                '<span class="switch-slider"></span>' +
-              '</label>' +
-            '</div>' +
             '<div class="qc-tag-row' + (f.makeTag ? '' : ' hidden') + '" id="quick-commit-tag-row">' +
-              '<input type="text" id="quick-commit-tag" class="field-input" placeholder="输入 tag 名称；留空将由 AI 在提交时自动生成" value="' + escapeHtml(f.tag || "") + '"' + (state.quickCommitSubmitting ? ' disabled' : '') + '>' +
+              '<input type="text" id="quick-commit-tag" class="field-input" placeholder="输入 tag 名称；留空则提交时由 AI 自动生成" value="' + escapeHtml(f.tag || "") + '"' + (state.quickCommitSubmitting ? ' disabled' : '') + '>' +
             '</div>' +
             (state.quickCommitError ? '<p class="error-message">' + escapeHtml(state.quickCommitError) + '</p>' : '') +
             '<div class="qc-section-actions">' +
@@ -3532,7 +3649,9 @@
         var visibleHistory = getClaudeHistoryRegionItems();
         var expanded = !!state.claudeHistoryExpanded;
         var loaded = !!state.claudeHistoryLoaded;
-        var count = loaded ? visibleHistory.length : 0;
+        var codexVisible = getVisibleCodexHistorySessions();
+        var codexLoaded = !!state.codexHistoryLoaded;
+        var count = (loaded ? visibleHistory.length : 0) + (codexLoaded ? codexVisible.length : 0);
 
         var badgeCls = "history-bubble";
         var badgeContent;
@@ -3558,7 +3677,7 @@
         '</button>';
 
         var body = expanded
-          ? '<div class="sidebar-history-body" id="sidebar-history-body">' + renderClaudeHistoryBodyContent(visibleHistory) + '</div>'
+          ? '<div class="sidebar-history-body" id="sidebar-history-body">' + renderClaudeHistoryBodyContent(visibleHistory) + renderCodexHistoryBodyContent(codexVisible) + '</div>'
           : '';
 
         return header + body;
@@ -3789,6 +3908,44 @@
         });
       }
 
+      function renderCodexHistoryDirectoryHeader(cwd, cwdShort, count, isExpanded) {
+        var chevron = isExpanded ? "\u25be" : "\u25b8";
+        return '<div class="claude-history-directory-header codex-history-directory-header" data-action="toggle-codex-history-directory" data-cwd="' + escapeHtml(cwd) + '" role="button" tabindex="0">' +
+          '<div class="session-group-title claude-history-directory-title">' +
+            '<span class="chevron">' + chevron + '</span>' +
+            '<span class="claude-history-directory-label">' + escapeHtml(cwdShort) + ' (' + count + ')</span>' +
+          '</div>' +
+        '</div>';
+      }
+
+      function renderCodexHistoryBodyContent(visibleHistory) {
+        if (!state.codexHistoryLoaded) {
+          return '<div class="claude-history-loading">\u626b\u63cf Codex \u5386\u53f2\u4f1a\u8bdd\u4e2d\u2026</div>';
+        }
+        if (visibleHistory.length === 0) {
+          return '';
+        }
+        var groups = {};
+        var groupOrder = [];
+        visibleHistory.forEach(function(s) {
+          if (!groups[s.cwd]) {
+            groups[s.cwd] = [];
+            groupOrder.push(s.cwd);
+          }
+          groups[s.cwd].push(s);
+        });
+        var listHtml = '<div class="sidebar-history-section-label">Codex</div>';
+        groupOrder.forEach(function(cwd) {
+          var cwdShort = cwd.split("/").filter(Boolean).slice(-3).join("/");
+          var isDirExpanded = !!state.codexHistoryExpandedDirs[cwd];
+          listHtml += renderCodexHistoryDirectoryHeader(cwd, cwdShort, groups[cwd].length, isDirExpanded);
+          if (isDirExpanded) {
+            listHtml += groups[cwd].map(function(session) { return renderClaudeHistoryItem(session, "codex"); }).join("");
+          }
+        });
+        return '<div class="sidebar-history-scroll codex-history-scroll">' + listHtml + '</div>';
+      }
+
       function renderClaudeHistoryDirectoryHeader(cwd, cwdShort, count, isExpanded) {
         var chevron = isExpanded ? "&#9662;" : "&#9656;";
         return '<div class="claude-history-directory-header" data-action="toggle-history-directory" data-cwd="' + escapeHtml(cwd) + '" role="button" tabindex="0">' +
@@ -3802,19 +3959,23 @@
       }
 
       function renderClaudeHistoryItem(session, kind) {
+        var isCodex = kind === "codex";
+        var rAct = isCodex ? "resume-codex-history" : "resume-history";
+        var dAct = isCodex ? "delete-codex-history" : "delete-history";
+        var selMap = isCodex ? state.selectedCodexHistoryIds : state.selectedClaudeHistoryIds;
         var shortId = session.claudeSessionId.slice(0, 8);
         var preview = session.firstUserMessage || "(空会话)";
         var timeStr = formatHistoryTime(session.timestamp);
         var checkbox = renderManageCheckbox(kind, session.claudeSessionId, "选择历史会话 " + preview);
         var deleteButton = state.sessionsManageMode ? '' :
-          '<button class="session-action-btn delete-btn" data-action="delete-history" data-claude-session-id="' +
+          '<button class="session-action-btn delete-btn" data-action="' + dAct + '" data-claude-session-id="' +
           session.claudeSessionId + '" type="button" aria-label="删除会话" title="隐藏此历史会话"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 6h18"/><path d="M8 6V4a2 2 0 012-2h4a2 2 0 012 2v2"/><path d="M19 6l-1 14a2 2 0 01-2 2H8a2 2 0 01-2-2L5 6"/></svg></button>';
         var resumeButton = state.sessionsManageMode ? '' :
-          '<button class="session-action-btn" data-action="resume-history" data-claude-session-id="' +
+          '<button class="session-action-btn" data-action="' + rAct + '" data-claude-session-id="' +
           session.claudeSessionId + '" data-cwd="' + escapeHtml(session.cwd) +
-          '" type="button" aria-label="恢复会话" title="恢复此 Claude 历史会话"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M1 4v6h6"/><path d="M3.51 15a9 9 0 105.64-11.36L3 10"/></svg></button>';
+          '" type="button" aria-label="恢复会话" title="' + (isCodex ? "恢复此 Codex 历史会话" : "恢复此 Claude 历史会话") + '"><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M1 4v6h6"/><path d="M3.51 15a9 9 0 105.64-11.36L3 10"/></svg></button>';
 
-        return '<div class="session-item claude-history-item' + (state.sessionsManageMode && state.selectedClaudeHistoryIds[session.claudeSessionId] ? ' selected' : '') + '" data-claude-history-id="' + session.claudeSessionId + '" data-cwd="' + escapeHtml(session.cwd) + '" role="button" tabindex="0">' +
+        return '<div class="session-item claude-history-item' + (state.sessionsManageMode && selMap[session.claudeSessionId] ? ' selected' : '') + '" data-claude-history-id="' + session.claudeSessionId + '" data-cwd="' + escapeHtml(session.cwd) + '" role="button" tabindex="0">' +
           '<div class="session-item-content">' +
             '<div class="session-item-row">' +
               checkbox +
@@ -3872,6 +4033,7 @@
       // 且在已加载时立即 resolve。
       var _claudeHistoryLoadingPromise = null;
       function ensureClaudeHistoryLoaded() {
+        ensureCodexHistoryLoaded();
         if (state.claudeHistoryLoaded) return Promise.resolve();
         if (_claudeHistoryLoadingPromise) return _claudeHistoryLoadingPromise;
         _claudeHistoryLoadingPromise = loadClaudeHistory().then(function() {
@@ -3882,6 +4044,46 @@
         return _claudeHistoryLoadingPromise;
       }
 
+      function loadCodexHistory() {
+        return fetch("/api/codex-history", { credentials: "same-origin" })
+          .then(function(res) {
+            if (!res.ok) return [];
+            return res.json();
+          })
+          .then(function(sessions) {
+            state.codexHistory = sessions || [];
+            state.codexHistoryLoaded = true;
+            updateSessionsList();
+          })
+          .catch(function() {
+            state.codexHistoryLoaded = true;
+            state.codexHistory = [];
+            updateSessionsList();
+          });
+      }
+
+      var _codexHistoryLoadingPromise = null;
+      function ensureCodexHistoryLoaded() {
+        if (state.codexHistoryLoaded) return Promise.resolve();
+        if (_codexHistoryLoadingPromise) return _codexHistoryLoadingPromise;
+        _codexHistoryLoadingPromise = loadCodexHistory().then(function() {
+          _codexHistoryLoadingPromise = null;
+        }, function() {
+          _codexHistoryLoadingPromise = null;
+        });
+        return _codexHistoryLoadingPromise;
+      }
+
+      function getVisibleCodexHistorySessions() {
+        var managedIds = new Set();
+        state.sessions.forEach(function(s) {
+          if (s.claudeSessionId) managedIds.add(s.claudeSessionId);
+        });
+        return state.codexHistory.filter(function(s) {
+          return s.hasConversation && !s.managedByWand && !managedIds.has(s.claudeSessionId);
+        });
+      }
+
       function isMobileLayout() {
         return window.innerWidth <= 768;
       }
@@ -5658,35 +5860,28 @@
         }
         persistElementExpandState(el, "thinking");
       };
-      // Toggle function for subagent reply bubbles — cycles preview → expanded → collapsed.
-      // 三态循环（preview 默认 ~5 行可滚 / expanded 大区可滚 / collapsed 完全收起）。
-      window.__subagentReplyCycle = function(e, btn) {
+      // Toggle function for subagent reply bubbles — simple two-state preview/expanded.
+      // 参考 opencode 的折叠面板：默认固定高度预览（含底部渐隐 mask），点击切到全文展开。
+      // 状态写在 data-expanded 上，配套 CSS 控制 max-height + mask；用 data-expand-key
+      // 走通用持久化通道（applyPersistedExpandState 会自动恢复用户上次的选择）。
+      window.__subagentReplyToggle = function(e, target) {
         if (e) { e.preventDefault(); e.stopPropagation(); }
-        var bubble = btn.closest(".subagent-reply");
+        var bubble = target && target.closest ? target.closest(".subagent-reply") : null;
         if (!bubble) return;
-        var modes = ["preview", "expanded", "collapsed"];
-        var current = bubble.getAttribute("data-collapse-mode") || "preview";
-        var idx = modes.indexOf(current);
-        if (idx < 0) idx = 0;
-        var next = modes[(idx + 1) % modes.length];
-        bubble.setAttribute("data-collapse-mode", next);
-        var label = btn.querySelector(".subagent-reply-cycle-label");
-        var icon = btn.querySelector(".subagent-reply-cycle-icon");
-        if (label) {
-          label.textContent = next === "preview" ? "展开"
-            : next === "expanded" ? "收起"
-            : "预览";
-        }
-        if (icon) {
-          icon.textContent = next === "collapsed" ? "▸"
-            : next === "expanded" ? "▴"
-            : "▾";
-        }
-        btn.setAttribute("aria-label",
-          next === "preview" ? "点击展开全部" :
-          next === "expanded" ? "点击完全收起" :
-          "点击切回预览"
-        );
+        var expanded = bubble.getAttribute("data-expanded") === "true";
+        applyExpandedState(bubble, "subagent-reply", !expanded);
+        persistElementExpandState(bubble, "subagent-reply");
+      };
+      // Toggle function for whole subagent panel (handoff + body + footer)。
+      // 头部 / 尾部按钮、整条 header 都绑这个；data-expanded 一变，CSS 切 body max-height
+      // + 旋转 chevron，applyExpandedState 走通用通道写持久化。
+      window.__subagentPanelToggle = function(e, target) {
+        if (e) { e.preventDefault(); e.stopPropagation(); }
+        var panel = target && target.closest ? target.closest(".subagent-panel") : null;
+        if (!panel) return;
+        var expanded = panel.getAttribute("data-expanded") === "true";
+        applyExpandedState(panel, "subagent-panel", !expanded);
+        persistElementExpandState(panel, "subagent-panel");
       };
       // Toggle function for inline tool rows (Read, Glob, Grep, etc.)
       window.__inlineToolToggle = function(el) {
@@ -7143,6 +7338,14 @@
             handleResumeAction(actionButton);
           } else if (actionButton.dataset.action === "resume-history" && actionButton.dataset.claudeSessionId) {
             handleResumeHistoryAction(actionButton);
+          } else if (actionButton.dataset.action === "resume-codex-history" && actionButton.dataset.claudeSessionId) {
+            handleResumeCodexHistoryAction(actionButton);
+          } else if (actionButton.dataset.action === "delete-codex-history" && actionButton.dataset.claudeSessionId) {
+            handleDeleteCodexHistoryAction(actionButton);
+          } else if (actionButton.dataset.action === "toggle-codex-history-directory" && actionButton.dataset.cwd) {
+            var codexDirCwd = actionButton.dataset.cwd;
+            state.codexHistoryExpandedDirs[codexDirCwd] = !state.codexHistoryExpandedDirs[codexDirCwd];
+            updateSessionsList();
           } else if (actionButton.dataset.action === "worktree-merge" && actionButton.dataset.sessionId) {
             openWorktreeMergeModal(actionButton.dataset.sessionId);
           } else if (actionButton.dataset.action === "worktree-cleanup" && actionButton.dataset.sessionId) {
@@ -14543,6 +14746,81 @@
           });
       }
 
+      function handleResumeCodexHistoryAction(actionButton) {
+        var threadId = actionButton.dataset.claudeSessionId;
+        var cwd = actionButton.dataset.cwd;
+        console.log("[WAND] handleResumeCodexHistoryAction threadId:", threadId, "cwd:", cwd);
+        if (!threadId) return;
+        actionButton.disabled = true;
+        resumeCodexHistorySession(threadId, cwd)
+          .then(function(data) {
+            if (data && data.id) {
+              state.codexHistory = state.codexHistory.filter(function(s) {
+                return s.claudeSessionId !== threadId;
+              });
+              state.selectedId = data.id;
+              persistSelectedId();
+              state.drafts[data.id] = "";
+              activateSession(data).then(function() {
+                dismissDrawerIfOverlay();
+              });
+            }
+          })
+          .finally(function() {
+            actionButton.disabled = false;
+          });
+      }
+
+      function resumeCodexHistorySession(threadId, cwd) {
+        return fetch("/api/codex-sessions/" + encodeURIComponent(threadId) + "/resume", {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          credentials: "same-origin",
+          body: JSON.stringify(withTerminalDimensions({
+            mode: state.chatMode || (state.config && state.config.defaultMode) || "default",
+            cwd: cwd
+          }))
+        })
+        .then(function(res) { return res.json(); })
+        .then(function(data) {
+          if (data.error) {
+            showToast(data.error, "error");
+            return null;
+          }
+          return data;
+        })
+        .catch(function(error) {
+          showToast((error && error.message) || "无法恢复历史会话。", "error");
+          return null;
+        });
+      }
+
+      function handleDeleteCodexHistoryAction(actionButton) {
+        var threadId = actionButton.dataset.claudeSessionId;
+        if (!threadId) return;
+        console.log("[WAND] handleDeleteCodexHistoryAction threadId:", threadId);
+        var item = actionButton.closest(".claude-history-item");
+        if (item) item.style.opacity = "0.5";
+        fetch("/api/codex-history/" + encodeURIComponent(threadId), {
+          method: "DELETE",
+          credentials: "same-origin"
+        })
+          .then(function(res) { return res.json(); })
+          .then(function(data) {
+            if (data && data.ok) {
+              state.codexHistory = state.codexHistory.filter(function(s) {
+                return s.claudeSessionId !== threadId;
+              });
+              updateSessionsList();
+            } else if (item) {
+              item.style.opacity = "1";
+            }
+          })
+          .catch(function() {
+            if (item) item.style.opacity = "1";
+          });
+      }
+
       function handleResumeHistoryAction(actionButton) {
         var claudeSessionId = actionButton.dataset.claudeSessionId;
         var cwd = actionButton.dataset.cwd;
@@ -18905,8 +19183,8 @@
         var agentType = sub.agentType || "";
         if (agentType && SUBAGENT_NAME_MAP[agentType]) return SUBAGENT_NAME_MAP[agentType];
         if (agentType) return agentType;
-        var tail = (sub.taskId || "").slice(-4) || "未知";
-        return "协作猫·" + tail;
+        var tail = (sub.taskId || "").slice(-4) || (getActiveLang() === "English" ? "?" : "未知");
+        return t("subagent.helper_fallback_prefix") + tail;
       }
       function getSubagentPalette(sub) {
         // 哈希优先用 agentType，让同类型 agent 跨 turn 颜色稳定；没有 agentType 时
@@ -18924,33 +19202,35 @@
         '</div>';
       }
 
-      // subagent tool_result → 独立 reply 气泡（markdown 渲染）。出错时显示红色错误体，
-      // 没文本时显示打字指示器（subagent 还在跑）。
+      // subagent 最终回复（父 Task 的 tool_result）——现在外层 .subagent-panel 已经
+      // 负责整段折叠 / 滚动，这里只需把"任务完成 / 失败"做个轻量标记块，markdown
+      // 内容平铺，让 panel 的 body 滚动条统一接管。
       function renderSubagentReplyBubble(block, role) {
         if (!block || block.type !== "tool_result") return "";
         var text = extractToolResultText(block.content);
         var isError = block.is_error === true;
-
-        if (isError) {
-          return '<div class="subagent-reply error">' +
-            '<span class="subagent-reply-icon">✗</span>' +
-            '<div class="subagent-reply-body">' + (text ? renderMarkdown(text) : escapeHtml("（无输出）")) + '</div>' +
+        var rawText = typeof text === "string" ? text : (text == null ? "" : String(text));
+
+        // pending：subagent 还在跑，没收到结果。在 panel body 里画一个 typing 指示器
+        // 占位，告诉用户"还在跑"。
+        if (!isError && !rawText.trim()) {
+          return '<div class="subagent-reply pending">' +
+            '<span class="subagent-reply-marker pending">' + escapeHtml(t("subagent.running")) + '</span>' +
+            '<span class="typing-indicator"><span></span><span></span><span></span></span>' +
           '</div>';
         }
 
-        if (!text || !String(text).trim()) {
-          return '<div class="subagent-reply pending"><span class="typing-indicator"><span></span><span></span><span></span></span></div>';
-        }
+        var displayText = rawText.trim() ? rawText : t("subagent.no_output");
+        var bodyHtml = rawText.trim() ? renderMarkdown(displayText) : escapeHtml(displayText);
+        var markerLabel = isError ? t("subagent.task.failed") : t("subagent.task.done");
+        var markerSymbol = isError ? "✗" : "✓";
 
-        // 三态折叠：preview（默认 ~5 行预览，内部可滚）→ expanded（高一些上限，可滚）→
-        // collapsed（完全收起，只剩工具条）→ preview。按钮一直可见在右下，状态写在
-        // data-collapse-mode 上，配套 CSS 控制 max-height。
-        return '<div class="subagent-reply collapsible" data-collapse-mode="preview">' +
-          '<div class="subagent-reply-scroll">' + renderMarkdown(text) + '</div>' +
-          '<button type="button" class="subagent-reply-cycle" onclick="__subagentReplyCycle(event, this)" title="展开 / 收起">' +
-            '<span class="subagent-reply-cycle-label">展开</span>' +
-            '<span class="subagent-reply-cycle-icon" aria-hidden="true">▾</span>' +
-          '</button>' +
+        return '<div class="subagent-reply final' + (isError ? ' error' : '') + '">' +
+          '<div class="subagent-reply-marker ' + (isError ? 'error' : 'done') + '">' +
+            '<span class="subagent-reply-marker-icon" aria-hidden="true">' + markerSymbol + '</span>' +
+            '<span class="subagent-reply-marker-label">' + escapeHtml(markerLabel) + '</span>' +
+          '</div>' +
+          '<div class="subagent-reply-content">' + bodyHtml + '</div>' +
         '</div>';
       }
       var PIXEL_AVATAR = {
@@ -19301,23 +19581,12 @@
           // 跳过整段。否则会渲染出"只有头像没内容"的空气泡。
           if (!segHtml || !segHtml.trim()) continue;
           if (seg.subagent) {
-            var subPalette = getSubagentPalette(seg.subagent);
-            if (showHandoff && lastSubId !== seg.subagent.taskId) {
-              var subName = getSubagentDisplayName(seg.subagent);
-              var desc = seg.subagent.taskDescription
-                ? '：<span class="chat-handoff-desc">' + escapeHtml(seg.subagent.taskDescription) + '</span>'
-                : '';
-              html += '<div class="chat-handoff" style="--agent-color:' + subPalette.primary + '">' +
-                '<span class="chat-handoff-arrow">↳</span> ' +
-                escapeHtml(parentPersonaName) + ' 让 <strong>' + escapeHtml(subName) + '</strong>' +
-                '<span class="chat-handoff-tag" title="子代理 / subagent">subagent</span>' +
-                '帮忙' + desc +
-              '</div>';
-            }
-            html += '<div class="chat-message-segment subagent" data-agent-id="' + escapeHtml(seg.subagent.taskId) + '" style="--agent-color:' + subPalette.primary + '">' +
-              subagentAvatarHtml(seg.subagent) +
-              '<div class="chat-message-content">' + segHtml + '</div>' +
-            '</div>';
+            // 整段 subagent 输出包成一个统一的可折叠面板：
+            // 头部 = handoff title + 展开按钮；body = segHtml（所有工具卡、文本、最终回复
+            // 都在 body 里）；footer = 同款按钮。同一 taskId 的连续段（极少出现的
+            // parent→sub→parent→sub 交错）只在第一次露 handoff title。
+            var includeHandoff = showHandoff && lastSubId !== seg.subagent.taskId;
+            html += buildSubagentPanelHtml(seg, parentPersonaName, segHtml, messageKey, includeHandoff);
             lastSubId = seg.subagent.taskId;
           } else {
             html += '<div class="chat-message-segment parent">' +
@@ -19330,6 +19599,85 @@
         return html;
       }
 
+      // 渲染整段 subagent 输出为一个可折叠面板：
+      //   ┌─ subagent-panel ──────────────────────────────────┐
+      //   │ [🐱] ↳ 勤劳初二 让 协作猫 帮忙：xxx     [展开 ▾] │  ← header (always visible)
+      //   ├───────────────────────────────────────────────────┤
+      //   │ <tool 卡 1>                                       │
+      //   │ <text>                                            │  ← body
+      //   │ <tool 卡 2>                                       │     默认 max-height 22em
+      //   │ <... 最终回复 ...>                                │     + 内部 overflow-y:auto
+      //   ├───────────────────────────────────────────────────┤
+      //   │                              [展开 ▾]            │  ← footer (always visible)
+      //   └───────────────────────────────────────────────────┘
+      // 状态写在 .subagent-panel[data-expanded]，按 messageKey + taskId 持久化。
+      // 默认折叠（preview）；用户点头/尾按钮或头部标题条都能切。
+      function buildSubagentPanelHtml(seg, parentPersonaName, segHtml, messageKey, includeHandoff) {
+        var sub = seg.subagent;
+        var subPalette = getSubagentPalette(sub);
+        var subName = getSubagentDisplayName(sub);
+        var taskId = sub.taskId || "";
+        var avatarSvg = buildPixelSvg(buildCatGrid(subPalette));
+
+        var titleHtml;
+        if (includeHandoff) {
+          // 用 i18n 模板拼 handoff title。{parent}/{sub} 用占位符避免在调用点拼字符串导致
+          // 顺序错乱（中文 "X 让 Y 帮忙"，英文 "X asked Y for help"，词序完全不同）。
+          // tag 是单独的彩色 chip，所以把模板里的 {sub} 替换成空 span 占位，然后再 splice
+          // 进 <strong> + chip——保证模板可读、调用点不脏。
+          var subInlineHtml = '<strong class="subagent-panel-name">' + escapeHtml(subName) + '</strong>' +
+            '<span class="subagent-panel-tag" title="' + escapeHtml(t("subagent.tag_title")) + '">' + escapeHtml(t("subagent.tag")) + '</span>';
+          var hasDesc = !!(sub.taskDescription && String(sub.taskDescription).trim());
+          var handoffTpl = hasDesc ? t("subagent.handoff.with_desc", { parent: escapeHtml(parentPersonaName), sub: subInlineHtml })
+                                   : t("subagent.handoff", { parent: escapeHtml(parentPersonaName), sub: subInlineHtml });
+          var descSpan = hasDesc
+            ? '<span class="subagent-panel-task-desc">' + escapeHtml(sub.taskDescription) + '</span>'
+            : '';
+          titleHtml = '<span class="subagent-panel-arrow" aria-hidden="true">↳</span>' +
+            '<span class="subagent-panel-attribution">' + handoffTpl + descSpan + '</span>';
+        } else {
+          titleHtml = '<span class="subagent-panel-attribution">' +
+            '<strong class="subagent-panel-name">' + escapeHtml(subName) + '</strong>' +
+            '<span class="subagent-panel-task-desc"> ' + escapeHtml(t("subagent.continued")) + '</span>' +
+          '</span>';
+        }
+
+        var expandKey = buildExpandKey("subagent-panel", [messageKey, taskId]);
+        var persisted = getPersistedExpandState(expandKey);
+        var expanded = persisted === null ? false : !!persisted;
+
+        function toggleBtnHtml(position) {
+          return '<button type="button" class="subagent-panel-toggle" ' +
+                          'data-position="' + position + '" ' +
+                          'onclick="__subagentPanelToggle(event, this)" ' +
+                          'aria-expanded="' + (expanded ? "true" : "false") + '" ' +
+                          'aria-label="' + escapeHtml(expanded ? t("ui.collapse_panel_aria") : t("ui.expand_panel_aria")) + '">' +
+              '<span class="subagent-panel-toggle-label">' + escapeHtml(expanded ? t("ui.collapse") : t("ui.expand")) + '</span>' +
+              '<svg class="subagent-panel-toggle-icon" width="10" height="10" viewBox="0 0 10 10" fill="none" aria-hidden="true">' +
+                '<path d="M2.5 3.75L5 6.25L7.5 3.75" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>' +
+              '</svg>' +
+            '</button>';
+        }
+
+        return '<div class="subagent-panel" ' +
+                    'data-expand-kind="subagent-panel" ' +
+                    'data-expand-key="' + escapeHtml(expandKey) + '" ' +
+                    'data-agent-id="' + escapeHtml(taskId) + '" ' +
+                    'data-expanded="' + (expanded ? "true" : "false") + '" ' +
+                    'style="--agent-color:' + subPalette.primary + '">' +
+          '<div class="subagent-panel-header" onclick="__subagentPanelToggle(event, this)" role="button" tabindex="0" aria-label="' + escapeHtml(t("subagent.title_aria")) + '">' +
+            '<span class="subagent-panel-avatar" aria-hidden="true">' + avatarSvg + '</span>' +
+            titleHtml +
+            toggleBtnHtml("top") +
+          '</div>' +
+          '<div class="subagent-panel-body">' + segHtml + '</div>' +
+          '<div class="subagent-panel-footer">' +
+            '<span class="subagent-panel-footer-hint" aria-hidden="true">— ' + escapeHtml(subName) + ' —</span>' +
+            toggleBtnHtml("bottom") +
+          '</div>' +
+        '</div>';
+      }
+
       function renderStructuredMessage(msg, roundUsage, messageIndex, legacyTaskMap) {
         var role = msg.role;
         var messageKey = getMessageKey(msg, messageIndex);