claude-code-kanban 7.7.0 → 7.9.0

package/public/group-tree.js

@@ -0,0 +1,21 @@
+// Loaded by the page as a plain script and by lib/user-groups.js through require, so the board's
+// transient sweep and the server's prune and expiry delete nested groups by one rule.
+const groupTree = (() => {
+  // The groups `goes` names whose child groups all go too.
+  function cascade(groups, goes) {
+    const children = new Map();
+    for (const g of groups) {
+      if (!children.has(g.parent)) children.set(g.parent, []);
+      children.get(g.parent).push(g);
+    }
+    const memo = new Map();
+    const all = (g) => {
+      if (!memo.has(g)) memo.set(g, goes(g) && (children.get(g.id) || []).every(all));
+      return memo.get(g);
+    };
+    return new Set(groups.filter(all));
+  }
+  return { cascade };
+})();
+
+if (typeof module === 'object' && module.exports) module.exports = groupTree;

package/public/index.html

@@ -28,6 +28,7 @@
   <script defer src="/project-match.js"></script>
   <script defer src="/tree-highlight.js"></script>
   <script defer src="/link-url.js"></script>
+  <script defer src="/group-tree.js"></script>
   <script defer src="/app.js"></script>
 </head>
 <body class="booting">
@@ -391,6 +392,7 @@
               <path d="M3 6h18M19 6v14a2 2 0 01-2 2H7a2 2 0 01-2-2V6m3 0V4a2 2 0 012-2h4a2 2 0 012 2v2"/>
             </svg>
           </button>
+          <button id="expand-detail" class="detail-close detail-expand" type="button"></button>
           <button id="close-detail" class="detail-close" aria-label="Close detail panel">
             <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
               <path d="M6 18L18 6M6 6l12 12"/>
@@ -475,7 +477,7 @@
           <button id="preview-pane-btn" class="icon-btn" aria-label="Open in a pane" title="Open in a pane" onclick="openPreviewInPane()">
             <svg fill="none" stroke="currentColor" stroke-width="2" width="16" height="16"><use href="#icon-pane"/></svg>
           </button>
-          <button id="preview-link-btn" class="icon-btn" aria-label="Link to current session" title="Link to current session" onclick="togglePreviewSessionLink()">
+          <button id="preview-link-btn" class="icon-btn" aria-label="Link to the session" title="Link to the session" onclick="togglePreviewSessionLink()">
             <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="16" height="16"><path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"/><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"/></svg>
           </button>
           <button class="icon-btn" aria-label="Open in editor" title="Open in editor" onclick="openPreviewInEditor()">
@@ -552,7 +554,7 @@
       <div class="modal-header">
         <h3 id="team-modal-title" class="modal-title">Team</h3>
         <div style="display:flex;align-items:center;gap:4px;">
-          <button id="session-info-sticky-btn" class="icon-btn" style="display:none" title="Sticky pin — always show at top" onclick="toggleSessionSticky(_infoModalSessionId); updateStickyBtnState()">
+          <button id="session-info-sticky-btn" class="icon-btn" style="display:none" title="Sticky pin — always show in the list" onclick="toggleSessionSticky(_infoModalSessionId); updateStickyBtnState()">
             <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 2 L15 9 L22 9 L17 14 L19 22 L12 18 L5 22 L7 14 L2 9 L9 9 Z"/></svg>
           </button>
           <button id="session-info-cost-btn" class="icon-btn" style="display:none" title="Open in Cost" onclick="openCost(_infoModalSessionId)">
@@ -750,13 +752,16 @@
           </button>
         </div>
       </div>
-      <div class="storage-tabs">
-        <button class="storage-tab active" data-tab="sessions" onclick="switchStorageTab('sessions')">Sessions</button>
-        <button class="storage-tab" data-tab="scratchpads" onclick="switchStorageTab('scratchpads')">Scratchpads</button>
-        <button class="storage-tab" data-tab="linked-docs" onclick="switchStorageTab('linked-docs')">Linked Docs</button>
+      <div class="storage-tabs" role="tablist" aria-label="Storage" title="← → switch tab">
+        <button class="storage-tab active" role="tab" aria-selected="true" data-tab="sessions" onclick="switchStorageTab('sessions')">Sessions</button>
+        <button class="storage-tab" role="tab" aria-selected="false" data-tab="dismissed" onclick="switchStorageTab('dismissed')">Dismissed</button>
+        <button class="storage-tab" role="tab" aria-selected="false" data-tab="scratchpads" onclick="switchStorageTab('scratchpads')">Scratchpads</button>
+        <button class="storage-tab" role="tab" aria-selected="false" data-tab="linked-docs" onclick="switchStorageTab('linked-docs')">Linked Docs</button>
+        <button class="storage-tab" role="tab" aria-selected="false" data-tab="groups" onclick="switchStorageTab('groups')">Groups</button>
       </div>
       <div class="modal-body modal-zoomable" id="storage-modal-body"></div>
       <div class="modal-footer">
+        <button id="storage-groups-clean-btn" class="btn btn-secondary" style="display:none" disabled title="Take the sessions the sidebar hides (not active or dismissed, and not pinned) out of every group" onclick="_storageCleanGroup(null)">Clean all</button>
         <button id="storage-cleanup-btn" class="btn btn-secondary" onclick="cleanupOrphanedStorage()">Clean Orphaned</button>
         <button class="btn btn-secondary" onclick="closeStorageManager()">Close</button>
       </div>
@@ -824,15 +829,31 @@
           </div>
         </div>
         <div class="ns-row ns-extra">
-          <label class="ns-label" for="ns-model">Model</label>
+          <span class="ns-label"></span>
           <div class="ns-field">
-            <select id="ns-model" class="form-input">
-              <option value="">Default</option>
-              <option value="fable">Fable</option>
-              <option value="opus">Opus</option>
-              <option value="sonnet">Sonnet</option>
-              <option value="haiku">Haiku</option>
-            </select>
+            <div class="ns-inline">
+              <fieldset class="ns-notched">
+                <legend><label for="ns-model">Model</label></legend>
+                <select id="ns-model" class="form-input">
+                  <option value="">Default</option>
+                  <option value="fable">Fable</option>
+                  <option value="opus">Opus</option>
+                  <option value="sonnet">Sonnet</option>
+                  <option value="haiku">Haiku</option>
+                </select>
+              </fieldset>
+              <fieldset class="ns-notched">
+                <legend><label for="ns-effort">Effort</label></legend>
+                <select id="ns-effort" class="form-input">
+                  <option value="">Default</option>
+                  <option value="low">Low</option>
+                  <option value="medium">Medium</option>
+                  <option value="high">High</option>
+                  <option value="xhigh">XHigh</option>
+                  <option value="max">Max</option>
+                </select>
+              </fieldset>
+            </div>
           </div>
         </div>
         <div id="ns-error" class="ns-error" hidden></div>

package/public/style.css

@@ -2134,6 +2134,12 @@ body.booting .boot-splash {
   border-left-color: var(--success);
 }
 
+.task-card.dim,
+.task-card.dim:hover {
+  opacity: 0.55;
+  border-left-color: var(--border);
+}
+
 .task-card.blocked {
   border-left-style: dashed;
 }
@@ -2209,6 +2215,21 @@ body.booting .boot-splash {
   white-space: nowrap;
 }
 
+.task-chip {
+  color: var(--text-muted);
+  text-transform: uppercase;
+  letter-spacing: 0.04em;
+  white-space: nowrap;
+}
+
+.task-chip-warn {
+  color: var(--warning);
+}
+
+.task-chip-accent {
+  color: var(--accent);
+}
+
 .task-desc {
   font-size: 11.5px;
   font-weight: 400;
@@ -2242,6 +2263,29 @@ body.booting .boot-splash {
 .detail-panel.visible {
   display: flex;
 }
+
+.detail-panel.expanded {
+  top: 50%;
+  left: 50%;
+  right: auto;
+  width: min(1200px, calc(100vw - 48px));
+  height: auto;
+  max-height: calc(100vh - 96px);
+  transform: translate(-50%, -50%);
+  border: 1px solid var(--border);
+  border-radius: 10px;
+  box-shadow: 0 12px 40px rgb(0 0 0 / 35%);
+  z-index: 900;
+}
+
+.detail-panel.expanded .panel-resize-handle {
+  display: none;
+}
+
+.detail-expand svg {
+  width: 15px;
+  height: 15px;
+}
 .detail-panel.resizing,
 .message-panel.resizing {
   transition: none;
@@ -4856,6 +4900,10 @@ body.show-resizing iframe {
   word-break: break-word;
 }
 
+.pane-doc-body:focus {
+  outline: none;
+}
+
 .pane-msg-meta {
   margin-bottom: 12px;
   font-size: 11px;
@@ -5518,6 +5566,9 @@ body.show-resizing iframe {
 .rendered-md li {
   margin: 0.2em 0;
 }
+.rendered-md ul > li:has(> input[type='checkbox']) {
+  list-style: none;
+}
 .rendered-md a {
   color: var(--accent);
 }
@@ -7851,7 +7902,7 @@ body.light .msg-assistant .msg-text {
 
 .confirm-dialog {
   padding: 0;
-  max-width: 480px;
+  max-width: 560px;
   overflow: hidden;
 }
 
@@ -8395,7 +8446,8 @@ select.form-input option:checked {
   box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3);
 }
 
-#review-pop textarea {
+#review-pop textarea,
+.review-card-edit {
   width: 100%;
   box-sizing: border-box;
   margin: 0 0 6px;
@@ -8524,7 +8576,8 @@ select.form-input option:checked {
 }
 
 .review-panel button.review-discard,
-.review-panel button.review-remove {
+.review-panel button.review-remove,
+.review-panel button.review-edit {
   padding: 3px 4px;
   color: var(--text-muted);
   background: none;
@@ -8539,7 +8592,7 @@ select.form-input option:checked {
 
 .review-card {
   position: relative;
-  padding: 8px 24px 10px 0;
+  padding: 8px 44px 10px 0;
   cursor: pointer;
 }
 
@@ -8566,12 +8619,35 @@ select.form-input option:checked {
   word-break: break-word;
 }
 
-.review-panel button.review-remove {
+.review-panel button.review-remove,
+.review-panel button.review-edit {
   position: absolute;
   top: 4px;
   right: 4px;
   padding: 0 6px;
 }
+
+.review-panel button.review-edit {
+  right: 24px;
+}
+
+.review-edit svg {
+  width: 11px;
+  height: 11px;
+}
+
+.review-card-edit {
+  border-color: var(--accent);
+}
+
+.review-orphan {
+  margin-right: 6px;
+  padding: 0 4px;
+  font-size: 10px;
+  color: var(--warning);
+  border: 1px solid var(--warning-dim);
+  border-radius: 3px;
+}
 /* #endregion */
 
 /* #region SESSION_PICKER */
@@ -8857,6 +8933,57 @@ select.form-input option:checked {
   min-width: 0;
 }
 
+.ns-body select.form-input {
+  appearance: none;
+  padding-right: 30px;
+  cursor: pointer;
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238b8d95' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  background-position: right 10px center;
+}
+
+.ns-notched {
+  flex: 1;
+  min-width: 0;
+  margin: 0;
+  padding: 0;
+  border: 1px solid var(--border);
+  border-radius: 6px;
+  background: var(--bg-elevated);
+  transition:
+    border-color 0.15s ease,
+    box-shadow 0.15s ease;
+}
+
+.ns-notched:focus-within {
+  border-color: var(--accent);
+  box-shadow: 0 0 0 3px var(--accent-dim);
+}
+
+.ns-notched legend {
+  margin: 0 8px 0 auto;
+  padding: 0 4px;
+  font-size: 11px;
+  font-weight: 500;
+  line-height: 13px;
+  color: var(--text-secondary);
+}
+
+.ns-notched:focus-within legend {
+  color: var(--accent-text);
+}
+
+/* The legend's lower half sits inside the box, so less top padding keeps the box as tall as a plain input. */
+.ns-body .ns-notched select.form-input,
+.ns-body .ns-notched select.form-input:focus {
+  padding-top: 2px;
+  font-size: 12px;
+  background-position: right 10px top calc(50% - 3px);
+  border: none;
+  background-color: transparent;
+  box-shadow: none;
+}
+
 .ns-body .btn.ns-browse {
   flex: none;
   padding: 8px 12px;
@@ -9551,6 +9678,15 @@ select.form-input option:checked {
   padding-top: 0;
 }
 
+.storage-group-header.storage-group-row {
+  padding: 6px 0;
+}
+
+.storage-group-row .storage-item-actions {
+  align-items: center;
+  gap: 8px;
+}
+
 .storage-empty {
   text-align: center;
   padding: 32px 0;
@@ -9692,19 +9828,16 @@ pre.mermaid[data-mermaid-error]::before {
 /* #endregion */
 
 /* #region ANIMATIONS */
+/* No `to` and fill backwards: the card ends on its own opacity (.completed, .dim), not on 1. */
 @keyframes fadeSlideIn {
   from {
     opacity: 0;
     transform: translateY(8px);
   }
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
 }
 
 .column-tasks .task-card {
-  animation: fadeSlideIn 150ms ease-out both;
+  animation: fadeSlideIn 150ms ease-out backwards;
 }
 
 .column-tasks .task-card:nth-child(1) {
@@ -10076,6 +10209,10 @@ pre.mermaid[data-mermaid-error]::before {
   outline-offset: -1px;
 }
 
+.session-group-header.sg-zen {
+  color: var(--accent);
+}
+
 .sg-sub-label {
   padding: 8px 10px 2px 8px;
   font-size: 10px;

package/public/sw.js

@@ -1,5 +1,5 @@
 const CACHE_NAME = 'cc-kanban-v2';
-const PRECACHE_URLS = ['/', '/style.css', '/project-match.js', '/link-url.js', '/app.js'];
+const PRECACHE_URLS = ['/', '/style.css', '/project-match.js', '/link-url.js', '/group-tree.js', '/app.js'];
 
 let cachePromise = null;
 function getCache() {

package/public/vendor/claude-hub-sdk.js

@@ -1,4 +1,4 @@
-// claude-hub-sdk 1.4.0 (sha256 7d559a8888ce). Copied by npm run sdk:sync in claude-code-hub. Do not edit.
+// claude-hub-sdk 1.5.0 (sha256 1505d3d5f8ba). Copied by npm run sdk:sync in claude-code-hub. Do not edit.
 // Claude Code Hub SDK: the one rule that names a key press, shared by the hub page, client.js and
 // stub.js. The hub serves it to its page as /sdk/keys.js; mount() and sdk:sync put it in front of
 // client.js and stub.js, so an app still loads one file.

package/server.js

@@ -50,9 +50,8 @@ const { readTerminalConfig } = require('./lib/terminal');
 const { createTerminalClient } = require('./lib/terminal-client');
 const { kanbotOn, kanbotModel, createKanbot } = require('./lib/kanbot');
 const { createShowStore, mountShowRoutes, showBodyParser, SHOW_PATH } = require('./lib/show');
-const { readLiveSessions, isPidAlive, isSessionLive } = require('./lib/live-sessions');
+const { readLiveSessions, isPidAlive, noteReplacedSessions } = require('./lib/live-sessions');
 const { createProcStats } = require('./lib/proc-stats');
-const { createGroupStore, isGroupName, suggestGroupName } = require('./lib/dispatch-groups');
 const { createUserGroupStore } = require('./lib/user-groups');
 const { createSessionPinStore } = require('./lib/session-pins');
 const { stampedJsonFile } = require('./lib/stamped-json-file');
@@ -115,7 +114,6 @@ const CCK_DIR = path.join(CLAUDE_DIR, '.cck');
 const AGENT_ACTIVITY_DIR = path.join(CCK_DIR, 'agent-activity');
 const CONTEXT_STATUS_DIR = path.join(CCK_DIR, 'context-status');
 const PINS_FILE = path.join(CCK_DIR, 'pins.json');
-const DISPATCH_GROUPS_FILE = path.join(CCK_DIR, 'dispatch-groups.json');
 const USER_GROUPS_FILE = path.join(CCK_DIR, 'groups.json');
 const DISPATCHED_FILE = path.join(CCK_DIR, 'dispatched.json');
 const WORKTREES_FILE = path.join(CCK_DIR, 'worktrees.json');
@@ -548,12 +546,15 @@ const SELF_TEAM_BOOT_WINDOW_MS = 60 * 1000;
 let liveSessionsCache = null;
 let lastLiveSessionsScan = 0;
 const LIVE_SESSIONS_TTL = 5000;
+const replacedSessions = new Map();
 
 function loadLiveSessions() {
   const now = Date.now();
   if (liveSessionsCache && now - lastLiveSessionsScan < LIVE_SESSIONS_TTL) return liveSessionsCache;
+  const prev = liveSessionsCache;
   liveSessionsCache = readLiveSessions(SESSIONS_DIR);
   lastLiveSessionsScan = now;
+  noteReplacedSessions(prev, liveSessionsCache, replacedSessions, now, SESSION_STALE_MS);
   return liveSessionsCache;
 }
 
@@ -574,13 +575,14 @@ function getPeerName(sessionId) {
 }
 
 function hasRecentLogActivity(sessionId, logAge) {
-  return logAge <= SESSION_STALE_MS && !isRegistryIdle(sessionId);
+  return logAge <= SESSION_STALE_MS && !isRegistryIdle(sessionId) && !replacedSessions.has(sessionId);
 }
 
 // Visibility-only recency: hasRecentLogActivity widened by the post-turn grace
 // window (ungated by registry-idle). Drives whether a session appears in the
 // active list — never the "active" status badges, which stay on hasRecentLog.
 function hasVisibleLogActivity(sessionId, logAge) {
+  if (replacedSessions.has(sessionId)) return false;
   return logAge <= SESSION_GRACE_MS || hasRecentLogActivity(sessionId, logAge);
 }
 
@@ -1659,7 +1661,7 @@ app.get('/api/sessions', async (req, res) => {
       s.autoCompact = autoCompactByProject.get(s.project);
     }
 
-    res.json(withDispatchPlacement(sessions));
+    res.json(withDispatchMarker(sessions));
     startPrewarm();
   } catch (error) {
     console.error('Error listing sessions:', error);
@@ -3346,10 +3348,13 @@ const terminal = createTerminalClient({
   // project dir it started in, and cwd drifts into subdirectories.
   resolveCwd: resolveSessionFolder,
   isAllowedFolder,
-  onChange: () => broadcast({ type: 'terminals-update', ids: terminal.ids() }),
+  onChange: () => broadcast({ type: 'terminals-update', ids: terminal.ids(), awaitingTrust: terminal.awaitingTrust() }),
   onExit: (id) => {
     if (dispatched.get(id)) broadcast({ type: 'dispatch-update' });
   },
+  onRekey: (from, to) => {
+    if (dispatched.move(from, to)) broadcast({ type: 'dispatch-update' });
+  },
 });
 
 // A call to the terminal host fails with 503 while the host restarts.
@@ -3379,8 +3384,8 @@ app.post('/api/terminal/pick-folder', async (req, res) => {
 // The New session dialog's "Stay here": the PTY starts headless and the board keeps its view.
 app.post('/api/terminal/start', terminalRoute(async (req, res) => {
   if (!terminal.authorized(req.get('x-terminal-token'))) return res.status(401).json({ error: 'invalid terminal token' });
-  const { id, cwd, name, model, worktree, prompt } = req.body || {};
-  const started = await terminal.startNew({ id, cwd, name, model, worktree, prompt });
+  const { id, cwd, name, model, effort, worktree, prompt } = req.body || {};
+  const started = await terminal.startNew({ id, cwd, name, model, effort, worktree, prompt });
   if (started.error) return res.status(started.status).json({ error: started.error });
   res.status(201).json({ session: started.id, cwd: started.cwd });
 }));
@@ -3456,26 +3461,12 @@ app.get('/vendor/xterm/:file', (req, res) => {
 // #region DISPATCH
 const dispatched = createDispatchedStore(jsonFile(DISPATCHED_FILE));
 
-const dispatchGroups = createGroupStore({
-  ...jsonFile(DISPATCH_GROUPS_FILE),
-  isAlive: (id) => terminal.isRunning(id) || isSessionLive(loadLiveSessions(), id),
-  pinnedIds: () => new Set(Object.keys(sessionPins.state().pins)),
-});
-
 const linkedDocs = createLinkedDocStore(jsonFile(LINKED_DOCS_FILE));
 
-// The board places a session from these alone, so it never has to move it later.
-function withDispatchPlacement(sessions) {
-  const groups = dispatchGroups.snapshot();
+function withDispatchMarker(sessions) {
   return sessions.map((s) => {
-    const dispatchGroup = groups.get(s.id);
     const marker = dispatched.get(s.id);
-    if (!dispatchGroup && !marker) return s;
-    return {
-      ...s,
-      dispatchGroup,
-      dispatched: marker ? { parent: marker.parent } : undefined,
-    };
+    return marker ? { ...s, dispatched: { parent: marker.parent } } : s;
   });
 }
 
@@ -3486,16 +3477,31 @@ app.post('/api/dispatch', terminalRoute(async (req, res) => {
   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'}` });
-  }
+  if (group != null && !(typeof group === 'string' && group.trim())) return res.status(400).json({ error: 'group must be a group name, path or id' });
   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 });
   dispatched.record(started.id, { parent, cwd: started.cwd, name, group, worktree });
-  // The starter stays where it is: moving it would jump it under the user.
-  if (group) dispatchGroups.join(group, [started.id]);
+  // Joined before dispatch-update, so the board places the session from its first frame. The
+  // starter stays where it is: moving it would jump it under the user.
+  let joined = null;
+  let groupError;
+  if (group) {
+    try {
+      userGroups.reload();
+      joined = userGroups.joinDispatch(group, started.id);
+      broadcast({ type: 'group:changed', rev: joined.rev });
+    } catch (e) {
+      groupError = e.message;
+    }
+  }
   broadcast({ type: 'dispatch-update' });
-  res.status(201).json({ session: started.id, cwd: started.cwd, group: group || null });
+  res.status(201).json({
+    session: started.id,
+    cwd: started.cwd,
+    group: joined?.path ?? null,
+    ...(joined ? { groupId: joined.group, transient: joined.transient } : {}),
+    ...(groupError ? { groupError } : {}),
+  });
 }));
 
 app.get('/api/dispatch', (req, res) => {
@@ -3627,7 +3633,6 @@ app.post('/api/tasks/:sessionId', async (req, res) => {
       id,
       subject,
       description: (req.body.description || '').trim(),
-      activeForm: subject,
       status: 'pending',
       blocks: [],
       blockedBy: [],
@@ -3959,6 +3964,9 @@ app.get('/api/session/resolve', (req, res) => {
       const m = metadata[idArg];
       return res.json({ id: idArg, customTitle: m?.customTitle || null });
     }
+    // A session cck just dispatched has no transcript yet, and its starter groups it at once.
+    const started = dispatched.get(idArg);
+    if (started) return res.json({ id: idArg, customTitle: started.name || null });
     const matches = ids.filter(id => id.startsWith(idArg));
     if (matches.length === 0) return res.status(404).json({ matches: [] });
     if (matches.length > 1) {
@@ -4050,30 +4058,58 @@ function groupRoute(fn) {
   };
 }
 
-app.get('/api/groups', (req, res) => {
+app.get('/api/groups', (_req, res) => {
   res.setHeader('Cache-Control', 'no-store');
   userGroups.reload();
-  const state = userGroups.state();
-  res.json(req.query.dispatch === '1' ? { ...state, dispatch: Object.fromEntries(dispatchGroups.snapshot()) } : state);
+  res.json(userGroups.state());
 });
 app.post('/api/groups', groupRoute((b) => userGroups.create(b)));
 app.put('/api/groups', groupRoute((b) => userGroups.replace(b)));
 app.post('/api/groups/import', groupRoute((b) => userGroups.importLocal(b)));
 app.post('/api/groups/ungroup', groupRoute((b) => userGroups.ungroup(b)));
-app.post('/api/groups/release', groupRoute((b) => userGroups.release(b.ids)));
 app.patch('/api/groups/:id', groupRoute((b, p) => userGroups.update(p.id, b)));
 app.delete('/api/groups/:id', groupRoute((_b, p) => userGroups.remove(p.id)));
 app.put('/api/groups/:id/members', groupRoute((b, p) => userGroups.place(p.id, b)));
-app.post('/api/groups/path', groupRoute((b) => userGroups.createPath(b.path)));
+app.post('/api/groups/path', groupRoute((b) => userGroups.createPath(b.path, b.transient === true)));
 app.post('/api/groups/rename', groupRoute((b) => userGroups.rename(b.group, b.name)));
 app.post('/api/groups/remove', groupRoute((b) => userGroups.removeByKey(b.group)));
-app.post('/api/groups/prune', groupRoute((b) => userGroups.prune({ dryRun: b.dryRun === true, isLive: liveGroupMember() })));
+app.post('/api/groups/prune', groupRoute((b) => {
+  const known = loadSessionMetadata();
+  return userGroups.prune({ dryRun: b.dryRun === true, isLive: liveGroupMember((id) => !!known[id]) });
+}));
+// `keep` is the ids of `/api/sessions?filter=active&limit=all`: the Active rule lives in that route.
+// `hide` is the ids dismissed on the board: hidden there even while their terminal runs, unless pinned.
+app.post('/api/groups/clean', groupRoute((b) => {
+  if (!Array.isArray(b.keep)) throw previewError(400, 'keep must be an array of session ids');
+  const keep = new Set(b.keep);
+  const hide = new Set(Array.isArray(b.hide) ? b.hide : []);
+  const pins = sessionPins.state().pins;
+  const live = liveGroupMember((id) => keep.has(id));
+  const isVisible = (m) => (Object.hasOwn(pins, m.ref) || !hide.has(m.ref)) && live(m);
+  return userGroups.clean({ group: b.group ?? null, dryRun: b.dryRun === true, isVisible });
+}));
 
 // A session that runs in the terminal or is still starting has no transcript yet.
-function liveGroupMember() {
-  const known = loadSessionMetadata();
-  const running = new Set([...terminal.ids(), ...dispatchGroups.snapshot().keys()]);
-  return (m) => m.type !== 'session' || !!known[m.ref] || running.has(m.ref);
+function liveGroupMember(isKnown) {
+  const live = new Set([...terminal.ids(), ...Object.keys(sessionPins.state().pins)]);
+  return (m) => m.type !== 'session' || isKnown(m.ref) || live.has(m.ref);
+}
+
+// Members dead in the previous sweep too, which is the grace period: a member has no timestamp.
+let groupMembersDead = new Set();
+function expireGroupMembers(known) {
+  if (!known) return { members: 0, groups: 0 };
+  const isLive = liveGroupMember((id) => known.has(id));
+  const dead = new Set();
+  userGroups.reload();
+  const out = userGroups.expire((m) => {
+    if (isLive(m)) return false;
+    dead.add(m.ref);
+    return groupMembersDead.has(m.ref);
+  });
+  groupMembersDead = dead;
+  if (out.members) broadcast({ type: 'group:changed', rev: out.rev });
+  return out;
 }
 // `with` names another session; its project is keyed as the board keys it, by the worktree's repo.
 function groupPeer(id) {
@@ -4082,7 +4118,6 @@ function groupPeer(id) {
   return {
     ref: id,
     project: sessionProjectKey({ project: meta.project, worktree: worktrees.resolve(meta.project) }),
-    dispatchGroup: dispatchGroups.snapshot().get(id) || null,
     name: getSessionDisplayName(id, meta) || `Session ${id.slice(0, 8)}`,
   };
 }
@@ -4750,8 +4785,9 @@ async function runRetention() {
     const contexts = await pruneContextStatus(CONTEXT_STATUS_DIR, opts);
     const wts = worktrees.prune(scan?.dirs);
     const taskMaps = await pruneTaskMaps(TASK_MAPS_DIR, opts);
-    if (markers || layouts || reviews || contexts || wts || taskMaps) {
-      console.log(`[retention] removed ${markers} dispatch markers, ${layouts} pane layouts, ${reviews} reviews, ${contexts} context status files, ${wts} worktrees, ${taskMaps} task-list mappings`);
+    const grouped = expireGroupMembers(scan?.ids);
+    if (markers || layouts || reviews || contexts || wts || taskMaps || grouped.members) {
+      console.log(`[retention] removed ${markers} dispatch markers, ${layouts} pane layouts, ${reviews} reviews, ${contexts} context status files, ${wts} worktrees, ${taskMaps} task-list mappings, ${grouped.members} group members, ${grouped.groups} groups`);
     }
   } catch (e) {
     console.warn('[retention] failed:', e.message);

package/skill-guides/dispatch.md

@@ -15,7 +15,7 @@ claude-code-kanban dispatch start --cwd <dir> --spec-file <spec.md> --name <name
 ```
 
 - `--name` is the sidebar name and the session's peer name. Kebab-case and unique: `fix-login-redirect`.
-- `--group` names the effort in kebab-case (`auth-refactor`) and shows the session under that sidebar group. Pass it on every dispatch that belongs to the effort; a dispatch without it goes to its project.
+- `--group` names the effort (`auth-refactor`, or a path like `auth-refactor/api`) and shows the session under that sidebar group. Pass it on every dispatch that belongs to the effort; a dispatch without it goes to its project. A group it makes goes when none of its sessions shows as active; an existing group stays.
 - `--spec-file` keeps a long spec out of shell quoting.
 - Everything after `--` goes to `claude` as it is: any flag in `claude --help`, e.g. `-- --permission-mode auto --add-dir ../shared`. Keep each value one shell word of plain characters (no quotes, `%` or control characters); long text belongs in the spec. cck owns the session id, name, model and worktree, so pass those with its own flags.
 - After a cck restart the terminal comes back with `claude --resume <id>` alone, so the args after `--` apply to the first run only.