claude-code-kanban 7.0.3 → 7.1.1

package/cli.js

@@ -228,7 +228,7 @@ const COMMANDS = {
     verbs: {
       start: {
         summary: 'Start claude in cck\'s terminal with a task; prints the session id',
-        usage: 'claude-code-kanban dispatch start --cwd <dir> (--spec <text> | --spec-file <path>) [--name <n>] [--group <g>] [--model <m>] [--worktree [name]] [--json] [-- <claude args>...]',
+        usage: 'claude-code-kanban dispatch start --cwd <dir> (--spec <text> | --spec-file <path>) [--name <n>] [--group <g>] [--model <m>] [--worktree [name]] [--task-list [id]] [--json] [-- <claude args>...]',
         flags: {
           '--cwd <dir>': 'Folder to run in (a known project, default: current dir)',
           '--spec <text>': 'The task, self-contained; sent as the first message',
@@ -237,12 +237,14 @@ const COMMANDS = {
           '--group <g>': 'Show it with this session in a kebab-case group (default: this session\'s group)',
           '--model <m>': 'fable, opus, sonnet or haiku',
           '--worktree [name]': 'Run in a new git worktree',
+          '--task-list [id]': 'Use this task list instead of its own (default: this session\'s list), so its cards show on one board with yours. Off unless given',
           '--json': 'Output JSON',
           '-- <claude args>': 'Passed to claude as they are, e.g. --permission-mode auto. No quotes, % or control characters; cck sets --session-id, --name, --model and --worktree',
         },
         notes: 'Needs the terminal token, so it runs on the machine of the cck server. cck sends no report: say in the spec how the session reports back. Run `claude-code-kanban skills get dispatch` for how to write the spec.',
         examples: [
           'claude-code-kanban dispatch start --cwd . --spec-file spec.md --name fix-login-redirect --group auth-refactor --model sonnet -- --permission-mode auto',
+          'claude-code-kanban dispatch start --cwd . --spec-file spec.md --name api-worker --task-list',
         ],
         run: runDispatchStartCli,
       },
@@ -1079,12 +1081,19 @@ async function runDispatchStartCli(argv) {
     return usageError(COMMANDS.dispatch.verbs.start, `Group names are kebab-case${hint ? `: try --group ${hint}` : ', e.g. auth-refactor'}`);
   }
   const worktree = args.includes('--worktree') ? getArgValue(args, 'worktree') || true : false;
+  const hasTaskList = args.some(a => a === '--task-list' || a.startsWith('--task-list='));
+  const ownList = process.env.CLAUDE_CODE_TASK_LIST_ID || process.env.CLAUDE_CODE_SESSION_ID;
+  const taskList = hasTaskList ? getArgValue(args, 'task-list') || ownList || null : null;
+  if (hasTaskList && !taskList) {
+    return usageError(COMMANDS.dispatch.verbs.start, 'No task list id: pass --task-list <id> outside a Claude Code session');
+  }
   const body = {
     cwd: canonicalDir(getArgValue(args, 'cwd') || '.'),
     spec,
     name: getArgValue(args, 'name'),
     model: getArgValue(args, 'model'),
     worktree,
+    taskList,
     group,
     claudeArgs,
     parent: process.env.CLAUDE_CODE_SESSION_ID || null,

package/lib/parsers.js

@@ -247,7 +247,7 @@ function pushUserMessage(messages, text, timestamp, sysLabel, extras) {
   messages.push(msg);
 }
 
-// Cache: jsonlPath -> { ino, mtimeMs, scannedUpTo, customTitle }
+// Cache: jsonlPath -> { ino, mtimeMs, scannedUpTo, customTitle, agentName }
 // Only re-scan the new bytes appended since last scan
 const customTitleCache = new Map();
 let sessionCacheDirty = false;
@@ -269,15 +269,19 @@ const TITLE_MARKER_TEXT = ['"custom-title"', '"ai-title"', '"agent-name"'];
 const TITLE_MARKERS = TITLE_MARKER_TEXT.map((m) => Buffer.from(m));
 const hasTitleMarker = (s) => TITLE_MARKER_TEXT.some((m) => s.includes(m));
 
-function extractCustomTitleFromText(text) {
-  if (!hasTitleMarker(text)) return null;
+// agentName is the session's peer name (the name SendMessage addresses), kept apart from the
+// merged title so a task owner can be matched to its session after the session ends.
+const NO_TITLES = { customTitle: null, agentName: null };
+
+function extractTitlesFromText(text) {
+  if (!hasTitleMarker(text)) return NO_TITLES;
   const lines = text.split('\n');
   let customTitle = null;
   let aiTitle = null;
   let agentName = null;
   for (let i = lines.length - 1; i >= 0; i--) {
     const line = lines[i];
-    if (!hasTitleMarker(line)) continue;
+    if (!hasTitleMarker(line) || (customTitle && !line.includes('"agent-name"'))) continue;
     try {
       const data = JSON.parse(line);
       if (!customTitle && data.type === 'custom-title' && data.customTitle && !data.customTitle.startsWith('<')) {
@@ -287,40 +291,43 @@ function extractCustomTitleFromText(text) {
       } else if (!agentName && data.type === 'agent-name' && data.agentName && !data.agentName.startsWith('<')) {
         agentName = data.agentName;
       }
-      if (customTitle) break;
+      if (customTitle && agentName) break;
     } catch {}
   }
-  return customTitle || aiTitle || agentName || null;
+  return { customTitle: customTitle || aiTitle || agentName || null, agentName };
 }
 
-// Same answer as extractCustomTitleFromText(buf.toString('utf8')): that function only looks at
+// Same answer as extractTitlesFromText(buf.toString('utf8')): that function only looks at
 // lines holding a marker, and a line cut at \n decodes the same alone as inside the chunk.
-function extractCustomTitleFromBuffer(buf) {
+function extractTitlesFromBuffer(buf) {
   const starts = new Set();
   for (const m of TITLE_MARKERS) {
     for (let i = buf.indexOf(m); i !== -1; i = buf.indexOf(m, i + m.length)) {
       starts.add(buf.lastIndexOf(0x0a, i) + 1);
     }
   }
-  if (!starts.size) return null;
+  if (!starts.size) return NO_TITLES;
   const lines = [...starts]
     .sort((a, b) => a - b)
     .map((s) => {
       const e = buf.indexOf(0x0a, s);
       return buf.toString('utf8', s, e === -1 ? buf.length : e);
     });
-  return extractCustomTitleFromText(lines.join('\n'));
+  return extractTitlesFromText(lines.join('\n'));
 }
 
-function readCustomTitle(jsonlPath, existingStat) {
+const pickTitles = ({ customTitle, agentName }) => ({ customTitle, agentName });
+
+function readTitles(jsonlPath, existingStat) {
   try {
     const stat = existingStat || statSync(jsonlPath);
     const prev = customTitleCache.get(jsonlPath);
     const cached = sameFileGrown(prev, stat) ? prev : null;
 
-    if (cached && cached.scannedUpTo === stat.size) return cached.customTitle;
+    if (cached && cached.scannedUpTo === stat.size) return cached;
 
     let customTitle = cached?.customTitle || null;
+    let agentName = cached?.agentName || null;
     const fd = fs.openSync(jsonlPath, 'r');
 
     if (cached) {
@@ -328,7 +335,9 @@ function readCustomTitle(jsonlPath, existingStat) {
       if (len > 0) {
         const buf = Buffer.alloc(len);
         fs.readSync(fd, buf, 0, len, cached.scannedUpTo);
-        customTitle = extractCustomTitleFromBuffer(buf) || customTitle;
+        const found = extractTitlesFromBuffer(buf);
+        customTitle = found.customTitle || customTitle;
+        agentName = found.agentName || agentName;
       }
     } else {
       // The last chunk holding a title wins, so scan from the end and stop at the first hit.
@@ -336,16 +345,17 @@ function readCustomTitle(jsonlPath, existingStat) {
       const buf = Buffer.allocUnsafe(Math.min(CHUNK, stat.size));
       for (let offset = Math.floor((stat.size - 1) / CHUNK) * CHUNK; offset >= 0 && !customTitle; offset -= CHUNK) {
         const n = fs.readSync(fd, buf, 0, Math.min(CHUNK, stat.size - offset), offset);
-        customTitle = extractCustomTitleFromBuffer(buf.subarray(0, n));
+        ({ customTitle, agentName } = extractTitlesFromBuffer(buf.subarray(0, n)));
       }
     }
 
     fs.closeSync(fd);
-    customTitleCache.set(jsonlPath, { ino: stat.ino, mtimeMs: stat.mtimeMs, scannedUpTo: stat.size, customTitle });
+    const entry = { ino: stat.ino, mtimeMs: stat.mtimeMs, scannedUpTo: stat.size, customTitle, agentName };
+    customTitleCache.set(jsonlPath, entry);
     sessionCacheDirty = true;
-    return customTitle;
+    return entry;
   } catch {
-    return null;
+    return NO_TITLES;
   }
 }
 
@@ -416,7 +426,7 @@ const withoutUsage = (reply) => reply && { ...reply, usage: null };
 // change or truncation (size < scannedUpTo).
 
 function readSessionInfoFromJsonl(jsonlPath) {
-  const result = { slug: null, projectPath: null, cwd: null, gitBranch: null, customTitle: null, logicalParentUuid: null, compactBoundaryUuid: null, permissionMode: null, cacheTtl: null, lastReply: null };
+  const result = { slug: null, projectPath: null, cwd: null, gitBranch: null, customTitle: null, agentName: null, logicalParentUuid: null, compactBoundaryUuid: null, permissionMode: null, cacheTtl: null, lastReply: null };
   let stat;
   let fd;
   try {
@@ -439,7 +449,7 @@ function readSessionInfoFromJsonl(jsonlPath) {
       permissionMode: cached.permissionMode || null,
       cacheTtl: cached.cacheTtl || null,
       lastReply: cached.lastReply || null,
-      customTitle: readCustomTitle(jsonlPath, stat)
+      ...pickTitles(readTitles(jsonlPath, stat))
     };
   }
 
@@ -633,7 +643,7 @@ function readSessionInfoFromJsonl(jsonlPath) {
     }
     sessionCacheDirty = true;
   }
-  result.customTitle = readCustomTitle(jsonlPath, stat);
+  Object.assign(result, pickTitles(readTitles(jsonlPath, stat)));
   return result;
 }
 

package/lib/retention.js

@@ -72,7 +72,7 @@ function createDispatchedStore({ load, save, now = Date.now }) {
     return removed;
   }
 
-  return { record, prune, get: (id) => entries.get(id) || null };
+  return { record, prune, get: (id) => entries.get(id) || null, entries: () => entries.entries() };
 }
 
 // Names only, no stat or parse: the sweep needs which transcripts exist, not what they hold.

package/lib/session-cache.js

@@ -4,7 +4,7 @@ const { exportParentVerdicts, importParentVerdicts, parentVerdictsDirty } = requ
 const { exportTaskCounts, importTaskCounts, taskCountsDirty } = require('./task-counts');
 
 // Bump when an entry's shape or meaning changes: a file with another version is ignored.
-const VERSION = 5;
+const VERSION = 6;
 // A cache this large is not one cck wrote for a normal set of transcripts. Rebuild it cold.
 const MAX_BYTES = 8 * 1024 * 1024;
 

package/lib/terminal.js

@@ -30,6 +30,8 @@ const PICK_START_SLACK_MS = 2000;
 // charset that needs no escaping beyond plain quotes. The first character is never '-'.
 const NAME_RE = /^[A-Za-z0-9][A-Za-z0-9 ._-]{0,79}$/;
 const WORKTREE_RE = /^[A-Za-z0-9][A-Za-z0-9._-]{0,63}$/;
+// Claude Code keeps a list in tasks/<id>/, so the id must stay one path segment.
+const TASK_LIST_RE = /^[A-Za-z0-9][A-Za-z0-9._-]{0,127}$/;
 const MODELS = new Set(['fable', 'opus', 'sonnet', 'haiku']);
 // Extra claude args reach the command line inside plain quotes (quoteArg), so a character
 // that ends or expands those quotes in any of the shells is refused.
@@ -72,6 +74,8 @@ const STRIP_ENV = [
   // session's child and writes no live-session registry entry, which the resume picker relies on.
   'CLAUDE_CODE_CHILD_SESSION', 'CLAUDE_CODE_SESSION_ID', 'CLAUDE_PID', 'CLAUDE_CODE_SESSION_ATTENDED',
   'CLAUDE_CODE_MESSAGING_SOCKET', 'CLAUDE_CODE_MESSAGING_TOKEN', 'CLAUDE_CODE_EXECPATH',
+  // A shared task list is opt-in per dispatch (taskList), never inherited from cck's own env.
+  'CLAUDE_CODE_TASK_LIST_ID',
   // A cck started inside tmux passes these on, and claude then lists its session under a tmux pane it is not in.
   'TMUX', 'TMUX_PANE',
 ];
@@ -190,13 +194,15 @@ function parseNewSpec(msg) {
   if (typeof worktree !== 'boolean' && !(typeof worktree === 'string' && WORKTREE_RE.test(worktree))) return 'worktree name';
   const model = msg.model || null;
   if (model && !MODELS.has(model)) return 'model';
+  const taskList = msg.taskList || null;
+  if (taskList && !(typeof taskList === 'string' && TASK_LIST_RE.test(taskList))) return 'task list id';
   // biome-ignore lint/suspicious/noControlCharactersInRegex: strips ESC so a prompt cannot carry terminal sequences
   const prompt = typeof msg.prompt === 'string' ? msg.prompt.replace(/\x1b/g, '').trim() : '';
   if (prompt.length > MAX_PROMPT) return 'prompt';
   const extraArgs = msg.extraArgs ?? [];
   const bad = extraArgsError(extraArgs);
   if (bad) return bad;
-  return { cwd: msg.cwd, name: name || null, worktree, model, prompt: prompt || null, extraArgs };
+  return { cwd: msg.cwd, name: name || null, worktree, model, taskList, prompt: prompt || null, extraArgs };
 }
 
 function samePath(a, b) {
@@ -298,8 +304,8 @@ function clientConfigFor(config, available) {
  * @param {(cmd: string) => string|null} o.which
  * @param {string} [o.token]
  * @param {() => void} [o.onChange]  a terminal started, ended or moved to another session id
- * @param {() => {sessions?: string[]}|null} [o.load]  the saved list, read when config.restore is on
- * @param {(data: {sessions: string[]}) => void} [o.save]  the session ids to resume on the next start
+ * @param {() => {sessions?: string[], taskLists?: Object<string, string>}|null} [o.load]  the saved list, read when config.restore is on
+ * @param {(data: {sessions: string[], taskLists?: Object<string, string>}) => void} [o.save]  the session ids to resume on the next start, and the shared task list of each that has one
  * @param {object} [o.pty]  stands in for @lydell/node-pty in tests
  */
 function createTerminalService(o) {
@@ -323,8 +329,14 @@ function createTerminalService(o) {
   const exitTimer = setInterval(checkExits, exitPollMs);
   exitTimer.unref();
   // Read before any terminal starts, so the first save keeps the ids still waiting to restore.
-  const saved = config.restore ? o.load?.()?.sessions : null;
+  const savedState = config.restore ? o.load?.() : null;
+  const saved = savedState?.sessions;
   const restoreQueue = Array.isArray(saved) ? saved.filter((id) => typeof id === 'string' && UUID_RE.test(id)) : [];
+  // A resumed claude gets back the shared task list it was started with.
+  const savedTaskLists = {};
+  for (const [id, list] of Object.entries(savedState?.taskLists || {})) {
+    if (restoreQueue.includes(id) && typeof list === 'string' && TASK_LIST_RE.test(list)) savedTaskLists[id] = list;
+  }
 
   // Lazy and optional: a missing prebuilt or shell must hide the feature, not crash cck.
   function load() {
@@ -366,8 +378,14 @@ function createTerminalService(o) {
   function saveState() {
     saveTimer = null;
     const ids = new Set(restoreQueue);
-    for (const s of sessions.values()) if (!s.ended && !s.claudeExitedAt && RESTORABLE_MODES.has(s.mode)) ids.add(s.id);
-    const data = { sessions: [...ids] };
+    const taskLists = {};
+    for (const id of restoreQueue) if (savedTaskLists[id]) taskLists[id] = savedTaskLists[id];
+    for (const s of sessions.values()) {
+      if (s.ended || s.claudeExitedAt || !RESTORABLE_MODES.has(s.mode)) continue;
+      ids.add(s.id);
+      if (s.taskList) taskLists[s.id] = s.taskList;
+    }
+    const data = { sessions: [...ids], ...(Object.keys(taskLists).length && { taskLists }) };
     const json = JSON.stringify(data);
     if (json === lastSaved) return;
     lastSaved = json;
@@ -515,6 +533,8 @@ function createTerminalService(o) {
   function spawnSession(id, mode, cwdCandidate, cols, rows, spec, extraEnv) {
     const cwd = cwdCandidate && fs.existsSync(cwdCandidate) ? cwdCandidate : os.homedir();
     const env = { ...ptyEnv({ claudeDir: o.claudeDir, isDefaultDir: o.isDefaultDir, noFlicker: config.noFlicker, cckUrl: o.serverUrl?.() }), ...extraEnv };
+    const taskList = spec?.taskList || savedTaskLists[id] || null;
+    if (taskList) env.CLAUDE_CODE_TASK_LIST_ID = taskList;
     // Git Bash's login profile cds to $HOME unless this is set.
     if (shellFamily(shell) === 'gitbash') env.CHERE_INVOKING = '1';
     const proc = pty.spawn(shell, shellArgs(shell, claudeArgsFor(mode, id, spec)), {
@@ -529,7 +549,7 @@ function createTerminalService(o) {
     term.loadAddon(serializer);
     const s = {
       id, mode, cwd, pty: proc, term, serializer, sockets: new Set(), exited: false, ended: false, paused: false, startedAt: Date.now(),
-      name: spec?.name || null, worktree: spec?.worktree || false, onOutput: null,
+      name: spec?.name || null, worktree: spec?.worktree || false, taskList, onOutput: null,
     };
     if (spec?.prompt) queuePrompt(s, spec.prompt);
     if (mode === 'pick') watchPick(s);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "claude-code-kanban",
-  "version": "7.0.3",
+  "version": "7.1.1",
   "description": "A web-based Kanban board for viewing Claude Code tasks with agent teams support",
   "main": "server.js",
   "type": "commonjs",

package/plugin/plugins/claude-code-kanban/.claude-plugin/plugin.json

@@ -1,6 +1,6 @@
 {
   "name": "claude-code-kanban",
-  "version": "2.25.1",
+  "version": "2.25.2",
   "description": "claude-code-kanban dashboard integration: agent activity tracking, context and cost tracking, skills to drive the board from a session and to follow it",
   "experimental": {
     "monitors": "./monitors.json"

package/plugin/plugins/claude-code-kanban/skills/dispatch/SKILL.md

@@ -24,6 +24,14 @@ When you are done, or cannot finish, send the result to <your peer name> with th
 
 `--handoff` is a skill argument that drops the reply line: the session owns the task, and the user follows it on the board. Keep it out of the `dispatch start` command.
 
+## Track on the board (optional)
+
+When the user asks to track the dispatched work, give each worker a card:
+
+1. Create one card per worker with `TaskCreate`.
+2. Right after each `dispatch start`, set the card's `owner` to the worker's `--name` and its status to `in_progress`. The card then links to the worker's session.
+3. Set the card to `completed` when the worker reports.
+
 ## Orchestration patterns
 
 Use request-reply, handoff or orchestrator-workers directly. When another shape fits better (a separate reviewer, steps that feed each other, a sub-orchestrator, a decision for the user), propose it in one line, the pattern and why, and dispatch only after the user agrees, unless the user named it. Details: [references/orchestration-patterns.md](references/orchestration-patterns.md).

package/plugin/plugins/claude-code-kanban/skills/dispatch/references/orchestration-patterns.md

@@ -20,6 +20,7 @@ Propose these first, unless the user named one. Each adds steps, rounds or sessi
 | Evaluator-optimizer | There is a clear acceptance bar and a second look improves the result |
 | Hierarchical | A part is itself large enough to split |
 | Human-in-the-loop | The spec leaves a choice the user should make |
+| Shared board | The user wants the workers to pick cards from one task list |
 
 ## Request-reply
 
@@ -48,3 +49,7 @@ A worker that dispatches its own workers and replies once they all have. Your co
 ## Human-in-the-loop
 
 Add to the worker's spec: `When you need a decision, ask <your peer name> with the SendMessage tool and keep working on what does not depend on the answer.` Ask the user when the decision is theirs, and reply with `SendMessage`. You can steer a running worker the same way at any time.
+
+## Shared board
+
+Every worker uses your task list instead of its own, so all cards show on one board. Pass `--task-list` with no value to each `dispatch start`. You assign the cards as in Track on the board (optional); the spec names the worker's card and tells it to set that card to `completed` when done.

package/public/app.js

@@ -4036,6 +4036,14 @@ function openBlockers(task) {
   return (task.blockedBy || []).filter((id) => findSiblingTask(task, id)?.status !== 'completed');
 }
 
+function renderOwnerBadge(task) {
+  const c = getOwnerColor(task.owner);
+  const style = `background:${c.bg};color:${c.color}`;
+  const target = task.ownerSessionId;
+  if (!target) return `<span class="task-owner-badge" style="${style}">${escapeHtml(task.owner)}</span>`;
+  return `<button type="button" class="task-owner-badge task-owner-link" style="${style}" title="Open dispatched session" onclick="event.stopPropagation(); revealSession('${escAttrJs(target)}')">${ICON_DISPATCHED}${escapeHtml(task.owner)}</button>`;
+}
+
 function renderTaskCard(task) {
   const blockers = openBlockers(task);
   const isBlocked = blockers.length > 0;
@@ -4059,16 +4067,7 @@ function renderTaskCard(task) {
           <div class="task-id">
             <span>#${taskId}</span>
             ${isBlocked ? `<span class="task-blocked" title="Blocked">waiting on ${blockers.map((id) => `#${escapeHtml(id)}`).join(' ')}</span>` : ''}
-            ${
-              task.owner
-                ? (
-                    () => {
-                      const c = getOwnerColor(task.owner);
-                      return `<span class="task-owner-badge" style="background:${c.bg};color:${c.color}">${escapeHtml(task.owner)}</span>`;
-                    }
-                  )()
-                : ''
-            }
+            ${task.owner ? renderOwnerBadge(task) : ''}
           </div>
           <div class="task-title">${escapeHtml(task.subject)}</div>
           ${task.status === 'in_progress' && task.activeForm ? `<div class="task-active">${escapeHtml(task.activeForm)}</div>` : ''}
@@ -5531,7 +5530,7 @@ async function showTaskDetail(taskId, sessionId = null) {
 
         <div class="detail-section" style="display: flex; gap: 12px; align-items: center;">
           <div>${statusLabels[task.status] || ''}</div>
-          ${task.owner ? `<div style="font-size: 13px; color: ${getOwnerColor(task.owner).color}; font-weight: 500;">${escapeHtml(task.owner)}</div>` : ''}
+          ${task.owner ? renderOwnerBadge(task) : ''}
         </div>
 
         <div class="detail-section">
@@ -7630,6 +7629,18 @@ function bridgedFrameEls() {
   return [...document.querySelectorAll('iframe[srcdoc]')].filter((f) => bridgedFrames.has(f));
 }
 
+// A previewed page always hands back the zoom keys, so Ctrl +/-/0 scales it like a markdown
+// preview instead of zooming the whole board. A bridged frame is on screen only in a zoomable view.
+const ZOOM_CLAIMS = ['ctrlKey', 'metaKey'].flatMap((mod) =>
+  [false, true].flatMap((shiftKey) =>
+    Object.keys(ZOOM_KEYS).map((k) =>
+      k.length === 1
+        ? { [mod]: true, shiftKey, key: k, code: '' }
+        : { [mod]: true, shiftKey, key: 'Unidentified', code: k },
+    ),
+  ),
+);
+
 function sendBridgeClaims(frames, claims) {
   for (const f of frames) f.contentWindow?.postMessage({ type: `${REVIEW_MSG}claims`, ...claims }, '*');
 }
@@ -7985,7 +7996,7 @@ function createPreviewFrame(className, srcdoc) {
   frame.setAttribute('referrerpolicy', 'no-referrer');
   frame.srcdoc = srcdoc;
   bridgedFrames.add(frame);
-  frame.addEventListener('load', () => sendBridgeClaims([frame], keyClaims()));
+  frame.addEventListener('load', () => sendBridgeClaims([frame], bridgeClaims(keyClaims())));
   return frame;
 }
 
@@ -12068,7 +12079,7 @@ async function loadPaneView(sid, pane, view) {
   }
   if (pane.kind === 'url') {
     const frame = document.createElement('iframe');
-    frame.className = 'pane-frame';
+    frame.className = 'pane-frame modal-zoomable';
     frame.setAttribute('sandbox', PANE_URL_SANDBOX);
     frame.setAttribute('referrerpolicy', 'no-referrer');
     frame.title = pane.title;
@@ -12088,7 +12099,7 @@ async function loadPaneView(sid, pane, view) {
     if (r.ok) data = await r.json();
   } catch {}
   if (data?.kind === 'html') {
-    const frame = createPreviewFrame('pane-frame', data.content + REVIEW_BRIDGE_TAG);
+    const frame = createPreviewFrame('pane-frame modal-zoomable', data.content + REVIEW_BRIDGE_TAG);
     frame.title = pane.title;
     view.appendChild(frame);
     attachPaneReview(view, sid, fileReviewOpts(data.path, data.kind, frame, frame));
@@ -12255,26 +12266,74 @@ function paneMenuKeydown(e) {
   menuKeydown(e, [...menu.querySelectorAll('.pane-menu-item')], closePaneMenu);
 }
 
+async function deleteBoardTasks(onlyCompleted) {
+  const sid = paneSessionId();
+  if (!sid) return;
+  const count = currentTasks.filter((t) => !onlyCompleted || t.status === 'completed').length;
+  if (!count) {
+    showToast(onlyCompleted ? 'No completed tasks' : 'No tasks', 'info');
+    return;
+  }
+  const noun = `${count} ${onlyCompleted ? 'completed ' : ''}task${count === 1 ? '' : 's'}`;
+  const ok = await confirmModal({
+    title: onlyCompleted ? 'Delete Completed Tasks' : 'Delete All Tasks',
+    message: `Delete ${noun}? This cannot be undone.`,
+    okLabel: 'Delete',
+  });
+  if (!ok) return;
+  const q = onlyCompleted ? '?status=completed' : '';
+  const res = await paneRequest('DELETE', `/api/tasks/${encodeURIComponent(sid)}${q}`);
+  if (res.error) {
+    showToast(`Failed to delete tasks: ${res.error}`, 'error');
+    return;
+  }
+  if (detailPanel.classList.contains('visible')) closeDetailPanel();
+  showToast(`Deleted ${res.deleted.length} task${res.deleted.length === 1 ? '' : 's'}`, 'success');
+  await refreshCurrentView();
+}
+
+const paneMenuItem = (act, label) =>
+  `<button class="pane-menu-item" role="menuitem" data-pane-act="${escapeHtml(act)}">${label}</button>`;
+
 function openPaneMenu(x, y, id) {
+  if (id === 'board') {
+    showPaneMenu(
+      x,
+      y,
+      id,
+      'Board actions',
+      '<div class="pane-menu-label">Board</div>' +
+        paneMenuItem('deleteCompleted', 'Delete completed tasks') +
+        paneMenuItem('deleteAll', 'Delete all tasks'),
+    );
+    return;
+  }
   const pane = paneById(id);
   if (!pane) return;
+  const url = pane.kind === 'url';
+  showPaneMenu(
+    x,
+    y,
+    pane.id,
+    'Pane actions',
+    `<div class="pane-menu-label" title="${escapeHtml(pane.target)}">${escapeHtml(pane.target)}</div>` +
+      paneMenuItem('copy', url ? 'Copy URL' : 'Copy path') +
+      paneMenuItem('open', url ? 'Open in new tab' : 'Open in preview') +
+      paneMenuItem('reload', 'Reload') +
+      paneMenuItem('close', 'Close pane'),
+  );
+}
+
+function showPaneMenu(x, y, id, ariaLabel, html) {
   closePaneMenu();
   sgCloseMenu();
-  const url = pane.kind === 'url';
-  const item = (act, label) =>
-    `<button class="pane-menu-item" role="menuitem" data-pane-act="${escapeHtml(act)}">${label}</button>`;
   const menu = document.createElement('div');
   menu.id = 'pane-menu';
   menu.className = 'pane-menu';
   menu.setAttribute('role', 'menu');
-  menu.setAttribute('aria-label', 'Pane actions');
-  menu.dataset.pane = pane.id;
-  menu.innerHTML =
-    `<div class="pane-menu-label" title="${escapeHtml(pane.target)}">${escapeHtml(pane.target)}</div>` +
-    item('copy', url ? 'Copy URL' : 'Copy path') +
-    item('open', url ? 'Open in new tab' : 'Open in preview') +
-    item('reload', 'Reload') +
-    item('close', 'Close pane');
+  menu.setAttribute('aria-label', ariaLabel);
+  menu.dataset.pane = id;
+  menu.innerHTML = html;
   placeMenu(menu, x, y);
   document.addEventListener('keydown', paneMenuKeydown, true);
   menu.querySelector('.pane-menu-item').focus();
@@ -12285,6 +12344,8 @@ const PANE_MENU_ACTIONS = {
   open: openPaneExternally,
   reload: reloadPane,
   close: closePane,
+  deleteCompleted: () => deleteBoardTasks(true),
+  deleteAll: () => deleteBoardTasks(false),
 };
 
 // The server takes only absolute paths, and linked docs can be relative to the session's folder.
@@ -12396,7 +12457,7 @@ paneStrip.addEventListener('auxclick', (e) => {
 });
 paneStrip.addEventListener('contextmenu', (e) => {
   const tab = e.target.closest('.pane-tab');
-  if (!tab || tab.dataset.pane === 'board') return;
+  if (!tab) return;
   e.preventDefault();
   openPaneMenu(e.clientX, e.clientY, tab.dataset.pane);
 });
@@ -12924,6 +12985,10 @@ function keyClaims() {
   return { keys: terminalClaims(), forward: hub.forwardCombos() };
 }
 
+function bridgeClaims(claims) {
+  return { ...claims, keys: [...claims.keys, ...ZOOM_CLAIMS] };
+}
+
 function pushTerminalClaims() {
   if (terminalClaimsQueued) return;
   terminalClaimsQueued = true;
@@ -12932,7 +12997,7 @@ function pushTerminalClaims() {
     const bridged = bridgedFrameEls();
     if (!termFrame.inited && !bridged.length) return;
     const claims = keyClaims();
-    sendBridgeClaims(bridged, claims);
+    sendBridgeClaims(bridged, bridgeClaims(claims));
     if (!termFrame.inited) return;
     const sig = JSON.stringify(claims);
     if (sig === termFrame.claims) return;

package/public/style.css

@@ -52,6 +52,7 @@
   --font-serif: var(--serif);
   /* reading-surface scale for the message-detail and preview modals (Ctrl +/-/0) */
   --modal-zoom: 1;
+  --review-panel-w: 320px;
 }
 
 /* Tokens derived from theme colors live on body, where color themes set those colors;
@@ -2929,6 +2930,22 @@ code.language-tree .hljs-title {
   letter-spacing: 0;
 }
 
+.task-owner-link {
+  border: none;
+  font-family: inherit;
+  cursor: pointer;
+}
+
+.task-owner-link:hover {
+  text-decoration: underline;
+}
+
+.task-owner-link svg {
+  width: 10px;
+  height: 10px;
+  flex-shrink: 0;
+}
+
 /* #endregion */
 
 /* #region TEAM_MODAL */
@@ -6028,7 +6045,6 @@ body.light .msg-assistant .msg-text {
 /* The comment panel opens beside the content, so the dialog grows by `--review-extra`
    instead of squeezing what is under review. */
 .modal.review-host {
-  --review-panel-w: 320px;
   --review-extra: 0px;
 }
 

package/server.js

@@ -828,12 +828,14 @@ function refreshSessionMetadataPath(jsonlPath) {
   if (shadow) {
     if (!existing.slug && info.slug) existing.slug = info.slug;
     if (!existing.customTitle && info.customTitle) existing.customTitle = info.customTitle;
+    if (!existing.agentName && info.agentName) existing.agentName = info.agentName;
     return true;
   }
   if (info.slug) existing.slug = info.slug;
   if (info.cwd) existing.cwd = info.cwd;
   if (info.gitBranch) existing.gitBranch = info.gitBranch;
   if (info.customTitle) existing.customTitle = info.customTitle;
+  if (info.agentName) existing.agentName = info.agentName;
   if (info.logicalParentUuid) existing.logicalParentUuid = info.logicalParentUuid;
   if (info.compactBoundaryUuid) existing.compactBoundaryUuid = info.compactBoundaryUuid;
   existing.permissionMode = info.permissionMode;
@@ -912,6 +914,7 @@ function loadSessionMetadata() {
         if (existing?.project && !candidateProject) {
           if (!existing.slug && sessionInfo.slug) existing.slug = sessionInfo.slug;
           if (!existing.customTitle && sessionInfo.customTitle) existing.customTitle = sessionInfo.customTitle;
+          if (!existing.agentName && sessionInfo.agentName) existing.agentName = sessionInfo.agentName;
           if (!existing.gitBranch && sessionInfo.gitBranch) existing.gitBranch = sessionInfo.gitBranch;
           sessionIds.push(sessionId);
           continue;
@@ -923,6 +926,7 @@ function loadSessionMetadata() {
           cwd: sessionInfo.cwd || null,
           gitBranch: sessionInfo.gitBranch || null,
           customTitle: sessionInfo.customTitle || null,
+          agentName: sessionInfo.agentName || null,
           jsonlPath: jsonlPath,
           logicalParentUuid: sessionInfo.logicalParentUuid || null,
           compactBoundaryUuid: sessionInfo.compactBoundaryUuid || null,
@@ -1680,6 +1684,27 @@ app.get('/api/projects', (_req, res) => {
 });
 
 // API: Get tasks for a session
+// A card's owner links to the session of that name that the list's session dispatched.
+// A name two of its dispatched sessions share gets no link.
+function addOwnerSessions(tasks, listIdOf) {
+  const lists = new Set(tasks.filter((t) => t.owner).map(listIdOf));
+  if (!lists.size) return;
+  const childIds = [...dispatched.entries()].filter(([, e]) => lists.has(e.parent));
+  if (!childIds.length) return;
+  const metadata = loadSessionMetadata();
+  const children = new Map();
+  for (const [id, { parent }] of childIds) {
+    const name = metadata[id]?.agentName;
+    if (!name) continue;
+    const key = `${parent}\n${name}`;
+    children.set(key, children.has(key) ? null : id);
+  }
+  for (const t of tasks) {
+    const id = t.owner && children.get(`${listIdOf(t)}\n${t.owner}`);
+    if (id) t.ownerSessionId = id;
+  }
+}
+
 app.get('/api/sessions/:sessionId', async (req, res) => {
   try {
     const sessionPath = taskDirFor(req.params.sessionId);
@@ -1704,6 +1729,7 @@ app.get('/api/sessions/:sessionId', async (req, res) => {
 
     // Sort by ID (numeric)
     tasks.sort((a, b) => parseInt(a.id, 10) - parseInt(b.id, 10));
+    addOwnerSessions(tasks, () => req.params.sessionId);
 
     res.json(tasks);
   } catch (error) {
@@ -1751,6 +1777,7 @@ app.get('/api/projects/:encodedPath/tasks', (req, res) => {
       }
     }
     tasks.sort((a, b) => parseInt(a.id, 10) - parseInt(b.id, 10));
+    addOwnerSessions(tasks, (t) => t._taskDir);
     res.json(tasks);
   } catch (error) {
     console.error('Error getting project tasks:', error);
@@ -3413,13 +3440,13 @@ function withDispatchPlacement(sessions) {
 // TERMINAL_TOKEN_FILE. The started session never holds it.
 app.post('/api/dispatch', terminalRoute(async (req, res) => {
   if (!terminal.authorized(req.get('x-terminal-token'))) return res.status(401).json({ error: 'invalid terminal token' });
-  const { cwd, spec, name, model, worktree, parent, group, claudeArgs } = req.body || {};
+  const { cwd, spec, name, model, worktree, taskList, parent, group, claudeArgs } = req.body || {};
   if (typeof spec !== 'string' || !spec.trim()) return res.status(400).json({ error: 'spec is required' });
   if (parent != null && !(typeof parent === 'string' && isUUID(parent))) return res.status(400).json({ error: 'invalid parent' });
   if (group != null && !isGroupName(group)) {
     return res.status(400).json({ error: `group must be kebab-case, e.g. ${suggestGroupName(group) || 'my-group'}` });
   }
-  const started = await terminal.startNew({ cwd, name, model, worktree, prompt: spec.trim(), extraArgs: claudeArgs });
+  const started = await terminal.startNew({ cwd, name, model, worktree, taskList, prompt: spec.trim(), extraArgs: claudeArgs });
   if (started.error) return res.status(started.status).json({ error: started.error });
   dispatches.add({ session: started.id, parent, cwd: started.cwd, name, group: group || null, worktree });
   dispatched.record(started.id, parent);
@@ -3578,33 +3605,50 @@ app.put('/api/tasks/:sessionId/:taskId', async (req, res) => {
   }
 });
 
+// A deleted task can't block anything, so drop the dangling reference instead of
+// refusing the delete -- a stale blockedBy id would pin the other task as BLOCKED forever.
+async function deleteTasks(dir, shouldDelete) {
+  let files;
+  try {
+    files = (await fs.readdir(dir)).filter((f) => f.endsWith('.json'));
+  } catch (e) {
+    if (e.code === 'ENOENT') return [];
+    throw e;
+  }
+  const tasks = [];
+  for (const file of files) {
+    try {
+      tasks.push({ file, task: JSON.parse(await fs.readFile(path.join(dir, file), 'utf8')) });
+    } catch (e) {
+      console.error(`Error parsing ${file}:`, e);
+    }
+  }
+  const doomed = tasks.filter((t) => shouldDelete(t));
+  const doomedIds = new Set(doomed.map(({ task }) => task.id));
+  const strip = (ids) => ids?.filter((id) => !doomedIds.has(id));
+
+  await Promise.all(
+    tasks
+      .filter(({ task }) => !doomedIds.has(task.id))
+      .map(({ file, task }) => {
+        const before = JSON.stringify(task);
+        task.blockedBy = strip(task.blockedBy);
+        task.blocks = strip(task.blocks);
+        if (JSON.stringify(task) === before) return null;
+        return fs.writeFile(path.join(dir, file), JSON.stringify(task, null, 2));
+      }),
+  );
+  // Delete the task file
+  await Promise.all(doomed.map(({ file }) => fs.unlink(path.join(dir, file))));
+  return [...doomedIds];
+}
+
 // API: Delete a task
 app.delete('/api/tasks/:sessionId/:taskId', async (req, res) => {
   try {
     const { sessionId, taskId } = req.params;
-    const sessionPath = taskDirFor(sessionId);
-    const taskPath = path.join(sessionPath, `${taskId}.json`);
-
-    if (!existsSync(taskPath)) {
-      return res.status(404).json({ error: 'Task not found' });
-    }
-
-    // A deleted task can't block anything, so drop the dangling reference instead of
-    // refusing the delete -- a stale blockedBy id would pin the other task as BLOCKED forever.
-    const taskFiles = readdirSync(sessionPath).filter(f => f.endsWith('.json'));
-
-    for (const file of taskFiles) {
-      const otherPath = path.join(sessionPath, file);
-      const otherTask = JSON.parse(readFileSync(otherPath, 'utf8'));
-      if (otherTask.blockedBy?.includes(taskId)) {
-        otherTask.blockedBy = otherTask.blockedBy.filter(id => id !== taskId);
-        await fs.writeFile(otherPath, JSON.stringify(otherTask, null, 2));
-      }
-    }
-
-    // Delete the task file
-    await fs.unlink(taskPath);
-
+    const deleted = await deleteTasks(taskDirFor(sessionId), ({ file }) => file === `${taskId}.json`);
+    if (!deleted.length) return res.status(404).json({ error: 'Task not found' });
     res.json({ success: true, taskId });
   } catch (error) {
     console.error('Error deleting task:', error);
@@ -3612,6 +3656,19 @@ app.delete('/api/tasks/:sessionId/:taskId', async (req, res) => {
   }
 });
 
+// API: Delete every task in a list, or with ?status=completed only the completed ones
+app.delete('/api/tasks/:sessionId', async (req, res) => {
+  try {
+    const { status } = req.query;
+    if (status !== undefined && status !== 'completed') return res.status(400).json({ error: 'Invalid status' });
+    const deleted = await deleteTasks(taskDirFor(req.params.sessionId), ({ task }) => !status || task.status === status);
+    res.json({ success: true, deleted });
+  } catch (error) {
+    console.error('Error deleting tasks:', error);
+    res.status(500).json({ error: 'Failed to delete tasks' });
+  }
+});
+
 // #endregion
 
 // #region PREVIEW