synabun 2026.4.25-beta.1 → 2026.4.25-beta.2

package/CHANGELOG.md

@@ -43,6 +43,20 @@ Raw internal changelogs are archived in [changelog/](changelog/).
 ### Changed — Claude Restored Tab Selection
 - **Restored Claude tabs keep stable IDs** — Updated `createTab()` in `ui-claude-panel.js` to accept a restored `id`, and changed `restoreTabs()` to pass saved tab IDs through. Placeholder click-through can now target the restored Claude tab instead of losing selection because the panel generated a fresh `crypto.randomUUID()` during bootstrap.
 
+### Changed — Backup System Coverage Expanded
+- **Backup file lists extended** — Added `stored-plans.json`, `synabun-plugins.json`, `mcp-registry.json`, and `active-profile.json` to both manual `GET /api/system/backup` (`neural-interface/server.js:10457`) and auto-backup `buildBackupZipToFile()` (`neural-interface/server.js:10844`) file arrays. These cover the post-plan hook plan→memory tracker, plugin install registry, third-party MCP server registry + profile defs, and active MCP profile selection — all previously lost on restore.
+- **Plan markdown history backed up recursively** — Added `addDirRecursive('data/plans', ...)` to both manual and auto backup paths (`neural-interface/server.js:10483`, `:10868`) so the date-sliced plan tree (`data/plans/YYYY-MM-DD/*.md`) rides along.
+- **Restore creates `plans` subdir** — Added `'plans'` to the `mkdirSync` subdir list in `POST /api/system/restore` (`neural-interface/server.js:10617`). Existing recursive `data/` write loop already extracts plan files via `dirname(target)` mkdir.
+- **Backward compatible with old backups** — Manifest version check still accepts `version 1 || 2`. Old backups restore exactly as before — missing new files skipped silently, no schema migration required.
+
+### Added — CLI-Not-Installed Indicator in Sidepanels
+- **Empty-state banner across Claude, Codex, OpenCode panels** — Detects when the corresponding CLI binary is missing and renders a warning banner inside the panel's empty state (`.cp-empty` / `.cxp-empty` / `.ocp-empty`) with the install command, an "Install guide" link to the official docs, and a "Re-check" button. Banner is removed automatically once the CLI is detected.
+- **Shared status module `cli-status.js`** — New `neural-interface/public/shared/cli-status.js` wraps the existing `/api/system/tool-versions` endpoint with a subscriber + auto-poll layer. Exposes `subscribeCliStatus(toolKey, cb)`, `recheckCliStatus(toolKey)`, `getCliDocUrl(toolKey)`, `getCliInstallCommand(toolKey)`, `getCliLabel(toolKey)`. Polls every 30s while at least one subscribed tool reports `installed === null`; stops once detected or unsubscribed. 10s in-memory cache + single in-flight fetch dedup.
+- **Send-button gating** — Each panel's send/input flow is now blocked while the CLI is missing. `ui-claude-panel.js` `send()` returns early with a notification. `cdx/cdx-tabs.js` `syncInputEnabled` reads the `.cxp-cli-blocked` panel class to force `send.disabled = true`, and `sendPrompt()` returns early with a system message. `ocp/ocp-panel.js` `syncSendButton` short-circuits to disabled with the "OpenCode CLI not installed" tooltip; `handleSend` returns early via `setStatus('offline', …)`.
+- **Banner re-render hooks** — `cdx/cdx-tabs.js` `clearTranscript` now dispatches a `cdx-empty-rebuilt` CustomEvent and `ocp/ocp-render.js` `renderEmptyState` dispatches `ocp-empty-rebuilt`, so the banner re-injects itself after the empty state is rebuilt during session resets.
+- **Official install URLs** — `claude-code` → `https://docs.claude.com/en/docs/claude-code/setup`, `codex` → `https://developers.openai.com/codex/cli/`, `opencode` → `https://opencode.ai/docs/`. (`gemini` constants defined for future use; no Gemini sidepanel currently exists.)
+- **Banner styles** — Added `.cp-cli-missing*`, `.cxp-cli-missing*`, `.ocp-cli-missing*` rule sets to `ui-claude-panel.js` style block, `cdx/cdx-styles.js`, and `ocp/ocp-styles.js`. Includes `.cp-cli-blocked` / `.cxp-cli-blocked` / `.ocp-cli-blocked` panel classes for the dimmed input state.
+
 ## 2026-04-24
 
 ### Added — "Continue planning" in OpenCode, Codex, and Claude plan UIs

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

@@ -4,6 +4,7 @@
 import { storage } from '../storage.js';
 import { state, emit, on } from '../state.js';
 import { reserveRightPanelLayout, clearRightPanelLayout } from '../ui-sidepanel-layout.js';
+import { subscribeCliStatus, recheckCliStatus, getCliDocUrl, getCliInstallCommand, getCliLabel } from '../cli-status.js';
 import { isClaudePanelOpen, toggleClaudePanel } from '../ui-claude-panel.js';
 import { injectStyles } from './cdx-styles.js';
 import { appendAssistantMarkdownMessage, flushCardBody, renderPostPlanActions } from './cdx-render.js';
@@ -46,6 +47,8 @@ document.addEventListener('visibilitychange', () => {
 let _panel = null;
 let _visible = false;
 let _resizeBound = false;
+let _cliInstalled = null;
+let _cliUnsub = null;
 
 // ═══════════════════════════════════════════
 //  Bound State (mirrors active tab — managed by cdx-tabs)
@@ -390,6 +393,74 @@ function startupEmptyText() {
   return '';
 }
 
+// ── CLI installation status (banner + send-block) ──
+function renderCliMissingBanner(emptyEl) {
+  if (!emptyEl) return;
+  const label = getCliLabel('codex');
+  const cmd = getCliInstallCommand('codex');
+  const url = getCliDocUrl('codex');
+  const statusEl = emptyEl.querySelector('.cxp-empty-status');
+  if (statusEl) statusEl.style.display = 'none';
+  let banner = emptyEl.querySelector('.cxp-cli-missing');
+  if (!banner) {
+    banner = document.createElement('div');
+    banner.className = 'cxp-cli-missing';
+    banner.innerHTML = `
+      <div class="cxp-cli-missing-title">${label} CLI not installed</div>
+      <div class="cxp-cli-missing-body">Run: <code>${cmd}</code></div>
+      <div class="cxp-cli-missing-actions">
+        <a class="cxp-cli-missing-link" href="${url}" target="_blank" rel="noopener noreferrer">Install guide</a>
+        <button class="cxp-cli-missing-recheck" type="button">Re-check</button>
+      </div>
+    `;
+    emptyEl.appendChild(banner);
+    const btn = banner.querySelector('.cxp-cli-missing-recheck');
+    btn?.addEventListener('click', async () => {
+      btn.disabled = true;
+      btn.textContent = 'Checking…';
+      try { await recheckCliStatus('codex'); }
+      finally {
+        if (btn.isConnected) {
+          btn.disabled = false;
+          btn.textContent = 'Re-check';
+        }
+      }
+    });
+  }
+}
+
+function refreshCliBanners() {
+  if (!_panel) return;
+  const empties = _panel.querySelectorAll('.cxp-empty');
+  if (_cliInstalled === null) {
+    _panel.classList.add('cxp-cli-blocked');
+    for (const el of empties) renderCliMissingBanner(el);
+  } else {
+    _panel.classList.remove('cxp-cli-blocked');
+    for (const el of empties) {
+      const banner = el.querySelector('.cxp-cli-missing');
+      if (banner) banner.remove();
+      const statusEl = el.querySelector('.cxp-empty-status');
+      if (statusEl) statusEl.style.display = '';
+    }
+  }
+  // Re-evaluate send button state with new CLI flag
+  try { syncInputEnabled(); } catch {}
+}
+
+export function isCdxCliInstalled() {
+  return _cliInstalled !== null;
+}
+
+function ensureCliSubscription() {
+  if (_cliUnsub) return;
+  _cliUnsub = subscribeCliStatus('codex', (info) => {
+    _cliInstalled = info?.installed || null;
+    refreshCliBanners();
+  });
+  document.addEventListener('cdx-empty-rebuilt', () => refreshCliBanners());
+}
+
 // ═══════════════════════════════════════════
 //  setVisible — Show / Hide Panel
 // ═══════════════════════════════════════════
@@ -426,6 +497,7 @@ function setVisible(nextVisible) {
     loadCurrentProfile();
     loadRecallProfile();
     panelEl('#cxp-input')?.focus();
+    refreshCliBanners();
   } else {
     document.removeEventListener('keydown', _cdxDocEscHandler, { capture: true });
   }
@@ -971,6 +1043,7 @@ function ensurePanel() {
   autosizeInput();
   restoreTabs();
   syncInputEnabled();
+  ensureCliSubscription();
   window.dispatchEvent(new CustomEvent('sidepanel-tray:provider-loaded', { detail: { provider: 'codex' } }));
   // Close Codex when a Claude/OpenCode pill is clicked (mutual exclusion)
   const tray = document.getElementById('term-minimized-tray');

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

@@ -984,6 +984,38 @@ export function injectStyles() {
     .cxp-empty-logo svg { width: 32px; height: 32px; opacity: 0.25; }
     .cxp-empty-name { font-size: 13px; font-weight: 500; color: rgba(255,255,255,0.35); letter-spacing: 0.02em; }
     .cxp-empty-status { font-size: 11px; color: rgba(255,255,255,0.28); line-height: 1.5; min-height: 1em; }
+    .cxp-cli-missing {
+      display: flex; flex-direction: column; align-items: center; gap: 8px;
+      max-width: 320px; padding: 14px 16px; margin-top: 4px;
+      border: 1px solid rgba(255,180,80,0.35); border-radius: 8px;
+      background: rgba(255,180,80,0.06);
+    }
+    .cxp-cli-missing-title {
+      font-size: 12px; font-weight: 600; color: rgba(255,200,120,0.9);
+      letter-spacing: 0.02em;
+    }
+    .cxp-cli-missing-body {
+      font-size: 11px; color: rgba(255,255,255,0.55); text-align: center; line-height: 1.45;
+    }
+    .cxp-cli-missing-body code {
+      display: inline-block; padding: 1px 6px; margin-top: 4px;
+      background: rgba(0,0,0,0.35); border-radius: 4px; font-size: 10.5px;
+      color: rgba(255,255,255,0.75);
+    }
+    .cxp-cli-missing-actions { display: flex; gap: 8px; margin-top: 4px; }
+    .cxp-cli-missing-link, .cxp-cli-missing-recheck {
+      display: inline-flex; align-items: center; gap: 4px;
+      padding: 5px 10px; font-size: 11px; font-weight: 500;
+      border-radius: 5px; border: 1px solid rgba(255,255,255,0.15);
+      background: rgba(255,255,255,0.04); color: rgba(255,255,255,0.85);
+      text-decoration: none; cursor: pointer; user-select: none;
+    }
+    .cxp-cli-missing-link:hover, .cxp-cli-missing-recheck:hover {
+      background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.3);
+    }
+    .cxp-cli-missing-recheck:disabled { opacity: 0.5; cursor: default; }
+    .codex-panel.cxp-cli-blocked .cxp-send { opacity: 0.4 !important; cursor: not-allowed !important; }
+    .codex-panel.cxp-cli-blocked .cxp-input { opacity: 0.7; }
     .cxp-system {
       align-self: center;
       max-width: 92%;

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

@@ -2041,6 +2041,7 @@ function startupEmptyText() {
 export function clearTranscript(emptyText = freshThreadText()) {
   if (!_messagesEl) return;
   _messagesEl.innerHTML = `<div class="cxp-empty"><div class="cxp-empty-logo">${OPENAI_ICON}</div><span class="cxp-empty-name">Codex</span><span class="cxp-empty-status"></span></div>`;
+  document.dispatchEvent(new CustomEvent('cdx-empty-rebuilt'));
   _items.clear();
   _requestCards.clear();
   _blockingServerRequests = new Map();
@@ -3271,11 +3272,12 @@ export function syncInputEnabled() {
   const hasPaths = !!(tab?.pendingPaths?.length);
   const blockedByRequest = hasBlockingServerRequests();
   if (input) input.disabled = !_connected || !_bootstrapped || _startingThread || blockedByRequest;
+  const cliBlocked = document.getElementById('codex-panel')?.classList.contains('cxp-cli-blocked');
   if (send) {
     const isStopMode = !!(tab?.running || _running);
     send.classList.toggle('cxp-send-stopping', !!isStopMode);
-    send.title = isStopMode ? 'Stop' : 'Send';
-    send.disabled = isStopMode ? false : (!_connected || !_bootstrapped || _running || _startingThread || blockedByRequest || (!hasText && !hasImages && !hasPaths));
+    send.title = cliBlocked ? 'Codex CLI not installed' : (isStopMode ? 'Stop' : 'Send');
+    send.disabled = cliBlocked || (isStopMode ? false : (!_connected || !_bootstrapped || _running || _startingThread || blockedByRequest || (!hasText && !hasImages && !hasPaths)));
   }
   if (fresh) {
     pruneDiscardableTabs({ keepTab: tab, persist: true });
@@ -4528,6 +4530,12 @@ export function sendPrompt() {
   const { input, tab, prompt, images, paths } = payload;
   if (!input || !_connected || !_bootstrapped) return;
   if (!prompt && !images.length && !paths.length) return;
+  // Block when CLI binary missing — banner already informs user.
+  const panel = document.getElementById('codex-panel');
+  if (panel?.classList.contains('cxp-cli-blocked')) {
+    appendSystem('Codex CLI not installed. Install it first, then click Re-check.', 'error');
+    return;
+  }
   handleLocalSlashCommand(payload).then((handled) => {
     if (handled) return;
     if (_running && tab) {

package/neural-interface/public/shared/cli-status.js

@@ -0,0 +1,157 @@
+// ═══════════════════════════════════════════
+// SynaBun — CLI Status (shared)
+// Detects whether Claude / Codex / OpenCode CLIs are installed by
+// querying /api/system/tool-versions. Caches the response, fans out
+// updates to subscribers, and auto-polls (every 30s) while at least
+// one subscribed tool reports installed=null.
+// ═══════════════════════════════════════════
+
+const TOOL_KEYS = ['claude-code', 'codex', 'opencode', 'gemini'];
+
+const CLI_DOC_URLS = {
+  'claude-code': 'https://docs.claude.com/en/docs/claude-code/setup',
+  'codex':       'https://developers.openai.com/codex/cli/',
+  'opencode':    'https://opencode.ai/docs/',
+  'gemini':      'https://github.com/google-gemini/gemini-cli',
+};
+
+const CLI_INSTALL_CMDS = {
+  'claude-code': 'npm install -g @anthropic-ai/claude-code',
+  'codex':       'npm install -g @openai/codex',
+  'opencode':    'npm install -g opencode-ai',
+  'gemini':      'npm install -g @google/gemini-cli',
+};
+
+const CLI_LABELS = {
+  'claude-code': 'Claude Code',
+  'codex':       'Codex',
+  'opencode':    'OpenCode',
+  'gemini':      'Gemini CLI',
+};
+
+const POLL_INTERVAL_MS = 30000;
+const CACHE_TTL_MS = 10000;
+
+let _cache = { fetchedAt: 0, tools: null };
+let _inflight = null;
+const _subscribers = new Map();
+let _pollTimer = null;
+
+export function getCliDocUrl(toolKey) {
+  return CLI_DOC_URLS[toolKey] || null;
+}
+
+export function getCliInstallCommand(toolKey) {
+  return CLI_INSTALL_CMDS[toolKey] || '';
+}
+
+export function getCliLabel(toolKey) {
+  return CLI_LABELS[toolKey] || toolKey;
+}
+
+async function _fetchToolVersions(force) {
+  if (!force && _cache.tools && (Date.now() - _cache.fetchedAt) < CACHE_TTL_MS) {
+    return _cache.tools;
+  }
+  if (_inflight) return _inflight;
+  const url = force ? '/api/system/tool-versions?force=1' : '/api/system/tool-versions';
+  _inflight = (async () => {
+    try {
+      const res = await fetch(url);
+      if (!res.ok) throw new Error(`HTTP ${res.status}`);
+      const data = await res.json();
+      _cache = { fetchedAt: Date.now(), tools: data?.tools || {} };
+      return _cache.tools;
+    } finally {
+      _inflight = null;
+    }
+  })();
+  return _inflight;
+}
+
+function _emitChange(prevTools, nextTools) {
+  for (const key of TOOL_KEYS) {
+    const prev = prevTools?.[key]?.installed ?? null;
+    const next = nextTools?.[key]?.installed ?? null;
+    const subs = _subscribers.get(key);
+    if (!subs || !subs.size) continue;
+    if (prev !== next || prevTools == null) {
+      const info = nextTools?.[key] || { installed: null };
+      for (const cb of subs) {
+        try { cb(info); } catch (e) { console.error('[cli-status] subscriber error:', e); }
+      }
+    }
+  }
+}
+
+function _hasMissingSubscribed() {
+  for (const key of _subscribers.keys()) {
+    const subs = _subscribers.get(key);
+    if (!subs?.size) continue;
+    const installed = _cache.tools?.[key]?.installed ?? null;
+    if (!installed) return true;
+  }
+  return false;
+}
+
+function _maybeStartPoller() {
+  if (_pollTimer) return;
+  if (!_hasMissingSubscribed()) return;
+  _pollTimer = setInterval(async () => {
+    if (!_hasMissingSubscribed()) {
+      _stopPoller();
+      return;
+    }
+    const prev = _cache.tools;
+    try {
+      const next = await _fetchToolVersions(true);
+      _emitChange(prev, next);
+      if (!_hasMissingSubscribed()) _stopPoller();
+    } catch { /* ignore — retry next tick */ }
+  }, POLL_INTERVAL_MS);
+}
+
+function _stopPoller() {
+  if (_pollTimer) {
+    clearInterval(_pollTimer);
+    _pollTimer = null;
+  }
+}
+
+export async function getCliStatus(toolKey, { force = false } = {}) {
+  const tools = await _fetchToolVersions(force);
+  return tools?.[toolKey] || { installed: null, latest: null };
+}
+
+export function subscribeCliStatus(toolKey, callback) {
+  if (!TOOL_KEYS.includes(toolKey)) return () => {};
+  let set = _subscribers.get(toolKey);
+  if (!set) { set = new Set(); _subscribers.set(toolKey, set); }
+  set.add(callback);
+
+  const cached = _cache.tools?.[toolKey];
+  if (cached) {
+    try { callback(cached); } catch (e) { console.error('[cli-status] subscriber error:', e); }
+    _maybeStartPoller();
+  } else {
+    _fetchToolVersions(false).then((tools) => {
+      try { callback(tools?.[toolKey] || { installed: null }); } catch {}
+      _maybeStartPoller();
+    }).catch(() => {});
+  }
+
+  return () => {
+    const s = _subscribers.get(toolKey);
+    if (!s) return;
+    s.delete(callback);
+    if (!s.size) _subscribers.delete(toolKey);
+    if (!_hasMissingSubscribed()) _stopPoller();
+  };
+}
+
+export async function recheckCliStatus(toolKey) {
+  const prev = _cache.tools;
+  const next = await _fetchToolVersions(true);
+  _emitChange(prev, next);
+  return next?.[toolKey] || { installed: null };
+}

package/neural-interface/public/shared/ocp/ocp-panel.js

@@ -8,6 +8,7 @@ import { state, emit, on } from '../state.js';
 import { storage } from '../storage.js';
 import { fetchProjects } from '../api.js';
 import { reserveRightPanelLayout, clearRightPanelLayout } from '../ui-sidepanel-layout.js';
+import { subscribeCliStatus, recheckCliStatus, getCliDocUrl, getCliInstallCommand, getCliLabel } from '../cli-status.js';
 
 import { injectStyles } from './ocp-styles.js';
 import {
@@ -64,6 +65,8 @@ let _serverVersion = null;
 let _serverManaged = false;
 let _projects = [];
 let _projectsLoaded = false;
+let _cliInstalled = null;
+let _cliUnsub = null;
 
 function panelEl(sel) { return _panel?.querySelector(sel) || null; }
 
@@ -907,6 +910,10 @@ async function handleSend() {
   if (!input) return;
   const tab = activeTab();
   if (!tab) return;
+  if (_cliInstalled === null) {
+    setStatus('offline', 'OpenCode CLI not installed. Install it first, then click Re-check.');
+    return;
+  }
   let text = input.value.trim();
   const images = Array.isArray(tab.attachedImages) ? [...tab.attachedImages] : [];
   if (!text && !images.length) return;
@@ -1006,6 +1013,16 @@ function syncSendButton() {
   const tab = activeTab();
   if (!sendBtn) return;
 
+  const cliBlocked = _cliInstalled === null;
+
+  if (cliBlocked) {
+    sendBtn.classList.remove('running');
+    sendBtn.disabled = true;
+    sendBtn.setAttribute('data-tooltip', 'OpenCode CLI not installed');
+    sendBtn.setAttribute('aria-label', 'OpenCode CLI not installed');
+    return;
+  }
+
   if (tab?.running) {
     sendBtn.disabled = false;
     sendBtn.classList.add('running');
@@ -1503,6 +1520,69 @@ function _ocpDocEscHandler(event) {
   abortMessage();
 }
 
+// ── CLI installation status (banner + send-block) ──
+function renderCliMissingBanner(emptyEl) {
+  if (!emptyEl) return;
+  const label = getCliLabel('opencode');
+  const cmd = getCliInstallCommand('opencode');
+  const url = getCliDocUrl('opencode');
+  const hintEl = emptyEl.querySelector('.ocp-empty-hint');
+  if (hintEl) hintEl.style.display = 'none';
+  let banner = emptyEl.querySelector('.ocp-cli-missing');
+  if (!banner) {
+    banner = document.createElement('div');
+    banner.className = 'ocp-cli-missing';
+    banner.innerHTML = `
+      <div class="ocp-cli-missing-title">${label} CLI not installed</div>
+      <div class="ocp-cli-missing-body">Run: <code>${cmd}</code></div>
+      <div class="ocp-cli-missing-actions">
+        <a class="ocp-cli-missing-link" href="${url}" target="_blank" rel="noopener noreferrer">Install guide</a>
+        <button class="ocp-cli-missing-recheck" type="button">Re-check</button>
+      </div>
+    `;
+    emptyEl.appendChild(banner);
+    const btn = banner.querySelector('.ocp-cli-missing-recheck');
+    btn?.addEventListener('click', async () => {
+      btn.disabled = true;
+      btn.textContent = 'Checking…';
+      try { await recheckCliStatus('opencode'); }
+      finally {
+        if (btn.isConnected) {
+          btn.disabled = false;
+          btn.textContent = 'Re-check';
+        }
+      }
+    });
+  }
+}
+
+function refreshCliBanners() {
+  if (!_panel) return;
+  const empties = _panel.querySelectorAll('.ocp-empty');
+  if (_cliInstalled === null) {
+    _panel.classList.add('ocp-cli-blocked');
+    for (const el of empties) renderCliMissingBanner(el);
+  } else {
+    _panel.classList.remove('ocp-cli-blocked');
+    for (const el of empties) {
+      const banner = el.querySelector('.ocp-cli-missing');
+      if (banner) banner.remove();
+      const hintEl = el.querySelector('.ocp-empty-hint');
+      if (hintEl) hintEl.style.display = '';
+    }
+  }
+  syncSendButton();
+}
+
+function ensureCliSubscription() {
+  if (_cliUnsub) return;
+  _cliUnsub = subscribeCliStatus('opencode', (info) => {
+    _cliInstalled = info?.installed || null;
+    refreshCliBanners();
+  });
+  document.addEventListener('ocp-empty-rebuilt', () => refreshCliBanners());
+}
+
 function setVisible(nextVisible) {
   if (!_panel) return;
   if (!nextVisible) {
@@ -1528,6 +1608,7 @@ function setVisible(nextVisible) {
     if (_curProject) loadBranches(_curProject);
     loadCurrentProfile();
     loadRecallProfile();
+    refreshCliBanners();
   } else {
     document.removeEventListener('keydown', _ocpDocEscHandler, { capture: true });
   }
@@ -1651,6 +1732,7 @@ function ensurePanel() {
   window.dispatchEvent(new CustomEvent('sidepanel-tray:provider-loaded', { detail: { provider: 'opencode' } }));
 
   syncSendButton();
+  ensureCliSubscription();
 
   // Connect WebSocket
   connectWs(wsCallbacks());

package/neural-interface/public/shared/ocp/ocp-render.js

@@ -985,9 +985,10 @@ export function renderEmptyState(container) {
     <div class="ocp-empty">
       <svg viewBox="0 0 240 300"><path fill-rule="evenodd" d="M0 0h240v300H0V0zm30 30v240h180V30H30z" fill="currentColor"/><rect x="30" y="150" width="180" height="120" opacity=".45" fill="currentColor"/></svg>
       <span>OpenCode</span>
-      <span style="font-size:10px;opacity:0.5">Send a message to start</span>
+      <span class="ocp-empty-hint" style="font-size:10px;opacity:0.5">Send a message to start</span>
     </div>
   `;
+  document.dispatchEvent(new CustomEvent('ocp-empty-rebuilt'));
 }
 
 // ── Render full history from messages:list response ──

package/neural-interface/public/shared/ocp/ocp-styles.js

@@ -1521,6 +1521,39 @@ export function injectStyles() {
       stroke: currentColor; fill: none;
       stroke-width: 1; opacity: 0.3;
     }
+    .ocp-cli-missing {
+      display: flex; flex-direction: column; align-items: center; gap: 8px;
+      max-width: 320px; padding: 14px 16px; margin-top: 4px;
+      border: 1px solid rgba(255,180,80,0.35); border-radius: 8px;
+      background: rgba(255,180,80,0.06);
+      color: rgba(255,255,255,0.6);
+    }
+    .ocp-cli-missing-title {
+      font-size: 12px; font-weight: 600; color: rgba(255,200,120,0.9);
+      letter-spacing: 0.02em;
+    }
+    .ocp-cli-missing-body {
+      font-size: 11px; color: rgba(255,255,255,0.55); text-align: center; line-height: 1.45;
+    }
+    .ocp-cli-missing-body code {
+      display: inline-block; padding: 1px 6px; margin-top: 4px;
+      background: rgba(0,0,0,0.35); border-radius: 4px; font-size: 10.5px;
+      color: rgba(255,255,255,0.75);
+    }
+    .ocp-cli-missing-actions { display: flex; gap: 8px; margin-top: 4px; }
+    .ocp-cli-missing-link, .ocp-cli-missing-recheck {
+      display: inline-flex; align-items: center; gap: 4px;
+      padding: 5px 10px; font-size: 11px; font-weight: 500;
+      border-radius: 5px; border: 1px solid rgba(255,255,255,0.15);
+      background: rgba(255,255,255,0.04); color: rgba(255,255,255,0.85);
+      text-decoration: none; cursor: pointer; user-select: none;
+      font-family: inherit;
+    }
+    .ocp-cli-missing-link:hover, .ocp-cli-missing-recheck:hover {
+      background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.3);
+    }
+    .ocp-cli-missing-recheck:disabled { opacity: 0.5; cursor: default; }
+    .ocp-panel.ocp-cli-blocked .ocp-input { opacity: 0.7; }
 
     /* ── Thinking indicator ── */
     .ocp-thinking {

package/neural-interface/public/shared/ui-claude-panel.js

@@ -9,6 +9,7 @@ import { fetchClaudeSessions, fetchBrowserSessions, searchSessions } from './api
 import { createFrameRenderer } from './utils.js';
 import { notify, NOTIF_TYPE } from './ui-notifications.js';
 import { reserveRightPanelLayout, clearRightPanelLayout } from './ui-sidepanel-layout.js';
+import { subscribeCliStatus, recheckCliStatus, getCliDocUrl, getCliInstallCommand, getCliLabel } from './cli-status.js';
 
 const CLAUDE_ICON = '<svg fill="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><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>';
 
@@ -120,6 +121,10 @@ function activeTab() { return _tabs[_activeTabIdx] || null; }
 let _browserEmbed = null;   // { sessionId, ws, canvas, ctx, urlBar, container }
 let _browserEmbedVisible = false;
 
+// ── CLI-installed status (claude binary detection) ──
+let _cliInstalled = null;   // null = unknown / missing, version string = installed
+let _cliUnsub = null;
+
 // Marked.js (lazy loaded)
 let _marked = null;
 (async () => {
@@ -427,6 +432,41 @@ function injectStyles() {
     .cp-messages:has(.msg) .cp-empty,
     .cp-messages:has(.msg-status) .cp-empty { display: none; }
 
+    /* ── CLI-not-installed banner (replaces empty-state hint when claude binary missing) ── */
+    .cp-cli-missing {
+      display: flex; flex-direction: column; align-items: center; gap: 8px;
+      max-width: 320px; padding: 14px 16px; margin-top: 4px;
+      border: 1px solid rgba(255,180,80,0.35); border-radius: 8px;
+      background: rgba(255,180,80,0.06); pointer-events: auto;
+    }
+    .cp-cli-missing-title {
+      font-size: 12px; font-weight: 600; color: rgba(255,200,120,0.9);
+      letter-spacing: 0.02em;
+    }
+    .cp-cli-missing-body {
+      font-size: 11px; color: rgba(255,255,255,0.55); text-align: center; line-height: 1.45;
+    }
+    .cp-cli-missing-body code {
+      display: inline-block; padding: 1px 6px; margin-top: 4px;
+      background: rgba(0,0,0,0.35); border-radius: 4px; font-size: 10.5px;
+      color: rgba(255,255,255,0.75);
+    }
+    .cp-cli-missing-actions { display: flex; gap: 8px; margin-top: 4px; }
+    .cp-cli-missing-link, .cp-cli-missing-recheck {
+      display: inline-flex; align-items: center; gap: 4px;
+      padding: 5px 10px; font-size: 11px; font-weight: 500;
+      border-radius: 5px; border: 1px solid rgba(255,255,255,0.15);
+      background: rgba(255,255,255,0.04); color: rgba(255,255,255,0.85);
+      text-decoration: none; cursor: pointer; user-select: none;
+    }
+    .cp-cli-missing-link:hover, .cp-cli-missing-recheck:hover {
+      background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.3);
+    }
+    .cp-cli-missing-recheck:disabled { opacity: 0.5; cursor: default; }
+    /* Block send button visually + functionally when CLI missing */
+    .claude-panel.cp-cli-blocked .cp-send { opacity: 0.4 !important; cursor: not-allowed !important; }
+    .claude-panel.cp-cli-blocked .cp-input { opacity: 0.7; }
+
     /* ── Browser embed (live screencast inside panel) ── */
     .cp-browser-embed {
       display: none;
@@ -2649,14 +2689,14 @@ document.addEventListener('click', (e) => {
 });
 
 // ── Tab lifecycle ──
-function createTab(sessionId = null, label = 'New chat', { autoSwitch = true, id = null } = {}) {
+function createTab(sessionId = null, label = 'New chat', { autoSwitch = true, id = null } = {}) {
   if (_tabs.length >= MAX_TABS) return null;
   // Capture current dropdown state for the new tab's project/model/effort
   const _$proj = _panel?.querySelector('#cp-project');
   const _$mod = _panel?.querySelector('#cp-model');
   const _$think = _panel?.querySelector('#cp-think-toggle');
   const tab = {
-    id: id || crypto.randomUUID(),
+    id: id || crypto.randomUUID(),
     sessionId,
     label,
     project: ddGetValue(_$proj) || '',       // per-tab project isolation
@@ -2712,6 +2752,7 @@ function createTab(sessionId = null, label = 'New chat', { autoSwitch = true, id
   msgDiv.innerHTML = `<div class="cp-empty"><div class="cp-empty-logo">${CLAUDE_ICON}</div><span class="cp-empty-name">Claude</span><span class="cp-empty-hint">Send a message to start</span></div>`;
   container.appendChild(msgDiv);
   tab.messagesEl = msgDiv;
+  if (_cliInstalled === null) _renderCliMissingBanner(msgDiv.querySelector('.cp-empty'));
   // Connect WebSocket
   connectTab(tab);
   // Create pill (rendered in shared tray, not inside panel)
@@ -2975,7 +3016,7 @@ function restoreTabs() {
       const data = JSON.parse(raw);
       if (data.tabs?.length) {
         for (const saved of data.tabs) {
-          const t = createTab(saved.sessionId, saved.label, { autoSwitch: false, id: saved.id });
+          const t = createTab(saved.sessionId, saved.label, { autoSwitch: false, id: saved.id });
           if (t && saved.sessionCost) t.sessionCost = saved.sessionCost;
           if (t && saved.running) t._wasRunning = true; // trigger reattach on WS open
           if (t && saved.project) t.project = saved.project;
@@ -2998,7 +3039,7 @@ function restoreTabs() {
       const data = JSON.parse(legacyRaw);
       if (data.tabs?.length) {
         for (const saved of data.tabs) {
-          const t = createTab(saved.sessionId, saved.label, { autoSwitch: false, id: saved.id });
+          const t = createTab(saved.sessionId, saved.label, { autoSwitch: false, id: saved.id });
           if (t && saved.sessionCost) t.sessionCost = saved.sessionCost;
           if (t && saved.running) t._wasRunning = true;
           if (t && saved.project) t.project = saved.project;
@@ -3535,6 +3576,7 @@ async function selectSession(sid, label) {
   const btn = _panel?.querySelector('.cp-session-label');
   if (btn) btn.textContent = tab.label;
   tab.messagesEl.innerHTML = `<div class="cp-empty"><div class="cp-empty-logo">${CLAUDE_ICON}</div><span class="cp-empty-name">Claude</span><span class="cp-empty-hint">Send a message to start</span></div>`;
+  if (_cliInstalled === null) _renderCliMissingBanner(tab.messagesEl.querySelector('.cp-empty'));
   if (sid) {
     loadSessionHistory(sid, tab.messagesEl);
     // Restore session cost from server
@@ -6544,6 +6586,10 @@ function runSlashCommand(tab, raw) {
 }
 
 function send({ shift = false } = {}) {
+  if (_cliInstalled === null) {
+    notify({ type: NOTIF_TYPE.WARN, title: 'Claude CLI not installed', body: 'Install the Claude Code CLI before sending a message.' });
+    return;
+  }
   const tab = activeTab();
   if (!tab) return;
   const $input = _panel?.querySelector('#cp-input');
@@ -7246,6 +7292,70 @@ function syncReservedWidth() {
   }
 }
 
+// ── CLI installation status (banner + send-block) ──
+function _renderCliMissingBanner(emptyEl) {
+  if (!emptyEl) return;
+  const label = getCliLabel('claude-code');
+  const cmd = getCliInstallCommand('claude-code');
+  const url = getCliDocUrl('claude-code');
+  const hint = emptyEl.querySelector('.cp-empty-hint');
+  if (hint) hint.style.display = 'none';
+  let banner = emptyEl.querySelector('.cp-cli-missing');
+  if (!banner) {
+    banner = document.createElement('div');
+    banner.className = 'cp-cli-missing';
+    banner.innerHTML = `
+      <div class="cp-cli-missing-title">${label} CLI not installed</div>
+      <div class="cp-cli-missing-body">Run: <code>${cmd}</code></div>
+      <div class="cp-cli-missing-actions">
+        <a class="cp-cli-missing-link" href="${url}" target="_blank" rel="noopener noreferrer">Install guide</a>
+        <button class="cp-cli-missing-recheck" type="button">Re-check</button>
+      </div>
+    `;
+    emptyEl.appendChild(banner);
+    const btn = banner.querySelector('.cp-cli-missing-recheck');
+    btn?.addEventListener('click', async () => {
+      btn.disabled = true;
+      btn.textContent = 'Checking…';
+      try { await recheckCliStatus('claude-code'); }
+      finally {
+        if (btn.isConnected) {
+          btn.disabled = false;
+          btn.textContent = 'Re-check';
+        }
+      }
+    });
+  }
+}
+
+function _refreshCliBanners() {
+  if (!_panel) return;
+  const empties = _panel.querySelectorAll('.cp-empty');
+  if (_cliInstalled === null) {
+    _panel.classList.add('cp-cli-blocked');
+    for (const el of empties) _renderCliMissingBanner(el);
+  } else {
+    _panel.classList.remove('cp-cli-blocked');
+    for (const el of empties) {
+      const banner = el.querySelector('.cp-cli-missing');
+      if (banner) banner.remove();
+      const hint = el.querySelector('.cp-empty-hint');
+      if (hint) hint.style.display = '';
+    }
+  }
+  // Re-sync send button state — installed transition should re-enable input drafts
+  const $send = _panel.querySelector('#cp-send');
+  if ($send && _cliInstalled === null) $send.disabled = true;
+}
+
+function _ensureCliSubscription() {
+  if (_cliUnsub) return;
+  _cliUnsub = subscribeCliStatus('claude-code', (info) => {
+    _cliInstalled = info?.installed || null;
+    _refreshCliBanners();
+  });
+}
+
 // ── Public API ──
 export async function toggleClaudePanel() {
   if (!_panel) {
@@ -7255,13 +7365,14 @@ export async function toggleClaudePanel() {
     wireEvents();
     await loadConfig();   // must complete before restoreTabs — checks server boot ID
     loadSkills();
-    restoreTabs();
-    loadMonthlyCost();
-    syncSessionCosts();
-    _wireBrowserSync();
-    _startHeartbeat();
-    window.dispatchEvent(new CustomEvent('sidepanel-tray:provider-loaded', { detail: { provider: 'claude' } }));
-  }
+    restoreTabs();
+    loadMonthlyCost();
+    syncSessionCosts();
+    _wireBrowserSync();
+    _startHeartbeat();
+    window.dispatchEvent(new CustomEvent('sidepanel-tray:provider-loaded', { detail: { provider: 'claude' } }));
+    _ensureCliSubscription();
+  }
   _visible = !_visible;
   if (_visible) {
     if (_tabs.length === 0) createTab(null, 'New chat');
@@ -7269,6 +7380,7 @@ export async function toggleClaudePanel() {
     _panel.classList.add('open');
     syncReservedWidth();
     _panel.querySelector('#cp-input')?.focus();
+    _refreshCliBanners();
   } else {
     const tab = activeTab();
     const $input = _panel?.querySelector('#cp-input');

package/neural-interface/server.js

@@ -10454,7 +10454,8 @@ app.get('/api/system/backup', async (req, res) => {
                       'loop-templates.json', 'loop-schedules.json', 'loop-folders.json', 'auto-backup-config.json',
                       'cost-tracking.json', 'skin-config.json', 'image-favorites.json',
                       'browser-config.json', 'browser-storage.json', 'last-session.json',
-                      'invite-sessions.json']) {
+                      'invite-sessions.json', 'stored-plans.json', 'synabun-plugins.json',
+                      'mcp-registry.json', 'active-profile.json']) {
       addFile(`data/${f}`, resolve(dataDir, f));
     }
 
@@ -10478,6 +10479,9 @@ app.get('/api/system/backup', async (req, res) => {
     // Screenshots, whiteboard captures, staged images
     addDirRecursive('data/images', resolve(dataDir, 'images'));
 
+    // Plan markdown history (data/plans/YYYY-MM-DD/*.md)
+    addDirRecursive('data/plans', resolve(dataDir, 'plans'));
+
     // 3. mcp-server/data/
     if (existsSync(CATEGORIES_DATA_DIR)) {
       for (const f of readdirSync(CATEGORIES_DATA_DIR)) {
@@ -10613,7 +10617,7 @@ app.post('/api/system/restore',
       // data/ files
       const dataDir = resolve(DATA_HOME, 'data');
       mkdirSync(dataDir, { recursive: true });
-      for (const subdir of ['pending-remember', 'pending-compact', 'loop']) {
+      for (const subdir of ['pending-remember', 'pending-compact', 'loop', 'plans']) {
         mkdirSync(resolve(dataDir, subdir), { recursive: true });
       }
 
@@ -10837,7 +10841,8 @@ function buildBackupZipToFile(destPath) {
                       'loop-templates.json', 'loop-schedules.json', 'loop-folders.json', 'auto-backup-config.json',
                       'cost-tracking.json', 'skin-config.json', 'image-favorites.json',
                       'browser-config.json', 'browser-storage.json', 'last-session.json',
-                      'invite-sessions.json']) {
+                      'invite-sessions.json', 'stored-plans.json', 'synabun-plugins.json',
+                      'mcp-registry.json', 'active-profile.json']) {
       addFile(`data/${f}`, resolve(dataDir, f));
     }
 
@@ -10859,6 +10864,9 @@ function buildBackupZipToFile(destPath) {
     // Screenshots, whiteboard captures, staged images
     addDirRecursive('data/images', resolve(dataDir, 'images'));
 
+    // Plan markdown history (data/plans/YYYY-MM-DD/*.md)
+    addDirRecursive('data/plans', resolve(dataDir, 'plans'));
+
     if (existsSync(CATEGORIES_DATA_DIR)) {
       for (const f of readdirSync(CATEGORIES_DATA_DIR)) {
         if (f.endsWith('.json')) addFile(`mcp-data/${f}`, resolve(CATEGORIES_DATA_DIR, f));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "synabun",
-  "version": "2026.4.25-beta.1",
+  "version": "2026.4.25-beta.2",
   "description": "Persistent vector memory for AI assistants",
   "license": "Apache-2.0",
   "author": "The SynaBun Authors",