@bakapiano/ccsm 0.21.0 → 0.21.2

package/lib/codexSeed.js

@@ -52,16 +52,23 @@ function execWithTimeout(exe, args, { timeoutMs = 8000 } = {}) {
   });
 }
 
-// Parse `CODEX_HOME    <path> (dir)` out of `codex doctor` output. Codex
-// formats it with variable whitespace; the `(dir)` / `(file)` suffix is
-// the easiest anchor to identify the path end. Some wrappers colour
-// the label (`\x1b[7mCODEX_HOME\x1b[0m`), so strip ANSI SGR codes first —
-// otherwise `CODEX_HOME` is followed by an escape, not whitespace, and the
-// match fails.
+// Pull CODEX_HOME out of a wrapper's `doctor` (or `--version`) output. Two
+// shapes appear, and we must handle BOTH:
+//   1. Diagnostic table:  `CODEX_HOME    <path> (dir)`  — only when `doctor`
+//      fully succeeds. Variable whitespace; the `(dir)`/`(file)` suffix marks
+//      the path end.
+//   2. Wrapper banner:    `CODEX_HOME=<path>`  — printed on EVERY invocation.
+//      Critical because in ccsm's non-interactive spawn `doctor` often exits
+//      non-zero (skipping the table) yet still prints this banner line, so it's
+//      the reliable source. Without it the probe returns null and the seed
+//      lands in ~/.codex instead of the wrapper's relocated home, breaking
+//      `resume <id>` ("No saved session found with ID …").
+// Some wrappers colour the label (`\x1b[7mCODEX_HOME\x1b[0m`); strip ANSI first.
 function parseCodexHomeFromDoctor(text) {
   if (!text) return null;
   const clean = String(text).replace(/\x1b\[[0-9;]*m/g, '');
-  const m = clean.match(/\bCODEX_HOME\s+(.+?)\s*\((?:dir|file)\)/);
+  let m = clean.match(/\bCODEX_HOME\s+(.+?)\s*\((?:dir|file)\)/);   // table form
+  if (!m) m = clean.match(/\bCODEX_HOME=(.+?)\s*$/m);               // banner form
   if (!m) return null;
   const p = m[1].trim();
   return p || null;
@@ -151,5 +158,26 @@ async function seedCodexSession({ id, cwd, cli }) {
   return file;
 }
 
-module.exports = { seedCodexSession, probeCodexHome, parseCodexHomeFromDoctor };
+// Copy ccsm's bundled light codex syntax theme into the codex home's themes/
+// dir so `-c tui.theme=ccsm-light` resolves. This theme carries light
+// markup.inserted/deleted backgrounds, which at true-color level override
+// codex's diff palette — the only way to get a LIGHT diff on Windows, where
+// codex's own background detection (default_bg()) is compiled out and always
+// falls back to a dark diff. Idempotent (writes only when missing/changed).
+async function ensureCodexLightTheme(home) {
+  if (!home) return false;
+  const src = path.join(__dirname, 'codexThemes', 'ccsm-light.tmTheme');
+  const dstDir = path.join(home, 'themes');
+  const dst = path.join(dstDir, 'ccsm-light.tmTheme');
+  try {
+    const content = await fs.readFile(src, 'utf8');
+    await fs.mkdir(dstDir, { recursive: true });
+    let existing = null;
+    try { existing = await fs.readFile(dst, 'utf8'); } catch {}
+    if (existing !== content) await fs.writeFile(dst, content, 'utf8');
+    return true;
+  } catch { return false; }
+}
+
+module.exports = { seedCodexSession, probeCodexHome, parseCodexHomeFromDoctor, ensureCodexLightTheme };
 

package/lib/codexThemes/ccsm-light.tmTheme

@@ -0,0 +1,77 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<!-- ccsm-light: a GitHub-Light-flavoured codex syntax theme whose
+     markup.inserted / markup.deleted scopes carry LIGHT diff backgrounds.
+     ccsm injects this (via `-c tui.theme=ccsm-light`) when the ccsm terminal
+     is in light mode, because codex's own diff theme detection (default_bg())
+     is compiled out on Windows and always falls back to a DARK diff palette —
+     which buries readability on a white terminal. At true-color level codex
+     lets a syntax theme's markup scope backgrounds override that default, so
+     these two scopes are what flip the diff to light. -->
+<plist version="1.0">
+<dict>
+  <key>name</key>
+  <string>ccsm-light</string>
+  <key>settings</key>
+  <array>
+    <dict>
+      <key>settings</key>
+      <dict>
+        <key>background</key><string>#ffffff</string>
+        <key>foreground</key><string>#1f2328</string>
+        <key>caret</key><string>#1f2328</string>
+        <key>selection</key><string>#b6d6fd</string>
+        <key>lineHighlight</key><string>#eaeef2</string>
+      </dict>
+    </dict>
+    <dict>
+      <key>scope</key><string>comment, punctuation.definition.comment</string>
+      <key>settings</key><dict><key>foreground</key><string>#6e7781</string></dict>
+    </dict>
+    <dict>
+      <key>scope</key><string>string, string.quoted, punctuation.definition.string</string>
+      <key>settings</key><dict><key>foreground</key><string>#0a3069</string></dict>
+    </dict>
+    <dict>
+      <key>scope</key><string>constant.numeric, constant.language, constant.character, constant.other</string>
+      <key>settings</key><dict><key>foreground</key><string>#0550ae</string></dict>
+    </dict>
+    <dict>
+      <key>scope</key><string>keyword, keyword.control, keyword.operator, storage, storage.type, storage.modifier</string>
+      <key>settings</key><dict><key>foreground</key><string>#cf222e</string></dict>
+    </dict>
+    <dict>
+      <key>scope</key><string>entity.name.function, support.function, meta.function-call</string>
+      <key>settings</key><dict><key>foreground</key><string>#8250df</string></dict>
+    </dict>
+    <dict>
+      <key>scope</key><string>entity.name.type, entity.name.class, entity.name.namespace, support.type, support.class</string>
+      <key>settings</key><dict><key>foreground</key><string>#953800</string></dict>
+    </dict>
+    <dict>
+      <key>scope</key><string>variable, variable.other, variable.parameter</string>
+      <key>settings</key><dict><key>foreground</key><string>#1f2328</string></dict>
+    </dict>
+    <dict>
+      <key>scope</key><string>entity.name.tag, support.type.property-name</string>
+      <key>settings</key><dict><key>foreground</key><string>#116329</string></dict>
+    </dict>
+    <dict>
+      <key>scope</key><string>markup.inserted, markup.inserted.diff, meta.diff.header.to-file</string>
+      <key>settings</key>
+      <dict>
+        <key>background</key><string>#e6ffec</string>
+        <key>foreground</key><string>#1a7f37</string>
+      </dict>
+    </dict>
+    <dict>
+      <key>scope</key><string>markup.deleted, markup.deleted.diff, meta.diff.header.from-file</string>
+      <key>settings</key>
+      <dict>
+        <key>background</key><string>#ffebe9</string>
+        <key>foreground</key><string>#cf222e</string>
+      </dict>
+    </dict>
+  </array>
+</dict>
+</plist>

package/lib/config.js

@@ -56,8 +56,13 @@ const DEFAULT_CLIS = [
     name: 'GitHub Copilot',
     command: 'copilot',
     args: [],
+    // copilot has no `--resume <id>` (space) flag — that parses as `--resume`
+    // (valueless → session picker) plus a stray positional arg, which hangs on
+    // a blank screen. `--session-id <id>` both creates AND resumes a session by
+    // id (`copilot --help`: "Resume an existing session or task by ID"), so we
+    // use it for both new and resume.
     newSessionIdArgs: ['--session-id', '<id>'],
-    resumeIdArgs: ['--resume', '<id>'],
+    resumeIdArgs: ['--session-id', '<id>'],
     shell: 'direct',
     type: 'copilot',
     builtin: true,
@@ -149,6 +154,16 @@ function mergeWithDefaults(partial) {
       const needsBackfill = (v) => v == null || (Array.isArray(v) && v.length === 0);
       if (needsBackfill(existing.resumeIdArgs)) existing.resumeIdArgs = def.resumeIdArgs;
       if (needsBackfill(existing.newSessionIdArgs)) existing.newSessionIdArgs = def.newSessionIdArgs;
+      // Heal the old broken copilot resume flag: `--resume <id>` (space form)
+      // isn't valid copilot syntax — it parses as a valueless `--resume`
+      // (session picker) plus a stray positional, hanging on a blank screen.
+      // The builtin now uses `--session-id <id>`. Migrate configs still
+      // carrying the old default; genuine user customisations are left alone.
+      if (existing.id === 'copilot'
+          && Array.isArray(existing.resumeIdArgs)
+          && existing.resumeIdArgs.join(' ') === '--resume <id>') {
+        existing.resumeIdArgs = def.resumeIdArgs;
+      }
       // Drop the v0.x `resumeArgs` fallback — every builtin now has a
       // pre-assigned UUID (claude/copilot via flag, codex via seed) so
       // resumeIdArgs always applies on resume; the field is dead weight.

package/lib/webTerminal.js

@@ -54,7 +54,13 @@ function spawn({ command, args = [], cwd, env, cols = 120, rows = 30, meta = {},
     name: 'xterm-256color',
     cols, rows,
     cwd: cwd ? path.resolve(cwd) : process.cwd(),
-    env: { ...process.env, ...(env || {}) },
+    // Advertise 24-bit colour. xterm.js renders truecolor, and CLIs like
+    // claude paint their diffs with 24-bit DARK red/green backgrounds +
+    // white text when COLORTERM says so. Without it they downgrade to the
+    // bright ANSI-16 red/green backgrounds, which wash the white foreground
+    // out (the "white text gets buried" report). VSCode sets the same on its
+    // terminal PTYs; our ANSI-16 palette already matches VSCode's verbatim.
+    env: { ...process.env, ...(env || {}), COLORTERM: 'truecolor' },
   };
   if (process.platform === 'win32') {
     ptyOpts.useConpty = true;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bakapiano/ccsm",
-  "version": "0.21.0",
+  "version": "0.21.2",
   "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/js/api.js

@@ -282,7 +282,11 @@ export function resumeSession(sessionId) {
   const cached = resumeInFlight.get(sessionId);
   if (cached) return cached;
   const p = (async () => {
-    const r = await api('POST', `/api/sessions/${sessionId}/resume`);
+    const r = await api('POST', `/api/sessions/${sessionId}/resume`, {
+      // Resolved terminal theme → backend sets a matching COLORFGBG so the
+      // CLI's light/dark auto-detection follows the ccsm terminal.
+      theme: document.documentElement.dataset.theme,
+    });
     await loadSessions();
     return r.launched;
   })();

package/public/js/components/TerminalView.js

@@ -183,6 +183,30 @@ export function TerminalView({ terminalId, cliType }) {
 
     const host = hostRef.current;
     term.open(host);
+
+    // Answer OSC 10/11 (default foreground / background colour) queries with
+    // the LIVE theme colours. CLIs like claude probe the terminal background
+    // (`OSC 11 ; ? ST`) to pick a light- or dark-tuned syntax theme. xterm.js
+    // doesn't answer these by default, so claude assumes a dark terminal and
+    // paints near-white tokens (comments, f-string interpolations, call
+    // names) that vanish on our light background — the "字体颜色和背景重复"
+    // bug. VSCode answers them; we match. Reply format is the xterm/X11
+    // `rgb:RRRR/GGGG/BBBB` (16-bit-per-channel) the query expects.
+    const answerColorOsc = (code, getHex) => (data) => {
+      if (data !== '?') return false;               // only the query form
+      const hex = getHex();                         // '#rrggbb'
+      const ch = (i) => parseInt(hex.slice(i, i + 2), 16);
+      const w = (v) => (v * 257).toString(16).padStart(4, '0');  // 8-bit → 16-bit
+      const reply = `\x1b]${code};rgb:${w(ch(1))}/${w(ch(3))}/${w(ch(5))}\x07`;
+      const ws = wsRef.current;
+      if (ws && ws.readyState === 1) ws.send(JSON.stringify({ type: 'input', data: reply }));
+      return true;
+    };
+    try {
+      term.parser.registerOscHandler(11, answerColorOsc(11, () => themeRef.current.background));
+      term.parser.registerOscHandler(10, answerColorOsc(10, () => themeRef.current.foreground));
+    } catch {}
+
     // Robust fit scheduler. A single requestAnimationFrame works most
     // of the time but races on tab/session switches: the .tab-panel
     // just flipped from display:none to display:flex and although the

package/public/js/pages/ConfigurePage.js

@@ -47,7 +47,7 @@ function tokenizeCliArgs(v) {
 const CLI_TYPE_DEFAULTS = {
   claude:  { command: 'claude',  resumeIdArgs: '--resume <id>', newSessionIdArgs: '--session-id <id>' },
   codex:   { command: 'codex',   resumeIdArgs: 'resume <id>',   newSessionIdArgs: 'resume <id>' },
-  copilot: { command: 'copilot', resumeIdArgs: '--resume <id>', newSessionIdArgs: '--session-id <id>' },
+  copilot: { command: 'copilot', resumeIdArgs: '--session-id <id>', newSessionIdArgs: '--session-id <id>' },
   other:   { resumeIdArgs: '', newSessionIdArgs: '' },
 };
 

package/public/js/pages/LaunchPage.js

@@ -171,7 +171,7 @@ function LaunchHero() {
       onChange: (v, next) => {
         const presets = { claude:  { command: 'claude',  resumeArgs: '--continue',    resumeIdArgs: '--resume <id>', name: 'Claude Code' },
                           codex:   { command: 'codex',   resumeArgs: 'resume --last', resumeIdArgs: 'resume <id>',   name: 'OpenAI Codex' },
-                          copilot: { command: 'copilot', resumeArgs: '--continue',    resumeIdArgs: '--resume <id>', name: 'GitHub Copilot' },
+                          copilot: { command: 'copilot', resumeArgs: '--continue',    resumeIdArgs: '--session-id <id>', name: 'GitHub Copilot' },
                           other:   {} }[v] || {};
         const patch = {};
         if (presets.resumeArgs != null) patch.resumeArgs = presets.resumeArgs;

package/public/js/streaming.js

@@ -60,10 +60,13 @@ function applyEvent(ev, rootId) {
 // onMeta(event) is called for workspace/launched/done events so the caller can
 // surface them in their own result text area.
 export async function streamNewSession(body, { progressRootId = 'newSessionProgress', onMeta } = {}) {
+  // Pass the resolved terminal theme so the backend can hand CLIs a matching
+  // COLORFGBG (light/dark detection). dataset.theme is set by applyTheme().
+  const theme = document.documentElement.dataset.theme;
   const res = await fetch(httpBase() + '/api/sessions/new', {
     method: 'POST',
     headers: { 'Content-Type': 'application/json' },
-    body: JSON.stringify(body),
+    body: JSON.stringify({ ...body, theme }),
   });
   if (!res.ok && res.headers.get('content-type')?.startsWith('application/json')) {
     const j = await res.json();

package/server.js

@@ -281,7 +281,7 @@ function quoteForCmd(s) {
   return s;
 }
 
-function spawnCliSession({ cli, cwd, sessionId, meta, extraArgs = [] }) {
+function spawnCliSession({ cli, cwd, sessionId, meta, extraArgs = [], theme }) {
   if (!webTerminal.available) {
     const e = new Error('node-pty unavailable · cannot spawn web terminal');
     e.code = 'PTY_UNAVAILABLE';
@@ -291,19 +291,46 @@ function spawnCliSession({ cli, cwd, sessionId, meta, extraArgs = [] }) {
   // extraArgs into the single quoted command string — otherwise extraArgs
   // would become args to the shell itself, not the wrapped command.
   // Re-resolve here when extraArgs is present so the quoting is correct.
+  // Force a session-scoped theme=auto for claude so its syntax/diff colours
+  // follow the ccsm terminal background (which we report via OSC 10/11 in
+  // TerminalView). claude's DEFAULT theme is *dark*, whose near-white tokens
+  // (comments, f-string interpolations, call names) vanish on our light
+  // terminal — the "字体颜色和背景重复" bug. --settings is session-scoped, so
+  // the user's global ~/.claude/settings.json is left untouched, and ccsm
+  // sessions Just Work on a fresh machine without anyone running /theme auto.
+  // (Injected here as an integration arg, like --session-id — not via the
+  // user-editable cli.args, so it reaches existing configs too.)
+  // Skip the injection entirely if the user already put their own --settings
+  // in cli.args — claude deep-merges multiple --settings (verified: later ones
+  // win per-key), so ours would silently override a theme they set on purpose.
+  // Respect the user's explicit choice instead.
+  const userHasSettings = (cli.args || []).some(
+    (a) => a === '--settings' || String(a).startsWith('--settings='));
+  const baseArgs = [...(cli.args || [])];
+  if (cli.type === 'claude' && !userHasSettings) baseArgs.push('--settings', '{"theme":"auto"}');
   const resolved = resolveCommand(
     cli.command,
-    [...(cli.args || []), ...extraArgs],
+    [...baseArgs, ...extraArgs],
     cli.shell || 'direct',
   );
   const { exe, prefixArgs, fallbackExe, consumesUserArgs } = resolved;
   const args = consumesUserArgs
     ? prefixArgs
-    : [...prefixArgs, ...(cli.args || []), ...extraArgs];
+    : [...prefixArgs, ...baseArgs, ...extraArgs];
   // Merge user-scope PATH from registry into the env we hand the PTY.
   // spawnEnv() also strips duplicate path-case keys so our override
   // doesn't get shadowed by the inherited `Path` from process.env.
   const env = spawnEnv(cli.env);
+  // Tell background-aware CLIs which way the ccsm terminal is painted, so
+  // their light/dark auto-detection matches it. COLORFGBG (fg;bg ANSI indices)
+  // is the de-facto signal that codex (its DiffTheme probes it), copilot, and
+  // claude all read — bg 15 = light, 0 = dark. claude additionally gets OSC
+  // 10/11 answers + --settings auto; this covers codex/copilot, which detect
+  // via COLORFGBG, not OSC. The frontend passes its resolved theme on spawn;
+  // a theme switch is picked up on the next resume.
+  if (theme === 'light' || theme === 'dark') {
+    env.COLORFGBG = theme === 'light' ? '0;15' : '15;0';
+  }
   const trySpawn = (executable) => webTerminal.spawn({
     id: sessionId,
     command: executable,
@@ -832,12 +859,14 @@ app.post('/api/sessions/new', async (req, res) => {
         cliSessionId: preAssignedId || undefined,
       });
       try {
+        const themeArgs = await codexThemeArgs(cli, req.body && req.body.theme);
         const entry = spawnCliSession({
           cli,
           cwd: workspace.path,
           sessionId: record.id,
           meta: { title: workspace.name, workspace: workspace.name, cwd: workspace.path },
-          extraArgs: newSessionArgs,
+          extraArgs: [...themeArgs, ...newSessionArgs],
+          theme: req.body && req.body.theme,
         });
         await persistedSessions.markRunning(record.id, entry.meta.pid);
         launched = { id: record.id, pid: entry.meta.pid, cliId: cli.id };
@@ -966,13 +995,15 @@ app.post('/api/sessions/:id/resume', asyncH(async (req, res) => {
     // pre-assignment refactor every ccsm-launched session has one (via
     // newSessionIdArgs flag or the codex seed trick), and adopted
     // sessions inherit theirs from the disk scan.
+    const themeArgs = await codexThemeArgs(cli, req.body && req.body.theme);
     const extraArgs = buildResumeArgs(cli, record);
     const entry = spawnCliSession({
       cli,
       cwd: record.cwd,
       sessionId: record.id,
       meta: { title: record.title || record.workspace, workspace: record.workspace, cwd: record.cwd },
-      extraArgs,
+      extraArgs: [...themeArgs, ...extraArgs],
+      theme: req.body && req.body.theme,
     });
     await persistedSessions.markRunning(record.id, entry.meta.pid);
     res.json({ launched: { id: record.id, pid: entry.meta.pid, cliId: cli.id } });
@@ -981,6 +1012,31 @@ app.post('/api/sessions/:id/resume', asyncH(async (req, res) => {
   }
 }));
 
+// codex-only: when the ccsm terminal is in LIGHT mode, inject a session-scoped
+// `-c tui.theme=ccsm-light`. codex's diff theme detection (default_bg()) is
+// compiled out on Windows and always falls back to a DARK diff palette, which
+// reads poorly on a white terminal — and it ignores COLORFGBG/OSC. The only
+// lever is a syntax theme whose markup.inserted/deleted scopes carry light
+// backgrounds (they override the diff palette at true-color level). We ship
+// that theme (ccsm-light.tmTheme), copy it into the codex home, and point
+// tui.theme at it. Returns the args to prepend (before `resume <id>` so the
+// global -c lands before the subcommand), or [] when not applicable. Skipped
+// in dark mode (codex's dark default is already correct on a dark terminal)
+// and when the user configured their own tui.theme in cli.args.
+async function codexThemeArgs(cli, theme) {
+  if (!cli || cli.type !== 'codex' || theme !== 'light') return [];
+  const args = cli.args || [];
+  const userSet = args.some((a, i) =>
+    String(a).includes('tui.theme') || (a === '-c' && String(args[i + 1] || '').includes('tui.theme')));
+  if (userSet) return [];
+  try {
+    const { probeCodexHome, ensureCodexLightTheme } = require('./lib/codexSeed');
+    const home = await probeCodexHome({ command: cli.command, shell: cli.shell });
+    if (!(await ensureCodexLightTheme(home))) return [];
+    return ['-c', 'tui.theme="ccsm-light"'];
+  } catch { return []; }
+}
+
 // Build the args appended on resume: substitute the captured upstream
 // session UUID into cli.resumeIdArgs (e.g. ['--resume', '<id>'] →
 // ['--resume', '7c28...']). Throws if either piece is missing — by