@co0ontty/wand 1.5.5 → 1.5.7

package/dist/process-manager.d.ts

@@ -1,11 +1,7 @@
 import { EventEmitter } from "node:events";
 import { WandStorage } from "./storage.js";
-import { ExecutionMode, SessionSnapshot, WandConfig } from "./types.js";
-export interface ProcessEvent {
-    type: "output" | "status" | "started" | "ended" | "usage" | "task" | "notification";
-    sessionId: string;
-    data?: unknown;
-}
+import { ExecutionMode, ProcessEventHandler, SessionSnapshot, WandConfig } from "./types.js";
+export type { ProcessEvent, ProcessEventHandler } from "./types.js";
 /** Human-readable task information for the UI */
 export interface TaskInfo {
     title: string;
@@ -17,7 +13,6 @@ export declare class SessionInputError extends Error {
     readonly sessionStatus?: SessionSnapshot["status"] | undefined;
     constructor(message: string, code: "SESSION_NOT_FOUND" | "SESSION_NOT_RUNNING" | "SESSION_NO_PTY", sessionId: string, sessionStatus?: SessionSnapshot["status"] | undefined);
 }
-export type ProcessEventHandler = (event: ProcessEvent) => void;
 /** A Claude Code session discovered by scanning ~/.claude/projects/ directories. */
 export interface ClaudeHistorySession {
     claudeSessionId: string;

package/dist/structured-session-manager.d.ts

@@ -1,6 +1,5 @@
 import { WandStorage } from "./storage.js";
-import { ExecutionMode, SessionRunner, SessionSnapshot, WandConfig } from "./types.js";
-import { ProcessEvent } from "./ws-broadcast.js";
+import { ExecutionMode, ProcessEvent, SessionRunner, SessionSnapshot, WandConfig } from "./types.js";
 interface CreateStructuredSessionOptions {
     cwd: string;
     mode: ExecutionMode;

package/dist/types.d.ts

@@ -8,6 +8,13 @@ export type EscalationScope = "write_file" | "run_command" | "network" | "outsid
 export type EscalationRunner = "json" | "pty";
 export type EscalationResolution = "approve_once" | "approve_turn" | "deny" | "fallback_manual";
 export type EscalationSource = "tool_permission_request" | "sandbox_hard_block" | "workspace_policy_limit" | "cli_capability_limit" | "unknown";
+/** WebSocket / ProcessManager event envelope used throughout the app. */
+export interface ProcessEvent {
+    type: "output" | "status" | "started" | "ended" | "usage" | "task" | "notification";
+    sessionId: string;
+    data?: unknown;
+}
+export type ProcessEventHandler = (event: ProcessEvent) => void;
 export interface EscalationRequest {
     requestId: string;
     scope: EscalationScope;

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

@@ -804,31 +804,50 @@
 
               // General config tab
               '<div class="settings-panel" id="settings-tab-general">' +
-                '<div class="field">' +
-                  '<label class="field-label" for="cfg-host">监听地址 (host)</label>' +
-                  '<input id="cfg-host" type="text" class="field-input" placeholder="127.0.0.1" />' +
-                '</div>' +
-                '<div class="field">' +
-                  '<label class="field-label" for="cfg-port">端口 (port)</label>' +
-                  '<input id="cfg-port" type="number" class="field-input" placeholder="8443" min="1" max="65535" />' +
+                '<div class="field-row">' +
+                  '<div class="field">' +
+                    '<label class="field-label" for="cfg-host">监听地址 (host)</label>' +
+                    '<input id="cfg-host" type="text" class="field-input" placeholder="127.0.0.1" />' +
+                  '</div>' +
+                  '<div class="field">' +
+                    '<label class="field-label" for="cfg-port">端口 (port)</label>' +
+                    '<input id="cfg-port" type="number" class="field-input" placeholder="8443" min="1" max="65535" />' +
+                  '</div>' +
                 '</div>' +
                 '<div class="field field-inline">' +
-                  '<label class="field-label" for="cfg-https">启用 HTTPS</label>' +
                   '<input id="cfg-https" type="checkbox" class="field-checkbox" />' +
+                  '<label class="field-label" for="cfg-https">启用 HTTPS</label>' +
                 '</div>' +
-                '<div class="field">' +
-                  '<label class="field-label" for="cfg-mode">默认执行模式</label>' +
-                  '<select id="cfg-mode" class="field-input">' +
-                    '<option value="default">default</option>' +
-                    '<option value="assist">assist</option>' +
-                    '<option value="agent">agent</option>' +
-                    '<option value="agent-max">agent-max</option>' +
-                    '<option value="auto-edit">auto-edit</option>' +
-                    '<option value="full-access">full-access</option>' +
-                    '<option value="native">native</option>' +
-                    '<option value="managed">managed</option>' +
-                  '</select>' +
+                '<div class="field-row">' +
+                  '<div class="field">' +
+                    '<label class="field-label" for="cfg-mode">默认执行模式</label>' +
+                    '<select id="cfg-mode" class="field-input">' +
+                      '<option value="default">default</option>' +
+                      '<option value="assist">assist</option>' +
+                      '<option value="agent">agent</option>' +
+                      '<option value="agent-max">agent-max</option>' +
+                      '<option value="auto-edit">auto-edit</option>' +
+                      '<option value="full-access">full-access</option>' +
+                      '<option value="native">native</option>' +
+                      '<option value="managed">managed</option>' +
+                    '</select>' +
+                  '</div>' +
+                  '<div class="field">' +
+                    '<label class="field-label" for="cfg-language">回复语言</label>' +
+                    '<select id="cfg-language" class="field-input">' +
+                      '<option value="">自动（不指定）</option>' +
+                      '<option value="中文">中文</option>' +
+                      '<option value="English">English</option>' +
+                      '<option value="日本語">日本語</option>' +
+                      '<option value="한국어">한국어</option>' +
+                      '<option value="Español">Español</option>' +
+                      '<option value="Français">Français</option>' +
+                      '<option value="Deutsch">Deutsch</option>' +
+                      '<option value="Русский">Русский</option>' +
+                    '</select>' +
+                  '</div>' +
                 '</div>' +
+                '<p class="field-hint" style="margin-top:-4px;">设置回复语言后，Claude 将尽量使用指定语言回复。</p>' +
                 '<div class="field">' +
                   '<label class="field-label" for="cfg-cwd">默认工作目录</label>' +
                   '<input id="cfg-cwd" type="text" class="field-input" placeholder="/home/user" />' +
@@ -837,52 +856,40 @@
                   '<label class="field-label" for="cfg-shell">Shell</label>' +
                   '<input id="cfg-shell" type="text" class="field-input" placeholder="/bin/bash" />' +
                 '</div>' +
-                '<div class="field">' +
-                  '<label class="field-label" for="cfg-language">回复语言</label>' +
-                  '<select id="cfg-language" class="field-input">' +
-                    '<option value="">自动（不指定）</option>' +
-                    '<option value="中文">中文</option>' +
-                    '<option value="English">English</option>' +
-                    '<option value="日本語">日本語</option>' +
-                    '<option value="한국어">한국어</option>' +
-                    '<option value="Español">Español</option>' +
-                    '<option value="Français">Français</option>' +
-                    '<option value="Deutsch">Deutsch</option>' +
-                    '<option value="Русский">Русский</option>' +
-                  '</select>' +
-                  '<p class="hint" style="margin-top:4px;margin-bottom:0;">设置后，Claude 将尽量使用指定语言回复。</p>' +
-                '</div>' +
                 '<button id="save-config-button" class="btn btn-primary btn-block">保存配置</button>' +
                 '<p id="config-message" class="hint hidden"></p>' +
               '</div>' +
 
               // Security tab
               '<div class="settings-panel" id="settings-tab-security">' +
-                '<h3 class="settings-section-title">修改密码</h3>' +
-                '<div class="field">' +
-                  '<label class="field-label" for="new-password">新密码</label>' +
-                  '<input id="new-password" type="password" class="field-input" placeholder="输入新密码（至少 6 个字符）" autocomplete="new-password" />' +
-                '</div>' +
-                '<div class="field">' +
-                  '<label class="field-label" for="confirm-password">确认密码</label>' +
-                  '<input id="confirm-password" type="password" class="field-input" placeholder="再次输入新密码" autocomplete="new-password" />' +
-                '</div>' +
-                '<button id="save-password-button" class="btn btn-primary btn-block">保存密码</button>' +
-                '<p id="settings-error" class="error-message hidden"></p>' +
-                '<p id="settings-success" class="hint hidden" style="color: var(--success);"></p>' +
-                '<hr class="settings-divider" />' +
-                '<h3 class="settings-section-title">SSL 证书</h3>' +
-                '<p class="settings-hint" id="cert-status">加载中...</p>' +
-                '<div class="field">' +
-                  '<label class="field-label" for="cert-key-file">私钥文件 (.key)</label>' +
-                  '<input id="cert-key-file" type="file" class="field-input field-file" accept=".key,.pem" />' +
+                '<div class="settings-card">' +
+                  '<h3 class="settings-section-title">\ud83d\udd12 修改密码</h3>' +
+                  '<div class="field">' +
+                    '<label class="field-label" for="new-password">新密码</label>' +
+                    '<input id="new-password" type="password" class="field-input" placeholder="输入新密码（至少 6 个字符）" autocomplete="new-password" />' +
+                  '</div>' +
+                  '<div class="field">' +
+                    '<label class="field-label" for="confirm-password">确认密码</label>' +
+                    '<input id="confirm-password" type="password" class="field-input" placeholder="再次输入新密码" autocomplete="new-password" />' +
+                  '</div>' +
+                  '<button id="save-password-button" class="btn btn-primary btn-block">保存密码</button>' +
+                  '<p id="settings-error" class="error-message hidden"></p>' +
+                  '<p id="settings-success" class="hint hidden" style="color: var(--success);"></p>' +
                 '</div>' +
-                '<div class="field">' +
-                  '<label class="field-label" for="cert-cert-file">证书文件 (.crt/.pem)</label>' +
-                  '<input id="cert-cert-file" type="file" class="field-input field-file" accept=".crt,.pem,.cert" />' +
+                '<div class="settings-card">' +
+                  '<h3 class="settings-section-title">\ud83d\udd10 SSL 证书</h3>' +
+                  '<p class="settings-hint" id="cert-status">加载中...</p>' +
+                  '<div class="field">' +
+                    '<label class="field-label" for="cert-key-file">私钥文件 (.key)</label>' +
+                    '<input id="cert-key-file" type="file" class="field-input field-file" accept=".key,.pem" />' +
+                  '</div>' +
+                  '<div class="field">' +
+                    '<label class="field-label" for="cert-cert-file">证书文件 (.crt/.pem)</label>' +
+                    '<input id="cert-cert-file" type="file" class="field-input field-file" accept=".crt,.pem,.cert" />' +
+                  '</div>' +
+                  '<button id="upload-cert-button" class="btn btn-primary btn-block">上传证书</button>' +
+                  '<p id="cert-message" class="hint hidden"></p>' +
                 '</div>' +
-                '<button id="upload-cert-button" class="btn btn-primary btn-block">上传证书</button>' +
-                '<p id="cert-message" class="hint hidden"></p>' +
               '</div>' +
 
               // Command presets tab
@@ -3943,15 +3950,23 @@
       function selectSession(id) {
         var foundSession = state.sessions.find(function(item) { return item.id === id; });
         console.log("[WAND] selectSession id:", id, "found:", !!foundSession, "sessionKind:", foundSession && foundSession.sessionKind, "runner:", foundSession && foundSession.runner, "isStructured:", isStructuredSession(foundSession));
+        if (!foundSession) {
+          console.warn("[WAND] selectSession: session not found, skipping", id);
+          return;
+        }
         state.selectedId = id;
         persistSelectedId();
+        // Clear queued inputs from the previous session to prevent cross-session leaks
+        state.messageQueue = [];
+        state.pendingMessages = [];
+        updateQueueCounter();
         resetChatRenderCache();
         state.currentMessages = [];
         if (chatRenderTimer) { clearTimeout(chatRenderTimer); chatRenderTimer = null; }
         // Reset todo progress bar
         var todoEl = document.getElementById("todo-progress");
         if (todoEl) todoEl.classList.add("hidden");
-        var session = state.sessions.find(function(item) { return item.id === id; });
+        var session = foundSession;
         state.preferredCommand = getPreferredTool();
         state.chatMode = getSafeModeForTool("claude", session && session.mode ? session.mode : state.chatMode);
         if (state.terminalInteractive && session && session.status !== "running") {
@@ -4010,6 +4025,8 @@
       var focusTrapHandler = null;
 
       function openSessionModal() {
+        // Close settings modal first if open (mutual exclusion)
+        closeSettingsModal();
         state.modalOpen = true;
         state.sessionsDrawerOpen = false;
         updateDrawerState();
@@ -4084,6 +4101,8 @@
       }
 
       function openSettingsModal() {
+        // Close session modal first if open (mutual exclusion)
+        closeSessionModal();
         var modal = document.getElementById("settings-modal");
         if (modal) {
           modal.classList.remove("hidden");
@@ -4240,7 +4259,7 @@
                   '<span class="preset-detail">' + escapeHtml(p.command) + (p.mode ? ' (' + escapeHtml(p.mode) + ')' : '') + '</span>' +
                 '</div>';
               }
-              if (!html) html = '<p class="settings-hint">没有命令预设。</p>';
+              if (!html) html = '<div class="empty-state-compact"><span class="empty-icon">\u2699</span><span>\u6ca1\u6709\u547d\u4ee4\u9884\u8bbe</span><span class="hint">\u5728 config.json \u7684 commandPresets \u4e2d\u914d\u7f6e</span></div>';
               presetsList.innerHTML = html;
             }
           })
@@ -4542,7 +4561,10 @@
         });
       }
 
+      var _sessionCreating = false;
+
       function runCommand() {
+        if (_sessionCreating) return;
         var cwdEl = document.getElementById("cwd");
         var errorEl = document.getElementById("modal-error");
         var command = getPreferredTool();
@@ -4564,6 +4586,7 @@
 
       function startStructuredSessionFromModal(cwd, mode, errorEl) {
         console.log("[WAND] startStructuredSessionFromModal cwd:", cwd, "mode:", mode);
+        _sessionCreating = true;
         state.modeValue = mode;
         state.chatMode = mode;
         state.sessionTool = "claude";
@@ -4579,11 +4602,13 @@
           .then(function() { focusInputBox(true); })
           .catch(function(error) {
             showError(errorEl, (error && error.message) || "无法启动结构化会话，请确认 Claude 已正确安装。");
-          });
+          })
+          .finally(function() { _sessionCreating = false; });
       }
 
       function runPtyCommandFromModal(command, cwd, mode, errorEl) {
         console.log("[WAND] runPtyCommandFromModal command:", command, "cwd:", cwd, "mode:", mode);
+        _sessionCreating = true;
         state.modeValue = mode;
         state.chatMode = mode;
         state.sessionTool = command;
@@ -4626,7 +4651,8 @@
         })
         .catch(function() {
           showError(errorEl, "无法启动会话，请确认 Claude 已正确安装。");
-        });
+        })
+        .finally(function() { _sessionCreating = false; });
       }
 
       function initBlankChatCwd() {
@@ -6012,9 +6038,12 @@
         });
       }
 
+      var _resumeInProgress = false;
+
       function resumeSession(sessionId, errorEl) {
         console.log("[WAND] resumeSession sessionId:", sessionId);
-        if (!sessionId) return Promise.resolve(null);
+        if (!sessionId || _resumeInProgress) return Promise.resolve(null);
+        _resumeInProgress = true;
         return fetch("/api/sessions/" + encodeURIComponent(sessionId) + "/resume", {
           method: "POST",
           headers: { "Content-Type": "application/json" },
@@ -6040,7 +6069,8 @@
           if (errorEl) showError(errorEl, message);
           else showToast(message, "error");
           return null;
-        });
+        })
+        .finally(function() { _resumeInProgress = false; });
       }
 
       function resumeClaudeSessionById(claudeSessionId, errorEl) {
@@ -8177,12 +8207,16 @@
             smartScrollToBottom(chatMessages);
           });
         } else if (msgCount === existingCount && outputHash !== prevHash) {
-          // Same message count but content changed (streaming update). Re-render in place
-          // by index so assistant growth, tool cards, and retroactive message fixes all show up.
+          // Same message count but content changed (streaming update).
+          // Optimization: only re-render the newest N messages (column-reverse: first children)
+          // that actually differ, starting from the top (newest). Most streaming updates only
+          // touch the latest assistant turn, so we can skip scanning all older messages.
           var existingEls = Array.from(chatMessages.querySelectorAll(".chat-message"));
           var reversedMessages = messages.slice().reverse();
           var replacedAny = false;
-          for (var mi = 0; mi < reversedMessages.length && mi < existingEls.length; mi++) {
+          // Scan from newest (index 0 in reversed) up to MAX_STREAMING_SCAN messages
+          var MAX_STREAMING_SCAN = Math.min(4, reversedMessages.length, existingEls.length);
+          for (var mi = 0; mi < MAX_STREAMING_SCAN; mi++) {
             var currentEl = existingEls[mi];
             var tmpWrap = document.createElement("div");
             var srOrigIdx = reversedMessages.length - 1 - mi;
@@ -8193,8 +8227,16 @@
               chatMessages.replaceChild(replacementEl, currentEl);
               attachCopyHandler(replacementEl);
               replacedAny = true;
+            } else if (mi > 0) {
+              // Once we hit an unchanged older message, stop scanning
+              break;
             }
           }
+          // Fallback: if hash changed but no visible diff found in the top N messages,
+          // the change is deeper — trigger a full render to avoid stale display.
+          if (!replacedAny && reversedMessages.length > MAX_STREAMING_SCAN) {
+            fullRenderChat();
+          }
           if (replacedAny) {
             requestAnimationFrame(function() {
               smartScrollToBottom(chatMessages);

package/dist/web-ui/content/styles.css

@@ -4802,7 +4802,7 @@
     .modal-backdrop {
       position: fixed;
       inset: 0;
-      z-index: 100;
+      z-index: 500;
       background: rgba(42, 28, 18, 0.52);
       backdrop-filter: blur(12px);
       -webkit-backdrop-filter: blur(12px);
@@ -5684,6 +5684,7 @@
       .modal { max-height: 80vh; }
       .modal-header { padding: 8px 10px; min-height: 36px; }
       .modal-body { padding: 8px 10px; }
+      .field-row { grid-template-columns: 1fr; gap: 0; }
 
       .btn { min-height: 36px; padding: 8px 12px; }
       .btn-sm { min-height: 28px; padding: 4px 8px; }
@@ -6287,18 +6288,21 @@
       background: none;
       border: none;
       border-bottom: 2px solid transparent;
+      border-radius: var(--radius-sm) var(--radius-sm) 0 0;
       cursor: pointer;
-      transition: color 0.15s, border-color 0.15s;
+      transition: color 0.15s, border-color 0.15s, background 0.15s;
       white-space: nowrap;
     }
 
     .settings-tab:hover {
       color: var(--text-primary);
+      background: rgba(197, 101, 61, 0.06);
     }
 
     .settings-tab.active {
       color: var(--accent);
       border-bottom-color: var(--accent);
+      background: var(--accent-muted);
     }
 
     .settings-panel {
@@ -6312,8 +6316,11 @@
     .settings-about-info {
       display: flex;
       flex-direction: column;
-      gap: 10px;
+      gap: 0;
       margin-bottom: 18px;
+      background: var(--bg-secondary);
+      border-radius: var(--radius-md);
+      padding: 2px 14px;
     }
 
     .settings-about-row {
@@ -6321,6 +6328,12 @@
       justify-content: space-between;
       align-items: center;
       font-size: 0.8125rem;
+      padding: 9px 0;
+      border-bottom: 1px solid var(--border-subtle);
+    }
+
+    .settings-about-row:last-child {
+      border-bottom: none;
     }
 
     .settings-label {
@@ -6356,8 +6369,8 @@
     .settings-section-title {
       font-size: 0.8125rem;
       font-weight: 600;
-      color: var(--fg-primary);
-      margin-bottom: 10px;
+      color: var(--text-primary);
+      margin: 0 0 12px 0;
       letter-spacing: 0.02em;
     }
 
@@ -6367,13 +6380,6 @@
       margin-top: 10px;
     }
 
-    .settings-section-title {
-      font-size: 0.875rem;
-      font-weight: 600;
-      color: var(--text-primary);
-      margin: 0 0 12px 0;
-    }
-
     .settings-divider {
       border: none;
       border-top: 1px solid var(--border-subtle);
@@ -6397,6 +6403,49 @@
       margin-bottom: 0;
     }
 
+    .field-row {
+      display: grid;
+      grid-template-columns: 1fr 1fr;
+      gap: 12px;
+      margin-bottom: 14px;
+    }
+    .field-row .field {
+      margin-bottom: 0;
+    }
+
+    .settings-card {
+      background: var(--bg-secondary);
+      border-radius: var(--radius-md);
+      padding: 16px;
+      margin-bottom: 14px;
+    }
+    .settings-card .field:last-of-type {
+      margin-bottom: 12px;
+    }
+    .settings-card .settings-section-title {
+      margin-top: 0;
+    }
+    .settings-card .field-input {
+      background: rgba(255, 255, 255, 0.6);
+    }
+    .settings-card .btn-block {
+      margin-bottom: 0;
+    }
+
+    .empty-state-compact {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      gap: 6px;
+      padding: 32px 16px;
+      color: var(--text-muted);
+      font-size: 0.8125rem;
+    }
+    .empty-state-compact .empty-icon {
+      font-size: 1.5rem;
+      opacity: 0.5;
+    }
+
     .field-checkbox {
       width: 18px;
       height: 18px;

package/dist/ws-broadcast.d.ts

@@ -3,12 +3,8 @@
  * Handles debounced output events, backpressure control, and client subscriptions.
  */
 import { WebSocketServer } from "ws";
-import type { SessionSnapshot } from "./types.js";
-export interface ProcessEvent {
-    type: "output" | "status" | "started" | "ended" | "usage" | "task" | "notification";
-    sessionId: string;
-    data?: unknown;
-}
+import type { SessionSnapshot, ProcessEvent } from "./types.js";
+export type { ProcessEvent } from "./types.js";
 export declare class WsBroadcastManager {
     private wss;
     private clients;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@co0ontty/wand",
-  "version": "1.5.5",
+  "version": "1.5.7",
   "description": "A web terminal for local CLI tools like Claude.",
   "type": "module",
   "bin": {