synabun 2.0.9 → 2.0.10

package/neural-interface/public/shared/assistant/asst-brain-picker.js

@@ -29,6 +29,7 @@ import {
 import { getHiddenModels, HIDDEN_MODELS_EVENT, hiddenModelMatch } from '../ocp-hidden-models.js';
 import { getProviderMeta } from '../provider-icons.js';
 import { on } from '../state.js';
+import { registerLaunchPrefetch } from '../launch-prefetch.js';
 import { fetchAssistantCatalog, fetchProjects, patchClaudeAccount, patchCodexAccount, setClaudeWorkerAccount, setCodexWorkerAccount } from './asst-api.js';
 import { accountBadge, accountIdentity, accountName, accountText } from '../account-view.js';
 import { autoAccountLabel } from '../account-usage.js';
@@ -54,6 +55,9 @@ import {
 } from './asst-state.js';
 
 let _projectsCache = null;
+// Providers whose field menus have everything they read loaded once (models, catalog, accounts or agents,
+// presets, projects): their menus open from it at once and read it again in the background.
+const _warmProviders = new Set();
 
 /** SynaBun's registered projects as the last load saw them ([{ path, label }]; [] before the first). */
 export function cachedProjects() { return _projectsCache || []; }
@@ -321,11 +325,41 @@ export async function loadModelCatalog({ force = false } = {}) {
     // while it loaded: the next open asks again.
     _catalogAt = remote && epoch === _catalogEpoch ? Date.now() : 0;
     _catalogPartial = !remote;
+    if (_catalogAt) keepCatalog(out, sets);
     return out;
   })().finally(() => { _catalogLoading = null; });
   return _catalogLoading;
 }
 
+// The last complete catalog is also kept in sessionStorage (this tab only): after a reload the model menus
+// paint from it at once. Read back, it is due: the first load asks the server again.
+const CATALOG_STORE_KEY = 'synabun:assistant-model-catalog:v1';
+function keepCatalog(catalog, sets) {
+  try {
+    if (typeof sessionStorage === 'undefined') return;
+    const hidden = {};
+    for (const provider of PROVIDERS) hidden[provider] = [...(sets?.[provider] || [])];
+    const rowOnly = {};
+    for (const provider of PROVIDERS) rowOnly[provider] = [...(sets?.rowOnly?.[provider] || [])];
+    sessionStorage.setItem(CATALOG_STORE_KEY, JSON.stringify({ catalog, hidden, rowOnly }));
+  } catch { /* full or unavailable */ }
+}
+(() => {
+  try {
+    if (typeof sessionStorage === 'undefined' || _catalog) return;
+    const kept = JSON.parse(sessionStorage.getItem(CATALOG_STORE_KEY) || 'null');
+    if (!kept?.catalog || typeof kept.catalog !== 'object') return;
+    _catalog = kept.catalog;
+    _catalogAt = 0;
+    const sets = { rowOnly: {} };
+    for (const provider of PROVIDERS) {
+      sets[provider] = new Set(Array.isArray(kept.hidden?.[provider]) ? kept.hidden[provider] : []);
+      sets.rowOnly[provider] = new Set(Array.isArray(kept.rowOnly?.[provider]) ? kept.rowOnly[provider] : []);
+    }
+    _hidden = sets;
+  } catch { /* unreadable: the first load builds it */ }
+})();
+
 /** The last loadModelCatalog() result, synchronously (null before the first load). */
 export function cachedModelCatalog() { return _catalog; }
 
@@ -346,6 +380,8 @@ export function invalidateModelCatalog() {
   _catalogAt = 0;
   _catalogPartial = false;
   _catalogEpoch += 1;
+  // A reload must not paint the lists this replaced.
+  try { if (typeof sessionStorage !== 'undefined') sessionStorage.removeItem(CATALOG_STORE_KEY); } catch { /* unavailable */ }
 }
 
 /**
@@ -366,6 +402,15 @@ function modelListsChanged() {
   for (const listener of [..._catalogListeners]) {
     try { listener(); } catch { /* a listener's failure is its own */ }
   }
+  scheduleCatalogReload();
+}
+
+// In a page: the new lists are read right away, so the next menu opens from them (an open that comes
+// first joins this read).
+let _catalogReloadTimer = null;
+function scheduleCatalogReload() {
+  if (typeof document === 'undefined' || _catalogReloadTimer) return;
+  _catalogReloadTimer = setTimeout(() => { _catalogReloadTimer = null; loadModelCatalog().catch(() => {}); }, 250);
 }
 
 /**
@@ -397,6 +442,12 @@ on('sync:opencode:hidden-models-changed', modelListsChanged);
 on('sync:assistant:hidden-models-changed', modelListsChanged);
 on('sync:assistant:catalog-changed', modelListsChanged);
 
+// Launch: the menus' lists are read once the page has painted, so the first model menu opens from them.
+if (typeof document !== 'undefined') {
+  registerLaunchPrefetch('assistant-model-catalog', () => loadModelCatalog(), { order: 10, owner: true });
+  registerLaunchPrefetch('assistant-accounts', () => Promise.allSettled([fetchClaudeAccounts(), fetchCodexAccounts(), fetchMcpProfilePresets(), fetchOpencodeAgents()]), { order: 14, owner: true });
+}
+
 function sameModel(selected, m) {
   if (!selected) return false;
   return selected === m.id || selected === m.selector;
@@ -435,74 +486,28 @@ export async function openModelMenu(anchor, opts = {}) {
   if (!anchor) return null;
   const tr = tf(t);
   const b = normalizeBrain(brain);
-  anchor.setAttribute('aria-busy', 'true');
-  // Open immediately: a slow provider still has a visible, cancellable state.
-  const loading = opts.routingEditor ? openMenu(anchor, {
-    title, className: 'asst-model-menu asst-route-model-menu',
-    items: [{ kind: 'info', label: tr('assistant.routes.editorState.loadingModels', 'Loading models…') }],
-    width: 380, zIndex: opts.zIndex ?? null, repositionOnResize: true,
-  }) : null;
-  if (loading) loading.el.setAttribute('aria-busy', 'true');
-  if (loading) { loading.el.setAttribute('role', 'dialog'); anchor.setAttribute('aria-haspopup', 'dialog'); }
+  // The kept catalog paints the menu at once (it is read again in the background below, and an open menu
+  // follows it in place); only a first open, or a reload the user asked for, waits for the lists.
+  const kept = opts.forceReload === true ? null : cachedModelCatalog();
   let catalog = {};
   let failed = false;
-  try { catalog = await loadModelCatalog({ force: opts.forceReload === true }); } catch { failed = true; } finally { anchor.removeAttribute('aria-busy'); }
-  if (!anchor.isConnected || (loading && currentMenu() !== loading.el)) return null;
-  const metadata = modelCatalogStatus();
-  const items = [];
-  if (Array.isArray(opts.accountItems) && opts.accountItems.length) {
-    items.push({ kind: 'header', label: opts.accountTitle || tr('assistant.brain.account', 'Account profile') }, ...opts.accountItems, { kind: 'separator' });
-  }
-  if (includeHere) {
-    items.push({ kind: 'radio', id: '__here', label: hereLabel || tr('assistant.routes.brainDecides', 'Let the brain decide'), selected: !current, onSelect: () => onSelect?.({ here: true }) });
-  }
-  const list = Array.isArray(providers) && providers.length ? PROVIDERS.filter(p => providers.includes(p)) : PROVIDERS;
-  let listed = 0;
-  for (const provider of list) {
-    const models = (catalog[provider] || []).filter(m => typeof accept !== 'function' || accept(provider, m));
-    if (!models.length && !opts.routingEditor) continue;
-    listed += models.length;
-    const meta = getProviderMeta(provider);
-    const hiddenCount = metadata.hiddenCounts[provider] || 0;
-    const note = opts.routingEditor ? tr('assistant.routes.menu.hiddenCount', '{count} hidden in Models', { count: hiddenCount }) : warnSwitch && provider !== b.provider ? tr('assistant.brain.newConversation', 'starts a new conversation') : '';
-    items.push({ kind: 'header', label: meta.label, icon: meta.icon, color: meta.color, note });
-    for (const m of models) {
-      items.push({
-        kind: 'radio',
-        id: `${provider}:${m.id}`,
-        label: m.label,
-        desc: modelDesc(m, tr, opts.routingEditor),
-        title: `${m.label || m.id} · ${m.id}`,
-        tag: tierTag(m, tr),
-        keywords: `${meta.label} ${m.id}`,
-        selected: !!current && current.provider === provider && sameModel(current.model, m),
-        onSelect: () => onSelect?.({ provider, model: m.id, label: m.label, tier: m.tier || null, vision: m.vision ?? null, outputs: m.outputs || null, efforts: m.efforts || null, price: m.price || null }),
-      });
-    }
-    if (opts.routingEditor && !models.length) items.push({ kind: 'info', label: typeof accept === 'function' ? tr('assistant.routes.menu.noCompatible', 'No compatible models shown for this provider.') : tr('assistant.routes.menu.providerEmpty', 'No models shown for this provider.') });
-  }
-  // Nothing passes the filter (e.g. no model makes video yet): say so instead of an empty list.
-  if (!listed && typeof accept === 'function' && emptyLabel) items.push({ kind: 'info', label: emptyLabel });
-  if (opts.routingEditor && !listed && typeof accept !== 'function') items.push({ kind: 'info', label: tr('assistant.routes.editorState.modelsEmpty', 'No models are available. Check Models or connect a provider, then reload.') });
-  if (allowCustom) {
-    items.push({ kind: 'separator' });
-    items.push({
-      kind: 'input',
-      placeholder: tr('assistant.brain.modelCustom', 'Custom model id…'),
-      onSubmit: (v) => {
-        const provider = current?.provider || b.provider;
-        const disabled = hiddenModelFor(provider, v);
-        if (disabled) {
-          onToast?.(tr('assistant.brain.modelDisabled', "{model} is disabled in the Assistant's Models list.", { model: disabled }));
-          return;
-        }
-        onSelect?.({ provider, model: v, label: modelShortName(v), custom: true });
-      },
-    });
-  }
-  if (!opts.routingEditor && typeof opts.onManageModels === 'function') {
-    items.push({ id: '__manage_models', label: tr('assistant.models.manage', 'Manage models…'), onSelect: () => opts.onManageModels() });
+  let loading = null;
+  if (kept) {
+    catalog = kept;
+  } else {
+    anchor.setAttribute('aria-busy', 'true');
+    // Open immediately: a slow provider still has a visible, cancellable state.
+    loading = opts.routingEditor ? openMenu(anchor, {
+      title, className: 'asst-model-menu asst-route-model-menu',
+      items: [{ kind: 'info', label: tr('assistant.routes.editorState.loadingModels', 'Loading models…') }],
+      width: 380, zIndex: opts.zIndex ?? null, repositionOnResize: true,
+    }) : null;
+    if (loading) loading.el.setAttribute('aria-busy', 'true');
+    if (loading) { loading.el.setAttribute('role', 'dialog'); anchor.setAttribute('aria-haspopup', 'dialog'); }
+    try { catalog = await loadModelCatalog({ force: opts.forceReload === true }); } catch { failed = true; } finally { anchor.removeAttribute('aria-busy'); }
+    if (!anchor.isConnected || (loading && currentMenu() !== loading.el)) return null;
   }
+  const items = buildModelMenuItems(catalog);
   const menu = openMenu(anchor, {
     title: title || tr('assistant.brain.model', 'Model'),
     items,
@@ -516,7 +521,79 @@ export async function openModelMenu(anchor, opts = {}) {
     repositionOnResize: true,
     filterEmptyLabel: tr('assistant.routes.menu.noMatches', 'No matching models. Check Models for hidden choices.'),
   });
-  if (opts.routingEditor && menu) {
+  if (opts.routingEditor && menu) decorateRouteMenu(menu, failed);
+  // Painted from the kept catalog: read it again (fresh within its minute, else a background request) and
+  // redraw the open menu in place when the lists changed, leaving the filter, the scroll and the focus alone.
+  if (kept && menu && !opts.routingEditor) {
+    loadModelCatalog().then((next) => {
+      if (!next || next === kept || currentMenu() !== menu.el || !anchor.isConnected) return;
+      const nextItems = buildModelMenuItems(next);
+      if (menuItemsSignature(nextItems) !== menuItemsSignature(items)) menu.update({ items: nextItems, keepPlace: true });
+    }).catch(() => { /* the kept list stays */ });
+  }
+  return menu;
+
+  function buildModelMenuItems(catalog) {
+    const metadata = modelCatalogStatus();
+    const items = [];
+    if (Array.isArray(opts.accountItems) && opts.accountItems.length) {
+      items.push({ kind: 'header', label: opts.accountTitle || tr('assistant.brain.account', 'Account profile') }, ...opts.accountItems, { kind: 'separator' });
+    }
+    if (includeHere) {
+      items.push({ kind: 'radio', id: '__here', label: hereLabel || tr('assistant.routes.brainDecides', 'Let the brain decide'), selected: !current, onSelect: () => onSelect?.({ here: true }) });
+    }
+    const list = Array.isArray(providers) && providers.length ? PROVIDERS.filter(p => providers.includes(p)) : PROVIDERS;
+    let listed = 0;
+    for (const provider of list) {
+      const models = (catalog[provider] || []).filter(m => typeof accept !== 'function' || accept(provider, m));
+      if (!models.length && !opts.routingEditor) continue;
+      listed += models.length;
+      const meta = getProviderMeta(provider);
+      const hiddenCount = metadata.hiddenCounts[provider] || 0;
+      const note = opts.routingEditor ? tr('assistant.routes.menu.hiddenCount', '{count} hidden in Models', { count: hiddenCount }) : warnSwitch && provider !== b.provider ? tr('assistant.brain.newConversation', 'starts a new conversation') : '';
+      items.push({ kind: 'header', label: meta.label, icon: meta.icon, color: meta.color, note });
+      for (const m of models) {
+        items.push({
+          kind: 'radio',
+          id: `${provider}:${m.id}`,
+          label: m.label,
+          desc: modelDesc(m, tr, opts.routingEditor),
+          title: `${m.label || m.id} · ${m.id}`,
+          tag: tierTag(m, tr),
+          keywords: `${meta.label} ${m.id}`,
+          selected: !!current && current.provider === provider && sameModel(current.model, m),
+          onSelect: () => onSelect?.({ provider, model: m.id, label: m.label, tier: m.tier || null, vision: m.vision ?? null, outputs: m.outputs || null, efforts: m.efforts || null, price: m.price || null }),
+        });
+      }
+      if (opts.routingEditor && !models.length) items.push({ kind: 'info', label: typeof accept === 'function' ? tr('assistant.routes.menu.noCompatible', 'No compatible models shown for this provider.') : tr('assistant.routes.menu.providerEmpty', 'No models shown for this provider.') });
+    }
+    // Nothing passes the filter (e.g. no model makes video yet): say so instead of an empty list.
+    if (!listed && typeof accept === 'function' && emptyLabel) items.push({ kind: 'info', label: emptyLabel });
+    if (opts.routingEditor && !listed && typeof accept !== 'function') items.push({ kind: 'info', label: tr('assistant.routes.editorState.modelsEmpty', 'No models are available. Check Models or connect a provider, then reload.') });
+    if (allowCustom) {
+      items.push({ kind: 'separator' });
+      items.push({
+        kind: 'input',
+        placeholder: tr('assistant.brain.modelCustom', 'Custom model id…'),
+        onSubmit: (v) => {
+          const provider = current?.provider || b.provider;
+          const disabled = hiddenModelFor(provider, v);
+          if (disabled) {
+            onToast?.(tr('assistant.brain.modelDisabled', "{model} is disabled in the Assistant's Models list.", { model: disabled }));
+            return;
+          }
+          onSelect?.({ provider, model: v, label: modelShortName(v), custom: true });
+        },
+      });
+    }
+    if (!opts.routingEditor && typeof opts.onManageModels === 'function') {
+      items.push({ id: '__manage_models', label: tr('assistant.models.manage', 'Manage models…'), onSelect: () => opts.onManageModels() });
+    }
+    return items;
+  }
+
+  function decorateRouteMenu(menu, failed) {
+    const metadata = modelCatalogStatus();
     // Search and a custom-id input belong to a dialog; choices are a radio group.
     // A menu role cannot contain these form fields or recovery buttons.
     menu.el.setAttribute('role', 'dialog');
@@ -546,7 +623,11 @@ export async function openModelMenu(anchor, opts = {}) {
     }
     menu.el.append(footer); menu.reposition();
   }
-  return menu;
+}
+
+/** What a model menu lists, for telling a fresher read from the one on screen. */
+function menuItemsSignature(items) {
+  return JSON.stringify((items || []).map((item) => [item.kind || '', item.id ?? '', item.label || '', item.desc || '', item.tag || '', item.note || '', !!item.selected]));
 }
 
 // ── Picker ──────────────────────────────────────────────────────────────────
@@ -968,6 +1049,7 @@ export function createBrainPicker(host, hooks = {}) {
       }).catch(() => { _projectsCache = _projectsCache || []; }));
     }
     await Promise.allSettled(jobs);
+    if (cachedModelCatalog()) _warmProviders.add(provider);
   }
 
   async function refresh(force = false) {
@@ -999,7 +1081,11 @@ export function createBrainPicker(host, hooks = {}) {
     const anchor = anchorFor(field, anchorOverride);
     const brain = currentBrain();
     if (field === 'model') {
-      if (ACCOUNT_PROVIDERS.has(brain.provider)) await ensureLoaded(brain.provider);
+      // The account rows come from the kept lists; they are read again in the background once loaded.
+      if (ACCOUNT_PROVIDERS.has(brain.provider)) {
+        if (_warmProviders.has(brain.provider)) ensureLoaded(brain.provider).catch(() => {});
+        else await ensureLoaded(brain.provider);
+      }
       await openModelMenu(anchor, {
         brain,
         t: hooks.t,
@@ -1034,12 +1120,48 @@ export function createBrainPicker(host, hooks = {}) {
       });
       return;
     }
-    // Everything else needs the provider catalog — load it lazily on first open.
-    anchor.setAttribute('aria-busy', 'true');
-    try { await ensureLoaded(brain.provider); } finally { anchor.removeAttribute('aria-busy'); }
-    if (destroyed || !anchor.isConnected) return;
-    const menu = (title, items, extra = {}) => openMenu(anchor, { title, items, placement, role: 'menu', ...extra });
+    // The account menu reads the kept rows and asks again by itself (asst-account-menu.js).
+    if (field === 'account') {
+      if (!ACCOUNT_PROVIDERS.has(brain.provider)) return;
+      if (!_warmProviders.has(brain.provider)) {
+        anchor.setAttribute('aria-busy', 'true');
+        try { await ensureLoaded(brain.provider); } finally { anchor.removeAttribute('aria-busy'); }
+        if (destroyed || !anchor.isConnected) return;
+      } else {
+        ensureLoaded(brain.provider).catch(() => {});
+      }
+      // Kept inside the panel that holds the anchor (the sidepanel, or the tab's own root).
+      openAccountMenu(anchor, accountMenu(brain, anchor.closest?.('.assistant-panel') || anchor.closest?.('.asst-root') || null));
+      return;
+    }
+    // Everything else needs the provider catalog — load it lazily on first open. Once it is loaded the menu
+    // opens from what is kept, the lists are read again in the background, and an open menu they change is
+    // redrawn in place (the filter, the scroll and the focus stay).
+    const warm = _warmProviders.has(brain.provider);
+    if (!warm) {
+      anchor.setAttribute('aria-busy', 'true');
+      try { await ensureLoaded(brain.provider); } finally { anchor.removeAttribute('aria-busy'); }
+      if (destroyed || !anchor.isConnected) return;
+    }
+    let shown = null;
+    drawField(field, brain, (title, items, extra = {}) => {
+      const opened = openMenu(anchor, { title, items, placement, role: 'menu', ...extra });
+      shown = opened ? { opened, items } : null;
+      return opened;
+    }, { anchor, restoreFocus });
+    if (warm && shown) {
+      ensureLoaded(brain.provider).then(() => {
+        if (destroyed || !shown || currentMenu() !== shown.opened.el || !anchor.isConnected) return;
+        let fresh = null;
+        drawField(field, currentBrain(), (_title, items) => { fresh = items; return null; }, { anchor, restoreFocus });
+        if (fresh && menuItemsSignature(fresh) !== menuItemsSignature(shown.items)) shown.opened.update({ items: fresh, keepPlace: true });
+      }).catch(() => {});
+    }
+  }
 
+  // The menu of one field, from the lists as they are kept now: `menu(title, items, extra)` opens it (or, for a
+  // redraw, only takes the items).
+  function drawField(field, brain, menu, { anchor, restoreFocus = false } = {}) {
     if (field === 'effort') {
       if (brain.provider === 'opencode') {
         const agents = getCachedOpencodeAgents();
@@ -1070,13 +1192,6 @@ export function createBrainPicker(host, hooks = {}) {
       return;
     }
 
-    if (field === 'account') {
-      if (!ACCOUNT_PROVIDERS.has(brain.provider)) return;
-      // Kept inside the panel that holds the anchor (the sidepanel, or the tab's own root).
-      openAccountMenu(anchor, accountMenu(brain, anchor.closest?.('.assistant-panel') || anchor.closest?.('.asst-root') || null));
-      return;
-    }
-
     if (field === 'project') {
       const actor = anchor === heroProject ? heroProjectMascot : null;
       const pick = project => {

package/neural-interface/public/shared/assistant/asst-composer.js

@@ -204,7 +204,7 @@ export function createComposer(hostEl, hooks = {}) {
   function renderAttachments() {
     const chips = [];
     state.images.forEach((img, i) => {
-      chips.push(`<span class="asst-chip static" data-kind="image" data-idx="${i}"><img src="data:${esc(img.mediaType)};base64,${img.base64}" alt=""><span class="asst-chip-text">${esc(img.name || 'image')}</span><button type="button" class="asst-chip-x" aria-label="${esc(t('common.remove', 'Remove'))}">${ICON_X}</button></span>`);
+      chips.push(`<span class="asst-chip static" data-kind="image" data-idx="${i}"><img src="data:${esc(img.mediaType)};base64,${esc(img.base64)}" alt=""><span class="asst-chip-text">${esc(img.name || 'image')}</span><button type="button" class="asst-chip-x" aria-label="${esc(t('common.remove', 'Remove'))}">${ICON_X}</button></span>`);
     });
     state.files.forEach((f, i) => {
       chips.push(`<span class="asst-chip static" data-kind="file" data-idx="${i}"><span class="asst-chip-text">${esc(f.name)}</span><span class="asst-chip-meta">${esc(Math.ceil(f.content.length / 1024))}k</span><button type="button" class="asst-chip-x" aria-label="${esc(t('common.remove', 'Remove'))}">${ICON_X}</button></span>`);

package/neural-interface/public/shared/assistant/asst-hosts.js

@@ -54,7 +54,7 @@ export function describeBrainFallback(fallback) {
 }
 
 /**
- * deps: { api: { list(), get(id), create({brain,label,fallback}) },
+ * deps: { api: { list(), get(id), create({brain,label,fallback,draft}), remove?(id) },
  *         isBlocked() → bool, toast(text), storedBrain() → brain|null,
  *         fallbackText(session.fallback) → text, defaultHost: 'terminal' }
  */
@@ -149,7 +149,9 @@ export function createAssistantHosts({
       try {
         // A model disabled since it was picked (Assistant → Models) must not
         // lock the Assistant out: the server starts on its enabled stand-in.
-        res = await api.create({ brain: b, label: label || undefined, fallback: true });
+        // A draft: the server stores and lists it from its first prompt on (a prompt
+        // given here is that prompt); closed or left unused, nothing of it remains.
+        res = await api.create({ brain: b, label: label || undefined, fallback: true, draft: true });
       } catch (err) {
         say(`Assistant unavailable: ${err?.message || err}`);
         return null;
@@ -245,6 +247,48 @@ export function createAssistantHosts({
     return true;
   }
 
+  /**
+   * A session nobody chatted in that the user left (they picked another one in its Sessions menu):
+   * its tab closes the way the user closes one, and the server removes it (it holds no conversation).
+   */
+  function discard(sessionId) {
+    const owner = ownerOf(sessionId);
+    if (last?.sessionId === sessionId) last = null;
+    if (!owner) return false;
+    adapters.get(owner).close(sessionId, { closeServer: true });
+    return true;
+  }
+
+  /**
+   * The Sessions menu's Remove: the server stops the session's running turn and workers and purges it,
+   * then its tab closes wherever it is open (other windows: the session-ended broadcast). `fresh`: it is
+   * the session showing where the user asked, and the host that has it gets a new one first, as New does
+   * (a host is never left empty in between). → { ok: true, stoppedRuns } | { ok: false, error }
+   */
+  async function remove(sessionId, { host = null, fresh = false, brain = null } = {}) {
+    if (!sessionId || !api.remove) return { ok: false, error: 'unavailable' };
+    if (isBlocked()) return { ok: false, error: 'blocked' };
+    if (fresh) { try { await open({ host: host || ownerOf(sessionId), brain }); } catch { /* the removal goes on */ } }
+    let res = null;
+    try { res = await api.remove(sessionId); }
+    catch (err) { return { ok: false, error: err?.message || String(err) }; }
+    ended(sessionId);
+    return { ok: true, stoppedRuns: Array.isArray(res?.stoppedRuns) ? res.stoppedRuns : [] };
+  }
+
+  /**
+   * The server no longer has a session a host shows (a draft it dropped, a restart before its first
+   * prompt, a removal this page missed): its tab closes, and with `fresh` (it was showing and had
+   * no conversation) a new session takes its place in the host that had it, so the user never sees a dead tab.
+   */
+  async function gone(sessionId, { host = null, fresh = false, brain = null } = {}) {
+    if (!sessionId) return null;
+    let opened = null;
+    if (fresh && !isBlocked()) { try { opened = await open({ host: host || ownerOf(sessionId), brain }); } catch { opened = null; } }
+    ended(sessionId);
+    return opened;
+  }
+
   return {
     register,
     ownerOf,
@@ -253,6 +297,9 @@ export function createAssistantHosts({
     toggle,
     show,
     ended,
+    discard,
+    remove,
+    gone,
     noteFocus,
     fetchLive,
     isLive: isAssistantSessionLive,

package/neural-interface/public/shared/assistant/asst-menu.js

@@ -31,6 +31,10 @@
 //   tag             { label }                        → non-interactive badge row
 //   input           { placeholder, value, onSubmit } → inline text field
 //   buttons         { label, buttons: [item…] }      → one row of compact items (a group)
+// `action: { icon, label, tooltip, id, onSelect }` on an item (or radio / check) adds one icon button at the
+// row's end, shown on hover and keyboard focus (the Sessions menu's Remove). It is not a stop of ↑/↓: → from
+// its row reaches it, ← goes back, Delete on the row presses it; choosing it never chooses the row and leaves
+// the menu open (its onSelect usually redraws it with update()).
 // `render(button, { checked })` on an item draws its content instead of label/desc/tag.
 // `className` on an item or an info row adds its own class.
 // `keepOpen` on an item leaves the menu open when it is chosen.
@@ -38,7 +42,7 @@
 // Keys: ↑/↓ move, Home/End jump, Enter/Space activate, Esc closes (focus back
 // to the anchor), Tab closes. The optional filter hides non-matching items and
 // any group left empty. The handle's update({ title, items, footer, focus }) redraws
-// an open menu in place (focus: the data-id to land on).
+// an open menu in place (focus: the data-id to land on; the filter's text still applies).
 
 let _open = null;
 let _uid = 0;
@@ -101,6 +105,11 @@ export function currentMenu() {
   return _open?.menu || null;
 }
 
+/** The element the open menu belongs to (null when none is open). */
+export function currentMenuAnchor() {
+  return _open?.anchor || null;
+}
+
 function itemButton(item, kind, { role, list, onActivate }) {
   const btn = el('button', `asst-dd-item${item.danger ? ' danger' : ''}${item.className ? ` ${item.className}` : ''}`);
   btn.type = 'button';
@@ -145,12 +154,28 @@ function itemButton(item, kind, { role, list, onActivate }) {
   return btn;
 }
 
+/** A row's own action (item.action): an icon button beside the row, outside the ↑/↓ cycle. */
+function actionButton(action, item, { role }) {
+  const btn = el('button', `asst-iconbtn asst-dd-item-action${action.className ? ` ${action.className}` : ''}`);
+  btn.type = 'button';
+  btn.tabIndex = -1;
+  btn.setAttribute('role', role === 'listbox' ? 'option' : 'menuitem');
+  if (action.id != null) btn.dataset.id = String(action.id);
+  const label = String(action.label || '');
+  if (label) btn.setAttribute('aria-label', label);
+  if (action.tooltip || label) btn.dataset.tooltip = action.tooltip || label;
+  btn.innerHTML = action.icon || '';
+  btn.querySelector('svg')?.setAttribute('aria-hidden', 'true');
+  btn.addEventListener('click', (e) => { e.stopPropagation(); action.onSelect?.(item, btn); });
+  return btn;
+}
+
 function buildItems(list, items, { role, onActivate }) {
   for (const item of items || []) {
     const kind = itemKind(item);
     if (kind === 'separator') { list.appendChild(el('div', 'asst-dd-sep')).setAttribute('role', 'separator'); continue; }
     if (kind === 'buttons') {
-      const row = el('div', 'asst-dd-btnrow');
+      const row = el('div', `asst-dd-btnrow${item.className ? ` ${item.className}` : ''}`);
       row.setAttribute('role', 'group');
       if (item.id != null) row.dataset.id = String(item.id);
       if (item.ariaLabel || item.label) row.setAttribute('aria-label', item.ariaLabel || item.label);
@@ -188,6 +213,14 @@ function buildItems(list, items, { role, onActivate }) {
       list.appendChild(input);
       continue;
     }
+    if (item.action && typeof item.action === 'object' && !item.disabled) {
+      const row = el('div', 'asst-dd-itemrow');
+      row.setAttribute('role', 'none');
+      row.appendChild(itemButton(item, kind, { role, list, onActivate }));
+      row.appendChild(actionButton(item.action, item, { role }));
+      list.appendChild(row);
+      continue;
+    }
     list.appendChild(itemButton(item, kind, { role, list, onActivate }));
   }
   if (!list.querySelector('.asst-dd-item, .asst-dd-input, .asst-dd-info, .asst-dd-tagrow')) list.appendChild(el('div', 'asst-dd-empty', '—'));
@@ -199,6 +232,8 @@ export function applyMenuFilter(list, query, emptyLabel = 'No matches') {
   const rows = [...list.children];
   for (const row of rows) {
     if (row.classList.contains('asst-dd-item')) row.hidden = !!q && !row.dataset.search.includes(q);
+    // A row with its own action: shown while its item matches.
+    else if (row.classList.contains('asst-dd-itemrow')) row.hidden = !!q && !(row.querySelector('.asst-dd-item')?.dataset.search || '').includes(q);
     // A button row stays whole: shown while one of its buttons matches.
     else if (row.classList.contains('asst-dd-btnrow')) row.hidden = !!q && ![...row.querySelectorAll('.asst-dd-item')].some(b => b.dataset.search.includes(q));
     else if (row.classList.contains('asst-dd-info') || row.classList.contains('asst-dd-tagrow')) row.hidden = !!q;
@@ -226,7 +261,7 @@ export function applyMenuFilter(list, query, emptyLabel = 'No matches') {
   const last = visible[visible.length - 1];
   if (last?.classList.contains('asst-dd-sep')) last.hidden = true;
   let empty = list.querySelector('.asst-dd-empty.asst-dd-noresults');
-  const hasItem = rows.some(r => !r.hidden && (r.classList.contains('asst-dd-item') || r.classList.contains('asst-dd-btnrow') || r.classList.contains('asst-dd-input')));
+  const hasItem = rows.some(r => !r.hidden && (r.classList.contains('asst-dd-item') || r.classList.contains('asst-dd-itemrow') || r.classList.contains('asst-dd-btnrow') || r.classList.contains('asst-dd-input')));
   if (q && !hasItem) {
     if (!empty) { empty = el('div', 'asst-dd-empty asst-dd-noresults', emptyLabel); list.appendChild(empty); }
     empty.hidden = false;
@@ -422,7 +457,9 @@ export function openMenu(anchor, opts = {}) {
     const target = e.target;
     const inInput = target?.classList?.contains('asst-dd-input');
     const nodes = focusables(menu);
-    const idx = nodes.indexOf(document.activeElement);
+    // On a row's action (item.action) the keys move from its row.
+    const onAction = document.activeElement?.classList?.contains('asst-dd-item-action') && menu.contains(document.activeElement) ? document.activeElement : null;
+    const idx = nodes.indexOf(onAction ? onAction.previousElementSibling : document.activeElement);
     if (e.key === 'Escape') {
       e.preventDefault(); e.stopPropagation();
       if (typeof opts.onEscape === 'function' && opts.onEscape() === true) return;
@@ -447,6 +484,18 @@ export function openMenu(anchor, opts = {}) {
       setFocused(menu, nodes[next]);
       return;
     }
+    if (!inInput && (e.key === 'ArrowRight' || e.key === 'ArrowLeft' || e.key === 'Delete')) {
+      const row = onAction ? null : document.activeElement?.closest?.('.asst-dd-item');
+      const action = onAction || (row?.parentElement?.classList.contains('asst-dd-itemrow') ? row.nextElementSibling : null);
+      if (action?.classList.contains('asst-dd-item-action')) {
+        e.preventDefault(); e.stopPropagation();
+        const main = action.previousElementSibling;
+        if (e.key === 'ArrowLeft') { if (onAction) setFocused(menu, main); return; }
+        if (!onAction) { setFocused(menu, main); try { action.focus({ preventScroll: true }); } catch { action.focus(); } }
+        if (e.key === 'Delete') action.click();
+        return;
+      }
+    }
     if ((e.key === 'Home' || e.key === 'End') && !inInput) {
       e.preventDefault(); e.stopPropagation();
       if (nodes.length) setFocused(menu, nodes[e.key === 'Home' ? 0 : nodes.length - 1]);
@@ -464,6 +513,7 @@ export function openMenu(anchor, opts = {}) {
       return;
     }
     if ((e.key === 'Enter' || e.key === ' ') && !inInput) {
+      if (onAction) { e.preventDefault(); e.stopPropagation(); onAction.click(); return; }
       const current = document.activeElement?.closest?.('.asst-dd-item');
       if (current && menu.contains(current)) { e.preventDefault(); e.stopPropagation(); current.click(); }
       return;
@@ -499,14 +549,35 @@ export function openMenu(anchor, opts = {}) {
     setFocused(menu, selected || first || null);
   }
   // Redraw in place (another view of the same menu): the anchor, the listeners and the focus stay in it.
+  // `keepPlace` (fresher data for the same view, read in the background): the scroll position, the row the
+  // keyboard is on and the filter's text and focus are left where the user had them.
   const update = (next = {}) => {
     if (!_open || _open.menu !== menu) return;
+    const keep = next.keepPlace === true;
+    const scrollBefore = list.scrollTop;
+    const active = document.activeElement;
+    const typing = !!active && active.classList?.contains('asst-dd-input') && menu.contains(active);
+    const onRowId = !typing ? (menu.querySelector('.asst-dd-item.focused')?.dataset?.id ?? null) : null;
     if (typeof next.title === 'string' && heading) heading.textContent = next.title;
-    if (Array.isArray(next.items)) { list.replaceChildren(); buildItems(list, next.items, { role, onActivate: activate }); list.scrollTop = 0; }
+    if (Array.isArray(next.items)) {
+      list.replaceChildren();
+      buildItems(list, next.items, { role, onActivate: activate });
+      if (filterInput?.value) applyMenuFilter(list, filterInput.value, opts.filterEmptyLabel);
+      list.scrollTop = keep ? scrollBefore : 0;
+    }
     if ('footer' in next) fillFooter(next.footer);
     place();
-    const wanted = next.focus != null ? [...menu.querySelectorAll('.asst-dd-item')].find(n => n.dataset.id === String(next.focus) && !n.disabled) : null;
+    if (keep && typing) {
+      // The input keeps the caret; the row highlight follows the selection as it did when it opened.
+      menu.querySelectorAll('.asst-dd-item.focused').forEach(n => n.classList.remove('focused'));
+      list.querySelector('.asst-dd-item[data-checked="1"]:not([disabled])')?.classList.add('focused');
+      return;
+    }
+    const keptRow = keep && onRowId != null ? [...menu.querySelectorAll('.asst-dd-item')].find(n => n.dataset.id === onRowId && !n.disabled) : null;
+    const wanted = keptRow || (next.focus != null ? [...menu.querySelectorAll('.asst-dd-item')].find(n => n.dataset.id === String(next.focus) && !n.disabled) : null);
+    if (keep && !keptRow && !menu.contains(document.activeElement)) return; // focus is elsewhere: not taken back
     setFocused(menu, wanted || list.querySelector('.asst-dd-item[data-checked="1"]:not([disabled])') || focusables(menu)[0] || null);
+    if (keep) list.scrollTop = scrollBefore;
   };
   return { el: menu, list, close: closeMenu, reposition: place, update };
 }