claude-mission-control 1.8.0 → 1.9.0

package/README.md

@@ -132,6 +132,8 @@ Edit `names.json` to control how projects are titled:
 
 Unlisted projects fall back to a cleaned-up folder name. Changes are picked up automatically — no restart needed.
 
+Sessions can be renamed too: click the ✎ next to any session title (live board, project cards, pinned strip, or a project's slide-over), type a name, and press Enter. Escape cancels; an empty name goes back to the automatic title. Custom names live in `config.json` under `sessionNames`, keyed by session id, and win over the AI-generated or first-prompt title everywhere.
+
 ## Hiding projects
 
 Edit `ignore.json` — an array of absolute path prefixes. A project is hidden if its path is, or sits under, any listed prefix, so one line hides a whole tree (e.g. all the plugins/themes inside one site). This only hides them from the dashboard, strip, and menu bar; nothing on disk or in `~/.claude` is touched. Picked up automatically.

package/lib/collector.js

@@ -165,8 +165,14 @@ class Collector {
     return [...set.values()].filter((p) => !isIgnored(p));
   }
 
+  // sessionTitle with the user's custom names from config.json applied.
+  titleOf(m) {
+    return sessionTitle(m, readConfig().sessionNames);
+  }
+
   assemble() {
     const registry = readRegistry();
+    const sessionNames = readConfig().sessionNames || {}; // read once, not per session
     const liveByProject = new Set(
       this.raw.live.map((s) => worktreeRoot(s.cwd).root.toLowerCase())
     );
@@ -203,7 +209,7 @@ class Collector {
           0
         ),
         sessions: sessionMetas.slice(0, SESSIONS_PER_PROJECT).map((m) => {
-          const { title, source } = sessionTitle(m);
+          const { title, source } = sessionTitle(m, sessionNames);
           return {
             sessionId: m.sessionId,
             estCost: estimateCost(combinedUsage(m)),
@@ -235,7 +241,7 @@ class Collector {
     const subsBySession = new Map();
     for (const g of this.raw.transcriptGroups.values()) {
       for (const m of g.sessions) {
-        titleBySession.set(m.sessionId, sessionTitle(m).title);
+        titleBySession.set(m.sessionId, sessionTitle(m, sessionNames).title);
         if (m.model) modelBySession.set(m.sessionId, m.model);
         const subs = subagentSummary(m);
         if (subs) subsBySession.set(m.sessionId, subs);
@@ -306,7 +312,7 @@ class Collector {
           if (pinnedIds.has(m.sessionId)) {
             pinned.push({
               sessionId: m.sessionId,
-              title: sessionTitle(m).title,
+              title: sessionTitle(m, sessionNames).title,
               projectName: friendlyName(g.path),
               model: m.model || null,
               lastActivityAt: m.lastActivityAt,
@@ -365,7 +371,7 @@ class Collector {
     const g = this.raw.transcriptGroups.get(projectPath.toLowerCase());
     if (!g) return [];
     return g.sessions.map((m) => {
-      const { title, source } = sessionTitle(m);
+      const { title, source } = this.titleOf(m);
       return {
         sessionId: m.sessionId,
         title,
@@ -441,7 +447,7 @@ class Collector {
           timeline.push({
             project: friendlyName(g.path),
             sessionId: m.sessionId,
-            title: sessionTitle(m).title,
+            title: this.titleOf(m).title,
             start: Math.max(m.startedAt || m.lastActivityAt, dayCut),
             end: m.lastActivityAt,
           });
@@ -507,7 +513,7 @@ class Collector {
     for (const g of this.raw.transcriptGroups.values()) {
       for (const m of g.sessions) {
         if (m.sessionId === sessionId) {
-          return { file: m.file, title: sessionTitle(m).title, projectName: friendlyName(g.path) };
+          return { file: m.file, title: this.titleOf(m).title, projectName: friendlyName(g.path) };
         }
       }
     }

package/lib/config.js

@@ -33,7 +33,7 @@ const CONFIG_FILE = path.join(CONFIG_DIR, 'config.json');
 const NAMES_FILE = path.join(CONFIG_DIR, 'names.json');
 const IGNORE_FILE = path.join(CONFIG_DIR, 'ignore.json');
 
-const DEFAULTS = { terminal: 'ghostty', notifications: true, usageApi: true, mutedProjects: [], weeklyBudget: 0, pinnedSessions: [], theme: 'board' };
+const DEFAULTS = { terminal: 'ghostty', notifications: true, usageApi: true, mutedProjects: [], weeklyBudget: 0, pinnedSessions: [], sessionNames: {}, theme: 'board' };
 
 // The one theme list: updateConfig validates against it and GET /api/config
 // serves it, so the settings dropdown can never offer a value the server
@@ -96,6 +96,23 @@ function togglePin(sessionId) {
   return !has;
 }
 
+// Pure: returns a new sessionNames map with `name` set for `sessionId`
+// (trimmed, capped at 80 chars); an empty name removes the entry.
+function applySessionName(sessionNames, sessionId, name) {
+  const next = { ...(sessionNames || {}) };
+  const clean = String(name || '').trim().slice(0, 80);
+  if (clean) next[sessionId] = clean;
+  else delete next[sessionId];
+  return next;
+}
+
+function setSessionName(sessionId, name) {
+  const next = { ...readConfig() };
+  next.sessionNames = applySessionName(next.sessionNames, sessionId, name);
+  writeJson(CONFIG_FILE, next);
+  return next.sessionNames[sessionId] || '';
+}
+
 function readNames() {
   return readJson(NAMES_FILE, {});
 }
@@ -208,6 +225,8 @@ module.exports = {
   updateConfig,
   setProjectMuted,
   togglePin,
+  applySessionName,
+  setSessionName,
   readNames,
   setName,
   readIgnores,

package/lib/transcripts.js

@@ -357,7 +357,11 @@ function dailyCostSeries(daysList, numDays, today = Date.now()) {
 }
 
 // Best display title for a session, with its provenance.
-function sessionTitle(meta) {
+// `custom` is a user-set name from config.json (sessionNames); it wins over
+// anything derived from the transcript.
+function sessionTitle(meta, customNames) {
+  const custom = customNames && customNames[meta.sessionId];
+  if (custom) return { title: custom, source: 'custom' };
   if (meta.aiTitle) return { title: meta.aiTitle, source: 'ai-title' };
   if (meta.firstUserPrompt) return { title: meta.firstUserPrompt, source: 'first-prompt' };
   if (meta.lastPrompt) return { title: meta.lastPrompt, source: 'last-prompt' };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "claude-mission-control",
-  "version": "1.8.0",
+  "version": "1.9.0",
   "description": "Local dashboard for Claude Code: live sessions, transcripts, costs, git status — all your projects in one place.",
   "main": "server.js",
   "bin": {

package/public/index.html

@@ -402,6 +402,15 @@
   .s-title[data-session], .di-title[data-session] { cursor: pointer; }
   .s-title[data-session]:hover, .di-title[data-session]:hover { color: var(--accent); }
 
+  /* inline session rename (pencil button swaps the title for this input) */
+  .rename-input {
+    font: inherit; font-size: 12.5px; color: var(--ink);
+    background: var(--surface2); border: 1px solid var(--accent);
+    border-radius: 2px; padding: 2px 6px; flex: 1; min-width: 0; width: 100%;
+    box-sizing: border-box;
+  }
+  .rename-input:focus { outline: none; }
+
   /* transcript rendering */
   .t-turn { margin: 10px 0; }
   .t-user {
@@ -934,6 +943,10 @@ function copyBtn(cmd) {
 
 // Live sessions are already open somewhere; only offer open on idle ones.
 let liveIds = new Set();
+function renameBtn(sessionId, title) {
+  return `<button class="copy rename-btn" data-rename-session="${esc(sessionId)}" data-title="${esc(title || '')}" title="Rename this session">✎</button>`;
+}
+
 function openBtn(sessionId) {
   if (liveIds.has(sessionId)) return '';
   return `<button class="copy open-btn" data-open="${esc(sessionId)}" title="Open this session">open ⬈</button>`;
@@ -972,6 +985,7 @@ function liveCard(s) {
       ${modelChip(s.model)}
       <span class="dep-elapsed">${elapsed(s.startedAt)}</span>
       ${statusFlap(s)}
+      ${renameBtn(s.sessionId, s.title)}
       ${copyBtn(s.resumeCommand)}
     </div>
   </div>`;
@@ -985,6 +999,7 @@ function projectCard(p) {
             sess.worktree ? `<span class="wt mono">⎇ ${esc(sess.worktree)}</span>` : ''}${esc(sess.title)}</span>
           ${modelChip(sess.model)}
           <span class="s-when">${relTime(sess.lastActivityAt)}</span>
+          ${renameBtn(sess.sessionId, sess.title)}
           ${openBtn(sess.sessionId)}
           ${copyBtn(sess.resumeCommand)}
         </li>`).join('')}</ul>`
@@ -1017,6 +1032,7 @@ function renderPinned(state) {
       ${modelChip(p.model)}
       <span class="s-when">${esc(p.projectName)}</span>
       <span class="s-when">${relTime(p.lastActivityAt)}</span>
+      ${renameBtn(p.sessionId, p.title)}
       <button class="copy" data-pin="${esc(p.sessionId)}" title="Unpin">unpin</button>
     </div>`).join(''));
 }
@@ -1117,7 +1133,11 @@ function renderDigest(state) {
   patch($('#digest-body'), html);
 }
 
+let renderDeferred = false; // an SSE tick arrived while a rename input was open
 function render(state) {
+  // Rebuilding the DOM mid-edit would wipe the rename input; catch up afterwards.
+  if (document.querySelector('.rename-input')) { renderDeferred = true; return; }
+  renderDeferred = false;
   if (state.theme && state.theme !== 'board') document.documentElement.dataset.theme = state.theme;
   else delete document.documentElement.dataset.theme;
   liveIds = new Set((state.liveSessions || []).map((s) => s.sessionId));
@@ -1356,6 +1376,7 @@ function renderDetail(d, name) {
             s.worktree ? `<span class="wt mono">⎇ ${esc(s.worktree)}</span> ` : ''}${esc(s.title)}</span>
           ${fmtCost(s.estCost) ? `<span class="s-when">≈${fmtCost(s.estCost)}</span>` : ''}
           <span class="s-when">${relTime(s.lastActivityAt)}</span>
+          ${renameBtn(s.sessionId, s.title)}
           ${openBtn(s.sessionId)}
           ${copyBtn(s.resumeCommand)}
         </li>`).join('')}</ul>`
@@ -1773,6 +1794,60 @@ async function applyUpdate(out, currentVersion) {
   })();
 }
 
+// Swap a session title for a text input. Enter/blur saves, Escape cancels,
+// an empty name goes back to the automatic title.
+function startRename(btn) {
+  const id = btn.dataset.renameSession;
+  const row = btn.closest('li, .pin-row, .dep-row');
+  const titleEl = row && row.querySelector(`[data-session="${CSS.escape(id)}"]`);
+  if (!titleEl || row.querySelector('.rename-input')) return;
+  const before = btn.dataset.title || '';
+  const input = document.createElement('input');
+  input.className = 'rename-input';
+  input.type = 'text';
+  input.maxLength = 80;
+  input.value = before;
+  input.placeholder = 'Session name — leave empty to reset';
+  titleEl.hidden = true;
+  titleEl.after(input);
+  input.focus();
+  input.select();
+  let done = false;
+  const finish = async (save) => {
+    if (done) return;
+    done = true;
+    const val = input.value.trim();
+    input.remove();
+    titleEl.hidden = false;
+    if (save && val !== before) {
+      try {
+        const r = await fetch('/api/config', {
+          method: 'POST',
+          headers: { 'Content-Type': 'application/json' },
+          body: JSON.stringify({ renameSession: id, name: val }),
+        });
+        const out = await r.json();
+        if (out.ok) {
+          // Drawers aren't re-rendered by SSE, so patch the title in place.
+          const text = [...titleEl.childNodes].find((n) => n.nodeType === 3);
+          if (text) text.textContent = out.title; else titleEl.append(out.title);
+          btn.dataset.title = out.title;
+          toast(val ? `Renamed to "${val}"` : 'Name reset to the automatic title');
+        } else toast(`Couldn't rename: ${out.error}`);
+      } catch {
+        toast("Couldn't reach the server");
+      }
+    }
+    if (renderDeferred && lastState) render(lastState);
+  };
+  input.addEventListener('keydown', (e) => {
+    e.stopPropagation(); // keep the page's shortcuts (Esc, /, etc.) out of the edit
+    if (e.key === 'Enter') finish(true);
+    else if (e.key === 'Escape') finish(false);
+  });
+  input.addEventListener('blur', () => finish(true));
+}
+
 async function saveSetting(endpoint, payload, note) {
   try {
     const r = await fetch(endpoint, {
@@ -1973,6 +2048,8 @@ document.addEventListener('click', async (e) => {
     }
     return;
   }
+  const rb = e.target.closest('[data-rename-session]');
+  if (rb) { startRename(rb); return; }
   const t = e.target.closest('[data-session]');
   if (t) { openTranscript(t.dataset.session, t.dataset.hl); return; }
   const nb = e.target.closest('[data-new]');

package/server.js

@@ -279,6 +279,13 @@ const server = http.createServer((req, res) => {
             collector.assemble();
             return json(res, 200, { ok: true, pinned });
           }
+          if (payload.renameSession !== undefined) {
+            const id = String(payload.renameSession || '');
+            if (!collector.findSessionFile(id)) return json(res, 404, { ok: false, error: 'unknown session' });
+            const name = cfg.setSessionName(id, String(payload.name || ''));
+            collector.assemble();
+            return json(res, 200, { ok: true, name, title: collector.findSessionFile(id).title });
+          }
           if (payload.mutePath !== undefined) {
             const known = collector
               .projectPaths()