ccakashic 0.2.7 → 0.3.0

package/dist/html-generator.js

@@ -1,14 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.renderMessage = renderMessage;
 exports.generate = generate;
 const template_assets_1 = require("./template-assets");
-function escapeHtml(str) {
-    return String(str)
-        .replace(/&/g, '&')
-        .replace(/</g, '&lt;')
-        .replace(/>/g, '&gt;')
-        .replace(/"/g, '&quot;');
-}
+const resume_ui_1 = require("./resume-ui");
+const util_1 = require("./util");
 function formatTime(ts) {
     if (!ts)
         return '';
@@ -32,21 +28,21 @@ function toolUseSummary(msg) {
     const input = msg.input || {};
     switch (name) {
         case 'Bash':
-            return `Bash: <code>${escapeHtml((input.command || '').slice(0, 120))}</code>`;
+            return `Bash: <code>${(0, util_1.escapeHtml)((input.command || '').slice(0, 120))}</code>`;
         case 'Read':
-            return `Read: <code>${escapeHtml(input.file_path || '')}</code>`;
+            return `Read: <code>${(0, util_1.escapeHtml)(input.file_path || '')}</code>`;
         case 'Write':
-            return `Write: <code>${escapeHtml(input.file_path || '')}</code>`;
+            return `Write: <code>${(0, util_1.escapeHtml)(input.file_path || '')}</code>`;
         case 'Edit':
-            return `Edit: <code>${escapeHtml(input.file_path || '')}</code>`;
+            return `Edit: <code>${(0, util_1.escapeHtml)(input.file_path || '')}</code>`;
         case 'Grep':
-            return `Grep: <code>${escapeHtml(input.pattern || '')}</code>`;
+            return `Grep: <code>${(0, util_1.escapeHtml)(input.pattern || '')}</code>`;
         case 'Glob':
-            return `Glob: <code>${escapeHtml(input.pattern || '')}</code>`;
+            return `Glob: <code>${(0, util_1.escapeHtml)(input.pattern || '')}</code>`;
         case 'Agent':
-            return `Agent: ${escapeHtml(input.description || input.subagent_type || '')}`;
+            return `Agent: ${(0, util_1.escapeHtml)(input.description || input.subagent_type || '')}`;
         default:
-            return escapeHtml(name);
+            return (0, util_1.escapeHtml)(name);
     }
 }
 function renderToolResult(msg) {
@@ -59,30 +55,30 @@ function renderToolResult(msg) {
         // Bash result
         if (rich.stdout !== undefined) {
             if (rich.stdout) {
-                parts.push(`<div class="tool-output"><pre><code>${escapeHtml(rich.stdout)}</code></pre></div>`);
+                parts.push(`<div class="tool-output"><pre><code>${(0, util_1.escapeHtml)(rich.stdout)}</code></pre></div>`);
             }
             if (rich.stderr) {
-                parts.push(`<div class="tool-output stderr"><pre><code>${escapeHtml(rich.stderr)}</code></pre></div>`);
+                parts.push(`<div class="tool-output stderr"><pre><code>${(0, util_1.escapeHtml)(rich.stderr)}</code></pre></div>`);
             }
             return parts.join('');
         }
         // File read result
         if (rich.type === 'text' && rich.file) {
             const f = rich.file;
-            parts.push(`<div class="tool-meta">${escapeHtml(f.filePath)} (lines ${f.startLine}-${f.startLine + f.numLines - 1} of ${f.totalLines})</div>`);
+            parts.push(`<div class="tool-meta">${(0, util_1.escapeHtml)(f.filePath)} (lines ${f.startLine}-${f.startLine + f.numLines - 1} of ${f.totalLines})</div>`);
             if (f.content) {
-                parts.push(`<div class="tool-output"><pre><code>${escapeHtml(f.content.slice(0, 3000))}</code></pre></div>`);
+                parts.push(`<div class="tool-output"><pre><code>${(0, util_1.escapeHtml)(f.content.slice(0, 3000))}</code></pre></div>`);
             }
             return parts.join('');
         }
         // File edit/create with structuredPatch
         if ((rich.type === 'update' || rich.type === 'create') && rich.filePath) {
-            parts.push(`<div class="tool-meta">${escapeHtml(rich.filePath)}</div>`);
+            parts.push(`<div class="tool-meta">${(0, util_1.escapeHtml)(rich.filePath)}</div>`);
             if (rich.structuredPatch && rich.structuredPatch.length > 0) {
                 parts.push(renderDiff(rich.structuredPatch));
             }
             else if (rich.content) {
-                parts.push(`<div class="tool-output"><pre><code>${escapeHtml(rich.content.slice(0, 3000))}</code></pre></div>`);
+                parts.push(`<div class="tool-output"><pre><code>${(0, util_1.escapeHtml)(rich.content.slice(0, 3000))}</code></pre></div>`);
             }
             return parts.join('');
         }
@@ -90,7 +86,7 @@ function renderToolResult(msg) {
     // Fallback: raw content
     const content = result.fullContent || result.content;
     if (content) {
-        parts.push(`<div class="tool-output"><pre><code>${escapeHtml(content.slice(0, 5000))}</code></pre></div>`);
+        parts.push(`<div class="tool-output"><pre><code>${(0, util_1.escapeHtml)(content.slice(0, 5000))}</code></pre></div>`);
     }
     return parts.join('');
 }
@@ -103,13 +99,13 @@ function renderDiff(patches) {
             const ch = line[0];
             const text = line.slice(1);
             if (ch === '+') {
-                lines.push(`<div class="diff-add">+${escapeHtml(text)}</div>`);
+                lines.push(`<div class="diff-add">+${(0, util_1.escapeHtml)(text)}</div>`);
             }
             else if (ch === '-') {
-                lines.push(`<div class="diff-del">-${escapeHtml(text)}</div>`);
+                lines.push(`<div class="diff-del">-${(0, util_1.escapeHtml)(text)}</div>`);
             }
             else {
-                lines.push(`<div class="diff-ctx"> ${escapeHtml(text)}</div>`);
+                lines.push(`<div class="diff-ctx"> ${(0, util_1.escapeHtml)(text)}</div>`);
             }
         }
     }
@@ -155,9 +151,9 @@ function renderMessage(msg) {
     const itemBadge = makeItemBadge(msg);
     switch (msg.type) {
         case 'user':
-            return `<div class="msg msg-user" id="${id}">${time}<div class="msg-content" data-markdown>${escapeHtml(msg.text)}</div>${turnBadge}</div>`;
+            return `<div class="msg msg-user" id="${id}">${time}<div class="msg-content" data-markdown>${(0, util_1.escapeHtml)(msg.text)}</div>${turnBadge}</div>`;
         case 'assistant':
-            return `<div class="msg msg-assistant" id="${id}">${time}<div class="msg-content" data-markdown>${escapeHtml(msg.text)}</div>${itemBadge ? `<div>${itemBadge}</div>` : ''}</div>`;
+            return `<div class="msg msg-assistant" id="${id}">${time}<div class="msg-content" data-markdown>${(0, util_1.escapeHtml)(msg.text)}</div>${itemBadge ? `<div>${itemBadge}</div>` : ''}</div>`;
         case 'thinking':
             return `<div class="msg msg-thinking" id="${id}">${time}<span class="thinking-indicator">Thinking...</span></div>`;
         case 'tool_use': {
@@ -170,18 +166,18 @@ function renderMessage(msg) {
         }
         case 'tool_result':
             // Unpaired tool result (shouldn't happen often)
-            return `<div class="msg msg-tool" id="${id}"><div class="tool-output"><pre><code>${escapeHtml((msg.content || '').slice(0, 2000))}</code></pre></div></div>`;
+            return `<div class="msg msg-tool" id="${id}"><div class="tool-output"><pre><code>${(0, util_1.escapeHtml)((msg.content || '').slice(0, 2000))}</code></pre></div></div>`;
         case 'local_command': {
-            const cmd = msg.command ? `<div class="local-cmd-input"><span class="local-cmd-prompt">$</span> ${escapeHtml(msg.command)}</div>` : '';
-            const stdout = msg.stdout && msg.stdout.trim() ? `<pre class="local-cmd-output"><code>${escapeHtml(msg.stdout)}</code></pre>` : '';
-            const stderr = msg.stderr && msg.stderr.trim() ? `<pre class="local-cmd-output local-cmd-stderr"><code>${escapeHtml(msg.stderr)}</code></pre>` : '';
+            const cmd = msg.command ? `<div class="local-cmd-input"><span class="local-cmd-prompt">$</span> ${(0, util_1.escapeHtml)(msg.command)}</div>` : '';
+            const stdout = msg.stdout && msg.stdout.trim() ? `<pre class="local-cmd-output"><code>${(0, util_1.escapeHtml)(msg.stdout)}</code></pre>` : '';
+            const stderr = msg.stderr && msg.stderr.trim() ? `<pre class="local-cmd-output local-cmd-stderr"><code>${(0, util_1.escapeHtml)(msg.stderr)}</code></pre>` : '';
             return `<div class="msg msg-local-cmd" id="${id}">${time}${cmd}${stdout}${stderr}${turnBadge}</div>`;
         }
         case 'system':
             if (msg.subtype === 'turn_duration') {
                 return ''; // Now shown in turn usage badge
             }
-            return `<div class="msg msg-system" id="${id}">${escapeHtml(msg.content || '')}</div>`;
+            return `<div class="msg msg-system" id="${id}">${(0, util_1.escapeHtml)(msg.content || '')}</div>`;
         default:
             return '';
     }
@@ -191,21 +187,21 @@ function renderToolInput(msg) {
     const name = msg.toolName;
     // Show command for Bash
     if (name === 'Bash' && input.command) {
-        return `<div class="tool-input"><div class="tool-input-label">Command:</div><pre><code>${escapeHtml(input.command)}</code></pre></div>`;
+        return `<div class="tool-input"><div class="tool-input-label">Command:</div><pre><code>${(0, util_1.escapeHtml)(input.command)}</code></pre></div>`;
     }
     // Show old_string/new_string for Edit
     if (name === 'Edit' && input.old_string) {
-        return `<div class="tool-input"><div class="tool-input-label">Edit:</div><div class="diff"><div class="diff-del">${escapeHtml(input.old_string)}</div><div class="diff-add">${escapeHtml(input.new_string || '')}</div></div></div>`;
+        return `<div class="tool-input"><div class="tool-input-label">Edit:</div><div class="diff"><div class="diff-del">${(0, util_1.escapeHtml)(input.old_string)}</div><div class="diff-add">${(0, util_1.escapeHtml)(input.new_string || '')}</div></div></div>`;
     }
     // For other tools, show input as JSON if small enough
     const json = JSON.stringify(input, null, 2);
     if (json.length > 500)
         return '';
-    return `<div class="tool-input"><pre><code>${escapeHtml(json)}</code></pre></div>`;
+    return `<div class="tool-input"><pre><code>${(0, util_1.escapeHtml)(json)}</code></pre></div>`;
 }
 function renderSubagent(agentId, messages) {
     const agentHtml = messages.map(renderMessage).join('\n');
-    return `<div class="msg msg-subagent"><details><summary><span class="tool-summary">Subagent: ${escapeHtml(agentId)}</span></summary><div class="subagent-content">${agentHtml}</div></details></div>`;
+    return `<div class="msg msg-subagent"><details><summary><span class="tool-summary">Subagent: ${(0, util_1.escapeHtml)(agentId)}</span></summary><div class="subagent-content">${agentHtml}</div></details></div>`;
 }
 function formatDateOnly(ts) {
     if (!ts)
@@ -299,8 +295,11 @@ function renderStats(stats) {
     return `<div class="stats-bar">${items.join('')}</div>`;
 }
 function generate(parsed, options = {}) {
-    const { projectName, session, backUrl } = options;
-    const title = session?.slug || session?.id || 'Session';
+    const { projectName, projectRawName, session, backUrl, resume } = options;
+    const resumeButtons = session?.id && projectRawName
+        ? (0, resume_ui_1.resumeButtonsHtml)(projectRawName, { id: session.id, cwd: session.cwd ?? null, lastModified: session.lastModified ?? 0 }, resume)
+        : '';
+    const title = session?.customTitle || session?.aiTitle || session?.slug || session?.id || 'Session';
     const date = session?.timestamp
         ? new Date(session.timestamp).toLocaleDateString('en-CA')
         : '';
@@ -309,26 +308,27 @@ function generate(parsed, options = {}) {
     // Build grouped HTML with date anchors
     const groupsHtml = dateGroups.map(g => {
         const msgsHtml = g.messages.map(renderMessage).join('\n');
-        return `<div class="detail-date-group" id="date-${g.date}" data-date="${escapeHtml(g.date)}">
-  <div class="detail-date-heading">${escapeHtml(g.date)}</div>
+        return `<div class="detail-date-group" id="date-${g.date}" data-date="${(0, util_1.escapeHtml)(g.date)}">
+  <div class="detail-date-heading">${(0, util_1.escapeHtml)(g.date)}</div>
   ${msgsHtml}
 </div>`;
     }).join('\n');
     // Side nav for dates
     const sideNavItems = dateGroups
         .filter(g => g.date !== 'unknown')
-        .map(g => `<a class="detail-sidenav-item" href="#date-${g.date}" data-date="${escapeHtml(g.date)}">${escapeHtml(g.date)}</a>`).join('\n');
+        .map(g => `<a class="detail-sidenav-item" href="#date-${g.date}" data-date="${(0, util_1.escapeHtml)(g.date)}">${(0, util_1.escapeHtml)(g.date)}</a>`).join('\n');
     const backLink = backUrl
-        ? `<div style="font-size:0.8rem;margin-bottom:8px"><a href="${escapeHtml(backUrl)}" style="color:var(--link);text-decoration:none">&larr; Back to sessions</a> &nbsp;|&nbsp; <a href="/" style="color:var(--link);text-decoration:none">All projects</a></div>`
+        ? `<div style="font-size:0.8rem;margin-bottom:8px"><a href="${(0, util_1.escapeHtml)(backUrl)}" style="color:var(--link);text-decoration:none">&larr; Back to sessions</a> &nbsp;|&nbsp; <a href="/" style="color:var(--link);text-decoration:none">Dashboard</a> &nbsp;|&nbsp; <a href="/projects" style="color:var(--link);text-decoration:none">All projects</a></div>`
         : '';
     return `<!DOCTYPE html>
 <html lang="en">
 <head>
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
-<title>${escapeHtml(title)} — ${escapeHtml(date)}</title>
+<title>${(0, util_1.escapeHtml)(title)} — ${(0, util_1.escapeHtml)(date)}</title>
 <style>${(0, template_assets_1.getCSS)()}
 ${detailLayoutCSS()}
+${(0, resume_ui_1.resumeCSS)()}
 </style>
 </head>
 <body>
@@ -336,13 +336,14 @@ ${detailLayoutCSS()}
 <div class="detail-sticky-bar" id="detailStickyBar"></div>
 <header class="session-header">
   ${backLink}
-  <h1>${escapeHtml(title)}</h1>
+  <h1>${(0, util_1.escapeHtml)(title)}</h1>
   <div class="session-meta">
-    ${projectName ? `<span class="meta-item">Project: ${escapeHtml(projectName)}</span>` : ''}
-    ${date ? `<span class="meta-item">Date: ${escapeHtml(date)}</span>` : ''}
-    ${session?.gitBranch ? `<span class="meta-item">Branch: ${escapeHtml(session.gitBranch)}</span>` : ''}
-    ${session?.model ? `<span class="meta-item">Model: ${escapeHtml(session.model)}</span>` : ''}
+    ${projectName ? `<span class="meta-item">Project: ${(0, util_1.escapeHtml)(projectName)}</span>` : ''}
+    ${date ? `<span class="meta-item">Date: ${(0, util_1.escapeHtml)(date)}</span>` : ''}
+    ${session?.gitBranch ? `<span class="meta-item">Branch: ${(0, util_1.escapeHtml)(session.gitBranch)}</span>` : ''}
+    ${session?.model ? `<span class="meta-item">Model: ${(0, util_1.escapeHtml)(session.model)}</span>` : ''}
   </div>
+  ${resumeButtons}
   ${renderStats(parsed.stats)}
 </header>
 <div class="detail-layout">
@@ -364,6 +365,7 @@ ${detailLayoutCSS()}
 </div>
 <script>${(0, template_assets_1.getAppJS)()}
 ${detailNavJS()}
+${(0, resume_ui_1.resumeJS)(resume)}
 </script>
 </body>
 </html>`;

package/dist/pages.js

@@ -3,13 +3,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.generateIndex = generateIndex;
 exports.generateSessionList = generateSessionList;
 const template_assets_1 = require("./template-assets");
-function escapeHtml(str) {
-    return String(str)
-        .replace(/&/g, '&')
-        .replace(/</g, '&lt;')
-        .replace(/>/g, '&gt;')
-        .replace(/"/g, '&quot;');
-}
+const resume_ui_1 = require("./resume-ui");
+const util_1 = require("./util");
 function formatDate(ts) {
     if (!ts)
         return '';
@@ -33,9 +28,10 @@ function pageShell(title, bodyHtml) {
 <head>
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
-<title>${escapeHtml(title)}</title>
+<title>${(0, util_1.escapeHtml)(title)}</title>
 <style>${(0, template_assets_1.getCSS)()}
 ${indexCSS()}
+${(0, resume_ui_1.resumeCSS)()}
 </style>
 </head>
 <body>
@@ -79,6 +75,7 @@ function indexCSS() {
 }
 .list-item {
   display: block;
+  position: relative;
   padding: 14px 16px;
   border: 1px solid var(--border);
   border-radius: 8px;
@@ -88,6 +85,12 @@ function indexCSS() {
   transition: background 0.15s, border-color 0.15s;
   cursor: pointer;
 }
+/* Full-cover navigation link for div-based rows (keeps <button>s out of <a>). */
+.list-item-link {
+  position: absolute;
+  inset: 0;
+  z-index: 0;
+}
 .list-item:hover {
   background: var(--bg-secondary);
   border-color: var(--link);
@@ -97,6 +100,12 @@ function indexCSS() {
   font-size: 0.95rem;
   margin-bottom: 4px;
 }
+.list-item-name {
+  font-size: 1.02rem;
+}
+.list-item-name.is-named {
+  color: var(--link);
+}
 .list-item-meta {
   font-size: 0.8rem;
   color: var(--text-muted);
@@ -121,6 +130,16 @@ function indexCSS() {
   background: var(--tool-bg);
   border: 1px solid var(--border);
 }
+.badge-named {
+  background: var(--link);
+  border-color: var(--link);
+  color: #fff;
+}
+.badge-ai {
+  background: transparent;
+  border-color: var(--link);
+  color: var(--link);
+}
 .search-box {
   width: 100%;
   padding: 10px 14px;
@@ -240,7 +259,7 @@ function generateIndex(projects) {
     const items = projects.map((p) => {
         const href = `/project/${encodeURIComponent(p.rawName)}`;
         return `<a class="list-item" href="${href}">
-  <div class="list-item-title">${escapeHtml(p.name)}</div>
+  <div class="list-item-title">${(0, util_1.escapeHtml)(p.name)}</div>
   <div class="list-item-meta">
     <span>${p.sessionCount} sessions</span>
     <span>Last: ${formatDate(p.lastModified)}</span>
@@ -249,6 +268,7 @@ function generateIndex(projects) {
     }).join('\n');
     return pageShell('ccakashic', `
 <div class="page-header">
+  <div class="breadcrumb"><a href="/">&larr; dashboard</a></div>
   <h1>ccakashic</h1>
   <div class="subtitle">Claude Code Session Logs</div>
 </div>
@@ -277,7 +297,7 @@ function formatTimeOnly(ts) {
     const d = ts instanceof Date ? ts : new Date(ts);
     return d.toLocaleTimeString('en-GB', { hour: '2-digit', minute: '2-digit' });
 }
-function generateSessionList(project, sessions) {
+function generateSessionList(project, sessions, resume) {
     const dateGroups = [];
     let currentDate = null;
     for (const s of sessions) {
@@ -289,36 +309,54 @@ function generateSessionList(project, sessions) {
         dateGroups[dateGroups.length - 1].sessions.push(s);
     }
     // Build side nav
-    const sideNavItems = dateGroups.map(g => `<a class="sidenav-item" href="#date-${g.date}" data-date="${escapeHtml(g.date)}">${escapeHtml(g.date)} <span class="sidenav-count">(${g.sessions.length})</span></a>`).join('\n');
+    const sideNavItems = dateGroups.map(g => `<a class="sidenav-item" href="#date-${g.date}" data-date="${(0, util_1.escapeHtml)(g.date)}">${(0, util_1.escapeHtml)(g.date)} <span class="sidenav-count">(${g.sessions.length})</span></a>`).join('\n');
     // Build session items grouped by date
     const groupsHtml = dateGroups.map(g => {
         const items = g.sessions.map(s => {
             const href = `/project/${encodeURIComponent(project.rawName)}/session/${encodeURIComponent(s.id)}`;
             const lastModTime = formatTimeOnly(new Date(s.lastModified));
             const startedTime = formatDate(s.timestamp);
-            const slug = s.slug ? `<span class="badge">${escapeHtml(s.slug)}</span>` : '';
+            const slug = s.slug ? `<span class="badge">${(0, util_1.escapeHtml)(s.slug)}</span>` : '';
             const sub = s.hasSubagents ? '<span class="badge">subagents</span>' : '';
-            const model = s.model ? `<span>${escapeHtml(s.model)}</span>` : '';
-            const branch = s.gitBranch && s.gitBranch !== 'HEAD' ? `<span>branch: ${escapeHtml(s.gitBranch)}</span>` : '';
+            const model = s.model ? `<span>${(0, util_1.escapeHtml)(s.model)}</span>` : '';
+            const branch = s.gitBranch && s.gitBranch !== 'HEAD' ? `<span>branch: ${(0, util_1.escapeHtml)(s.gitBranch)}</span>` : '';
             const tokens = s.totalTokens ? `<span>${formatTokens(s.totalTokens)} tokens</span>` : '';
             const outTok = s.outputTokens ? `<span>out: ${formatTokens(s.outputTokens)}</span>` : '';
-            const preview = s.preview ? `<div class="list-item-preview">${escapeHtml(s.preview)}</div>` : '';
-            return `<a class="list-item" href="${href}">
-  <div class="list-item-title">${lastModTime} ${slug} ${sub}</div>
-  <div class="list-item-meta"><span>started: ${startedTime}</span>${model}${branch}${tokens}${outTok}</div>
+            const preview = s.preview ? `<div class="list-item-preview">${(0, util_1.escapeHtml)(s.preview)}</div>` : '';
+            // Prefer a human/AI-given name as the headline; renamed sessions get a
+            // distinct treatment so they're easy to spot in the list.
+            const displayName = s.customTitle || s.aiTitle;
+            const nameBadge = s.customTitle
+                ? '<span class="badge badge-named">named</span>'
+                : s.aiTitle
+                    ? '<span class="badge badge-ai">AI</span>'
+                    : '';
+            const titleRow = displayName
+                ? `<div class="list-item-title"><span class="list-item-name${s.customTitle ? ' is-named' : ''}">${(0, util_1.escapeHtml)(displayName)}</span> ${nameBadge} ${slug} ${sub}</div>
+  <div class="list-item-meta"><span>${lastModTime}</span><span>started: ${startedTime}</span>${model}${branch}${tokens}${outTok}</div>`
+                : `<div class="list-item-title">${lastModTime} ${slug} ${sub}</div>
+  <div class="list-item-meta"><span>started: ${startedTime}</span>${model}${branch}${tokens}${outTok}</div>`;
+            // Stretched-link pattern: the row is a <div> (not an <a>) so the resume
+            // <button>s aren't nested inside an anchor (invalid HTML). A full-cover
+            // link handles row navigation; the buttons sit above it via z-index.
+            const label = (0, util_1.escapeHtml)(displayName || s.id);
+            return `<div class="list-item">
+  <a class="list-item-link" href="${href}" aria-label="${label}"></a>
+  ${titleRow}
   ${preview}
-</a>`;
+  ${(0, resume_ui_1.resumeButtonsHtml)(project.rawName, s, resume)}
+</div>`;
         }).join('\n');
-        return `<div class="date-group" id="date-${g.date}" data-date="${escapeHtml(g.date)}">
-  <div class="date-heading">${escapeHtml(g.date)}</div>
+        return `<div class="date-group" id="date-${g.date}" data-date="${(0, util_1.escapeHtml)(g.date)}">
+  <div class="date-heading">${(0, util_1.escapeHtml)(g.date)}</div>
   ${items}
 </div>`;
     }).join('\n');
     return pageShell(`${project.name} — ccakashic`, `
 <div class="sticky-date-bar" id="stickyDateBar"></div>
 <div class="page-header">
-  <div class="breadcrumb"><a href="/">ccakashic</a> / ${escapeHtml(project.name)}</div>
-  <h1>${escapeHtml(project.name)}</h1>
+  <div class="breadcrumb"><a href="/">dashboard</a> / <a href="/projects">projects</a> / ${(0, util_1.escapeHtml)(project.name)}</div>
+  <h1>${(0, util_1.escapeHtml)(project.name)}</h1>
   <div class="subtitle">${sessions.length} sessions</div>
 </div>
 <div class="session-layout">
@@ -374,5 +412,6 @@ function generateSessionList(project, sessions) {
   window.addEventListener('scroll', updateCurrentDate, { passive: true });
   updateCurrentDate();
 })();
+${(0, resume_ui_1.resumeJS)(resume)}
 </script>`);
 }

package/dist/parser.js

@@ -33,10 +33,37 @@ var __importStar = (this && this.__importStar) || (function () {
     };
 })();
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.parseSessionCached = parseSessionCached;
 exports.parseSession = parseSession;
 const fs = __importStar(require("fs"));
 const path = __importStar(require("path"));
 const readline = __importStar(require("readline"));
+// Small LRU cache keyed on (path, mtime). The dashboard's server-side render
+// and the /api/pane poll can ask for the same (unchanged) session, and several
+// panes/clients may show the same session; this avoids re-reading and
+// re-parsing the whole file for an identical mtime. NOTE: an actively-changing
+// session gets a new mtime each poll (cache miss) and is still fully re-parsed;
+// a future optimization could read only the bytes appended past the last offset.
+const parseCache = new Map();
+const PARSE_CACHE_MAX = 32;
+async function parseSessionCached(sessionPath, mtimeMs) {
+    const key = sessionPath;
+    const hit = parseCache.get(key);
+    if (hit && hit.mtimeMs === mtimeMs) {
+        // Refresh LRU recency.
+        parseCache.delete(key);
+        parseCache.set(key, hit);
+        return hit.parsed;
+    }
+    const parsed = await parseSession(sessionPath);
+    parseCache.set(key, { mtimeMs, parsed });
+    if (parseCache.size > PARSE_CACHE_MAX) {
+        const oldest = parseCache.keys().next().value;
+        if (oldest !== undefined)
+            parseCache.delete(oldest);
+    }
+    return parsed;
+}
 async function parseSession(sessionPath) {
     const lines = await readJsonlLines(sessionPath);
     const messages = buildConversation(lines);

package/dist/resume-ui.js

@@ -0,0 +1,148 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.resumeButtonsHtml = resumeButtonsHtml;
+exports.resumeCSS = resumeCSS;
+exports.resumeJS = resumeJS;
+const cmux_1 = require("./cmux");
+const util_1 = require("./util");
+function resumeButtonsHtml(projectRawName, session, ctx) {
+    if (!ctx || !session.cwd)
+        return '';
+    const isOpen = ctx.openSessionIds.has(session.id);
+    const isActive = Date.now() - session.lastModified < util_1.ACTIVE_THRESHOLD_MS;
+    const resumeBtn = ctx.cmuxAvailable
+        ? `<button type="button" class="resume-btn${isOpen ? ' is-open' : ''}"
+        data-project="${(0, util_1.escapeHtml)(projectRawName)}"
+        data-session="${(0, util_1.escapeHtml)(session.id)}"
+        data-open="${isOpen ? '1' : '0'}"
+        data-active="${isActive ? '1' : '0'}"
+        title="${isOpen ? 'Jump to the open cmux workspace' : 'Resume in a new cmux workspace (Alt-click: open in background)'}">${isOpen ? '&#8618; Jump' : '&#9654; Resume'}</button>`
+        : '';
+    const copyBtn = `<button type="button" class="copy-cmd-btn"
+        data-cmd="${(0, util_1.escapeHtml)((0, cmux_1.buildResumeCommand)(session.cwd, session.id))}"
+        title="Copy the cd + claude --resume command">&#128203; Copy</button>`;
+    return `<div class="resume-actions">${resumeBtn}${copyBtn}</div>`;
+}
+function resumeCSS() {
+    return `
+.resume-actions {
+  display: inline-flex;
+  gap: 6px;
+  margin-top: 6px;
+  /* Sit above the stretched .list-item-link so the buttons stay clickable. */
+  position: relative;
+  z-index: 1;
+}
+.resume-btn, .copy-cmd-btn {
+  font-size: 0.72rem;
+  font-weight: 600;
+  padding: 3px 10px;
+  border-radius: 5px;
+  border: 1px solid var(--border);
+  background: var(--tool-bg);
+  color: var(--text);
+  cursor: pointer;
+  transition: background 0.15s, border-color 0.15s;
+}
+.resume-btn:hover, .copy-cmd-btn:hover {
+  border-color: var(--link);
+  background: var(--bg-secondary);
+}
+.resume-btn.is-open {
+  color: var(--link);
+  border-color: var(--link);
+}
+.resume-btn:disabled, .copy-cmd-btn:disabled { opacity: 0.5; cursor: wait; }
+.resume-toast {
+  position: fixed;
+  bottom: 24px;
+  left: 50%;
+  transform: translateX(-50%);
+  background: var(--text);
+  color: var(--bg);
+  padding: 8px 18px;
+  border-radius: 8px;
+  font-size: 0.85rem;
+  z-index: 1000;
+  opacity: 0;
+  transition: opacity 0.2s;
+  pointer-events: none;
+}
+.resume-toast.visible { opacity: 1; }
+`;
+}
+function resumeJS(ctx) {
+    if (!ctx)
+        return '';
+    return `
+(function() {
+  var TOKEN = ${JSON.stringify(ctx.token)};
+  var toastEl = null;
+  function toast(msg) {
+    if (!toastEl) {
+      toastEl = document.createElement('div');
+      toastEl.className = 'resume-toast';
+      document.body.appendChild(toastEl);
+    }
+    toastEl.textContent = msg;
+    toastEl.classList.add('visible');
+    clearTimeout(toastEl._t);
+    toastEl._t = setTimeout(function() { toastEl.classList.remove('visible'); }, 2500);
+  }
+  function copy(text) {
+    navigator.clipboard.writeText(text).then(
+      function() { toast('Command copied'); },
+      function() { toast('Copy failed'); }
+    );
+  }
+  document.addEventListener('click', function(e) {
+    var btn = e.target.closest ? e.target.closest('.resume-btn, .copy-cmd-btn') : null;
+    if (!btn) return;
+    e.preventDefault();
+    e.stopPropagation();
+
+    if (btn.classList.contains('copy-cmd-btn')) {
+      copy(btn.dataset.cmd);
+      return;
+    }
+
+    // Resuming a session that still looks active forks the conversation;
+    // require a second click to confirm.
+    if (btn.dataset.active === '1' && btn.dataset.open !== '1' && !btn.dataset.confirm) {
+      btn.dataset.confirm = '1';
+      var orig = btn.innerHTML;
+      btn.innerHTML = '&#9888; Fork? click again';
+      setTimeout(function() { delete btn.dataset.confirm; btn.innerHTML = orig; }, 3000);
+      return;
+    }
+    delete btn.dataset.confirm;
+
+    var mode = e.altKey ? 'background' : 'jump';
+    btn.disabled = true;
+    fetch('/api/resume', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json', 'X-Ccakashic-Token': TOKEN },
+      body: JSON.stringify({ project: btn.dataset.project, session: btn.dataset.session, mode: mode })
+    }).then(function(res) { return res.json(); }).then(function(data) {
+      btn.disabled = false;
+      if (data.action === 'jumped') {
+        toast('Jumped to the open cmux workspace');
+      } else if (data.action === 'resumed') {
+        toast(mode === 'background' ? 'Resumed in a background cmux workspace' : 'Resumed in a new cmux workspace');
+        btn.dataset.open = '1';
+        btn.dataset.active = '1';
+        btn.classList.add('is-open');
+        btn.innerHTML = '&#8618; Jump';
+      } else if (data.action === 'unavailable' && data.command) {
+        copy(data.command);
+      } else {
+        toast(data.message || 'Resume failed');
+      }
+    }).catch(function() {
+      btn.disabled = false;
+      toast('Resume failed: server unreachable');
+    });
+  }, true);
+})();
+`;
+}