clay-server 3.4.0-beta.2 → 3.4.0-beta.20

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=20260407">
+<link rel="stylesheet" href="style.css?v=20260826a">
 <style>
 @media(max-width:768px){
   /* User messages: vertical stack, avatar on top, right-aligned */
@@ -373,12 +373,11 @@
           </div>
           <button id="hamburger-btn" aria-label="Toggle sidebar" title="Toggle sidebar"><i data-lucide="menu"></i></button>
           <span class="header-title" id="header-title">Connecting...</span>
+          <button id="header-rename-btn" type="button" title="Rename session"><i data-lucide="pencil"></i></button>
           <button id="header-info-btn" type="button" title="Session info"><i data-lucide="info"></i></button>
           <button id="header-full-access-btn" type="button" class="session-full-access hidden" role="switch" aria-checked="false" title="Skip Permissions is off — permission prompts are on">
             <span class="session-full-access-label">Skip Permissions</span><span class="session-full-access-track" aria-hidden="true"><span></span></span>
           </button>
-          <button id="header-rename-btn" type="button" title="Rename session"><i data-lucide="pencil"></i></button>
-          <button id="header-add-worker-btn" type="button" title="Add Worker — this session becomes the Driver of a pair"><i data-lucide="user-plus"></i></button>
           <button type="button" id="header-tui-close-btn" class="header-tui-close-btn hidden" title="Close terminal (keeps history, resume anytime)" aria-label="Close terminal"><i data-lucide="power"></i></button>
           <div id="mate-mobile-title" class="mate-mobile-title hidden">
             <img id="mate-mobile-avatar" class="mate-mobile-avatar" alt="">
@@ -389,6 +388,9 @@
         <div id="ralph-sticky" class="hidden"></div>
         <div id="debate-sticky" class="hidden"></div>
         <div class="status">
+          <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>
           </button>
@@ -528,14 +530,34 @@
                   <img src="/codex-avatar.png" class="vendor-toggle-icon" alt="Codex">
                   <span class="vendor-toggle-label">Codex</span>
                 </button>
-                <button id="vendor-btn-gemini" class="vendor-toggle-btn" data-vendor="gemini">
-                  <img src="/gemini-avatar.svg" class="vendor-toggle-icon" alt="Gemini">
-                  <span class="vendor-toggle-label">Gemini CLI</span>
+                <button id="vendor-btn-antigravity" class="vendor-toggle-btn" data-vendor="antigravity">
+                  <img src="/antigravity-avatar.png" class="vendor-toggle-icon" alt="Antigravity">
+                  <span class="vendor-toggle-label">Antigravity CLI</span>
                 </button>
                 <button id="vendor-btn-opencode" class="vendor-toggle-btn" data-vendor="opencode">
                   <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>
@@ -2338,7 +2360,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"></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-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() {
@@ -93,6 +71,8 @@ export function initHeader() {
       input.type = "text";
       input.className = "header-rename-input";
       input.value = currentText;
+      var titleBar = headerTitleEl.closest(".title-bar-content");
+      if (titleBar) titleBar.classList.add("session-renaming");
       headerTitleEl.style.display = "none";
       headerRenameBtn.style.display = "none";
       headerTitleEl.parentNode.insertBefore(input, headerTitleEl.nextSibling);
@@ -117,6 +97,7 @@ export function initHeader() {
           }
         }
         input.remove();
+        if (titleBar) titleBar.classList.remove("session-renaming");
         headerTitleEl.style.display = "";
         headerRenameBtn.style.display = "";
       }
@@ -126,6 +107,7 @@ export function initHeader() {
         if (e.key === "Escape") {
           e.preventDefault();
           input.remove();
+          if (titleBar) titleBar.classList.remove("session-renaming");
           headerTitleEl.style.display = "";
           headerRenameBtn.style.display = "";
         }

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

@@ -21,6 +21,7 @@ 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';
@@ -52,6 +53,8 @@ import { setStatus } from './app-connection.js';
 import { handleWhatsNewState, handleWhatsNewSeenResult, setKnownEntries as setWhatsNewKnownEntries } from './whats-new.js';
 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';
@@ -414,6 +417,15 @@ export function processMessage(msg) {
         break;
 
       case "model_info": {
+        // Installation state applies across vendors. Keep it even when the
+        // model payload itself is stale for the active session.
+        var _vendorState = {};
+        if (msg.availableVendors) _vendorState.availableVendors = msg.availableVendors;
+        if (msg.installedVendors) _vendorState.installedVendors = msg.installedVendors;
+        if (Object.keys(_vendorState).length > 0) {
+          store.set(_vendorState);
+          selectDefaultVendorForBlankSession();
+        }
         // Drop stale model_info from a vendor that doesn't match the active
         // session's vendor. On high-latency connections, the server's default-
         // adapter model_info can arrive after session_switched has already
@@ -421,12 +433,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
@@ -435,10 +447,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);
+          });
+          var _incomingInList = !_modelVal || (msg.models || []).length === 0 || (msg.models || []).some(function (m) {
+            return modelEntryMatches(m, _modelVal);
           });
-          if (store.get('vendorSelectionLocked') && _curInList) {
+          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 || "";
@@ -447,17 +464,31 @@ export function processMessage(msg) {
           _miUpdate.currentModel = store.get('currentModel');
         }
         if (msg.vendor && !store.get('vendorSelectionLocked')) _miUpdate.currentVendor = msg.vendor;
-        if (msg.availableVendors) _miUpdate.availableVendors = msg.availableVendors;
-        if (msg.installedVendors) _miUpdate.installedVendors = msg.installedVendors;
         if (msg.capabilities) _miUpdate.vendorCapabilities = msg.capabilities;
         store.set(_miUpdate);
         updateSettingsModels(_modelVal, msg.models || []);
         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;
@@ -589,6 +620,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;
@@ -661,7 +699,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, 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.
@@ -706,8 +744,9 @@ export function processMessage(msg) {
           }
         }
         if (!msg.hasHistory && !msg.vendor) {
-          // Preserve explicit pre-message vendor choice on brand-new sessions.
+          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
@@ -1108,6 +1147,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

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

@@ -5,8 +5,9 @@ import { refreshIcons } from "./icons.js";
 import { escapeHtml, showToast } from "./utils.js";
 import { store } from './store.js';
 import { getWs } from './ws-ref.js';
-import { VENDOR_NAMES } from './app-rendering.js';
+import { VENDOR_NAMES, isExperimentalVendor } from './app-rendering.js';
 import { reportPaneContext } from './pane-bridge.js';
+import { setupModelPicker, renderModelPicker, requestVendorModels, prepareModelPickerOpen, modelDisplayName } from './model-picker.js';
 
 // --- Module-owned state (not in store) ---
 var sessionUsage = { cost: 0, input: 0, output: 0, cacheRead: 0, cacheWrite: 0, turns: 0 };
@@ -20,7 +21,6 @@ var configChipWrap = null;
 var configChip = null;
 var configChipLabel = null;
 var configPopover = null;
-var configModelList = null;
 var configModeList = null;
 var configEffortSection = null;
 var configEffortBar = null;
@@ -89,7 +89,7 @@ var EFFORT_LEVELS = ["low", "medium", "high", "xhigh", "max"];
 var EFFORT_LEVELS_BY_VENDOR = {
   claude: ["low", "medium", "high", "xhigh", "max"],
   codex: ["minimal", "low", "medium", "high", "xhigh"],
-  gemini: [],
+  antigravity: [],
   opencode: [],
   kiro: ["low", "medium", "high", "xhigh", "max"],
 };
@@ -132,18 +132,6 @@ export function setContextData(v) { contextData = v; }
 
 // --- Internal helpers ---
 
-function modelDisplayName(value, models) {
-  if (!value) return "";
-  if (models) {
-    for (var i = 0; i < models.length; i++) {
-      var m = models[i];
-      if (typeof m === "string") { if (m === value) return m; }
-      else if (m.value === value && m.displayName) return m.displayName;
-    }
-  }
-  return value;
-}
-
 function modeDisplayName(value) {
   for (var i = 0; i < MODE_OPTIONS.length; i++) {
     if (MODE_OPTIONS[i].value === value) return MODE_OPTIONS[i].label;
@@ -198,65 +186,6 @@ function hasBeta(name) {
   return false;
 }
 
-function rebuildModelList() {
-  if (!configModelList) return;
-  // Picker lock policy is capability-based (yoke midSessionModelSwitch):
-  //   Claude -> free. The SDK supports mid-thread swaps on a live query
-  //             (query.setModel: "Change the model used for subsequent
-  //             responses"), and sdk-bridge already routes set_model to
-  //             queryInstance.setModel. Cache re-priming on switch is a
-  //             cost, not a breakage.
-  //   Codex / Kiro -> locked once the session has history: their threads
-  //             bind the model at creation and a mid-thread change would be
-  //             silently ignored. Picks made before the first message still
-  //             work everywhere (sdk-bridge stores into sm.currentModel when
-  //             there's no active queryInstance).
-  var modelSection = configModelList.parentElement;
-  var s = store.snap();
-  var vendor = s.currentVendor || "claude";
-  if (modelSection) modelSection.style.display = "";
-  configModelList.innerHTML = "";
-
-  var caps = s.vendorCapabilities || {};
-  var lockedForGui = s.activeSessionMode === "gui" && !!s.sessionHasHistory && !caps.midSessionModelSwitch;
-
-  var list = s.currentModels.length > 0 ? s.currentModels : (s.currentModel ? [{ value: s.currentModel, displayName: s.currentModel }] : []);
-  for (var i = 0; i < list.length; i++) {
-    var item = list[i];
-    // Support both object { value, displayName } and plain string formats
-    var value = typeof item === "string" ? item : (item.value || "");
-    var label = typeof item === "string" ? item : (item.displayName || value);
-    var btn = document.createElement("button");
-    btn.className = "config-radio-item";
-    if (value === s.currentModel) btn.classList.add("active");
-    if (lockedForGui) btn.classList.add("locked");
-    btn.dataset.model = value;
-    btn.textContent = label;
-    if (lockedForGui) {
-      btn.disabled = true;
-      btn.title = "This vendor binds the model when the session starts. Start a new session to change it.";
-    } else {
-      btn.addEventListener("click", function () {
-        var model = this.dataset.model;
-        var ws = getWs();
-        if (ws && ws.readyState === 1) {
-          ws.send(JSON.stringify({ type: "set_model", model: model }));
-        }
-        configPopover.classList.add("hidden");
-        configChip.classList.remove("active");
-      });
-    }
-    configModelList.appendChild(btn);
-  }
-
-  if (lockedForGui) {
-    var hint = document.createElement("div");
-    hint.className = "config-model-hint";
-    hint.textContent = "Locked after first message. Start a new session to change models.";
-    configModelList.appendChild(hint);
-  }
-}
-
 function rebuildModeList() {
   if (!configModeList) return;
   configModeList.innerHTML = "";
@@ -422,7 +351,7 @@ export function initPanels() {
   configChip = $("config-chip");
   configChipLabel = $("config-chip-label");
   configPopover = $("config-popover");
-  configModelList = $("config-model-list");
+  setupModelPicker();
   configModeList = $("config-mode-list");
   configEffortSection = $("config-effort-section");
   configEffortBar = $("config-effort-bar");
@@ -443,14 +372,24 @@ export function initPanels() {
   var vendorToggleWrap = $("vendor-toggle-wrap");
   var vendorBtnClaude = $("vendor-btn-claude");
   var vendorBtnCodex = $("vendor-btn-codex");
-  var vendorBtnGemini = $("vendor-btn-gemini");
+  var vendorBtnAntigravity = $("vendor-btn-antigravity");
   var vendorBtnOpenCode = $("vendor-btn-opencode");
+  var vendorBtnKimi = $("vendor-btn-kimi");
+  var vendorBtnGrok = $("vendor-btn-grok");
+  var vendorBtnCopilot = $("vendor-btn-copilot");
+  var vendorBtnQwen = $("vendor-btn-qwen");
+  var vendorBtnJunie = $("vendor-btn-junie");
   var vendorBtnKiro = $("vendor-btn-kiro");
   var vendorBtns = {
     claude: vendorBtnClaude,
     codex: vendorBtnCodex,
-    gemini: vendorBtnGemini,
+    antigravity: vendorBtnAntigravity,
     opencode: vendorBtnOpenCode,
+    kimi: vendorBtnKimi,
+    grok: vendorBtnGrok,
+    copilot: vendorBtnCopilot,
+    qwen: vendorBtnQwen,
+    junie: vendorBtnJunie,
     kiro: vendorBtnKiro,
   };
 
@@ -466,7 +405,10 @@ export function initPanels() {
       var isInstalled = installed.indexOf(v) !== -1;
       btn.classList.toggle("active", v === current);
       btn.classList.toggle("disabled", !isInstalled);
-      btn.title = isInstalled ? (VENDOR_NAMES[v] || v) : (VENDOR_NAMES[v] || v) + " is not installed";
+      btn.classList.toggle("experimental", isExperimentalVendor(v));
+      var title = isInstalled ? (VENDOR_NAMES[v] || v) : (VENDOR_NAMES[v] || v) + " is not installed";
+      if (isExperimentalVendor(v)) title += " · Experimental integration; not yet validated through direct use testing";
+      btn.title = title;
     }
   }
 
@@ -474,15 +416,20 @@ export function initPanels() {
     if (vendor === (store.get('currentVendor') || "claude")) return;
     var installed = store.get('installedVendors') || [];
     if (installed.indexOf(vendor) === -1) return;
-    store.set({ currentVendor: vendor, currentModel: "", currentModels: [], vendorSelectionLocked: true });
+    store.set({ currentVendor: vendor, currentModel: "", currentModels: [], vendorCapabilities: {}, vendorSelectionLocked: true, sessionVendorBound: true });
     var ws = getWs();
     if (ws) ws.send(JSON.stringify({ type: "set_vendor", vendor: vendor }));
   }
 
   if (vendorBtnClaude) vendorBtnClaude.addEventListener("click", function() { onVendorClick("claude"); });
   if (vendorBtnCodex) vendorBtnCodex.addEventListener("click", function() { onVendorClick("codex"); });
-  if (vendorBtnGemini) vendorBtnGemini.addEventListener("click", function() { onVendorClick("gemini"); });
+  if (vendorBtnAntigravity) vendorBtnAntigravity.addEventListener("click", function() { onVendorClick("antigravity"); });
   if (vendorBtnOpenCode) vendorBtnOpenCode.addEventListener("click", function() { onVendorClick("opencode"); });
+  if (vendorBtnKimi) vendorBtnKimi.addEventListener("click", function() { onVendorClick("kimi"); });
+  if (vendorBtnGrok) vendorBtnGrok.addEventListener("click", function() { onVendorClick("grok"); });
+  if (vendorBtnCopilot) vendorBtnCopilot.addEventListener("click", function() { onVendorClick("copilot"); });
+  if (vendorBtnQwen) vendorBtnQwen.addEventListener("click", function() { onVendorClick("qwen"); });
+  if (vendorBtnJunie) vendorBtnJunie.addEventListener("click", function() { onVendorClick("junie"); });
   if (vendorBtnKiro) vendorBtnKiro.addEventListener("click", function() { onVendorClick("kiro"); });
 
   // --- Reactive UI sync ---
@@ -510,8 +457,7 @@ export function initPanels() {
 
     // Vendor changed -> switch model list and current model to match
     if (state.currentVendor !== prev.currentVendor && state.currentVendor) {
-      var ws = getWs();
-      if (ws) ws.send(JSON.stringify({ type: "get_vendor_models", vendor: state.currentVendor }));
+      requestVendorModels(state.currentVendor, true);
     }
 
     // config chip
@@ -521,6 +467,12 @@ export function initPanels() {
         state.currentBetas !== prev.currentBetas ||
         state.currentThinking !== prev.currentThinking ||
         state.currentVendor !== prev.currentVendor ||
+        state.currentModels !== prev.currentModels ||
+        state.vendorCapabilities !== prev.vendorCapabilities ||
+        state.modelListStatus !== prev.modelListStatus ||
+        state.modelListError !== prev.modelListError ||
+        state.modelSelectionPending !== prev.modelSelectionPending ||
+        state.modelSelectionError !== prev.modelSelectionError ||
         state.codexApproval !== prev.codexApproval ||
         state.codexSandbox !== prev.codexSandbox ||
         state.codexWebSearch !== prev.codexWebSearch ||
@@ -621,6 +573,7 @@ export function initPanels() {
       e.stopPropagation();
       var wasHidden = configPopover.classList.toggle("hidden");
       configChip.classList.toggle("active", !wasHidden);
+      if (!wasHidden) prepareModelPickerOpen();
     });
   }
 
@@ -674,7 +627,7 @@ export function updateConfigChip() {
   var s = store.snap();
   var vendor = s.currentVendor || "claude";
   configChipLabel.textContent = modelDisplayName(s.currentModel, s.currentModels);
-  rebuildModelList();
+  renderModelPicker();
   rebuildModeList();
   rebuildEffortBar();
 

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

@@ -5,6 +5,7 @@ import { escapeHtml, showToast } from './utils.js';
 import { refreshIcons } from './icons.js';
 import { parseEmojis } from './markdown.js';
 import { store } from './store.js';
+import { resetModelPickerState } from './model-picker.js';
 import { getWs, setWs } from './ws-ref.js';
 import { getMessagesEl, getStatusDot } from './dom-refs.js';
 import { userAvatarUrl } from './avatar.js';
@@ -322,7 +323,7 @@ export function renderProjectList() {
       isWorktree: p.isWorktree || false,
       parentSlug: p.parentSlug || null,
       branch: p.branch || null,
-      worktreeAccessible: p.worktreeAccessible !== undefined ? p.worktreeAccessible : true,
+      worktreeExternal: p.worktreeExternal === true,
     };
   });
   var st = store.snap();
@@ -363,6 +364,7 @@ export function renderProjectList() {
 }
 
 export function resetClientState() {
+  resetModelPickerState();
   if (isSearchOpen()) closeSearch();
   getMessagesEl().innerHTML = "";
   store.set({ currentMsgEl: null });