synabun 2.0.9 → 2.1.0

package/neural-interface/public/shared/cdx/cdx-tabs.js

@@ -1,3 +1,4 @@
+import { cxpText, cxpSessionLabel } from './cdx-copy.js';
 import { mountCodexSettings } from './cdx-settings.js';
 import { t } from '../i18n.js';
 import { getCliState, isCliInstalling } from '../cli-status.js';
@@ -15,6 +16,7 @@ import '../account-i18n.js';
 import { restoreMcpAppCards, teardownMcpApps, retireMcpAppNode, stripMcpAppRuntime } from './cdx-mcp-app-host.js';
 import { renderTurnDiff, completeTurnOutputs } from './cdx-render.js';
 import { hydrateOutputControls } from './cdx-output.js';
+import { sanitizeStoredHtml } from '../assistant/asst-sanitize.js';
 import {
   beginPlanTurn, capturePlanItem, finishPlanTurn, getPlanMarkdown, syncPlanMirrors, recordPlanTurn,
   migrateLegacyPlan, recoverPlanFromHistory, planBelongsToTab, useMessageAsPlan,
@@ -30,6 +32,7 @@ import {
 } from '../agent-runtime-options.js';
 import { CodexModelCatalog, codexModelAccountKey, codexContextAvailability } from './cdx-model-catalog.js';
 import { nativeLoopWindowId } from '../ui-native-window-id.js';
+import { skillHintEntries, skillsForPrompt, skillsListRequest } from './cdx-skill-hints.js';
 import { syncSidepanelLayout, focusSidepanel, isHostedSessionFocused } from '../ui-sidepanel-windows.js';
 import { notify, NOTIF_TYPE } from '../ui-notifications.js';
 import { createStickyScrollController } from '../ui-scroll-follow.js';
@@ -297,7 +300,6 @@ function buildWsCallbacks(tab, options = {}) {
           userVerification: true,
           windowId: windowId,
           accountId: _accountId || 'default',
-          mcpProfile: tab.mcpProfile || null,
           ...codexRuntimeSelection(tab),
         });
       } else {
@@ -309,7 +311,6 @@ function buildWsCallbacks(tab, options = {}) {
           threadId: _threadId || null,
           cwd: _project || null,
           accountId: _accountId || 'default',
-          mcpProfile: tab.mcpProfile || null,
           ...codexRuntimeSelection(tab),
         });
       }
@@ -368,7 +369,6 @@ function buildWsCallbacks(tab, options = {}) {
           _accountId = msg.accountId;
           if (_boundTab) _boundTab.accountId = _accountId;
         }
-        if (msg.mcpProfile && _boundTab) _boundTab.mcpProfile = msg.mcpProfile;
         // A reattached app-server can still have a different process-active
         // thread. Preserve the tab's displayed thread instead of adopting it.
         _threadId = _threadId || msg.threadId || null;
@@ -378,6 +378,9 @@ function buildWsCallbacks(tab, options = {}) {
           if (_boundTab) _boundTab.running = true;
           setStatus('Resuming…', 'working');
           resetStallTimer();
+          // The turn it found is still at work: so is the tab's pill (the panel may be hidden, the tab in the background).
+          updateTrayPillRunning();
+          renderPills();
         } else if (msg.running === false && (!msg.threadId || String(msg.threadId) === String(_threadId || ''))) {
           // A plan can finish while disconnected. The server's idle reply
           // releases the stale running/query state before history recovery.
@@ -391,7 +394,6 @@ function buildWsCallbacks(tab, options = {}) {
           threadId: _threadId || null,
           cwd: _project || null,
           accountId: _accountId || 'default',
-          mcpProfile: tab.mcpProfile || null,
           ...codexRuntimeSelection(tab),
         });
       } else {
@@ -404,7 +406,6 @@ function buildWsCallbacks(tab, options = {}) {
           threadId: _threadId || null,
           cwd: _project || null,
           accountId: _accountId || 'default',
-          mcpProfile: tab.mcpProfile || null,
           ...codexRuntimeSelection(tab),
         });
       }
@@ -422,10 +423,6 @@ function buildWsCallbacks(tab, options = {}) {
       restoreMcpAppCards(_messagesEl, { tab: _boundTab, items: _items, request: requestSocketPayloadForTab, draft: setMcpAppDraft });
       if (_boundTab) _boundTab.bootstrapped = true;
       ensureCodexTerminalAuth(tab);
-      if (msg.mcpProfile && _boundTab) {
-        _boundTab.mcpProfile = msg.mcpProfile;
-        if (activeTab() === _boundTab) _onActiveTabChanged?.(_boundTab);
-      }
       if (Object.prototype.hasOwnProperty.call(msg, 'threadId')) {
         _threadId = msg.threadId || null;
         if (_boundTab) _boundTab.threadId = _threadId;
@@ -589,20 +586,17 @@ function buildWsCallbacks(tab, options = {}) {
     },
 
     onInterruptAck(msg) {
-      _running = false;
-      _activeTurnId = null;
-      if (_boundTab) {
-        _boundTab.running = false;
-        _boundTab.activeTurnId = null;
-        if (_boundTab._abortRetry) {
-          clearTimeout(_boundTab._abortRetry);
-          _boundTab._abortRetry = null;
-        }
+      if (_boundTab?._abortRetry) {
+        clearTimeout(_boundTab._abortRetry);
+        _boundTab._abortRetry = null;
       }
       clearInterruptTimer();
-      stopStallTimer();
+      // A prompt sent after the Stop has a turn of its own: the ack is not about it.
+      if (!interruptAckEndsTurn(_boundTab)) return;
+      // The stopped turn is over: the tab, its pill and the saved tabs say so (setRunning), even
+      // when something marked it working again before the ack came back.
+      setRunning(false);
       setStatus('Interrupted', 'muted');
-      syncInputEnabled();
       syncSessionControls();
       releaseInactiveIdleTab(_boundTab);
     },
@@ -693,11 +687,6 @@ function buildWsCallbacks(tab, options = {}) {
         }
         renderStatusChrome();
       }
-      if (msg.type === 'mcp_profile_changed' && msg.profile) {
-        if (_boundTab) _boundTab.mcpProfile = msg.profile;
-        if (activeTab() === _boundTab) _onActiveTabChanged?.(_boundTab);
-        saveTabs();
-      }
       if (msg.type === 'mcp_approval_updated' && msg.name) {
         const server = _mcpServers.get(msg.name);
         if (server) {
@@ -847,6 +836,9 @@ let _interruptRetried = false;
 let _prevInputTokens = 0;
 let _skillsCache = null;
 let _skillsPromise = null;
+// A skills:changed arrived since the list was last read: the next skills_list asks the app-server to reload its skills
+// (cdx-skill-hints.js skillsListRequest).
+let _skillsChanged = false;
 let _blockingServerRequests = new Map();
 let _bufferedSocketMessages = [];
 
@@ -959,6 +951,7 @@ function rememberBlockingServerRequest(requestId, method, params = {}) {
   if (_boundTab) _boundTab.blockingServerRequests = _blockingServerRequests;
   syncWorkStatus();
   syncInputEnabled();
+  updateTrayPillRunning(); // the pill needs you
   saveTabs();
 }
 
@@ -968,6 +961,7 @@ function clearBlockingServerRequest(requestId, { flushBuffered = true } = {}) {
   if (_boundTab) _boundTab.blockingServerRequests = _blockingServerRequests;
   syncWorkStatus();
   syncInputEnabled();
+  updateTrayPillRunning();
   saveTabs();
   if (flushBuffered && !hasBlockingServerRequests()) flushBufferedSocketMessages();
   releaseInactiveIdleTab(_boundTab);
@@ -985,6 +979,7 @@ function clearAllBlockingServerRequests() {
   }
   syncWorkStatus();
   syncInputEnabled();
+  updateTrayPillRunning();
 }
 
 function shouldBufferSocketMessage(kind, payload) {
@@ -1064,6 +1059,11 @@ function applySocketError(msg) {
 
 function applySocketClosed() {
   appendSystem('Codex session closed', 'muted');
+  // The app-server ran the turn: it exited, the turn went with it (the server forgot it too).
+  if (_running) {
+    setRunning(false);
+    setStatus('Codex session closed', 'muted');
+  }
 }
 
 function applyBufferedSocketMessage(entry) {
@@ -1459,7 +1459,7 @@ let _hljs = null;
 
 (async () => {
   try {
-    const mod = await import('https://cdn.jsdelivr.net/npm/marked@14/lib/marked.esm.js').catch(() => null);
+    const mod = await import('/vendor/marked/marked-14.1.4.esm.js').catch(() => null);
     if (mod) {
       _marked = mod.marked || mod.default;
       if (_marked?.setOptions) _marked.setOptions({ breaks: true, gfm: true });
@@ -1471,10 +1471,10 @@ let _hljs = null;
   try {
     const link = document.createElement('link');
     link.rel = 'stylesheet';
-    link.href = 'https://cdn.jsdelivr.net/npm/highlight.js@11/styles/github-dark-dimmed.min.css';
+    link.href = '/vendor/highlight/github-dark-dimmed-11.12.0.min.css';
     document.head.appendChild(link);
     const script = document.createElement('script');
-    script.src = 'https://cdn.jsdelivr.net/npm/highlight.js@11/lib/highlight.min.js';
+    script.src = '/vendor/highlight/highlight-11.12.0.min.js';
     script.onload = () => { _hljs = window.hljs || null; };
     document.head.appendChild(script);
   } catch {}
@@ -1852,14 +1852,19 @@ async function restoreCanonicalPlan(tab, thread) {
 }
 
 // ── Formatting & helpers (lines 1148-1421) ──
+function codexStatusText(status) {
+  const known = {"pending": "pending", "completed": "completed", "complete": "complete", "inProgress": "in progress", "failed": "failed", "declined": "declined"};
+  return Object.hasOwn(known, status) ? cxpText(`status_${status}`, known[status]) : status;
+}
+
 export function formatStatus(status) {
-  if (!status) return 'pending';
-  if (typeof status === 'string') return status;
+  if (!status) return codexStatusText('pending');
+  if (typeof status === 'string') return codexStatusText(status);
   if (typeof status === 'object') {
     const [key, val] = Object.entries(status)[0] || [];
-    if (!key) return 'pending';
-    if (val && typeof val === 'object' && val.message) return `${key}: ${val.message}`;
-    return key;
+    if (!key) return codexStatusText('pending');
+    if (val && typeof val === 'object' && val.message) return `${codexStatusText(key)}: ${val.message}`;
+    return codexStatusText(key);
   }
   return String(status);
 }
@@ -2417,14 +2422,26 @@ export function restoreActiveBinding(fallbackState) {
   else restoreBoundState(fallbackState);
 }
 
+// How many withTab calls are under way. The outermost one hands the binding back to the active tab; a
+// nested one hands it back to the tab the call around it bound, with what that call had done so far
+// written to it first. (The history of a tab in the background renders while another tab is shown, and
+// a nested withTab in it used to leave the rest of that history to the shown tab: its held approvals
+// were looked up there and never came back.)
+let _withTabDepth = 0;
+
 export function withTab(tab, fn) {
   const prev = snapshotBoundState();
+  const outer = _withTabDepth > 0 ? _boundTab : null;
+  if (outer) commitBoundState();
+  _withTabDepth += 1;
   bindTabState(tab);
   try {
     return fn();
   } finally {
     commitBoundState();
-    restoreActiveBinding(prev);
+    _withTabDepth -= 1;
+    if (outer) bindTabState(outer);
+    else restoreActiveBinding(prev);
   }
 }
 
@@ -2436,10 +2453,10 @@ export function setSessionLabel(label, { persist = true } = {}) {
   }
   if (isActiveTab(_boundTab)) {
     const labelEl = panelEl('#cxp-session-label');
-    if (labelEl) labelEl.replaceChildren(document.createTextNode(_sessionLabel));
+    if (labelEl) labelEl.replaceChildren(document.createTextNode(cxpSessionLabel(_sessionLabel)));
     // The whole name, for when the header shows only part of it.
     const sessionBtn = panelEl('#cxp-session-btn');
-    if (sessionBtn) sessionBtn.title = _sessionLabel;
+    if (sessionBtn) sessionBtn.title = cxpSessionLabel(_sessionLabel);
     syncLegacyState();
   }
   updateTrayPillLabel();
@@ -2487,6 +2504,11 @@ function scheduleCodexTitleReassert(tab) {
 
 function applyCodexProviderTitle(title) {
   const tab = _boundTab;
+  // Dispatch metadata owns the panel label; reading history must never rename the provider thread.
+  if (tab?.automationRunId) {
+    setSessionLabel(tab.automationTitle || tab.sessionLabel);
+    return;
+  }
   const incoming = normalizeSessionLabel(title || '');
   const desiredTitle = normalizeSessionLabel(tab?.pendingSessionLabel || tab?.sessionLabel || '');
   const authoritative = tab
@@ -2676,12 +2698,16 @@ function createTrayPill(tab) {
 export function renderPills() {
   const active = activeTab();
   for (const tab of _tabs) {
-    if (!tab.pillEl?.isConnected) tab.pillEl = createTrayPill(tab);
+    if (!tab.pillEl?.isConnected) {
+      tab.pillEl = createTrayPill(tab);
+      // The bound tab's own reference too, or its running state would go on reaching the old node.
+      if (tab === _boundTab) _trayPill = tab.pillEl;
+    }
     if (!tab.pillEl) continue;
     // Read directly from tab to avoid nested withTab clobbering uncommitted state
     const label = tab.pillEl.querySelector('.term-minimized-pill-label');
     if (label) label.textContent = tab.sessionLabel || 'New session';
-    tab.pillEl.classList.toggle('cxp-pill-running', !!(tab.running || tab.startingThread));
+    paintTrayPill(tab.pillEl, tab);
     const shouldShow = hasMeaningfulTrayState(tab) && (!_getVisible() || tab !== active);
     tab.pillEl.style.display = shouldShow ? '' : 'none';
   }
@@ -2763,7 +2789,6 @@ export function createTab(saved = {}, { autoSwitch = true } = {}) {
   const inheritedAccountId = saved.accountId ?? activeTab()?.accountId ?? 'default';
   const inheritedEffort = saved.effort ?? activeTab()?.effort ?? (storage.getItem(STOR.effort) || 'off');
   const inheritedAutoAccept = codexNewTabAutoAccept(saved, activeTab(), storedAutoAccept());
-  const inheritedMcpProfile = saved.mcpProfile ?? null;
   const automationRunId = saved.automationRunId || null;
   const inheritedPlanMode = automationRunId ? false : (saved.planMode ?? activeTab()?.planMode ?? false);
   const hasExplicitTitle = !!title && !['new session', 'saved session', 'untitled session', 'codex'].includes(title.toLowerCase());
@@ -2791,7 +2816,6 @@ export function createTab(saved = {}, { autoSwitch = true } = {}) {
     extendedContextVerificationArmed: false,
     effort: inheritedEffort,
     autoAccept: inheritedAutoAccept,
-    mcpProfile: inheritedMcpProfile,
     planMode: inheritedPlanMode,
     sessionListRequest: null,
     threadStartRequest: null,
@@ -2873,7 +2897,9 @@ export function createTab(saved = {}, { autoSwitch = true } = {}) {
     isolationRejections: {},
     ownedThreadIds: new Set(),
     automationRunId,
+    automationTitle: automationRunId ? (saved.automationTitle || title || '') : '',
     automationActive: !!saved.automationActive,
+    automationAwaits: false, // the run's turn ended asking the user (runAwaitsAnswer, set by its attach): the pill needs you
     automationOwnerId: saved.automationOwnerId || null,
     releasedRunId: automationRunId ? null : (saved.releasedRunId || null),
   };
@@ -3013,7 +3039,6 @@ export function saveTabs() {
           contextMode: normalizeCodexContextMode(tab.contextMode),
           effort: tab.effort || 'off',
           autoAccept: !!tab.autoAccept,
-          mcpProfile: tab.mcpProfile || null,
           planMode: !!tab.planMode,
           planFilePath: tab.planFilePath || '',
           planContent: tab.planContent || '',
@@ -3036,9 +3061,17 @@ export function saveTabs() {
           postCompactionPending: tab.postCompactionPromptSource === 'manual' && !!tab.postCompactionPending,
           postCompactionPromptSource: tab.postCompactionPromptSource === 'manual' ? 'manual' : '',
           automationRunId: tab.automationRunId || null,
+          automationTitle: tab.automationTitle || '',
           automationActive: !!tab.automationActive,
           automationOwnerId: tab.automationOwnerId || null,
           releasedRunId: tab.releasedRunId || null,
+          // Whether it was working when this was written: after a reload its placeholder pill says so and
+          // the panel boots to ask (ui-sidepanel-tray.js), and the tab reattaches at once (restoreTabs).
+          // Never restored as running: only the reattach's answer says that. `needsYou`: an approval or a
+          // question card waited on the user; the reattach replays the request the bridge still holds.
+          running: !!tab.running,
+          startingThread: !!tab.startingThread,
+          needsYou: tab.blockingServerRequests?.size > 0 || !!tab.automationAwaits,
         };
       });
     const localRunIds = new Set(localTabs.map((tab) => tab.automationRunId).filter(Boolean));
@@ -3125,9 +3158,11 @@ export function restoreTabs() {
     if (raw) {
       const data = JSON.parse(raw);
       if (Array.isArray(data?.tabs) && data.tabs.length) {
+        const wereWorking = [];
         for (const saved of data.tabs) {
           if (saved.automationActive && saved.automationOwnerId !== nativeLoopWindowId) continue;
-          createTab(saved, { autoSwitch: false });
+          const tab = createTab(saved, { autoSwitch: false });
+          if (tab && !tab.automationRunId && (saved.running || saved.startingThread || saved.needsYou)) wereWorking.push(tab);
         }
         if (!_tabs.length) throw new Error('No restorable Codex tabs');
         _activeTabIdx = Math.min(Math.max(Number(data.activeIdx) || 0, 0), _tabs.length - 1);
@@ -3135,6 +3170,11 @@ export function restoreTabs() {
         if (!_tabs.length) throw new Error('No restorable Codex tabs');
         updateActiveTabView();
         saveTabs();
+        // A tab that was working when the page went away asks after its turn now, hidden or in the
+        // background (a restored tab reattaches first: its turn outlives the page on the server), so
+        // its pill says what the thread does. An idle one is let go again once it is ready
+        // (releaseInactiveIdleTab); idle tabs stay unconnected until they are shown.
+        for (const tab of wereWorking) if (_tabs.includes(tab) && !tab.ws) connectTab(tab);
         return;
       }
     }
@@ -3158,8 +3198,47 @@ export function updateTrayPillLabel() {
   if (label) label.textContent = _sessionLabel;
 }
 
+/**
+ * What a tab's tray pill says: it needs you while an approval or a question card waits on your answer
+ * (its blocking server requests), or, for a dispatched worker, while its turn ended asking you something
+ * (the run's outcome: automationAwaits), else it works while a turn runs or a thread is being made.
+ * sidepanel-session-status.js reads the same classes for a detached window's pill.
+ */
+function paintTrayPill(pill, { running, startingThread, blockingServerRequests, automationAwaits }) {
+  if (!pill) return;
+  const needsYou = blockingServerRequests?.size > 0 || !!automationAwaits;
+  pill.classList.toggle('cxp-pill-attention', needsYou);
+  pill.classList.toggle('cxp-pill-running', !needsYou && !!(running || startingThread));
+}
+
 export function updateTrayPillRunning() {
-  _trayPill?.classList.toggle('cxp-pill-running', !!(_running || _startingThread));
+  paintTrayPill(_trayPill, {
+    running: _running, startingThread: _startingThread, blockingServerRequests: _blockingServerRequests, automationAwaits: _boundTab?.automationAwaits,
+  });
+}
+
+/**
+ * The bound tab's work ended (or began) outside setRunning: the tab, its pill and the saved tabs say
+ * so now. The tab is written first: renderPills and saveTabs read it, never the bound copy, and a
+ * nested withTab binds the tab again from it (withTab itself writes it back only when it returns).
+ */
+function publishWorkState() {
+  if (_boundTab) {
+    _boundTab.running = _running;
+    _boundTab.startingThread = _startingThread;
+  }
+  updateTrayPillRunning();
+  renderPills();
+  saveTabs();
+}
+
+/**
+ * Whether a Stop's ack ends the tab's running state: not once a prompt was sent after that Stop
+ * (dispatchPrompt counts them, interruptTab notes the count it stopped at), whose turn is its own.
+ */
+function interruptAckEndsTurn(tab) {
+  if (!tab || tab.interruptedAtPrompt == null) return true;
+  return (tab.promptCount || 0) === tab.interruptedAtPrompt;
 }
 
 
@@ -3258,6 +3337,7 @@ export function clearTranscript(emptyText = freshThreadText()) {
   showEmpty(emptyText);
   setCompactingUI(false);
   renderStatusChrome();
+  updateTrayPillRunning(); // (its request cards went with the transcript)
 }
 
 export function renderStoredTranscript(snapshot, emptyText = freshThreadText()) {
@@ -3267,7 +3347,10 @@ export function renderStoredTranscript(snapshot, emptyText = freshThreadText())
 
   clearTranscript(emptyText);
   _messagesEl.querySelectorAll(':scope > .cxp-empty').forEach(node => node.remove());
-  _messagesEl.insertAdjacentHTML('beforeend', normalized.html);
+  // A snapshot is the transcript's own markup, saved and read back from storage, and a build before the panel
+  // sanitised its Markdown saved model HTML in it as it was: it is rebuilt from the stored-transcript allowlist
+  // (asst-sanitize.js, the sanitiser live output goes through) before it reaches the page.
+  _messagesEl.append(sanitizeStoredHtml(normalized.html));
   const acceptedItemIds = new Set(normalized.acceptedItemIds);
   const acceptedTurnIds = new Set(normalized.acceptedTurnIds);
   const restoredNodes = [..._messagesEl.children].filter((node) => (
@@ -3365,6 +3448,11 @@ export function resetThreadState({ tone = 'ready', preserveStatus = false } = {}
   _running = false;
   _startingThread = false;
   if (_boundTab) {
+    // On the tab at once: clearPlanHandoffState below binds the tab again (updatePostPlanTranscriptMeta's
+    // withTab), which read its old running state back over these and saved the reset tab as working.
+    _boundTab.running = false;
+    _boundTab.startingThread = false;
+    _boundTab.activeTurnId = null;
     _boundTab.ownedThreadIds = new Set();
     _boundTab.expectedThreadId = null;
     _boundTab.expectedThreadRequestId = null;
@@ -3385,8 +3473,7 @@ export function resetThreadState({ tone = 'ready', preserveStatus = false } = {}
   clearTranscript();
   syncInputEnabled();
   syncSessionControls();
-  renderPills();
-  saveTabs();
+  publishWorkState();
 }
 
 export function setActiveProject(projectPath, { reset = true, preserveStatus = false, tone = 'ready' } = {}) {
@@ -3433,7 +3520,7 @@ export function setThread(thread) {
   _freshThread = false;
   // History and a new thread carry the provider's name or, without one, the
   // first prompt. A name the user gave stays, and is sent to the provider again.
-  if (_boundTab?.titleByUser && hasCustomSessionLabel(_boundTab)) {
+  if (_boundTab?.automationRunId || (_boundTab?.titleByUser && hasCustomSessionLabel(_boundTab))) {
     applyCodexProviderTitle(getThreadLabel(thread, _sessionLabel || 'New session'));
   } else {
     setSessionLabel(getThreadLabel(thread, 'New session'));
@@ -3577,12 +3664,12 @@ async function startNewThread(tab = activeTab()) {
   } finally {
     if (!tab.closed) withTab(tab, () => {
       _startingThread = false;
+      // The tab first, then what reads it (the pill, the saved tabs, the toolbar): renderPills
+      // used to find it still starting and put the running class back on the pill.
+      publishWorkState();
       syncInputEnabled();
       syncToolbarState();
       syncSessionControls();
-      updateTrayPillRunning();
-      renderPills();
-      saveTabs();
       releaseInactiveIdleTab(tab);
     });
   }
@@ -4438,7 +4525,7 @@ export function promptNameNewSession() {
       <div class="cxp-name-modal-row">
         <label class="cxp-name-modal-label">Project</label>
         <select class="cxp-name-modal-select" data-role="project">
-          ${projectOptions.map(p => `<option value="${String(p.value).replace(/"/g, '&quot;')}">${p.label}</option>`).join('')}
+          ${projectOptions.map(p => `<option value="${esc(p.value)}">${esc(p.label)}</option>`).join('')}
         </select>
       </div>
       <div class="cxp-name-modal-row">
@@ -4476,7 +4563,8 @@ export function promptNameNewSession() {
       branchSel.innerHTML = '<option value="">(none)</option>';
       branchSel.disabled = true;
     } else {
-      branchSel.innerHTML = branches.map(b => `<option value="${b.replace(/"/g, '&quot;')}">${b}</option>`).join('');
+      // A branch name is the repository's (an agent can make one): text, never markup.
+      branchSel.innerHTML = branches.map(b => `<option value="${esc(b)}">${esc(b)}</option>`).join('');
       if (branchOriginal) branchSel.value = branchOriginal;
       branchSel.disabled = false;
     }
@@ -5052,6 +5140,10 @@ export function dispatchPrompt(prompt, { tab = activeTab(), images = null, paths
   };
   if (tab?.model) msg.model = tab.model;
   if (tab?.effort && tab.effort !== 'off') msg.effort = tab.effort;
+  // A native skill picked from the hints (SK-050): sent as Codex's own skill input, once.
+  const nativeSkills = skillsForPrompt(inputText, tab?.pendingSkill);
+  if (nativeSkills.length) msg.skills = nativeSkills;
+  if (tab) tab.pendingSkill = null;
   // A person's own turn: the greeting engine keeps when they were last here. The greeting this
   // tab opened with goes back once, with the first prompt of its new thread.
   msg.human = true;
@@ -5078,6 +5170,8 @@ export function dispatchPrompt(prompt, { tab = activeTab(), images = null, paths
   }
   if (tab) {
     tab.extendedContextVerificationArmed = normalizeCodexContextMode(tab.contextMode) === 'extended';
+    // A Stop's late ack must not end this prompt's turn (interruptAckEndsTurn).
+    tab.promptCount = (tab.promptCount || 0) + 1;
   }
   requestCodexSessionTitle(tab, inputText, {
     paths: [...pathList, ...mentionList.map((mention) => mention.path).filter(Boolean)],
@@ -5417,7 +5511,8 @@ export function handleNotify(method, params) {
           flushPostCompactionPrompt(_boundTab);
         }
         if (_boundTab?.providerTitleDirty) scheduleCodexTitleReassert(_boundTab);
-        if (!shouldHoldForPlanApproval(_boundTab)) advanceQueue();
+        // The queue of the tab whose turn this was, never the one on screen.
+        if (!shouldHoldForPlanApproval(tab)) advanceQueue(tab);
         releaseInactiveIdleTab(tab);
       }
       break;
@@ -5877,7 +5972,7 @@ export function syncToolbarState() {
     effortBtn.title = `Reasoning effort: ${selected?.label || effort}`;
     effortBtn.classList.toggle('active', effort !== 'off');
     const label = effortBtn.querySelector('.cxp-btn-label');
-    if (label) label.textContent = effort === 'off' ? 'Effort' : (selected?.label || effort);
+    if (label) label.textContent = effort === 'off' ? cxpText('effortLabel', 'Effort') : cxpText(`effort_${effort}`, selected?.label || effort);
     const dots = effortBtn.querySelectorAll('.cxp-effort-dots i');
     const litCount = Math.max(0, options.findIndex((option) => option.id === effort));
     dots.forEach((d, i) => d.classList.toggle('lit', i < litCount));
@@ -5908,7 +6003,7 @@ export function syncToolbarState() {
     contextBtn.disabled = !!(tab?.running || tab?.startingThread || tab?.compacting)
       || (mode !== 'extended' && !supportsExtended);
     const label = contextBtn.querySelector('.cxp-btn-label');
-    if (label) label.textContent = mode === 'extended' ? 'Extended' : 'Default';
+    if (label) label.textContent = mode === 'extended' ? cxpText('extended', 'Extended') : cxpText('default', 'Default');
     if (availability.reason) {
       contextBtn.title = availability.reason;
     } else if (mode !== 'extended') {
@@ -6130,6 +6225,7 @@ export function interruptTab(tab = activeTab()) {
       clearTimeout(tab._abortRetry);
       tab._abortRetry = null;
     }
+    tab.interruptedAtPrompt = tab.promptCount || 0;
     sendSocket({ type: 'interrupt', sessionId: tab.id, threadId });
     tab._abortRetry = setTimeout(() => {
       tab._abortRetry = null;
@@ -6160,6 +6256,7 @@ export function interruptAllTabs() {
     const ws = tab.ws;
     const threadId = tab.threadId || null;
     if (ws && ws.readyState === 1) {
+      tab.interruptedAtPrompt = tab.promptCount || 0;
       try {
         ws.send(JSON.stringify({
           type: 'interrupt',
@@ -6935,6 +7032,14 @@ export function steerActiveTurn() {
   return true;
 }
 
+/**
+ * Whether `tab` has a turn running. The bound tab's is the module's own state (the freshest: withTab
+ * writes it back to the tab only when it returns); any other tab's is its own.
+ */
+function tabTurnRunning(tab) {
+  return tab === _boundTab ? _running : !!tab?.running;
+}
+
 export function syncQueueTray() {
   const tab = activeTab();
   if (!tab) return;
@@ -6952,7 +7057,8 @@ export function syncQueueTray() {
   if (hint) {
     hint.textContent = count > 0
       ? `${count} message${count > 1 ? 's' : ''} queued${tab.queuePaused ? ' (paused)' : ''}. Enter steers. Tab queues the next turn.`
-      : _running
+      // The tab on screen's turn, not the bound tab's (a tab working in the background is bound while its events run).
+      : tabTurnRunning(tab)
         ? 'Enter steers the active turn. Tab queues the next turn. Shift+Enter inserts a newline.'
         : 'Enter sends. Shift+Enter inserts a newline.';
   }
@@ -7012,7 +7118,7 @@ export function toggleQueuePause() {
   if (!tab) return;
   tab.queuePaused = !tab.queuePaused;
   syncQueueTray();
-  if (!tab.queuePaused) advanceQueue();
+  if (!tab.queuePaused) advanceQueue(tab);
   saveTabs();
 }
 
@@ -7024,11 +7130,17 @@ export function clearQueue() {
   saveTabs();
 }
 
-export function advanceQueue() {
-  const tab = activeTab();
-  if (!tab || _running || tab.queuePaused || !tab.queue.length || hasBlockingServerRequests() || shouldHoldForPlanApproval(tab)) return;
+/**
+ * Send the next prompt queued in `tab`, the tab it was typed in, on that tab's own connection and
+ * thread: a background tab whose turn ends advances its own queue, never the one on screen (the
+ * module state is the bound tab's, so the tab is bound first).
+ */
+export function advanceQueue(tab = activeTab()) {
+  if (!tab || tab.closed) return false;
+  if (_boundTab !== tab) return withTab(tab, () => advanceQueue(tab));
+  if (_running || tab.queuePaused || !tab.queue?.length || hasBlockingServerRequests() || shouldHoldForPlanApproval(tab)) return false;
   const next = tab.queue.shift();
-  if (!next) return;
+  if (!next) return false;
   if (tab.planMode) {
     preparePlanModeTurn(tab);
   }
@@ -7040,13 +7152,19 @@ export function advanceQueue() {
     mentions: next.mentions || [],
     forcePlanModePrefix: tab.planMode,
   });
-  if (!sent) return;
+  if (!sent) {
+    // Not sent: it stays first in its tab's queue.
+    tab.queue.unshift(next);
+    syncQueueTray();
+    return false;
+  }
   // Render queued user message immediately with images
   if (queueImages?.length) {
     appendLocalUserMessage(next.text || '', queueImages);
     tab._pendingSendImages = queueImages;
   }
   syncQueueTray();
+  return true;
 }
 
 // ── Phase 2: Image attachments ──
@@ -7101,6 +7219,15 @@ export function renderImageStrip() {
 // ── Whiteboard "Send to Panel" — receive image via event bus ──
 // Any window or surface changed a Codex account (signed in or out, a key, its mode, renamed, added,
 // removed): the menu re-reads the list, and the tabs on that account re-check sign-in.
+// A skill was installed, removed or changed (Skills Studio, Settings, an agent): the app-server is asked to reload its
+// skills at once (it does not watch the folders itself), so the hints and the thread's skills are current before the
+// next "/" is typed.
+appOn('sync:skills:changed', () => {
+  _skillsCache = null; _skillsPromise = null; _skillsChanged = true;
+  if (!activeTab()) return;
+  _skillsPromise = loadSlashCommands().catch(() => {}).finally(() => { _skillsPromise = null; });
+});
+
 appOn('sync:codex:accounts-changed', (msg = {}) => {
   refreshCodexAccounts().catch(() => {});
   for (const tab of _tabs) if (!msg.accountId || serverAccountId(tab.accountId) === msg.accountId) void tab.terminalAuthView?.refresh();
@@ -7377,16 +7504,12 @@ export async function loadSlashCommands() {
     if (!tab) return commands;
     const capabilities = await getCodexCapabilities(tab);
     commands = codexCommandHints(capabilities);
-    const data = await requestSocketPayloadForTab(tab, 'skills_list', { cwds: tab.project ? [tab.project] : [] });
+    const reload = _skillsChanged;
+    const data = await requestSocketPayloadForTab(tab, 'skills_list', skillsListRequest(tab, reload));
+    if (reload) _skillsChanged = false;
     const seen = new Set(BUILTIN_SLASH_COMMANDS.map((entry) => entry.cmd));
-    const skillCommands = flattenNativeCatalog(data, 'skills')
-      .filter((skill) => skill.enabled !== false)
-      .map((skill) => ({
-        cmd: '/' + String(skill.name || skill.dirName || '').trim(),
-        desc: String(skill.description || '').trim(),
-      }))
-      .filter((skill) => skill.cmd !== '/' && !seen.has(skill.cmd))
-      .sort((a, b) => a.cmd.localeCompare(b.cmd));
+    // Each native skill keeps its SKILL.md path: picking it sends Codex's own skill input (cdx-skill-hints.js).
+    const skillCommands = skillHintEntries(flattenNativeCatalog(data, 'skills'), seen);
     _skillsCache = [...commands, ...skillCommands];
   } catch {
     _skillsCache = commands;
@@ -7449,15 +7572,19 @@ export function showSlashHints(text) {
     descSpan.className = 'cxp-slash-hint-desc';
     descSpan.textContent = c.desc;
     item.append(cmdSpan, descSpan);
-    item.addEventListener('click', () => selectSlashHint(c.cmd));
+    item._hint = c;
+    item.addEventListener('click', () => selectSlashHint(c.cmd, c));
     hintsEl.appendChild(item);
   });
 }
 
-export function selectSlashHint(cmd) {
+export function selectSlashHint(cmd, hint = null) {
   const input = panelEl('#cxp-input');
   hideComposerHints();
   if (!input) return;
+  // A native skill picked here goes as Codex's own skill input with the prompt, while the prompt starts with it.
+  const pickTab = activeTab();
+  if (pickTab) pickTab.pendingSkill = hint?.skill ? { cmd: hint.cmd, name: hint.skill.name, path: hint.skill.path } : null;
   const command = CODEX_COMMAND_BY_NAME.get(String(cmd).replace(/^\//, ''));
   if (command?.name === 'model') {
     panelEl('#cxp-model')?.classList.toggle('open');
@@ -7495,7 +7622,7 @@ export function confirmSlashHint() {
     return true;
   }
   const cmdEl = items[_slashActiveIdx]?.querySelector('.cxp-slash-hint-cmd');
-  if (cmdEl) selectSlashHint(cmdEl.textContent);
+  if (cmdEl) selectSlashHint(cmdEl.textContent, items[_slashActiveIdx]._hint || null);
   return true;
 }