@bakapiano/ccsm 0.12.0 → 0.13.0

package/lib/webTerminal.js

@@ -84,6 +84,12 @@ function spawn({ command, args = [], cwd, env, cols = 120, rows = 30, meta = {},
     if (entry.onDataExtra) { try { entry.onDataExtra(data); } catch {} }
   });
   proc.onExit(({ exitCode, signal }) => {
+    // If a respawn replaced us in the pool (same entryId, new entry
+    // object), do not touch persistedSessions or schedule a delete —
+    // those belong to the new entry now. Without this guard, a slow-
+    // dying old PTY would fire markExited on the same sessionId and
+    // clobber the new spawn's markRunning state.
+    if (sessions.get(entryId) !== entry) return;
     entry.exitCode = exitCode;
     entry.exitedAt = Date.now();
     const frame = JSON.stringify({ type: 'exit', code: exitCode, signal });
@@ -91,8 +97,18 @@ function spawn({ command, args = [], cwd, env, cols = 120, rows = 30, meta = {},
       try { ws.send(frame); } catch {}
     }
     if (entry.onExitExtra) { try { entry.onExitExtra({ exitCode, signal }); } catch {} }
-    setTimeout(() => sessions.delete(entryId), 30_000);
+    setTimeout(() => {
+      if (sessions.get(entryId) === entry) sessions.delete(entryId);
+    }, 30_000);
   });
+  // If a previous entry exists under the same id (respawn), kill its
+  // pty so we don't have zombie claude.exe processes hanging on. The
+  // onExit guard above ensures its callback no-ops once we've taken
+  // over the slot.
+  const prev = sessions.get(entryId);
+  if (prev && !prev.exitedAt) {
+    try { prev.pty.kill(); } catch {}
+  }
   sessions.set(entryId, entry);
   return entry;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bakapiano/ccsm",
-  "version": "0.12.0",
+  "version": "0.13.0",
   "description": "Claude Code Session Manager — Windows web UI to manage many concurrent claude sessions: live list, snapshot/restore, focus existing window, new session in an isolated workspace with repo clones",
   "license": "MIT",
   "main": "server.js",

package/public/css/widgets.css

@@ -980,6 +980,38 @@
   gap: 6px;
   margin-top: 4px;
 }
+.entity-test-button { margin-right: auto; }
+
+.entity-test-result {
+  margin-top: 4px;
+  padding: 8px 10px;
+  border-radius: 6px;
+  border: 1px solid var(--border);
+  background: var(--bg);
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  font-size: 12.5px;
+}
+.entity-test-result.is-ok    { border-color: rgba(74, 138, 74, 0.4); background: rgba(74, 138, 74, 0.06); }
+.entity-test-result.is-fail  { border-color: rgba(183, 63, 63, 0.4); background: rgba(183, 63, 63, 0.06); }
+.entity-test-summary {
+  font-family: var(--body);
+  font-weight: 500;
+  color: var(--ink);
+}
+.entity-test-result.is-fail .entity-test-summary { color: var(--red); }
+.entity-test-out {
+  margin: 0;
+  font-family: var(--mono);
+  font-size: 11.5px;
+  color: var(--ink-mid);
+  white-space: pre-wrap;
+  word-break: break-word;
+  max-height: 120px;
+  overflow-y: auto;
+}
+.entity-test-out.is-stderr { color: var(--ink-muted); border-top: 1px dashed var(--border); padding-top: 4px; }
 
 .icon-radio {
   display: grid;

package/public/js/api.js

@@ -28,11 +28,11 @@ export async function loadConfig() {
 export async function updateCli(id, patch) {
   const cfg = S.config.value || (await api('GET', '/api/config'));
   const target = (cfg.clis || []).find((c) => c.id === id);
-  // Built-in CLIs lock down identity-defining fields. UI already greys these
-  // out; we belt-and-braces here so a tampered request from elsewhere
-  // can't change them either.
+  // Built-in CLIs lock down structural fields (id + builtin flag) but
+  // allow command edits — users routinely need to point at an absolute
+  // path (e.g. C:\Users\you\.local\bin\claude.exe) or a wrapper script
+  // when the bare name isn't on the spawn-time PATH.
   if (target?.builtin) {
-    delete patch.command;
     delete patch.id;
     delete patch.builtin;
   }
@@ -52,6 +52,14 @@ export async function updateCli(id, patch) {
   return id;
 }
 
+// Probe a (possibly-unsaved) CLI config: spawn its command with
+// `--version`, capture output, see if it looks like the claimed type.
+// `args` is intentionally ignored server-side — runtime flags can
+// disturb a quick probe.
+export async function testCli({ command, shell, type }) {
+  return api('POST', '/api/clis/test', { command, shell, type });
+}
+
 export async function deleteCli(id) {
   const cfg = S.config.value || (await api('GET', '/api/config'));
   const target = (cfg.clis || []).find((c) => c.id === id);

package/public/js/components/EntityFormModal.js

@@ -18,10 +18,13 @@ import { Modal } from './Modal.js';
 export function EntityFormModal({
   title, fields, initial = {}, submitLabel = 'Save',
   readOnlyKeys = [],
-  onSubmit, onClose, danger,
+  onSubmit, onClose, onTest, testLabel = 'Test',
+  danger,
 }) {
   const [draft, setDraft] = useState(() => ({ ...initialFrom(fields), ...initial }));
   const [saving, setSaving] = useState(false);
+  const [testing, setTesting] = useState(false);
+  const [testResult, setTestResult] = useState(null);
 
   const isReadOnly = (key) => readOnlyKeys.includes(key);
 
@@ -36,6 +39,20 @@ export function EntityFormModal({
     finally { setSaving(false); }
   };
 
+  const runTest = async () => {
+    if (!onTest) return;
+    setTesting(true);
+    setTestResult(null);
+    try {
+      const r = await onTest(draft);
+      setTestResult(r);
+    } catch (e) {
+      setTestResult({ ok: false, spawnError: String(e?.message || e) });
+    } finally {
+      setTesting(false);
+    }
+  };
+
   return html`
     <${Modal} title=${title} onClose=${onClose} width=${440}>
       <form class="entity-form" onSubmit=${submit}>
@@ -87,7 +104,26 @@ export function EntityFormModal({
             ${f.hint && f.type !== 'checkbox' ? html`
               <span class="entity-field-hint">${f.hint}</span>` : null}
           </label>`)}
+        ${testResult ? html`
+          <div class=${`entity-test-result ${testResult.ok ? 'is-ok' : 'is-fail'}`}>
+            <div class="entity-test-summary">
+              ${testResult.ok ? '✓' : '✗'} ${testResult.ok ? 'works' : 'failed'}
+              ${typeof testResult.exitCode === 'number' ? html` · exit ${testResult.exitCode}` : null}
+              ${typeof testResult.durationMs === 'number' ? html` · ${testResult.durationMs}ms` : null}
+              ${testResult.timedOut ? html` · timed out` : null}
+              ${testResult.matchedType === true ? html` · type matches ${testResult.expectedType}` : null}
+              ${testResult.matchedType === false ? html` · type mismatch (expected ${testResult.expectedType})` : null}
+            </div>
+            ${testResult.spawnError ? html`<pre class="entity-test-out">${testResult.spawnError}</pre>` : null}
+            ${testResult.stdout ? html`<pre class="entity-test-out">${testResult.stdout}</pre>` : null}
+            ${testResult.stderr ? html`<pre class="entity-test-out is-stderr">${testResult.stderr}</pre>` : null}
+          </div>` : null}
         <div class="entity-form-actions">
+          ${onTest ? html`
+            <button type="button" class="action small subtle entity-test-button"
+                    disabled=${testing} onClick=${runTest}>
+              ${testing ? 'Testing…' : testLabel}
+            </button>` : null}
           <button type="button" class="action small subtle" onClick=${onClose}>Cancel</button>
           <button type="submit" class=${`action small ${danger ? 'danger' : 'primary'}`}
                   disabled=${saving}>

package/public/js/components/Sidebar.js

@@ -56,47 +56,6 @@ function SessionRow({ s }) {
     }
   };
 
-  const onContext = async (ev) => {
-    ev.preventDefault();
-    ev.stopPropagation();
-    // Quick menu: Rename / Move / Delete. We use sequential prompts
-    // to avoid building a real context-menu component for now.
-    const action = await ccsmPrompt(
-      `${title} · ${running ? 'running' : 'stopped'}\nType: rename / move / delete / resume / cancel`,
-      'cancel', { title: s.id, okLabel: 'OK' });
-    if (!action) return;
-    const verb = action.trim().toLowerCase();
-    if (verb === 'rename') {
-      const next = await ccsmPrompt('New title', title, { title: 'Rename session', okLabel: 'Save' });
-      if (next === null) return;
-      try { await setSessionTitle(s.id, next.trim()); setToast('renamed'); }
-      catch (e) { setToast(e.message, 'error'); }
-    } else if (verb === 'move') {
-      // Move to a folder by name
-      const folderNames = folders.value.map((f) => f.name).join(', ');
-      const target = await ccsmPrompt(
-        `Move to which folder? (empty = Unsorted)\nExisting: ${folderNames || '(none)'}`,
-        '', { title: 'Move', okLabel: 'Move' });
-      if (target === null) return;
-      const t = target.trim();
-      const folder = t ? folders.value.find((f) => f.name.toLowerCase() === t.toLowerCase()) : null;
-      if (t && !folder) { setToast(`no folder named "${t}"`, 'error'); return; }
-      try { await setSessionFolder(s.id, folder ? folder.id : null); setToast('moved'); }
-      catch (e) { setToast(e.message, 'error'); }
-    } else if (verb === 'delete') {
-      const ok = await ccsmConfirm(`Delete session ${title}? PTY will be killed if alive.`, {
-        title: 'Delete session', okLabel: 'Delete', danger: true });
-      if (!ok) return;
-      try {
-        await deleteSession(s.id);
-        if (activeSessionId.value === s.id) activeSessionId.value = null;
-      } catch (e) { setToast(e.message, 'error'); }
-    } else if (verb === 'resume' && !running) {
-      try { await resumeSession(s.id); selectSession(s.id); }
-      catch (e) { setToast(e.message, 'error'); }
-    }
-  };
-
   const onRenameClick = async (ev) => {
     ev.preventDefault();
     ev.stopPropagation();
@@ -135,7 +94,6 @@ function SessionRow({ s }) {
          onDragStart=${onDragStart}
          onDragEnd=${onDragEnd}
          onClick=${onClick}
-         onContextMenu=${onContext}
          title=${`${title}\n${s.cwd}\n${running ? 'running' : 'stopped'} · ${s.cliId}`}>
       <span class=${`tree-dot ${running ? 'is-running' : 'is-stopped'}`}></span>
       <span class="tree-label">${title}</span>

package/public/js/components/TerminalView.js

@@ -86,6 +86,22 @@ export function TerminalView({ terminalId }) {
     } catch (e) {
       console.warn('[ccsm] WebGL addon failed, using DOM renderer:', e);
     }
+    // Ctrl+C with a selection: by default xterm.js sends \x03 AND the
+    // browser's own copy event fires — so the user gets "selection
+    // copied to clipboard" AND the running CLI gets SIGINT. Mirror
+    // VSCode/Windows Terminal behaviour: when there's a selection,
+    // suppress \x03 and let the copy event do its thing. With no
+    // selection, Ctrl+C still sends \x03 normally.
+    term.attachCustomKeyEventHandler((ev) => {
+      if (ev.type === 'keydown'
+          && ev.ctrlKey && !ev.shiftKey && !ev.altKey && !ev.metaKey
+          && ev.key.toLowerCase() === 'c'
+          && term.hasSelection()) {
+        return false;
+      }
+      return true;
+    });
+
     const host = hostRef.current;
     term.open(host);
     // Defer fit one tick so the container has measured layout

package/public/js/pages/ConfigurePage.js

@@ -10,7 +10,7 @@ import {
 } from '../state.js';
 import {
   api, loadConfig, loadWorkspaces, loadFolders,
-  createCli, updateCli, deleteCli, setDefaultCli,
+  createCli, updateCli, deleteCli, setDefaultCli, testCli,
   createRepo, updateRepo, deleteRepo,
   createFolder, renameFolder, deleteFolder, reorderFolders,
   deleteWorkspace,
@@ -252,6 +252,7 @@ export function ConfigurePage() {
     ${edit?.kind === 'cli-new' ? html`
       <${EntityFormModal} title="New CLI" fields=${cliFieldsFor({ creating: true })}
         onClose=${close} submitLabel="Create"
+        onTest=${(v) => testCli({ command: v.command, shell: v.shell, type: v.type })}
         onSubmit=${async (v) => {
           try { await createCli(v); setToast(`created CLI · ${v.name}`); }
           catch (e) { setToast(e.message, 'error'); throw e; }
@@ -259,7 +260,7 @@ export function ConfigurePage() {
 
     ${edit?.kind === 'cli-edit' ? html`
       <${EntityFormModal} title=${`Edit ${edit.payload.name}`} fields=${cliFieldsFor()}
-        readOnlyKeys=${edit.payload.builtin ? ['type', 'command'] : []}
+        readOnlyKeys=${edit.payload.builtin ? ['type'] : []}
         initial=${{
           ...edit.payload,
           args: (edit.payload.args || []).join(' '),
@@ -267,6 +268,7 @@ export function ConfigurePage() {
           resumeIdArgs: (edit.payload.resumeIdArgs || []).join(' '),
         }}
         onClose=${close}
+        onTest=${(v) => testCli({ command: v.command, shell: v.shell, type: v.type })}
         onSubmit=${async (v) => {
           try {
             const patch = {
@@ -275,8 +277,6 @@ export function ConfigurePage() {
               resumeArgs: typeof v.resumeArgs === 'string' ? v.resumeArgs.split(/\s+/).filter(Boolean) : v.resumeArgs,
               resumeIdArgs: typeof v.resumeIdArgs === 'string' ? v.resumeIdArgs.split(/\s+/).filter(Boolean) : v.resumeIdArgs,
             };
-            // command is locked on builtins — drop any tampered value.
-            if (edit.payload.builtin) delete patch.command;
             await updateCli(edit.payload.id, patch);
             setToast('saved');
           } catch (e) { setToast(e.message, 'error'); throw e; }

package/server.js

@@ -393,7 +393,92 @@ app.put('/api/config', asyncH(async (req, res) => {
   res.json(decorateConfigWithProbes(cfg));
 }));
 
-// ---- CLIs ----
+// ---- CLI probe / test ----
+//
+// Run the user's configured command with `--version` and report back
+// stdout/stderr + whether the output looks like the claimed CLI type.
+// Used by the Configure page "Test" button so the user can verify the
+// command resolves + actually launches the right tool BEFORE saving.
+// Body: { command, args?, shell?, type? }. args is ignored for the
+// version probe — we always append `--version` directly so the user's
+// runtime args (e.g. --dangerously-skip-permissions) don't perturb the
+// quick probe.
+app.post('/api/clis/test', asyncH(async (req, res) => {
+  const { spawn } = require('node:child_process');
+  const body = req.body || {};
+  const command = String(body.command || '').trim();
+  const shell = ['direct', 'pwsh', 'cmd'].includes(body.shell) ? body.shell : 'direct';
+  const type = ['claude', 'codex', 'copilot', 'other'].includes(body.type) ? body.type : 'other';
+  if (!command) return res.status(400).json({ error: 'command required' });
+
+  // Build the test exec. Same shell-wrapping rules as resolveCommand,
+  // but we force `--version` as the only arg and we DROP `-NoExit`
+  // from the pwsh wrapper so pwsh terminates after printing.
+  let exe, args;
+  const cmd = command.replace(/^\.[\\\/]/, '');
+  const versionArg = '--version';
+  if (shell === 'pwsh') {
+    const joined = `& ${/[\s'"\`$]/.test(cmd) ? `'${cmd.replace(/'/g, "''")}'` : cmd} ${versionArg}`;
+    exe = 'pwsh.exe';
+    args = ['-NoLogo', '-Command', joined];
+  } else if (shell === 'cmd') {
+    exe = process.env.ComSpec || 'cmd.exe';
+    args = ['/d', '/s', '/c', `${cmd} ${versionArg}`];
+  } else if (path.isAbsolute(cmd)) {
+    const ext = path.extname(cmd).toLowerCase();
+    if (ext === '.cmd' || ext === '.bat') {
+      exe = process.env.ComSpec || 'cmd.exe';
+      args = ['/d', '/s', '/c', cmd, versionArg];
+    } else if (ext === '.ps1') {
+      exe = 'powershell.exe';
+      args = ['-NoProfile', '-ExecutionPolicy', 'Bypass', '-File', cmd, versionArg];
+    } else {
+      exe = cmd;
+      args = [versionArg];
+    }
+  } else {
+    exe = process.env.ComSpec || 'cmd.exe';
+    args = ['/d', '/s', '/c', cmd, versionArg];
+  }
+
+  const t0 = Date.now();
+  let stdout = '';
+  let stderr = '';
+  let exitCode = null;
+  let timedOut = false;
+  let spawnError = null;
+  try {
+    const child = spawn(exe, args, { env: spawnEnv(), windowsHide: true });
+    const killer = setTimeout(() => { timedOut = true; try { child.kill(); } catch {} }, 5000);
+    child.stdout.on('data', (d) => { stdout += d.toString(); if (stdout.length > 8192) stdout = stdout.slice(0, 8192); });
+    child.stderr.on('data', (d) => { stderr += d.toString(); if (stderr.length > 8192) stderr = stderr.slice(0, 8192); });
+    exitCode = await new Promise((resolve, reject) => {
+      child.on('exit', (code) => { clearTimeout(killer); resolve(code); });
+      child.on('error', (err) => { clearTimeout(killer); reject(err); });
+    });
+  } catch (e) {
+    spawnError = String(e && e.message || e);
+  }
+  const durationMs = Date.now() - t0;
+
+  const out = (stdout + '\n' + stderr).toLowerCase();
+  const PATTERNS = {
+    claude:  /claude/,
+    codex:   /codex|openai/,
+    copilot: /copilot/,
+  };
+  const matchedType = type === 'other' ? null : (PATTERNS[type] ? PATTERNS[type].test(out) : null);
+  const ok = !spawnError && !timedOut && exitCode === 0;
+  res.json({
+    ok, exitCode, durationMs, timedOut, spawnError,
+    stdout: stdout.trim(),
+    stderr: stderr.trim(),
+    matchedType,
+    expectedType: type,
+    spawned: { exe, args },
+  });
+}));
+
 // ---- folders ----
 
 app.get('/api/folders', asyncH(async (_req, res) => {