synabun 2.0.9 → 2.1.0

package/neural-interface/public/shared/settings/settings-skill-folders-pane.js

@@ -0,0 +1,265 @@
+// ═══════════════════════════════════════════
+// SynaBun Neural Interface — Settings → Skills: the skill folders block
+// ═══════════════════════════════════════════
+//
+// Under the skill chips: the move of SynaBun's old Codex prompt / OpenCode command bridges to native skill
+// folders (review it, move them, undo the last move) and the switch that lets installs go into the shared
+// ~/.agents/skills. Nothing moves when Settings opens: the owner reads the plan and presses Move (the server checks
+// the plan's digest, installs the native folder first, keeps each bridge's bytes in the move's journal, and leaves
+// every file that is not SynaBun's where it is). Words and states come from settings-skill-folders.js; requests
+// carry the X-SynaBun-UI header the owner-only routes ask for (api.js). A change made anywhere else (another window,
+// the Studio, an agent's submission, an install) reaches the block and the chips through `skills:changed`, in place,
+// never under a plan the owner is reading.
+
+import * as kit from './settings-kit.js';
+import { chipState, installedToast, lastUndoable, readFoldersStatus, readMigrationOutcome, readMigrationPlan, readRevertOutcome, toggledAssistants } from './settings-skill-folders.js';
+import { fetchClaudeCodeSkills, fetchSkillsConfig, fetchSkillsMigrations, fetchSkillsStatus, planSkillsBridgeMigration, planSkillsBridgeMigrationConfirmed, revertSkillsMigration, runSkillsBridgeMigration, saveSkillsConfig } from '../api.js';
+import { on } from '../state.js';
+
+export { chipState, installedToast };
+
+const params = (p) => Object.fromEntries(Object.entries(p || {}).map(([k, v]) => [k, v && typeof v === 'object' && typeof v.key === 'string' ? kit.tx(v.key) : v]));
+const say = (m) => (m ? kit.tx(m.key, params(m.params)) : '');
+
+/** The block's markup (filled in by wireSkillFolders once the server answers). */
+export function skillFoldersHTML() {
+  return `
+          <div class="stg-skill-folders" id="stg-skill-folders">
+            ${kit.subhead(kit.te('settings.redesign.skills.folders.title'))}
+            <div class="stg-help" id="stg-skill-folders-status" role="status" aria-live="polite" style="margin-top:0">${kit.te('settings.redesign.skills.folders.loading')}</div>
+            <div class="stg-help" id="stg-skill-folders-others" hidden></div>
+            <ul class="stg-help" id="stg-skill-folders-plan" hidden></ul>
+            <div class="cc-skill-targets" role="group" id="stg-skill-folders-actions">
+              <button type="button" class="cc-skill-target" id="stg-skill-folders-review" hidden>${kit.te('settings.redesign.skills.folders.review')}</button>
+              <button type="button" class="cc-skill-target" id="stg-skill-folders-move" hidden>${kit.te('settings.redesign.skills.folders.move')}</button>
+              <button type="button" class="cc-skill-target" id="stg-skill-folders-cancel" hidden>${kit.te('settings.redesign.skills.folders.cancel')}</button>
+              <button type="button" class="cc-skill-target" id="stg-skill-folders-undo" hidden>${kit.te('settings.redesign.skills.folders.undo')}</button>
+            </div>
+            <div class="cc-skill-row" id="stg-skill-folders-assistants" hidden>
+              <div class="cc-skill-info">
+                <span class="cc-skill-name">${kit.te('settings.redesign.skills.assistants.title')}</span>
+                <span class="cc-skill-desc" id="stg-skill-folders-assistants-help">${kit.te('settings.redesign.skills.assistants.help')}</span>
+              </div>
+              <div class="cc-skill-targets" role="group" aria-label="${kit.te('settings.redesign.skills.assistants.title')}" id="stg-skill-folders-assistants-chips"></div>
+            </div>
+            <div class="cc-skill-row" id="stg-skill-folders-shared" hidden>
+              <div class="cc-skill-info">
+                <span class="cc-skill-name">${kit.te('settings.redesign.skills.folders.sharedLabel')}</span>
+                <span class="cc-skill-desc">${kit.te('settings.redesign.skills.folders.sharedHelp')}</span>
+              </div>
+              <div class="cc-skill-targets"><button type="button" class="cc-skill-target" id="stg-skill-folders-shared-toggle" aria-pressed="false">${kit.te('settings.redesign.skills.folders.sharedOff')}</button></div>
+            </div>
+          </div>`;
+}
+
+/**
+ * Read the skills again and redraw each runtime chip in place (its state, pressed, title). A chip that is being
+ * clicked is left to its own request.
+ * @param {HTMLElement} root the Settings overlay
+ */
+export async function refreshSkillChips(root) {
+  let skills;
+  try { skills = (await fetchClaudeCodeSkills())?.skills; } catch { return; }
+  if (!Array.isArray(skills)) return;
+  const byDir = new Map(skills.map((skill) => [skill.dirName, skill]));
+  for (const chip of root.querySelectorAll('.cc-skill-target[data-cc-skill][data-cc-target]')) {
+    const skill = byDir.get(chip.dataset.ccSkill);
+    if (!skill || chip.style.pointerEvents === 'none') continue;
+    const target = chip.dataset.ccTarget;
+    const installed = skill.installedTargets || { claude: !!skill.installed, codex: false, opencode: false };
+    const now = chipState(skill.targetStates?.[target], !!installed[target]);
+    chip.classList.toggle('on', now.on);
+    chip.dataset.state = now.on ? 'on' : 'off';
+    chip.dataset.installState = now.state;
+    chip.setAttribute('aria-pressed', now.on ? 'true' : 'false');
+    chip.title = kit.tx(now.key, { skill: skill.name || skill.dirName, assistant: chip.textContent.trim() });
+    const row = chip.closest('.cc-skill-row');
+    if (row) row.classList.toggle('installed', !!row.querySelector('.cc-skill-target.on'));
+  }
+}
+
+/**
+ * Fill the block in and wire its buttons.
+ * @param {HTMLElement} root the Settings overlay
+ * @param {{ toast?: (msg: string, ms?: number) => void, onChanged?: () => void, signal?: AbortSignal }} [o]
+ *   `onChanged`: something here (or elsewhere) changed the skills; `signal`: the panel's life (its listeners end with it)
+ */
+export async function wireSkillFolders(root, { toast = () => {}, onChanged = () => {}, signal = null } = {}) {
+  const box = root.querySelector('#stg-skill-folders');
+  if (!box) return;
+  const $ = (id) => box.querySelector(`#${id}`);
+  const status = $('stg-skill-folders-status');
+  const others = $('stg-skill-folders-others');
+  const planList = $('stg-skill-folders-plan');
+  const review = $('stg-skill-folders-review');
+  const move = $('stg-skill-folders-move');
+  const cancel = $('stg-skill-folders-cancel');
+  const undo = $('stg-skill-folders-undo');
+  const shared = $('stg-skill-folders-shared');
+  const sharedToggle = $('stg-skill-folders-shared-toggle');
+  const assistantsRow = $('stg-skill-folders-assistants');
+  const assistantChips = $('stg-skill-folders-assistants-chips');
+  const assistantsHelp = $('stg-skill-folders-assistants-help');
+  let plan = null;
+  let undoable = null;
+  let working = false;
+  let assistants = null;
+  const ticked = new Set();   // the offered bridges the owner ticked ("Move it too")
+
+  const busy = (yes) => { working = yes; for (const b of [review, move, cancel, undo, sharedToggle, ...assistantChips.querySelectorAll('button'), ...planList.querySelectorAll('input')]) if (b) b.disabled = yes; };
+  const showPlan = (reading) => {
+    planList.replaceChildren(...reading.lines.map((line) => {
+      const li = document.createElement('li');
+      li.dataset.tone = line.tone;
+      if (line.offer) {
+        // A bridge file of a shipped skill that is not proven SynaBun's: moved only when the owner ticks it here.
+        const label = document.createElement('label');
+        label.className = 'stg-skill-folders-offer';
+        const box = document.createElement('input');
+        box.type = 'checkbox'; box.checked = !!line.offer.on; box.dataset.bridge = line.bridgeId; box.dataset.digest = line.offer.digest;
+        box.setAttribute('aria-label', kit.tx('settings.redesign.skills.folders.offerTick', { name: line.params.name }));
+        const text = document.createElement('span');
+        text.textContent = say(line);
+        label.append(box, text);
+        li.append(label);
+      } else li.textContent = say(line);
+      return li;
+    }));
+    planList.hidden = !reading.lines.length;
+  };
+  // A plan on screen: its lines, Move only when something would move, Cancel to put the block back.
+  const present = (next) => {
+    plan = next;
+    const reading = readMigrationPlan(plan, ticked);
+    showPlan(reading);
+    if (reading.empty) status.textContent = say(reading.empty);
+    move.hidden = reading.movable === 0;
+    cancel.hidden = false;
+    review.hidden = true;
+  };
+  // An offer ticked or unticked: the plan is asked again with the confirmations (a confirmed plan is another plan,
+  // taken by its own digest), and shown.
+  planList.addEventListener('change', async (e) => {
+    const box = e.target;
+    if (!box?.dataset?.bridge) return;
+    if (box.checked) ticked.add(box.dataset.bridge); else ticked.delete(box.dataset.bridge);
+    busy(true);
+    try {
+      const confirm = Object.fromEntries([...planList.querySelectorAll('input[data-bridge]')].filter((b) => ticked.has(b.dataset.bridge)).map((b) => [b.dataset.bridge, b.dataset.digest]));
+      present((await planSkillsBridgeMigrationConfirmed(confirm)).plan);
+    } catch (err) { toast(kit.tx('settings.redesign.skills.folders.failed', { message: err.message }), 6000); }
+    finally { busy(false); }
+  });
+  const drawAssistants = () => {
+    if (!assistants) { assistantsRow.hidden = true; return; }
+    assistantsRow.hidden = false;
+    assistantChips.replaceChildren(...assistants.chips.map((chip) => {
+      const b = document.createElement('button');
+      b.type = 'button';
+      b.className = `cc-skill-target${chip.on ? ' on' : ''}`;
+      b.dataset.assistant = chip.id;
+      b.setAttribute('aria-pressed', chip.on ? 'true' : 'false');
+      b.textContent = kit.tx(chip.key);
+      b.title = kit.tx(chip.on ? 'settings.redesign.skills.assistants.chipOn' : 'settings.redesign.skills.assistants.chipOff', { assistant: kit.tx(chip.key) });
+      return b;
+    }));
+    const detected = assistants.detectedWords.map((w) => kit.tx(w.key)).join(', ');
+    assistantsHelp.textContent = `${kit.tx('settings.redesign.skills.assistants.help')} ${kit.tx(assistants.auto ? 'settings.redesign.skills.assistants.detected' : 'settings.redesign.skills.assistants.chosen', { detected })}`;
+    if (!assistants.auto) {
+      const reset = document.createElement('button');
+      reset.type = 'button'; reset.className = 'cc-skill-target'; reset.dataset.assistant = 'auto';
+      reset.textContent = kit.tx('settings.redesign.skills.assistants.useDetected');
+      reset.title = kit.tx('settings.redesign.skills.assistants.detected', { detected });
+      assistantChips.append(reset);
+    }
+  };
+  assistantChips.addEventListener('click', async (e) => {
+    const chip = e.target.closest?.('button[data-assistant]');
+    if (!chip || chip.disabled || !assistants) return;
+    const next = chip.dataset.assistant === 'auto' ? null : toggledAssistants(assistants.effective, chip.dataset.assistant);
+    busy(true);
+    try { await saveSkillsConfig({ assistants: next }); }
+    catch (err) { toast(kit.tx('settings.redesign.skills.folders.failed', { message: err.message }), 6000); }
+    finally { busy(false); }
+    await refresh();
+  });
+  async function refresh() {
+    let answer = null;
+    try { answer = await fetchSkillsStatus(); } catch { answer = null; }
+    const reading = readFoldersStatus(answer);
+    status.textContent = say(reading.message);
+    if (!reading.available) { for (const el of [others, planList, review, move, cancel, undo, shared, assistantsRow]) el.hidden = true; return; }
+    // The owner's assistants: the status carries them on a server with the preference; GET /config is the fuller read.
+    assistants = reading.assistants;
+    if (assistants) { try { const cfg = await fetchSkillsConfig(); if (cfg?.assistants) assistants = readFoldersStatus({ ok: true, bridges: {}, assistants: cfg.assistants }).assistants; } catch { /* the status' view */ } }
+    drawAssistants();
+    ticked.clear();
+    others.hidden = !reading.others;
+    others.textContent = say(reading.others);
+    review.hidden = !reading.canReview;
+    move.hidden = true; cancel.hidden = true; planList.hidden = true; plan = null;
+    shared.hidden = false;
+    sharedToggle.classList.toggle('on', reading.sharedAgentsRoot);
+    sharedToggle.setAttribute('aria-pressed', reading.sharedAgentsRoot ? 'true' : 'false');
+    sharedToggle.textContent = kit.tx(reading.sharedAgentsRoot ? 'settings.redesign.skills.folders.sharedOn' : 'settings.redesign.skills.folders.sharedOff');
+    try { undoable = lastUndoable((await fetchSkillsMigrations()).migrations); } catch { undoable = null; }
+    undo.hidden = !undoable;
+  }
+
+  review.addEventListener('click', async () => {
+    busy(true);
+    try {
+      present((await planSkillsBridgeMigration()).plan);
+    } catch (err) { toast(kit.tx('settings.redesign.skills.folders.failed', { message: err.message }), 6000); }
+    finally { busy(false); }
+  });
+  cancel.addEventListener('click', () => refresh());
+  move.addEventListener('click', async () => {
+    const reading = readMigrationPlan(plan, ticked);
+    if (!reading.planDigest) return;
+    busy(true);
+    try {
+      const out = await runSkillsBridgeMigration(reading.planDigest, reading.confirm);
+      toast(say(readMigrationOutcome(out)), 8000);
+      onChanged();
+    } catch (err) {
+      // The bridges or their destinations changed since the plan was shown: nothing moved, the new plan is shown.
+      if (err.code === 'plan_changed' && err.body?.plan) { present(err.body.plan); toast(kit.tx('settings.redesign.skills.folders.planChanged'), 8000); return; }
+      toast(kit.tx('settings.redesign.skills.folders.failed', { message: err.message }), 6000);
+    } finally { busy(false); }
+    await refresh();
+  });
+  undo.addEventListener('click', async () => {
+    if (!undoable) return;
+    busy(true);
+    try {
+      const out = await revertSkillsMigration(undoable.journalId);
+      toast(say(readRevertOutcome(out)), 8000);
+      onChanged();
+    } catch (err) { toast(kit.tx('settings.redesign.skills.folders.failed', { message: err.message }), 6000); }
+    finally { busy(false); }
+    await refresh();
+  });
+  sharedToggle.addEventListener('click', async () => {
+    const next = sharedToggle.getAttribute('aria-pressed') !== 'true';
+    busy(true);
+    try { await saveSkillsConfig({ sharedAgentsRoot: next }); }
+    catch (err) { toast(kit.tx('settings.redesign.skills.folders.failed', { message: err.message }), 6000); }
+    finally { busy(false); }
+    await refresh();
+  });
+  // Changes from anywhere else: the chips follow at once; the block follows unless a plan is on screen or a request
+  // of its own is under way (a move is taken only by the digest of the plan shown, so a stale plan moves nothing).
+  let soon = 0;
+  const stop = on('sync:skills:changed', () => {
+    clearTimeout(soon);
+    soon = setTimeout(() => {
+      if (!box.isConnected) { stop(); return; }
+      onChanged();
+      if (!plan && !working) refresh();
+    }, 300);
+  });
+  signal?.addEventListener('abort', () => { stop(); clearTimeout(soon); }, { once: true });
+  if (signal?.aborted) { stop(); return; }
+  await refresh();
+}

package/neural-interface/public/shared/settings/settings-skill-folders.js

@@ -0,0 +1,130 @@
+// ═══════════════════════════════════════════
+// SynaBun Neural Interface — Settings → Skills: skill folders, read (no DOM)
+// ═══════════════════════════════════════════
+//
+// What the Skills Service says (GET /api/skills-studio/v2/status, the bridge migration's plan and outcome) turned
+// into what Settings → Skills shows: whether the old Codex prompt / OpenCode command bridges can move to native
+// skill folders, what each would do, the outcome of a move or an undo, the shared ~/.agents/skills switch, and
+// each runtime chip's state (a native folder, an old bridge, someone else's folder). Every sentence is a
+// settings.redesign.skills.* key; the pane (settings-skill-folders-pane.js) draws it.
+
+const RUNTIME = { claude: 'settings.redesign.product.claude', codex: 'settings.redesign.product.codex', opencode: 'settings.redesign.product.opencode' };
+
+/** What the status answer says, or that the server cannot say it yet (one from before the Skills Service). */
+export function readFoldersStatus(answer) {
+  if (!answer || answer.ok !== true || !answer.bridges) return { available: false, message: { key: 'settings.redesign.skills.folders.unavailable' } };
+  const synabun = Number(answer.bridges.synabun) || 0;
+  const other = Number(answer.bridges.other) || 0;
+  return {
+    available: true,
+    sharedAgentsRoot: answer.config?.sharedAgentsRoot === true,
+    assistants: readAssistants(answer.assistants),
+    bridges: { synabun, other },
+    message: synabun === 0 ? { key: 'settings.redesign.skills.folders.bridgesNone' } : synabun === 1 ? { key: 'settings.redesign.skills.folders.bridgesOne' } : { key: 'settings.redesign.skills.folders.bridgesMany', params: { count: synabun } },
+    others: other === 0 ? null : other === 1 ? { key: 'settings.redesign.skills.folders.othersOne' } : { key: 'settings.redesign.skills.folders.othersMany', params: { count: other } },
+    canReview: synabun > 0,
+  };
+}
+
+const ASSISTANTS = ['claude', 'codex', 'opencode'];
+
+/**
+ * The owner's assistants (GET /v2/config `assistants`: chosen, detected, effective): one chip per runtime, on when
+ * it is in effect, and whether the list is the detected one (nothing chosen yet). A server from before this has none.
+ */
+export function readAssistants(view) {
+  if (!view || !Array.isArray(view.effective)) return null;
+  const effective = view.effective.filter((r) => ASSISTANTS.includes(r));
+  const detected = (Array.isArray(view.detected) ? view.detected : []).filter((r) => ASSISTANTS.includes(r));
+  return {
+    auto: !Array.isArray(view.chosen),
+    effective, detected,
+    chips: ASSISTANTS.map((id) => ({ id, key: RUNTIME[id], on: effective.includes(id), detected: detected.includes(id) })),
+    detectedWords: detected.map((id) => ({ key: RUNTIME[id] })),
+  };
+}
+
+/** The list a chip's click sends (PUT /v2/config `assistants`): toggled, never empty (the last one stays on). */
+export function toggledAssistants(effective, id) {
+  const now = (Array.isArray(effective) ? effective : []).filter((r) => ASSISTANTS.includes(r));
+  if (now.includes(id)) { const next = now.filter((r) => r !== id); return next.length ? next : now; }
+  return ASSISTANTS.filter((r) => now.includes(r) || r === id);
+}
+
+/**
+ * The lines of a migration plan, one per bridge of SynaBun's, and whether anything would move. The prompt and
+ * command files that are not SynaBun's are only counted (the status says how many): they are never moved, and a
+ * line each would bury the ones that are; except the bridge file of a skill SynaBun ships that is not proven its
+ * own (`offer`): that one is listed with a tick, "Move it too", and moves only once the owner confirms its bytes.
+ * @param {object} plan @param {Set<string>|string[]} [ticked] the offers the owner ticked (bridge ids)
+ */
+export function readMigrationPlan(plan, ticked = []) {
+  const steps = Array.isArray(plan?.steps) ? plan.steps : [];
+  const on = new Set(ticked);
+  const lines = steps.filter((s) => s.action !== 'leave' || s.proof !== 'none' || s.ledgerRecord || s.offer).map((s) => {
+    const params = { runtime: { key: RUNTIME[s.runtime] || RUNTIME.codex }, name: `/${s.name}`, destination: s.native?.destination || '', why: s.why || '' };
+    if (s.action === 'migrate') return { tone: 'ok', key: s.proof === 'owner-confirmed' ? 'settings.redesign.skills.folders.stepConfirmed' : 'settings.redesign.skills.folders.stepMigrate', params, bridgeId: s.bridgeId, offer: s.proof === 'owner-confirmed' ? { digest: s.digest, on: true } : null };
+    if (s.action === 'blocked') return { tone: 'warn', key: 'settings.redesign.skills.folders.stepBlocked', params };
+    if (s.offer) return { tone: 'offer', key: 'settings.redesign.skills.folders.stepOffer', params, bridgeId: s.bridgeId, offer: { digest: s.offer.digest, on: on.has(s.bridgeId) } };
+    return { tone: 'muted', key: 'settings.redesign.skills.folders.stepLeave', params };
+  });
+  const movable = steps.filter((s) => s.action === 'migrate').length;
+  const confirm = Object.fromEntries(steps.filter((s) => s.proof === 'owner-confirmed').map((s) => [s.bridgeId, s.digest]));
+  return { lines, movable, offered: steps.filter((s) => s.action === 'leave' && s.offer).length, confirm, planDigest: typeof plan?.planDigest === 'string' ? plan.planDigest : null, empty: movable === 0 ? { key: 'settings.redesign.skills.folders.nothing' } : null };
+}
+
+/** What a move answered: done, in part (which and why), nothing to do. */
+export function readMigrationOutcome(out) {
+  if (!out) return { tone: 'warn', key: 'settings.redesign.skills.folders.failed', params: { message: '' } };
+  if (out.nothingToDo) return { tone: 'muted', key: 'settings.redesign.skills.folders.nothing' };
+  if (out.status === 'done') return { tone: 'ok', key: 'settings.redesign.skills.folders.moved', params: { id: out.journalId } };
+  const failed = (out.results || []).filter((r) => r.outcome !== 'migrated').map((r) => `/${r.name}: ${r.error || r.outcome}`).join('; ');
+  if (out.status === 'failed') return { tone: 'warn', key: 'settings.redesign.skills.folders.failed', params: { message: failed } };
+  return { tone: 'warn', key: 'settings.redesign.skills.folders.movedPartly', params: { details: failed } };
+}
+
+/** What an undo answered. */
+export function readRevertOutcome(out) {
+  if (!out) return { tone: 'warn', key: 'settings.redesign.skills.folders.failed', params: { message: '' } };
+  if (out.status === 'reverted') return { tone: 'ok', key: 'settings.redesign.skills.folders.undone' };
+  const details = (out.results || []).filter((r) => r.bridge === 'conflict' || r.bridge === 'failed' || r.native === 'kept').map((r) => r.why || r.path).join('; ');
+  return { tone: 'warn', key: 'settings.redesign.skills.folders.undonePartly', params: { details } };
+}
+
+/** The last move that can be undone, from GET /migrations (newest first). */
+export function lastUndoable(list) {
+  const rows = (Array.isArray(list) ? list : []).filter((m) => m && (m.status === 'done' || m.status === 'partial' || m.status === 'partially-reverted') && m.migrated > 0);
+  rows.sort((a, b) => (a.createdAt < b.createdAt ? 1 : -1));
+  return rows[0] || null;
+}
+
+/**
+ * A runtime chip of a skill: its state (`native`: SynaBun's skill folder; `bridge`: an old bridge not moved yet;
+ * `shared`: SynaBun's copy in ~/.agents/skills, which Codex and OpenCode both read; `other`: a folder of that name
+ * SynaBun did not install, in the runtime's folder or the shared one; `installed`: a server from before the skill
+ * folders says only that it is there; `off`) and its title key.
+ * @param {object|undefined} state the skill's targetStates[runtime] from GET /api/skills
+ * @param {boolean} installed the older single flag (installedTargets[runtime])
+ */
+export function chipState(state, installed) {
+  if (!state) return installed ? { state: 'installed', on: true, key: 'settings.redesign.skills.chip.installed' } : { state: 'off', on: false, key: 'settings.redesign.skills.installFor' };
+  if (state.native === 'native' || state.native === 'modified') return { state: 'native', on: true, key: 'settings.redesign.skills.chip.native' };
+  if (state.bridge) return { state: 'bridge', on: true, key: 'settings.redesign.skills.chip.bridge' };
+  if (state.shared === 'native') return { state: 'shared', on: true, key: 'settings.redesign.skills.chip.shared' };
+  if (state.native === 'other') return { state: 'other', on: false, key: 'settings.redesign.skills.chip.other' };
+  if (state.shared === 'other') return { state: 'other', on: false, key: 'settings.redesign.skills.chip.otherShared' };
+  return { state: 'off', on: false, key: 'settings.redesign.skills.installFor' };
+}
+
+/**
+ * The toast after a chip installed a skill: a skill folder of its own, whether an old bridge of it is still there,
+ * and what the runtime needs to see it (`refresh` of the install answer: automatic, reload-skills, new-session).
+ */
+export function installedToast(answer) {
+  if (answer?.shared) return 'settings.redesign.skills.chip.installedShared';
+  if (answer?.bridge) return 'settings.redesign.skills.chip.installedBridgeLeft';
+  const kinds = new Set((Array.isArray(answer?.refresh) ? answer.refresh : []).map((r) => r?.kind));
+  if (kinds.has('new-session')) return 'settings.redesign.skills.chip.installedNewSession';
+  if (kinds.has('reload-skills')) return 'settings.redesign.skills.chip.installedReload';
+  return 'settings.redesign.skills.chip.installedNative';
+}

package/neural-interface/public/shared/settings/settings-worker-guard.js

@@ -0,0 +1,72 @@
+// ═══════════════════════════════════════════
+// SETTINGS — Protect workers, in words
+// ═══════════════════════════════════════════
+//
+// What `GET /api/assistant/worker-guard` (lib/assistant-api.js; the setting in lib/worker-guard-setting.js, what
+// it means in lib/worker-confinement.js) says about Settings → Automations → Automation behavior → Protect
+// workers: the mode in effect (enforce, warn, off), whether it can be changed, and what stands in the way. Pure:
+// no DOM and no import, so node runs it (tests/settings-worker-guard-view.test.mjs).
+//
+//   readWorkerGuardResponse({ status, body, error })   what the server answered → a reading
+//   describeWorkerGuard(reading, { tx })                the row as ui-settings.js draws it
+//   describeWorkerGuardSaveFailure(input, { tx })       the sentence for a choice that could not be saved
+//
+// `tx(key, params)` is the caller's translate function over the settings.redesign.* strings (the kit's `tx`).
+// The row never shows a healthy-looking control for something that is not happening: a server started before
+// the setting existed shows the default, disabled, and says a restart is missing.
+
+const K = 'settings.redesign.hooks.workerGuard';
+
+export const WORKER_GUARD_MODES = Object.freeze(['enforce', 'warn', 'off']);
+export const WORKER_GUARD_DEFAULT = 'enforce';
+
+const clean = (value, max = 200) => {
+  const text = String(value ?? '').replace(/\s+/g, ' ').trim();
+  return text.length > max ? `${text.slice(0, max - 1)}…` : text;
+};
+
+/**
+ * What the server answered.
+ *
+ *   ready        the setting is there: `mode` is in effect, `modes` the choices
+ *   old-server   404: the running server was started before the setting existed
+ *   failed       503 WORKER_GUARD_UNAVAILABLE: the setting did not start; `reason` is the error
+ *   unreadable   anything else (no answer, a refusal, a body that is not the payload)
+ */
+export function readWorkerGuardResponse({ status = 0, body = null, error = null } = {}) {
+  const code = Number(status) || 0;
+  if (code === 404) return { state: 'old-server', mode: WORKER_GUARD_DEFAULT, modes: [...WORKER_GUARD_MODES], reason: null };
+  if (code === 503) return { state: 'failed', mode: WORKER_GUARD_DEFAULT, modes: [...WORKER_GUARD_MODES], reason: clean(body?.reason || body?.error) || null };
+  if (code >= 200 && code < 300 && body && typeof body === 'object' && body.ok !== false && WORKER_GUARD_MODES.includes(body.mode)) {
+    const modes = Array.isArray(body.modes) && body.modes.every((m) => WORKER_GUARD_MODES.includes(m)) && body.modes.length ? body.modes : [...WORKER_GUARD_MODES];
+    return { state: 'ready', mode: body.mode, modes, reason: null };
+  }
+  return { state: 'unreadable', mode: WORKER_GUARD_DEFAULT, modes: [...WORKER_GUARD_MODES], reason: clean(error || body?.error || (code ? `HTTP ${code}` : '')) || null };
+}
+
+/** The row: { ready, disabled, mode, options: [{ value, label, help }], note: { text, tone } | null, applies }. */
+export function describeWorkerGuard(reading, { tx }) {
+  const r = reading || readWorkerGuardResponse({ status: 0 });
+  const options = (r.modes || WORKER_GUARD_MODES).map((value) => ({ value, label: tx(`${K}.mode.${value}`), help: tx(`${K}.modeHelp.${value}`) }));
+  let note = null;
+  if (r.state === 'old-server') note = { text: tx(`${K}.restart`), tone: 'warn' };
+  else if (r.state === 'failed') note = { text: r.reason ? tx(`${K}.failed`, { reason: r.reason }) : tx(`${K}.failedNoReason`), tone: 'warn' };
+  else if (r.state === 'unreadable') note = { text: r.reason ? tx(`${K}.unreadable`, { reason: r.reason }) : tx(`${K}.unreadableNoReason`), tone: 'warn' };
+  return {
+    ready: r.state === 'ready',
+    disabled: r.state !== 'ready',
+    mode: r.mode || WORKER_GUARD_DEFAULT,
+    options,
+    note,
+    applies: tx(`${K}.applies`),
+  };
+}
+
+/** The sentence under the row when a choice could not be saved: { status, body, error, mode }. */
+export function describeWorkerGuardSaveFailure({ status = 0, body = null, error = null, mode = '' } = {}, { tx }) {
+  const code = Number(status) || 0;
+  const name = tx(`${K}.mode.${WORKER_GUARD_MODES.includes(mode) ? mode : WORKER_GUARD_DEFAULT}`);
+  if (code === 404) return tx(`${K}.save.oldServer`, { mode: name });
+  if (!code) return tx(`${K}.save.noAnswer`, { mode: name, reason: clean(error) || '' });
+  return tx(`${K}.save.failed`, { mode: name, reason: clean(body?.error || error) || `HTTP ${code}` });
+}

package/neural-interface/public/shared/sidepanel-session-status.js

@@ -0,0 +1,49 @@
+// What a detached session window (ui-sidepanel-sessions.js) is doing, for the
+// pill the main window shows for it. It is read from the window's own tray
+// pills, the ones its provider panel paints from its sessions' state: Claude
+// (tabWorking: a turn or background agents and shells; tabNeedsYou: a
+// permission or a question waiting), Codex (a turn or a thread being made; an
+// approval or a question card waiting), OpenCode (tabPillState: a turn, an
+// automation's turn, a sub-agent's, one waiting on you) and the SynaBun
+// Assistant (sessionStatus). The same source as the tray pills, never a second
+// guess. DOM-free.
+
+const WORKING = /^(cp|cxp|ocpv2|asp)-pill-running$/;
+const NEEDS_YOU = /^((cp|cxp|asp)-pill-attention|ocpv2-pill-waiting)$/;
+
+/** The states a detached window's pill shows: a session in it needs you > one works > none. */
+export const SESSION_WINDOW_STATES = Object.freeze(['action', 'working', 'idle']);
+
+/**
+ * 'action' when a session in the window waits on you, 'working' when one works,
+ * else 'idle'. `pills`: the class names of each tray pill of the window.
+ */
+export function sessionWindowStatus(pills) {
+  let working = false;
+  for (const classes of pills || []) {
+    for (const cls of classes || []) {
+      if (NEEDS_YOU.test(cls)) return 'action';
+      if (WORKING.test(cls)) working = true;
+    }
+  }
+  return working ? 'working' : 'idle';
+}
+
+/** A status a window reported, or 'idle' for anything else. */
+export function normalizeSessionWindowStatus(status) {
+  return SESSION_WINDOW_STATES.includes(status) ? status : 'idle';
+}
+
+/**
+ * A dispatched worker's run (its descriptor) waits on your answer with no card
+ * in its tab: its turn ended asking you something (the run's outcome is
+ * needs_input while the warm worker rests between turns). Claude's and Codex's
+ * tabs say "needs you" for it, as OpenCode's do (automationTurnPhase); a card
+ * of their own (a permission, a question) says it already. A run that ended
+ * waits on nobody.
+ */
+export function runAwaitsAnswer(run) {
+  if (run?.status !== 'starting' && run?.status !== 'running') return false;
+  if (run.turnState === 'needs_input') return true;
+  return run.turnState === 'idle' && (run.outcome || run.lastResult?.status) === 'needs_input';
+}

package/neural-interface/public/shared/skills/ss-args.js

@@ -0,0 +1,96 @@
+// ═══════════════════════════════════════════
+// SynaBun Neural Interface — Skills Studio: a skill's arguments, as Claude Code fills them
+// ═══════════════════════════════════════════
+//
+// When a panel hands a SKILL.md to a model itself (a skill the runtime cannot see, server.js
+// maybeInjectSkillPrompt), the body is filled the way Claude Code fills it (code.claude.com/docs/en/skills,
+// "Available string substitutions", read 2026-10-21):
+//   $ARGUMENTS          the argument text as typed; when nothing in the body takes the arguments, Claude Code
+//                       adds "ARGUMENTS: <text>" at the end instead
+//   $ARGUMENTS[N], $N   the Nth argument, counted from 0 ($0 is the first); a quoted phrase is one argument;
+//                       one that is not there stays as written
+//   $name               an argument named in the frontmatter's `arguments` (in that order); empty when missing
+//   \$...               a backslash keeps the placeholder as text (the backslash goes)
+//   ${CLAUDE_SKILL_DIR} the skill's folder; ${CLAUDE_PROJECT_DIR} the project (when known); other ${CLAUDE_*}
+//                       stay as written
+// One pass over the text: what an argument brings in is never read again as a placeholder, so a "$&" or a
+// "$ARGUMENTS" typed by the person reaches the model as they typed it. `$SKILL_DIR` (a convention of SynaBun's
+// old bridges, not a runtime variable) is filled with the skill's folder too. No DOM.
+
+/** The arguments as Claude Code counts them: split on white space, a "quoted phrase" or 'quoted phrase' is one. */
+export function splitArguments(text) {
+  const out = [];
+  const s = String(text ?? '');
+  let i = 0;
+  while (i < s.length) {
+    while (i < s.length && /\s/.test(s[i])) i++;
+    if (i >= s.length) break;
+    let item = '';
+    while (i < s.length && !/\s/.test(s[i])) {
+      const quote = s[i];
+      if (quote === '"' || quote === "'") {
+        const close = s.indexOf(quote, i + 1);
+        if (close > i) { item += s.slice(i + 1, close); i = close + 1; continue; }
+      }
+      item += s[i];
+      i++;
+    }
+    out.push(item);
+  }
+  return out;
+}
+
+/** The names `arguments` declares (a space-separated text or a list), in order; [] for anything else. */
+export function declaredArgumentNames(value) {
+  const list = typeof value === 'string' ? value.split(/[\s,]+/) : (Array.isArray(value) ? value : []);
+  return list.filter((n) => typeof n === 'string' && /^[A-Za-z_][A-Za-z0-9_]*$/.test(n.trim())).map((n) => n.trim());
+}
+
+// One regular expression for every placeholder, so the text is read once. Order matters inside the alternation:
+// the escaped form first, then the longer names. Only an argument placeholder can be escaped: a backslash before
+// ${CLAUDE_*} is not an escape (it stays, and the variable is filled).
+const PLACEHOLDER = /\\\$(ARGUMENTS(?:\[\d+\])?|\d+|[A-Za-z_][A-Za-z0-9_]*)|\$ARGUMENTS\[(\d+)\]|\$ARGUMENTS\b|\$(\d+)|\$\{(CLAUDE_[A-Z_]+)\}|\$SKILL_DIR\b|\$([A-Za-z_][A-Za-z0-9_]*)/g;
+
+/**
+ * Fill a skill body.
+ * @param {string} body the text after the frontmatter
+ * @param {object} o
+ * @param {string} [o.args] the argument text as typed (may be empty)
+ * @param {string[]|string} [o.declared] the frontmatter's `arguments`
+ * @param {string} [o.skillDir] the skill's folder
+ * @param {string} [o.projectDir] the project folder, when known
+ * @param {string} [o.emptyArguments] what $ARGUMENTS reads when nothing was typed (Claude Code: ''; SynaBun's panels
+ *   say "(none)" so the instructions read as meant)
+ * @returns {{ text: string, consumed: boolean }} `consumed`: a placeholder took the arguments
+ */
+export function renderSkillBody(body, { args = '', declared = [], skillDir = '', projectDir = '', emptyArguments = '' } = {}) {
+  const text = String(body ?? '');
+  const typed = String(args ?? '');
+  const items = splitArguments(typed);
+  const names = declaredArgumentNames(declared);
+  let consumed = false;
+  const out = text.replace(PLACEHOLDER, (whole, escaped, indexed, positional, claudeVar, name) => {
+    if (escaped !== undefined) {
+      const placeholder = /^ARGUMENTS(?:\[\d+\])?$/.test(escaped) || /^\d+$/.test(escaped) || names.includes(escaped);
+      return placeholder ? `$${escaped}` : whole;
+    }
+    if (indexed !== undefined) { const v = items[Number(indexed)]; if (v === undefined) return whole; consumed = true; return v; }
+    if (positional !== undefined) { const v = items[Number(positional)]; if (v === undefined) return whole; consumed = true; return v; }
+    if (claudeVar !== undefined) {
+      if (claudeVar === 'CLAUDE_SKILL_DIR' && skillDir) return skillDir;
+      if (claudeVar === 'CLAUDE_PROJECT_DIR' && projectDir) return projectDir;
+      return whole;
+    }
+    if (whole === '$ARGUMENTS') { consumed = true; return typed.trim() ? typed : emptyArguments; }
+    if (whole === '$SKILL_DIR') return skillDir || whole;
+    if (name !== undefined) {
+      const at = names.indexOf(name);
+      if (at < 0) return whole;
+      consumed = true;
+      return items[at] ?? '';
+    }
+    return whole;
+  });
+  if (!consumed && typed.trim()) return { text: `${out}${out.endsWith('\n') ? '' : '\n'}\nARGUMENTS: ${typed}`, consumed: false };
+  return { text: out, consumed };
+}