synabun 1.3.0 → 2.0.0-beta

package/neural-interface/public/shared/ui-keybinds.js

@@ -9,6 +9,7 @@ import { fetchKeybinds, saveKeybindsToServer } from './api.js';
 // ── CLI icons for Launch group ──
 
 const CLI_ICONS = {
+  assistant: '<svg viewBox="0 0 24 24" fill="currentColor"><rect x="8" y="5.5" width="11" height="5" rx="2.5" transform="rotate(-12 13.5 8)"/><rect x="4.5" y="12.5" width="11" height="5" rx="2.5" transform="rotate(-12 10 15)"/></svg>',
   claude: '<svg viewBox="0 0 24 24" fill="currentColor"><path d="M4.709 15.955l4.72-2.647.08-.23-.08-.128H9.2l-.79-.048-2.698-.073-2.339-.097-2.266-.122-.571-.121L0 11.784l.055-.352.48-.321.686.06 1.52.103 2.278.158 1.652.097 2.449.255h.389l.055-.157-.134-.098-.103-.097-2.358-1.596-2.552-1.688-1.336-.972-.724-.491-.364-.462-.158-1.008.656-.722.881.06.225.061.893.686 1.908 1.476 2.491 1.833.365.304.145-.103.019-.073-.164-.274-1.355-2.446-1.446-2.49-.644-1.032-.17-.619a2.97 2.97 0 01-.104-.729L6.283.134 6.696 0l.996.134.42.364.62 1.414 1.002 2.229 1.555 3.03.456.898.243.832.091.255h.158V9.01l.128-1.706.237-2.095.23-2.695.08-.76.376-.91.747-.492.584.28.48.685-.067.444-.286 1.851-.559 2.903-.364 1.942h.212l.243-.242.985-1.306 1.652-2.064.73-.82.85-.904.547-.431h1.033l.76 1.129-.34 1.166-1.064 1.347-.881 1.142-1.264 1.7-.79 1.36.073.11.188-.02 2.856-.606 1.543-.28 1.841-.315.833.388.091.395-.328.807-1.969.486-2.309.462-3.439.813-.042.03.049.061 1.549.146.662.036h1.622l3.02.225.79.522.474.638-.079.485-1.215.62-1.64-.389-3.829-.91-1.312-.329h-.182v.11l1.093 1.068 2.006 1.81 2.509 2.33.127.578-.322.455-.34-.049-2.205-1.657-.851-.747-1.926-1.62h-.128v.17l.444.649 2.345 3.521.122 1.08-.17.353-.608.213-.668-.122-1.374-1.925-1.415-2.167-1.143-1.943-.14.08-.674 7.254-.316.37-.729.28-.607-.461-.322-.747.322-1.476.389-1.924.315-1.53.286-1.9.17-.632-.012-.042-.14.018-1.434 1.967-2.18 2.945-1.726 1.845-.414.164-.717-.37.067-.662.401-.589 2.388-3.036 1.44-1.882.93-1.086-.006-.158h-.055L4.132 18.56l-1.13.146-.487-.456.061-.746.231-.243 1.908-1.312-.006.006z"/></svg>',
   codex: '<svg viewBox="0 0 24 24" fill="currentColor"><path d="M9.205 8.658v-2.26c0-.19.072-.333.238-.428l4.543-2.616c.619-.357 1.356-.523 2.117-.523 2.854 0 4.662 2.212 4.662 4.566 0 .167 0 .357-.024.547l-4.71-2.759a.797.797 0 00-.856 0l-5.97 3.473zm10.609 8.8V12.06c0-.333-.143-.57-.429-.737l-5.97-3.473 1.95-1.118a.433.433 0 01.476 0l4.543 2.617c1.309.76 2.189 2.378 2.189 3.948 0 1.808-1.07 3.473-2.76 4.163zM7.802 12.703l-1.95-1.142c-.167-.095-.239-.238-.239-.428V5.899c0-2.545 1.95-4.472 4.591-4.472 1 0 1.927.333 2.712.928L8.23 5.067c-.285.166-.428.404-.428.737v6.898zM12 15.128l-2.795-1.57v-3.33L12 8.658l2.795 1.57v3.33L12 15.128zm1.796 7.23c-1 0-1.927-.332-2.712-.927l4.686-2.712c.285-.166.428-.404.428-.737v-6.898l1.974 1.142c.167.095.238.238.238.428v5.233c0 2.545-1.974 4.472-4.614 4.472zm-5.637-5.303l-4.544-2.617c-1.308-.761-2.188-2.378-2.188-3.948A4.482 4.482 0 014.21 6.327v5.423c0 .333.143.571.428.738l5.947 3.449-1.95 1.118a.432.432 0 01-.476 0zm-.262 3.9c-2.688 0-4.662-2.021-4.662-4.519 0-.19.024-.38.047-.57l4.686 2.71c.286.167.571.167.856 0l5.97-3.448v2.26c0 .19-.07.333-.237.428l-4.543 2.616c-.619.357-1.356.523-2.117.523zm5.899 2.83a5.947 5.947 0 005.827-4.756C22.287 18.339 24 15.84 24 13.296c0-1.665-.713-3.282-1.998-4.448.119-.5.19-.999.19-1.498 0-3.401-2.759-5.947-5.946-5.947-.642 0-1.26.095-1.88.31A5.962 5.962 0 0010.205 0a5.947 5.947 0 00-5.827 4.757C1.713 5.447 0 7.945 0 10.49c0 1.666.713 3.283 1.998 4.448-.119.5-.19 1-.19 1.499 0 3.401 2.759 5.946 5.946 5.946.642 0 1.26-.095 1.88-.309a5.96 5.96 0 004.162 1.713z"/></svg>',
   gemini: '<svg viewBox="0 0 24 24" fill="currentColor"><path d="M20.616 10.835a14.147 14.147 0 01-4.45-3.001 14.111 14.111 0 01-3.678-6.452.503.503 0 00-.975 0 14.134 14.134 0 01-3.679 6.452 14.155 14.155 0 01-4.45 3.001c-.65.28-1.318.505-2.002.678a.502.502 0 000 .975c.684.172 1.35.397 2.002.677a14.147 14.147 0 014.45 3.001 14.112 14.112 0 013.679 6.453.502.502 0 00.975 0c.172-.685.397-1.351.677-2.003a14.145 14.145 0 013.001-4.45 14.113 14.113 0 016.453-3.678.503.503 0 000-.975 13.245 13.245 0 01-2.003-.678z"/></svg>',
@@ -100,8 +101,8 @@ function centralKeyHandler(e) {
   // Skip if in text input
   const tag = document.activeElement?.tagName;
   if (tag === 'INPUT' || tag === 'TEXTAREA') return;
-  // Skip if in xterm.js terminal
-  if (document.activeElement?.closest('.term-viewport')) return;
+  // Skip if in xterm.js terminal or the Assistant (terminal tab or sidepanel)
+  if (document.activeElement?.closest('.term-viewport, .asst-root, .asst-bar')) return;
   // Skip if contenteditable
   if (document.activeElement?.isContentEditable) return;
 

package/neural-interface/public/shared/ui-link.js

@@ -43,14 +43,61 @@ let _history = [];          // local copy of conversation history
 let _minimized = false;
 let _visible = false;
 
-// Drag state
-let _dragState = null;
-// Resize state
-let _resizeState = null;
-
-/**
- * Open the Link Panel. If no link exists, shows setup view.
- */
+// Drag state
+let _dragState = null;
+let _dragRaf = 0;
+let _pendingDragFrame = null;
+// Resize state
+let _resizeState = null;
+let _resizeRaf = 0;
+let _pendingResizeFrame = null;
+
+function _applyDragFrame() {
+  _dragRaf = 0;
+  if (!_panel || !_pendingDragFrame) return;
+  _panel.style.left = _pendingDragFrame.left + 'px';
+  _panel.style.top = _pendingDragFrame.top + 'px';
+}
+
+function _scheduleDragFrame(left, top) {
+  _pendingDragFrame = { left, top };
+  if (!_dragRaf) _dragRaf = requestAnimationFrame(_applyDragFrame);
+}
+
+function _flushDragFrame() {
+  if (_dragRaf) {
+    cancelAnimationFrame(_dragRaf);
+    _dragRaf = 0;
+  }
+  _applyDragFrame();
+}
+
+function _applyResizeFrame() {
+  _resizeRaf = 0;
+  if (!_panel || !_pendingResizeFrame) return;
+  const { width, height, left, top } = _pendingResizeFrame;
+  if (width != null) _panel.style.width = width + 'px';
+  if (height != null) _panel.style.height = height + 'px';
+  if (left != null) _panel.style.left = left + 'px';
+  if (top != null) _panel.style.top = top + 'px';
+}
+
+function _scheduleResizeFrame(frame) {
+  _pendingResizeFrame = frame;
+  if (!_resizeRaf) _resizeRaf = requestAnimationFrame(_applyResizeFrame);
+}
+
+function _flushResizeFrame() {
+  if (_resizeRaf) {
+    cancelAnimationFrame(_resizeRaf);
+    _resizeRaf = 0;
+  }
+  _applyResizeFrame();
+}
+
+/**
+ * Open the Link Panel. If no link exists, shows setup view.
+ */
 export async function openLinkPanel() {
   console.log('[link-panel] openLinkPanel called, _panel=', !!_panel, '_visible=', _visible);
   if (_panel) {
@@ -575,26 +622,28 @@ function _onSyncResumed() {
 function _onDragStart(e) {
   if (e.target.closest('.link-panel-btn')) return;
   e.preventDefault();
-  const rect = _panel.getBoundingClientRect();
-  _panel.style.transform = 'none';
-  _dragState = { startX: e.clientX, startY: e.clientY, startLeft: rect.left, startTop: rect.top };
-  _panel.classList.add('dragging');
+  const rect = _panel.getBoundingClientRect();
+  _panel.style.transform = 'none';
+  _dragState = { startX: e.clientX, startY: e.clientY, startLeft: rect.left, startTop: rect.top };
+  _pendingDragFrame = null;
+  _panel.classList.add('dragging');
   document.addEventListener('mousemove', _onDragMove);
   document.addEventListener('mouseup', _onDragEnd);
 }
 
-function _onDragMove(e) {
-  if (!_dragState) return;
-  const dx = e.clientX - _dragState.startX;
-  const dy = e.clientY - _dragState.startY;
-  _panel.style.left = (_dragState.startLeft + dx) + 'px';
-  _panel.style.top = (_dragState.startTop + dy) + 'px';
-}
-
-function _onDragEnd() {
-  _dragState = null;
-  _panel.classList.remove('dragging');
-  document.removeEventListener('mousemove', _onDragMove);
+function _onDragMove(e) {
+  if (!_dragState) return;
+  const dx = e.clientX - _dragState.startX;
+  const dy = e.clientY - _dragState.startY;
+  _scheduleDragFrame(_dragState.startLeft + dx, _dragState.startTop + dy);
+}
+
+function _onDragEnd() {
+  if (!_dragState) return;
+  _flushDragFrame();
+  _dragState = null;
+  _panel.classList.remove('dragging');
+  document.removeEventListener('mousemove', _onDragMove);
   document.removeEventListener('mouseup', _onDragEnd);
   _savePosition();
 }
@@ -625,36 +674,41 @@ function _onResizeStart(e) {
     left: x < edge, right: x > rect.width - edge,
     top: y < edge, bottom: y > rect.height - edge,
   };
-  if (!dirs.left && !dirs.right && !dirs.top && !dirs.bottom) return;
-  e.preventDefault();
-  _resizeState = { dirs, startX: e.clientX, startY: e.clientY, startRect: rect };
-  document.addEventListener('mousemove', _onResizeMove);
+  if (!dirs.left && !dirs.right && !dirs.top && !dirs.bottom) return;
+  e.preventDefault();
+  _resizeState = { dirs, startX: e.clientX, startY: e.clientY, startRect: rect };
+  _pendingResizeFrame = null;
+  document.addEventListener('mousemove', _onResizeMove);
   document.addEventListener('mouseup', _onResizeEnd);
 }
 
-function _onResizeMove(e) {
-  if (!_resizeState) return;
-  const { dirs, startX, startY, startRect } = _resizeState;
-  const dx = e.clientX - startX, dy = e.clientY - startY;
-  const minW = 320, minH = 300;
-  if (dirs.right) _panel.style.width = Math.max(minW, startRect.width + dx) + 'px';
-  if (dirs.bottom) _panel.style.height = Math.max(minH, startRect.height + dy) + 'px';
-  if (dirs.left) {
-    const newW = Math.max(minW, startRect.width - dx);
-    _panel.style.width = newW + 'px';
-    _panel.style.left = (startRect.left + startRect.width - newW) + 'px';
-  }
-  if (dirs.top) {
-    const newH = Math.max(minH, startRect.height - dy);
-    _panel.style.height = newH + 'px';
-    _panel.style.top = (startRect.top + startRect.height - newH) + 'px';
-  }
-}
-
-function _onResizeEnd() {
-  _resizeState = null;
-  document.removeEventListener('mousemove', _onResizeMove);
-  document.removeEventListener('mouseup', _onResizeEnd);
+function _onResizeMove(e) {
+  if (!_resizeState) return;
+  const { dirs, startX, startY, startRect } = _resizeState;
+  const dx = e.clientX - startX, dy = e.clientY - startY;
+  const minW = 320, minH = 300;
+  const frame = {};
+  if (dirs.right) frame.width = Math.max(minW, startRect.width + dx);
+  if (dirs.bottom) frame.height = Math.max(minH, startRect.height + dy);
+  if (dirs.left) {
+    const newW = Math.max(minW, startRect.width - dx);
+    frame.width = newW;
+    frame.left = startRect.left + startRect.width - newW;
+  }
+  if (dirs.top) {
+    const newH = Math.max(minH, startRect.height - dy);
+    frame.height = newH;
+    frame.top = startRect.top + startRect.height - newH;
+  }
+  _scheduleResizeFrame(frame);
+}
+
+function _onResizeEnd() {
+  if (!_resizeState) return;
+  _flushResizeFrame();
+  _resizeState = null;
+  document.removeEventListener('mousemove', _onResizeMove);
+  document.removeEventListener('mouseup', _onResizeEnd);
   _savePosition();
 }
 

package/neural-interface/public/shared/ui-loading.js

@@ -104,10 +104,8 @@ function resetLoadingToConnecting() {
 export async function checkHealth() {
   try {
     const health = await fetchHealth();
-    // Cache projectDir for the server-offline command display
     if (health.projectDir) {
       localStorage.setItem('synabun-project-dir', health.projectDir);
-      updateCmdText(health.projectDir);
     }
     if (!health.ok) {
       const messages = {
@@ -130,11 +128,11 @@ export async function checkHealth() {
 }
 
 /**
- * Update the command text element with the full path to npm start.
+ * Update the command text element with the restart command.
  */
 function updateCmdText(projectDir) {
   const cmdEl = $('loading-cmd-text');
-  if (cmdEl) cmdEl.textContent = `cd ${projectDir} && npm start`;
+  if (cmdEl) cmdEl.textContent = `cd "${projectDir}" ; npm start`;
 }
 
 // ═══════════════════════════════════════════
@@ -167,6 +165,8 @@ async function handleStartAction() {
       if ($label) $label.textContent = t('common.retry');
     }
   } catch (err) {
+    // Server is unreachable — try protocol handler as fallback
+    window.location.href = 'synabun://start';
     if ($status) $status.textContent = t('loading.somethingWrong');
     if (btn) btn.disabled = false;
     if ($label) $label.textContent = t('common.retry');

package/neural-interface/public/shared/ui-memory-maintenance.js

@@ -0,0 +1,111 @@
+async function api(path,body) {
+  const response=await fetch(path,body ? {method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify(body)} : {});
+  const data=await response.json();
+  if(!response.ok)throw new Error(data.error || DEFAULT_STRINGS.requestFailed);
+  return data;
+}
+function element(tag,text,className) {
+  const el=document.createElement(tag); if(text)el.textContent=text; if(className)el.className=className; return el;
+}
+function button(label,action,tag,help) {
+  const el=element('button',label,'conn-action-btn'); el.type='button';
+  if(tag)el.dataset.stgId=tag;
+  if(help)el.title=help;
+  el.addEventListener('click',async()=>{el.disabled=true;try{await action();}finally{el.disabled=false;}});
+  return el;
+}
+const fill=(text,params)=>String(text).replace(/\{(\w+)\}/g,(m,name)=>params&&params[name]!=null?params[name]:m);
+
+// English defaults. Settings passes translated copy as `strings`, which is merged over these
+// (the browser test mounts this module alone and relies on the defaults).
+// `tag` ids are the Settings inventory ids of the controls this module renders.
+const DEFAULT_STRINGS = {
+  requestFailed:'Memory request failed',
+  loading:'Loading memory status…',
+  running:'Maintenance running',
+  paused:'Maintenance paused',
+  noWork:'No pending work',
+  pause:'Pause maintenance',
+  resume:'Resume maintenance',
+  refresh:'Refresh',
+  retry:'Retry failed jobs',
+  undo:'Undo relationship',
+  confirm:'Confirm conflict',
+  noReview:'No relationships awaiting review.',
+  jobCount:'{count} {status}',
+  help:{pause:'',resume:'',refresh:'',retry:'',undo:'',confirm:'',details:''},
+  jobStatus:{},
+  relationKind:{},
+};
+
+export function mountMemoryMaintenance(root,{strings={},onStatus}={}) {
+  if(!root || root.dataset.mounted)return;
+  root.dataset.mounted='true';
+  const text={...DEFAULT_STRINGS,...strings,help:{...DEFAULT_STRINGS.help,...strings.help},jobStatus:{...DEFAULT_STRINGS.jobStatus,...strings.jobStatus},relationKind:{...DEFAULT_STRINGS.relationKind,...strings.relationKind}};
+  const status=element('p',text.loading,'stg-help');
+  status.setAttribute('role','status');
+  const actions=element('div');actions.style.cssText='display:flex;gap:8px;flex-wrap:wrap;margin:8px 0';
+  const review=element('div');
+  root.append(status,actions,review);
+  async function load(operation) {
+    try {
+      const data=await api('/api/memory-maintenance',operation);
+      const jobs=data.jobs.map(j=>fill(text.jobCount,{count:j.count,status:text.jobStatus[j.status]||j.status})).join(' · ') || text.noWork;
+      status.textContent=`${data.paused ? text.paused : text.running} · ${jobs}`;
+      if(onStatus)try{onStatus(data);}catch{}
+      actions.replaceChildren(
+        data.paused ? button(text.resume,()=>load({operation:'resume'}),'MEM012',text.help.resume) : button(text.pause,()=>load({operation:'pause'}),'MEM012',text.help.pause),
+        button(text.refresh,()=>load(),'MEM013',text.help.refresh),button(text.retry,()=>load({operation:'retry'}),'MEM014',text.help.retry),
+      );
+      review.replaceChildren();
+      for(const relation of data.relationships || []) {
+        const row=element('details');row.style.margin='8px 0';
+        const summary=element('summary',`${text.relationKind[relation.kind]||relation.kind.replaceAll('_',' ')} · ${relation.from_id.slice(0,8)} → ${relation.to_id.slice(0,8)}`);
+        summary.dataset.stgId='MEM001';
+        if(text.help.details)summary.title=text.help.details;
+        row.append(summary);
+        const evidence=element('div');
+        let loaded=false;
+        row.addEventListener('toggle',async()=>{
+          if(!row.open || loaded)return; loaded=true;
+          try {
+            for(const id of [relation.from_id,relation.to_id]) {
+              const m=await api('/api/memory/'+encodeURIComponent(id));
+              const pre=element('pre',`[${id}]\n${m.payload.content}`);pre.style.cssText='white-space:pre-wrap;overflow-wrap:anywhere;max-height:240px;overflow:auto';evidence.append(pre);
+            }
+          }catch(error){evidence.textContent=error.message;loaded=false;}
+        });
+        row.append(evidence,button(text.undo,()=>load({operation:'undo-relation',id:relation.id}),'MEM015',text.help.undo));
+        if(relation.kind==='possible_conflict')row.append(button(text.confirm,()=>load({operation:'confirm-relation',id:relation.id,from_id:relation.from_id,to_id:relation.to_id,kind:'conflicts_with'}),'MEM016',text.help.confirm));
+        review.append(row);
+      }
+      if(!data.relationships?.length)review.append(element('p',text.noReview,'stg-help'));
+    }catch(error){status.textContent=error.message;}
+  }
+  load();
+}
+
+export function mountMemoryHistory(root,id,onRestore=()=>{}) {
+  if(!root)return;
+  const details=element('details'); details.style.marginTop='12px';
+  details.append(element('summary','Revision history'));
+  const body=element('div');details.append(body);root.append(details);
+  async function load() {
+    body.textContent='Loading revisions…';
+    try {
+      const data=await api(`/api/memory/${encodeURIComponent(id)}/history`);
+      body.replaceChildren();
+      for(const revision of data.revisions) {
+        const entry=element('details');entry.append(element('summary',`Revision ${revision.revision} · ${revision.recorded_at}`));
+        const pre=element('pre',revision.payload.content);pre.style.cssText='white-space:pre-wrap;overflow-wrap:anywhere;max-height:300px;overflow:auto';
+        entry.append(pre);
+        if(revision.revision!==data.revision)entry.append(button('Restore this revision',async()=>{
+          try {await api(`/api/memory/${encodeURIComponent(id)}/undo`,{revision:revision.revision,expected_revision:data.revision});await onRestore();await load();}
+          catch(error){body.prepend(element('p',error.message));}
+        }));
+        body.append(entry);
+      }
+    }catch(error){body.textContent=error.message;}
+  }
+  details.addEventListener('toggle',()=>{if(details.open)load();});
+}

package/neural-interface/public/shared/ui-menubar.js

@@ -12,6 +12,8 @@ import { openHelp } from './ui-help.js';
 import { registerAction } from './ui-keybinds.js';
 import { isGuest, hasPermission } from './ui-sync.js';
 import { sendToPanel } from './ui-claude-panel.js';
+import { forceCheckToolUpdates, showUpdateToast, TOOL_LABELS } from './ui-tool-updates.js';
+import { forceCheckSynabunUpdate, openSynabunUpdateModal } from './ui-update.js';
 
 const $ = (id) => document.getElementById(id);
 
@@ -126,12 +128,18 @@ export function initMenubar() {
     'menu-open-skills-studio': 'skills',
     'menu-skills-new': 'skills',
     'menu-skills-import': 'skills',
+    'menu-open-styleguide': 'styleGuide',
     'menu-open-automation-studio': 'automations',
+    'menu-automations-schedule-new': 'automations',
+    'menu-automations-quick-timer': 'automations',
+    'menu-automations-schedule-groups': 'automations',
     'menu-automations-new': 'automations',
     'menu-automations-import': 'automations',
+    'menu-terminal-assistant': 'terminal',
     'menu-terminal-claude': 'terminal',
     'menu-terminal-codex': 'terminal',
     'menu-terminal-gemini': 'terminal',
+    'menu-terminal-opencode': 'terminal',
     'menu-terminal-shell': 'terminal',
     'menu-terminal-browser': 'browser',
     'menu-terminal-youtube': 'browser',
@@ -318,6 +326,27 @@ function wireAutomationsMenu() {
       emit('automations:open-schedules');
     });
   }
+  const newScheduleItem = $('menu-automations-schedule-new');
+  if (newScheduleItem) {
+    newScheduleItem.addEventListener('click', () => {
+      closeAll();
+      emit('automations:open-schedules', { action: 'new-schedule' });
+    });
+  }
+  const quickTimerItem = $('menu-automations-quick-timer');
+  if (quickTimerItem) {
+    quickTimerItem.addEventListener('click', () => {
+      closeAll();
+      emit('automations:open-schedules', { action: 'quick-timer' });
+    });
+  }
+  const scheduleGroupsItem = $('menu-automations-schedule-groups');
+  if (scheduleGroupsItem) {
+    scheduleGroupsItem.addEventListener('click', () => {
+      closeAll();
+      emit('automations:open-schedules', { tab: 'groups' });
+    });
+  }
   const newItem = $('menu-automations-new');
   if (newItem) {
     newItem.addEventListener('click', () => {
@@ -340,9 +369,39 @@ function wireAutomationsMenu() {
 
 function wireTerminalMenu() {
   const items = {
+    'menu-terminal-assistant': () => emit('assistant:open'),
     'menu-terminal-claude':  () => emit('terminal:open', { profile: 'claude-code' }),
     'menu-terminal-codex':   () => emit('terminal:open', { profile: 'codex' }),
-    'menu-terminal-gemini':  () => emit('terminal:open', { profile: 'gemini' }),
+    'menu-terminal-gemini':   () => emit('terminal:open', { profile: 'gemini' }),
+    'menu-terminal-opencode': () => emit('terminal:open', { profile: 'opencode' }),
+    'menu-check-cli-updates': async () => {
+      const [tools, syn] = await Promise.all([
+        forceCheckToolUpdates(),
+        forceCheckSynabunUpdate(),
+      ]);
+
+      const updates = [];
+      for (const [key, info] of Object.entries(tools?.tools || {})) {
+        if (info?.updateAvailable) {
+          const label = `${TOOL_LABELS[key] || key} v${info.installed} → v${info.latest}`;
+          updates.push({ label });
+        }
+      }
+      if (syn?.updateAvailable) {
+        const srcLabel = syn.source === 'both' ? 'npm + GitHub' : syn.source === 'github' ? 'GitHub' : 'npm';
+        updates.push({ label: `SynaBun v${syn.current} → v${syn.latest}`, source: srcLabel });
+      }
+
+      const errors = [];
+      if (!tools) errors.push('CLI versions');
+      if (!syn)   errors.push('SynaBun version');
+
+      showUpdateToast({
+        updates,
+        errors,
+        onClick: syn?.updateAvailable ? () => openSynabunUpdateModal() : null,
+      });
+    },
     'menu-terminal-shell':   () => emit('terminal:open', { profile: 'shell' }),
     'menu-terminal-browser': () => emit('browser:open'),
     'menu-terminal-youtube': () => emit('browser:open', { url: 'https://www.youtube.com' }),
@@ -350,6 +409,7 @@ function wireTerminalMenu() {
     'menu-terminal-x':       () => emit('browser:open', { url: 'https://x.com' }),
     'menu-terminal-whatsapp': () => emit('browser:open', { url: 'https://web.whatsapp.com' }),
     'menu-app-leonardo':     () => { emit('browser:open', { url: 'https://app.leonardo.ai' }); emit('leonardo:launch'); },
+    'menu-open-styleguide':  () => emit('styleguide:open'),
     'menu-command-runner':   () => emit('command-runner:open'),
     'menu-terminal-link':    () => emit('link:toggle'),
     'menu-terminal-toggle':  () => emit('terminal:toggle'),
@@ -372,12 +432,37 @@ function wireTerminalMenu() {
           const hd = await h.json();
           if (hd.projectDir) localStorage.setItem('synabun-project-dir', hd.projectDir);
         } catch {}
-        await fetch('/api/server/restart', { method: 'POST' });
-        // Show brief message then attempt reconnect after delay
         document.title = 'Restarting...';
-        setTimeout(() => location.reload(), 2000);
+        await fetch('/api/server/restart', { method: 'POST' });
+
+        // Poll /api/health until the server has gone down AND come back up.
+        // The everDown flag prevents premature reload during the brief window
+        // where the old process is still serving requests during shutdown grace.
+        const deadline = Date.now() + 15000;
+        let everDown = false;
+        while (Date.now() < deadline) {
+          await new Promise(r => setTimeout(r, 250));
+          try {
+            const r = await fetch('/api/health', { cache: 'no-store' });
+            if (!r.ok) { everDown = true; continue; }
+            if (everDown) { location.reload(); return; }
+          } catch { everDown = true; }
+        }
+        // Timeout safety net — reload anyway so the user isn't stranded.
+        location.reload();
       } catch {}
     },
+    'menu-stop-server':      async () => {
+      const previousTitle = document.title;
+      try {
+        document.title = 'Stopping...';
+        const response = await fetch('/api/server/shutdown', { method: 'POST' });
+        if (!response.ok) throw new Error(`Server stop failed (${response.status})`);
+        document.title = 'SynaBun Stopped';
+      } catch {
+        document.title = previousTitle;
+      }
+    },
   };
   Object.entries(items).forEach(([id, handler]) => {
     const el = $(id);

package/neural-interface/public/shared/ui-native-loop-router-state.js

@@ -0,0 +1,94 @@
+export function isNewerRunDescriptor(next, current, terminalStatuses) {
+  if (!current) return true;
+  const nextTerminal = terminalStatuses.has(next.status);
+  const currentTerminal = terminalStatuses.has(current.status);
+  if (currentTerminal !== nextTerminal) return nextTerminal;
+  const nextVersion = Number(next.version) || 0;
+  const currentVersion = Number(current.version) || 0;
+  if (nextVersion !== currentVersion) return nextVersion > currentVersion;
+  const nextTime = new Date(next.updatedAt || next.startedAt || 0).getTime() || 0;
+  const currentTime = new Date(current.updatedAt || current.startedAt || 0).getTime() || 0;
+  if (nextTime !== currentTime) return nextTime > currentTime;
+  return (Number(next.currentIteration) || 0) >= (Number(current.currentIteration) || 0);
+}
+
+export function hasActiveForeignClaim(run, windowId, claimTtlMs, now = Date.now) {
+  if (!run?.claimedBy || run.claimedBy === windowId) return false;
+  const claimedAt = new Date(run.claimedAt || 0).getTime();
+  const claimAge = claimedAt ? now() - claimedAt : Infinity;
+  return claimAge <= claimTtlMs;
+}
+
+/**
+ * Resolve the descriptor to attach after acquiring (or reusing) a claim.
+ *
+ * The claim endpoint broadcasts before its HTTP response is delivered. That
+ * broadcast may replace latestEntry while claim() is in flight; a compatible
+ * self-claim is therefore fresh state, not a reason to release the claim.
+ */
+export async function resolveRouteClaim({
+  entry,
+  alreadyOwned,
+  claim,
+  getLatestEntry,
+  windowId,
+  claimTtlMs,
+  terminalStatuses,
+  now = Date.now,
+}) {
+  let claimedRun = entry?.run || null;
+  if (!alreadyOwned) {
+    claimedRun = await claim(claimedRun);
+    if (!claimedRun) return { ok: false, release: false, reason: 'claim_failed' };
+  }
+
+  const latestEntry = getLatestEntry();
+  if (!latestEntry?.run) {
+    return { ok: false, release: !alreadyOwned, reason: 'route_removed' };
+  }
+  if (hasActiveForeignClaim(latestEntry.run, windowId, claimTtlMs, now)) {
+    return { ok: false, release: false, reason: 'foreign_claim' };
+  }
+
+  const run = isNewerRunDescriptor(latestEntry.run, claimedRun, terminalStatuses)
+    ? latestEntry.run
+    : claimedRun;
+  return {
+    ok: true,
+    run,
+    focus: latestEntry.focus ?? entry?.focus,
+  };
+}
+
+export class LocalReleaseTracker {
+  constructor({ ttlMs = 5_000, now = Date.now } = {}) {
+    this.ttlMs = ttlMs;
+    this.now = now;
+    this.entries = new Map();
+  }
+
+  mark(runId) {
+    this.prune();
+    const token = {};
+    this.entries.set(runId, { token, at: this.now() });
+    return token;
+  }
+
+  consume(runId) {
+    const entry = this.entries.get(runId);
+    if (!entry) return false;
+    this.entries.delete(runId);
+    return this.now() - entry.at <= this.ttlMs;
+  }
+
+  clear(runId, token) {
+    if (this.entries.get(runId)?.token === token) this.entries.delete(runId);
+  }
+
+  prune() {
+    const cutoff = this.now() - this.ttlMs;
+    for (const [runId, entry] of this.entries) {
+      if (entry.at < cutoff) this.entries.delete(runId);
+    }
+  }
+}