clay-server 3.4.0-beta.9 → 3.4.0

package/lib/public/css/menus.css

@@ -43,62 +43,6 @@
 #header-rename-btn:hover { color: var(--text-secondary); background: rgba(var(--overlay-rgb),0.04); border-color: var(--border); }
 #header-rename-btn .lucide { width: 13px; height: 13px; }
 
-#header-add-worker-btn {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  gap: 7px;
-  width: auto;
-  height: 28px;
-  border: 1px solid color-mix(in srgb, var(--accent2) 28%, var(--border));
-  background: var(--accent2-8);
-  color: var(--accent2);
-  cursor: pointer;
-  border-radius: 8px;
-  flex-shrink: 0;
-  padding: 0 9px 0 7px;
-  margin-left: 0;
-  font-family: inherit;
-  font-size: 11px;
-  font-weight: 700;
-  line-height: 1;
-  white-space: nowrap;
-  transition: color 0.15s, background 0.15s, border-color 0.15s;
-}
-#header-add-worker-btn:hover {
-  color: var(--accent2-hover);
-  background: var(--accent2-15);
-  border-color: color-mix(in srgb, var(--accent2) 48%, var(--border));
-}
-.header-worker-icon {
-  position: relative;
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  width: 16px;
-  height: 16px;
-  flex-shrink: 0;
-}
-.header-worker-icon > .lucide { width: 15px; height: 15px; }
-.header-worker-add-badge {
-  position: absolute;
-  right: -4px;
-  bottom: -3px;
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  width: 9px;
-  height: 9px;
-  border-radius: 50%;
-  background: var(--accent2);
-  color: var(--bg);
-  box-shadow: 0 0 0 2px var(--bg);
-}
-.header-worker-add-badge .lucide { width: 7px; height: 7px; stroke-width: 3; }
-.header-worker-label { letter-spacing: 0.01em; }
-#header-add-worker-btn.hidden { display: none; }
-body.dm-mode #header-add-worker-btn { display: none; }
-
 /* "Close terminal" button for a live TUI session. Matches the session-control
    chrome; reds out on hover since it stops the running agent while preserving
    the resumable session. */
@@ -702,6 +646,41 @@ body.dm-mode #header-add-worker-btn { display: none; }
   color: var(--text-dimmer);
   font-style: italic;
 }
+.config-model-state {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  min-width: 280px;
+  padding: 10px 14px;
+  color: var(--text-secondary);
+  font-size: 12px;
+  white-space: normal;
+}
+.config-model-state > div { flex: 1; min-width: 0; }
+.config-model-state-title { color: var(--text); font-weight: 600; }
+.config-model-state-detail { margin-top: 2px; color: var(--text-muted); line-height: 1.35; }
+.config-model-spinner {
+  width: 14px;
+  height: 14px;
+  flex: 0 0 auto;
+  border: 2px solid var(--border);
+  border-top-color: var(--accent);
+  border-radius: 50%;
+  animation: config-model-spin 0.8s linear infinite;
+}
+@keyframes config-model-spin { to { transform: rotate(360deg); } }
+.config-model-retry {
+  flex: 0 0 auto;
+  border: 1px solid var(--border);
+  border-radius: 5px;
+  padding: 4px 8px;
+  background: var(--surface-raised);
+  color: var(--text-secondary);
+  font: inherit;
+  cursor: pointer;
+}
+.config-model-retry:hover { color: var(--text); border-color: var(--text-muted); }
+.config-radio-item.pending { color: var(--accent); opacity: 0.75; }
 
 /* Segmented control for effort */
 .config-segmented {

package/lib/public/css/pane.css

@@ -23,6 +23,12 @@ body.pane-mode #sticky-notes-container {
   display: none !important;
 }
 
+body.pane-mode #file-viewer { display: none !important; }
+
+body.pane-mode #connect-overlay { background: var(--bg); }
+body.pane-mode #connect-overlay #ascii-logo-canvas { display: none; }
+body.pane-mode #connect-overlay-msg { color: var(--text-dimmer); }
+
 body.pane-mode .notif-banner-container {
   display: none !important;
 }
@@ -100,7 +106,8 @@ body.pane-mode #input-area {
 }
 
 .split-pane-title {
-  flex: 1;
+  flex: 0 1 auto;
+  max-width: 46%;
   min-width: 0;
   overflow: hidden;
   text-overflow: ellipsis;
@@ -202,15 +209,18 @@ button.split-pair-role:hover { filter: brightness(1.25); }
   max-width: var(--content-width);
   margin: 0 auto;
   padding: 4px 10px;
-  border: 1px solid color-mix(in srgb, var(--accent) 30%, transparent);
-  border-bottom: 0;
   border-radius: 8px 8px 0 0;
   background: color-mix(in srgb, var(--accent) 8%, var(--bg));
   color: var(--text-secondary);
   font-size: 11px;
   line-height: 1.4;
+  transition: box-shadow 0.2s;
 }
 .pane-delegation-notice.visible { display: flex; }
+.pane-delegation-notice.visible:has(+ #input-wrapper #input-row:focus-within) {
+  box-shadow: 0 0 0 1px var(--border);
+  clip-path: inset(-1px -1px 0 -1px);
+}
 .pane-delegation-notice.visible + #input-wrapper #input-row {
   border-radius: 0 0 8px 8px;
 }
@@ -283,12 +293,17 @@ button.split-pair-role:hover { filter: brightness(1.25); }
   color: var(--text-dimmer);
   cursor: pointer;
   flex-shrink: 0;
+  margin-left: auto;
 }
 
 .split-pane-context.has-data {
   display: inline-flex;
 }
 
+.split-pane-context:not(.has-data) + .split-pane-close {
+  margin-left: auto;
+}
+
 .split-pane-context:hover {
   background: var(--bg-alt);
   color: var(--text);

package/lib/public/css/session-actions.css

@@ -0,0 +1,98 @@
+#header-session-actions-btn {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: 28px;
+  height: 28px;
+  padding: 0;
+  border: 1px solid transparent;
+  border-radius: 8px;
+  background: transparent;
+  color: var(--text-dimmer);
+  cursor: pointer;
+  flex-shrink: 0;
+  transition: color 0.15s, background 0.15s, border-color 0.15s;
+}
+
+#header-session-actions-btn:hover,
+#header-session-actions-btn[aria-expanded="true"] {
+  color: var(--text);
+  background: rgba(var(--overlay-rgb), 0.05);
+  border-color: var(--border);
+}
+
+#header-session-actions-btn.hidden { display: none; }
+#header-session-actions-btn .lucide { width: 16px; height: 16px; }
+
+.session-actions-menu {
+  position: fixed;
+  z-index: 10020;
+  width: 286px;
+  padding: 6px;
+  border: 1px solid var(--border);
+  border-radius: 12px;
+  background: color-mix(in srgb, var(--bg) 96%, transparent);
+  box-shadow: 0 14px 38px rgba(var(--shadow-rgb), 0.32), 0 2px 8px rgba(var(--shadow-rgb), 0.2);
+  backdrop-filter: blur(18px);
+}
+
+.session-actions-row {
+  width: 100%;
+  border: 0;
+  background: transparent;
+  color: var(--text);
+  font: inherit;
+  text-align: left;
+  cursor: pointer;
+}
+
+.session-actions-row {
+  display: grid;
+  grid-template-columns: 30px minmax(0, 1fr) 16px;
+  align-items: center;
+  gap: 8px;
+  min-height: 54px;
+  padding: 7px 8px;
+  border-radius: 8px;
+}
+
+.session-actions-row:hover { background: var(--bg-alt); }
+.session-actions-row:disabled { cursor: default; opacity: 0.42; }
+.session-actions-row:disabled:hover { background: transparent; }
+
+.session-actions-row-icon {
+  display: grid;
+  place-items: center;
+  width: 28px;
+  height: 28px;
+  border: 1px solid var(--border-subtle);
+  border-radius: 8px;
+  background: rgba(var(--overlay-rgb), 0.035);
+  color: var(--accent2);
+}
+
+.session-actions-row-icon .lucide { width: 15px; height: 15px; }
+.session-actions-row-copy { display: flex; min-width: 0; flex-direction: column; gap: 2px; }
+.session-actions-row-copy strong { font-size: 12px; font-weight: 750; }
+.session-actions-row-copy > span { color: var(--text-dimmer); font-size: 10px; line-height: 1.25; }
+.session-actions-row-chevron { color: var(--text-dimmer); }
+.session-actions-row-chevron .lucide { width: 13px; height: 13px; }
+
+.handoff-modal { width: min(420px, calc(100vw - 32px)); }
+.handoff-modal-desc { margin: -10px 0 14px; color: var(--text-dimmer); font-size: 12px; line-height: 1.45; }
+.handoff-modal-source {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  margin-bottom: 14px;
+  padding: 10px;
+  border: 1px solid var(--border-subtle);
+  border-radius: 9px;
+  background: var(--bg-alt);
+}
+.handoff-modal-source > img { width: 26px; height: 26px; object-fit: contain; border-radius: 6px; }
+.handoff-modal-source > span { display: grid; min-width: 0; gap: 1px; }
+.handoff-modal-source strong { overflow: hidden; color: var(--text); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
+.handoff-modal-source span span { color: var(--text-dimmer); font-size: 10px; }
+.handoff-modal-field + .handoff-modal-field { margin-top: 10px; }
+.handoff-modal-field .wt-modal-label { margin-top: 0; }

package/lib/public/grok-avatar.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" role="img" aria-label="Grok Build">
+  <rect width="64" height="64" rx="14" fill="#111"/>
+  <path d="M45 17A21 21 0 1 0 49 42H35v-9h22v4A25 25 0 1 1 51 13z" fill="#fff"/>
+</svg>

package/lib/public/index.html

@@ -30,7 +30,7 @@
 (function(){try{var k="clay-theme-vars",v=localStorage.getItem(k),r=document.documentElement;if(v){var o=JSON.parse(v),p;for(p in o)r.style.setProperty(p,o[p]);var vt=localStorage.getItem(k.replace("-vars","-variant"));if(vt==="light"){r.classList.add("light-theme");r.classList.remove("dark-theme")}else{r.classList.add("dark-theme");r.classList.remove("light-theme")}var m=document.querySelector('meta[name="theme-color"]');if(m&&o["--bg"])m.setAttribute("content",o["--bg"])}else{var sl=window.matchMedia&&window.matchMedia("(prefers-color-scheme: light)").matches;if(sl){r.classList.add("light-theme");r.classList.remove("dark-theme")}}}catch(e){}})();
 </script>
 <script>if(window.navigator.standalone||window.matchMedia("(display-mode:standalone)").matches){document.documentElement.classList.add("pwa-standalone")}</script>
-<link rel="stylesheet" href="style.css?v=20260824f">
+<link rel="stylesheet" href="style.css?v=20260826a">
 <style>
 @media(max-width:768px){
   /* User messages: vertical stack, avatar on top, right-aligned */
@@ -388,12 +388,8 @@
         <div id="ralph-sticky" class="hidden"></div>
         <div id="debate-sticky" class="hidden"></div>
         <div class="status">
-          <button id="header-add-worker-btn" type="button" aria-label="Add AI Worker" title="Add an AI Worker — this session becomes the Driver of a pair">
-            <span class="header-worker-icon" aria-hidden="true">
-              <i data-lucide="bot"></i>
-              <span class="header-worker-add-badge"><i data-lucide="plus"></i></span>
-            </span>
-            <span class="header-worker-label">Add Worker</span>
+          <button id="header-session-actions-btn" type="button" aria-label="Session actions" title="Session actions" aria-haspopup="menu" aria-expanded="false">
+            <i data-lucide="ellipsis"></i>
           </button>
           <button type="button" id="header-tui-font-btn" class="header-tui-font-btn hidden" title="Terminal font" aria-label="Terminal font">
             <i data-lucide="type"></i>
@@ -407,7 +403,7 @@
       <div id="app">
         <div id="connect-overlay">
       <canvas id="ascii-logo-canvas"></canvas>
-      <p id="connect-overlay-msg">Reconnecting to server…</p>
+      <p id="connect-overlay-msg">Connecting…</p>
     </div>
     <div id="sticky-notes-container" class="hidden"></div>
     <div id="debate-info-float" class="hidden"></div>
@@ -542,6 +538,26 @@
                   <img src="/opencode-avatar.svg" class="vendor-toggle-icon" alt="OpenCode">
                   <span class="vendor-toggle-label">OpenCode</span>
                 </button>
+                <button id="vendor-btn-kimi" class="vendor-toggle-btn" data-vendor="kimi">
+                  <img src="/kimi-avatar.svg" class="vendor-toggle-icon" alt="Kimi">
+                  <span class="vendor-toggle-label">Kimi Code</span>
+                </button>
+                <button id="vendor-btn-grok" class="vendor-toggle-btn" data-vendor="grok">
+                  <img src="/grok-avatar.svg" class="vendor-toggle-icon" alt="Grok">
+                  <span class="vendor-toggle-label">Grok Build</span>
+                </button>
+                <button id="vendor-btn-copilot" class="vendor-toggle-btn" data-vendor="copilot">
+                  <img src="/copilot-avatar.svg" class="vendor-toggle-icon" alt="GitHub Copilot">
+                  <span class="vendor-toggle-label">GitHub Copilot CLI</span>
+                </button>
+                <button id="vendor-btn-qwen" class="vendor-toggle-btn" data-vendor="qwen">
+                  <img src="/qwen-avatar.svg" class="vendor-toggle-icon" alt="Qwen">
+                  <span class="vendor-toggle-label">Qwen Code</span>
+                </button>
+                <button id="vendor-btn-junie" class="vendor-toggle-btn" data-vendor="junie">
+                  <img src="/junie-avatar.svg" class="vendor-toggle-icon" alt="Junie">
+                  <span class="vendor-toggle-label">Junie CLI</span>
+                </button>
                 <button id="vendor-btn-kiro" class="vendor-toggle-btn" data-vendor="kiro">
                   <img src="/kiro-avatar.svg" class="vendor-toggle-icon" alt="Kiro">
                   <span class="vendor-toggle-label">Kiro CLI</span>
@@ -664,6 +680,7 @@
 
   <div id="file-viewer" class="hidden">
     <div class="file-viewer-header">
+      <div class="file-viewer-tabs" id="file-viewer-tabs" role="tablist"></div>
       <span class="file-viewer-path" id="file-viewer-path"></span>
       <span class="file-viewer-live-status hidden" id="file-viewer-live-status" aria-live="polite">
         <span class="file-viewer-live-dot"></span>
@@ -2344,7 +2361,7 @@
 <script src="https://cdn.jsdelivr.net/npm/@xterm/addon-fit@0/lib/addon-fit.min.js"></script>
 <script src="https://cdn.jsdelivr.net/npm/@xterm/addon-web-links@0/lib/addon-web-links.min.js"></script>
 <script src="https://cdn.jsdelivr.net/npm/@xterm/addon-webgl@0/lib/addon-webgl.min.js"></script>
-<script type="module" src="app.js?v=20260824g"></script>
+<script type="module" src="app.js?v=20260826a"></script>
 <div id="pwa-install-modal" class="pwa-modal hidden">
   <div class="pwa-modal-backdrop"></div>
   <div class="pwa-modal-card">

package/lib/public/junie-avatar.svg

@@ -0,0 +1,11 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" role="img" aria-label="Junie">
+  <defs>
+    <linearGradient id="junie-gradient" x1="8" y1="8" x2="56" y2="56" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#8B5CF6"/>
+      <stop offset="1" stop-color="#F97316"/>
+    </linearGradient>
+  </defs>
+  <rect width="64" height="64" rx="15" fill="url(#junie-gradient)"/>
+  <path d="M39 15v26c0 7.7-5.4 12-13.2 12-5.3 0-9.4-2.2-12-6.4l7.1-5c1.3 2 2.7 3 4.6 3 2.5 0 4-1.4 4-4.4V15H39Z" fill="#fff"/>
+  <circle cx="47.5" cy="17.5" r="4.5" fill="#fff" fill-opacity=".9"/>
+</svg>

package/lib/public/kimi-avatar.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" role="img" aria-label="Kimi Code">
+  <rect width="64" height="64" rx="14" fill="#1769ff"/>
+  <path d="M18 14h9v15l13-15h11L36 31l16 19H40L27 34v16h-9z" fill="#fff"/>
+</svg>

package/lib/public/modules/agent-config-selects.js

@@ -0,0 +1,69 @@
+import { VENDOR_NAMES, VENDOR_ORDER, isExperimentalVendor } from './app-rendering.js';
+import { effortLevelsFor, effortDisplayName } from './app-panels.js';
+
+function optionValue(entry) {
+  if (typeof entry === "string") return entry;
+  return entry && (entry.value || entry.id) || "";
+}
+
+function optionLabel(entry) {
+  if (typeof entry === "string") return entry;
+  return entry && (entry.displayName || entry.name || entry.value || entry.id) || "";
+}
+
+export function buildAgentVendorSelect(installed, preferred) {
+  var select = document.createElement("select");
+  select.className = "wt-modal-input";
+  for (var i = 0; i < VENDOR_ORDER.length; i++) {
+    var vendor = VENDOR_ORDER[i];
+    if (installed.indexOf(vendor) === -1) continue;
+    var option = document.createElement("option");
+    option.value = vendor;
+    option.textContent = (isExperimentalVendor(vendor) ? "🧪 " : "") + (VENDOR_NAMES[vendor] || vendor);
+    if (isExperimentalVendor(vendor)) option.title = "Experimental integration; not yet validated through direct use testing";
+    select.appendChild(option);
+  }
+  if (preferred && installed.indexOf(preferred) !== -1) select.value = preferred;
+  return select;
+}
+
+export function fillAgentModels(select, vendor, options, preferred) {
+  var models = (options.modelsByVendor && options.modelsByVendor[vendor]) || [];
+  select.innerHTML = "";
+  var automatic = document.createElement("option");
+  automatic.value = "";
+  automatic.textContent = "Automatic";
+  select.appendChild(automatic);
+  for (var i = 0; i < models.length; i++) {
+    var option = document.createElement("option");
+    option.value = optionValue(models[i]);
+    option.textContent = optionLabel(models[i]);
+    select.appendChild(option);
+  }
+  select.value = preferred || "";
+  if (select.selectedIndex === -1) select.value = "";
+}
+
+export function buildAgentEffortSelect() {
+  var select = document.createElement("select");
+  select.className = "wt-modal-input";
+  return select;
+}
+
+export function fillAgentEffort(select, vendor, options, modelValue, preferred) {
+  var previous = preferred === undefined ? select.value : preferred;
+  var models = (options.modelsByVendor && options.modelsByVendor[vendor]) || [];
+  var levels = effortLevelsFor(vendor, models, modelValue);
+  select.innerHTML = "";
+  var automatic = document.createElement("option");
+  automatic.value = "";
+  automatic.textContent = "Default";
+  select.appendChild(automatic);
+  for (var i = 0; i < levels.length; i++) {
+    var option = document.createElement("option");
+    option.value = levels[i];
+    option.textContent = effortDisplayName(levels[i]);
+    select.appendChild(option);
+  }
+  select.value = levels.indexOf(previous) !== -1 ? previous : "";
+}

package/lib/public/modules/app-connection.js

@@ -17,6 +17,7 @@ var reconnectTimer = null;
 var reconnectDelay = 1000;
 var connectTimeoutId = null;
 var connectOverlay = null;
+var hasConnectedOnce = false;
 
 export function initConnection() {
   connectOverlay = document.getElementById("connect-overlay");
@@ -39,6 +40,7 @@ export function initConnection() {
     if (state.connected !== prev.connected) {
       var sendBtn = getSendBtn();
       if (state.connected) {
+        hasConnectedOnce = true;
         if (sendBtn) sendBtn.disabled = false;
         if (connectOverlay) connectOverlay.classList.add("hidden");
         var updPill = document.getElementById("update-pill-wrap");
@@ -46,6 +48,10 @@ export function initConnection() {
         stopLogoAnimation();
       } else {
         if (sendBtn) sendBtn.disabled = true;
+        if (hasConnectedOnce && connectOverlay) {
+          var overlayMessage = document.getElementById("connect-overlay-msg");
+          if (overlayMessage) overlayMessage.textContent = "Reconnecting to server…";
+        }
         if (connectOverlay) connectOverlay.classList.remove("hidden");
         startLogoAnimation();
       }

package/lib/public/modules/app-header.js

@@ -12,7 +12,6 @@ import { saveToolState, resetToolState, restoreToolState } from './tools.js';
 import { getSessionUsage, setSessionUsage, getContextData, setContextData, updateContextPanel, updateUsagePanel } from './app-panels.js';
 import { onHistoryPrepended as onSessionSearchHistoryPrepended } from './session-search.js';
 import { getCachedSessions } from './sidebar-sessions.js';
-import { openPairDialog } from './split-pair-ui.js';
 import { showConfirm } from './app-misc.js';
 
 // --- Module-owned state ---
@@ -23,27 +22,6 @@ export function initHeader() {
   var headerRenameBtn = document.getElementById("header-rename-btn");
   var headerTitleEl = document.getElementById("header-title");
   var headerInfoBtn = document.getElementById("header-info-btn");
-  var headerAddWorkerBtn = document.getElementById("header-add-worker-btn");
-
-  // --- Add Worker: the current session becomes the Driver of a new pair ---
-  if (headerAddWorkerBtn) {
-    headerAddWorkerBtn.addEventListener("click", function () {
-      var sessionId = store.get('activeSessionId');
-      if (!sessionId || store.get('splitPanes') || store.get('dmMode')) return;
-      openPairDialog({
-        sessionId: sessionId,
-        title: headerTitleEl ? headerTitleEl.textContent : "",
-        vendor: store.get('currentVendor') || "claude",
-      });
-    });
-    // A split shows the GROUP in the title bar; adding a worker there makes
-    // no sense (the group already has two members), so hide the button.
-    store.subscribe(function (state, prev) {
-      if (state.splitPanes !== prev.splitPanes) {
-        headerAddWorkerBtn.classList.toggle("hidden", !!state.splitPanes);
-      }
-    });
-  }
   var headerFullAccessBtn = document.getElementById("header-full-access-btn");
 
   function updateFullAccessButton() {

package/lib/public/modules/app-messages.js

@@ -21,12 +21,14 @@ import { handlePaletteSessionSwitch, setPaletteVersion } from './command-palette
 import { handleFindInSessionResults } from './session-search.js';
 import { syncPaneTitles, maybeRestoreSplitGroup, openGroup } from './split-view.js';
 import { showPairDialog, handlePairCreated, handleSplitDelegation, showWorkerDelegationNotice, hideWorkerDelegationNotice } from './split-pair-ui.js';
+import { handleSessionActionMessage } from './session-actions.js';
 import { renderWorkerProposal, updateWorkerProposal } from './worker-proposal.js';
 import { handleInputSync, autoResize, builtinCommands, setScheduleBtnDisabled, sendShellResultToAgent } from './input.js';
 import { startThinking, appendThinking, stopThinking, resetThinkingGroup, createToolItem, updateToolExecuting, updateToolResult, markAllToolsDone, closeToolGroup, removeToolFromGroup, resetToolState, getTools, getPlanContent, setPlanContent, renderPlanBanner, renderPlanCard, getTodoTools, handleTodoWrite, handleTaskCreate, handleTaskUpdate, applyDeadSessionTodoCompaction, isPlanFilePath, enableMainInput, addTurnMeta, updateSubagentActivity, addSubagentToolEntry, markSubagentDone, initSubagentStop, updateSubagentProgress, updateSubagentTaskStatus, renderAskUserQuestion, markAskUserAnswered, renderPermissionRequest, markPermissionCancelled, markPermissionResolved, renderElicitationRequest, markElicitationResolved, renderUserDialogRequest, markUserDialogResolved, updateThinkingTokens } from './tools.js';
 import { showDoneNotification, playDoneSound, isNotifAlertEnabled, isNotifSoundEnabled } from './notifications.js';
 import { handleFsList, handleFsRead, handleFileChanged, handleDirChanged, handleFileHistory, handleGitDiff, handleFileAt, refreshIfOpen, getPendingNavigate, handleFsSearch, presentMarkdownEdit } from './filebrowser.js';
 import { beginMarkdownTurn, finishMarkdownTurn, markdownPathFromToolInput } from './markdown-live-edit.js';
+import { forwardPaneMarkdownPresentation } from './pane-bridge.js';
 import { isProjectSettingsOpen, handleInstructionsRead, handleInstructionsWrite, handleProjectEnv, handleProjectEnvSaved, handleProjectSharedEnv, handleProjectSharedEnvSaved, handleProjectOwnerChanged } from './project-settings.js';
 import { updateSettingsModels, updateSettingsStats, updateDaemonConfig, handleSetPinResult, handleKeepAwakeChanged, handleInheritGroupsChanged, handleAutoContinueChanged, handleRestartResult, handleShutdownResult, handleSharedEnv, handleSharedEnvSaved, handleGlobalClaudeMdRead, handleGlobalClaudeMdWrite } from './server-settings.js';
 import { handleTermList, handleTermCreated, sendTerminalCommand, handleTermOutput, handleTermResized, handleTermExited, handleTermClosed } from './terminal.js';
@@ -53,6 +55,7 @@ import { handleWhatsNewState, handleWhatsNewSeenResult, setKnownEntries as setWh
 import { closeArticle as closeWhatsNewArticle } from './whats-new-article.js';
 import { resolvePaneSession, resolveSwitchedVendor } from './pane-session.js';
 import { selectDefaultVendorForBlankSession } from './vendor-selection.js';
+import { getModelInfoUpdate, modelEntryValue, modelEntryMatches, handleModelSelectionResult, requestVendorModels } from './model-picker.js';
 import { getModelEffortLevels, accumulateUsage, updateUsagePanel, accumulateContext, updateContextPanel, renderCtxPopover, updateStatusPanel } from './app-panels.js';
 import { updateProjectList, resetClientState, showUpdateAvailable, handleRemoveProjectCheckResult, handleRemoveProjectResult, handleBrowseDirResult, handleAddProjectResult, handleCloneProgress } from './app-projects.js';
 import { updateHistorySentinel, prependOlderHistory } from './app-header.js';
@@ -431,12 +434,12 @@ export function processMessage(msg) {
         // currentModels with the wrong vendor's list and trigger app-panels
         // to request models for the "wrong" vendor, which feeds back into a
         // ping-pong loop of vendor flapping. See issue #336.
-        var _curV = store.get('currentVendor');
-        if (msg.vendor && _curV && msg.vendor !== _curV) break;
+        var _modelLoadUpdate = getModelInfoUpdate(msg);
+        if (!_modelLoadUpdate) break;
 
         var _modelVal = msg.model;
         if (_modelVal && typeof _modelVal === "object") _modelVal = _modelVal.value || _modelVal.displayName || "";
-        var _miUpdate = { currentModels: msg.models || [] };
+        var _miUpdate = Object.assign({ currentModels: msg.models || [] }, _modelLoadUpdate);
         if (Object.prototype.hasOwnProperty.call(msg, "model")) {
           // Keep the user's existing selection only if it actually belongs to
           // this vendor's model list. Otherwise (e.g. switching to a Codex
@@ -445,10 +448,15 @@ export function processMessage(msg) {
           // model.
           var _curModel = store.get('currentModel');
           var _curInList = !!_curModel && (msg.models || []).some(function (m) {
-            var v = typeof m === "string" ? m : (m && m.value);
-            return v === _curModel;
+            return modelEntryMatches(m, _curModel);
           });
-          if (store.get('vendorSelectionLocked') && _curInList) {
+          var _incomingInList = !_modelVal || (msg.models || []).length === 0 || (msg.models || []).some(function (m) {
+            return modelEntryMatches(m, _modelVal);
+          });
+          if (!_incomingInList) {
+            console.warn("[model-state] Ignoring model not listed for vendor " + (msg.vendor || store.get('currentVendor')) + ": " + _modelVal);
+            _miUpdate.currentModel = _curInList ? _curModel : modelEntryValue((msg.models || [])[0]);
+          } else if (store.get('vendorSelectionLocked') && _curInList) {
             // Keep the user's existing (valid) selection; only update models list
           } else {
             _miUpdate.currentModel = _modelVal || "";
@@ -463,9 +471,25 @@ export function processMessage(msg) {
         break;
       }
 
+      case "model_selection_result":
+        handleModelSelectionResult(msg);
+        break;
+
       case "config_state": {
+        if ((msg.sessionId != null && msg.sessionId !== store.get('activeSessionId')) || (msg.vendor && msg.vendor !== store.get('currentVendor'))) break;
         var _cs = {};
-        if (msg.model) _cs.currentModel = msg.model;
+        if (msg.model) {
+          var _knownModels = store.get('currentModels') || [];
+          var _modelKnown = _knownModels.length === 0 || _knownModels.some(function(model) { return modelEntryMatches(model, msg.model); });
+          if (_modelKnown) {
+            _cs.currentModel = msg.model;
+          } else {
+            console.warn("[model-state] Ignoring model not listed for current vendor: " + msg.model);
+            var _existingModel = store.get('currentModel');
+            var _existingKnown = _knownModels.some(function(model) { return modelEntryMatches(model, _existingModel); });
+            _cs.currentModel = _existingKnown ? _existingModel : modelEntryValue(_knownModels[0]);
+          }
+        }
         if (msg.mode) _cs.currentMode = msg.mode;
         if (msg.effort) _cs.currentEffort = msg.effort;
         if (msg.betas) _cs.currentBetas = msg.betas;
@@ -597,6 +621,13 @@ export function processMessage(msg) {
         if (createdPairGroup) openGroup(createdPairGroup);
         break;
 
+      case "session_handoff_result":
+      case "handoff_session_options":
+      case "handoff_context":
+      case "handoff_created":
+        handleSessionActionMessage(msg);
+        break;
+
       case "worker_proposal":
         renderWorkerProposal(msg);
         break;
@@ -669,7 +700,7 @@ export function processMessage(msg) {
         var _effectiveTerminalId = (typeof msg.runtimeTerminalId === "number")
           ? msg.runtimeTerminalId
           : (typeof msg.terminalId === "number" ? msg.terminalId : null);
-        store.set({ activeSessionId: msg.id, cliSessionId: msg.cliSessionId || null, currentModel: msg.model || store.get('currentModel'), currentEffort: msg.effort || store.get('currentEffort'), vendorCapabilities: msg.capabilities || {}, sessionIsProcessing: !!msg.isProcessing, activeSessionMode: _effectiveMode, activeTerminalId: _effectiveTerminalId, sessionHasHistory: !!msg.hasHistory, sessionVendorBound: !!msg.vendor || !!msg.hasHistory, sessionFullAccess: msg.permissionMode === "bypassPermissions", currentMode: msg.permissionMode || store.get('currentMode') });
+        store.set({ activeSessionId: msg.id, cliSessionId: msg.cliSessionId || null, currentModel: msg.model || "", currentEffort: msg.effort || store.get('currentEffort'), vendorCapabilities: msg.capabilities || {}, sessionIsProcessing: !!msg.isProcessing, activeSessionMode: _effectiveMode, activeTerminalId: _effectiveTerminalId, sessionHasHistory: !!msg.hasHistory, sessionVendorBound: !!msg.vendor || !!msg.hasHistory, sessionFullAccess: msg.permissionMode === "bypassPermissions", currentMode: msg.permissionMode || store.get('currentMode') });
         // TUI sessions swap the chat UI for an embedded xterm running
         // `claude` inside a real PTY. Mount or tear down before the rest of
         // the chat-side bookkeeping runs so we don't waste work on hidden DOM.
@@ -716,6 +747,7 @@ export function processMessage(msg) {
         if (!msg.hasHistory && !msg.vendor) {
           selectDefaultVendorForBlankSession();
         }
+        if (!msg.model) requestVendorModels(store.get('currentVendor') || "claude", true);
         // Vendor toggle visibility + active-vendor indicator next to the
         // model chip.
         //   - Session has an explicit vendor: hide the toggle (it's
@@ -1116,6 +1148,10 @@ export function processMessage(msg) {
         updateSubagentTaskStatus(msg.parentToolId, msg.patch);
         break;
 
+      case "active_background_tasks":
+        store.set({ activeBackgroundTasks: Array.isArray(msg.tasks) ? msg.tasks : [] });
+        break;
+
       case "result":
         // Result marks turn end. Drop pre-thinking even if no delta/tool
         // event ever arrived (e.g. tool-only turn whose progress signals
@@ -1365,7 +1401,10 @@ export function processMessage(msg) {
         break;
 
       case "markdown_edit_present":
-        if (!store.get('replayingHistory') && !store.get('dmMode')) presentMarkdownEdit(msg);
+        if (!store.get('replayingHistory') && !store.get('dmMode')) {
+          if (store.get('paneMode')) forwardPaneMarkdownPresentation(msg);
+          else if (!store.get('splitPanes')) presentMarkdownEdit(msg);
+        }
         break;
 
       case "fs_dir_changed":