@phren/cli 0.0.15 → 0.0.17

package/mcp/dist/memory-ui-graph.js

@@ -338,10 +338,10 @@ export function renderGraphScript() {
     /* sprite rendering */
     if (phrenImgReady) {
       ctx.save();
-      /* fixed 128px size in screen pixels, scale up to 148px on arrival flash */
-      var spriteScreenSize = 128;
+      /* fixed 48px size in screen pixels, scale up to 56px on arrival flash */
+      var spriteScreenSize = 48;
       if (phren.arriving && phren.arriveTimer < 0.4) {
-        spriteScreenSize = 128 + 20 * (1 - phren.arriveTimer / 0.4);
+        spriteScreenSize = 48 + 8 * (1 - phren.arriveTimer / 0.4);
       }
       var spriteSize = spriteScreenSize * s; /* convert to graph coords */
       /* bob up/down when walking — sine wave synced to walk progress */
@@ -1454,8 +1454,8 @@ export function renderGraphScript() {
       if (healthText) html += '<div style="margin-top:4px">' + healthText + '</div>';
       if (node.project) {
         html += '<div style="display:flex;gap:8px;margin-top:12px">';
-        html += '<button class="btn btn-sm" onclick="window.graphNodeEdit(' + JSON.stringify(node.project) + ',' + JSON.stringify(findingText) + ')" style="padding:5px 14px;font-size:12px">Edit</button>';
-        html += '<button class="btn btn-sm" onclick="window.graphNodeDelete(' + JSON.stringify(node.project) + ',' + JSON.stringify(findingText) + ')" style="padding:5px 14px;font-size:12px;color:#ef4444;border-color:#ef4444">Delete</button>';
+        html += '<button class="btn btn-sm" data-action="graphNodeEdit" data-project="' + esc(node.project) + '" data-finding="' + esc(findingText) + '" style="padding:5px 14px;font-size:12px">Edit</button>';
+        html += '<button class="btn btn-sm" data-action="graphNodeDelete" data-project="' + esc(node.project) + '" data-finding="' + esc(findingText) + '" style="padding:5px 14px;font-size:12px;color:#ef4444;border-color:#ef4444">Delete</button>';
         html += '</div>';
       }
 
@@ -1507,8 +1507,8 @@ export function renderGraphScript() {
           html += '<div style="margin-top:8px;padding:8px 10px;border-radius:6px;border:1px solid var(--border);background:var(--surface-alt,var(--surface))">';
           html += '<div style="font-size:12px;line-height:1.5;color:var(--ink)">' + esc(lfText) + '</div>';
           html += '<div style="display:flex;gap:6px;margin-top:6px">';
-          html += '<button class="btn btn-sm" onclick="window.graphNodeEdit(' + JSON.stringify(lf.project) + ',' + JSON.stringify(lfText) + ')" style="padding:3px 10px;font-size:11px">Edit</button>';
-          html += '<button class="btn btn-sm" onclick="window.graphNodeDelete(' + JSON.stringify(lf.project) + ',' + JSON.stringify(lfText) + ')" style="padding:3px 10px;font-size:11px;color:#ef4444;border-color:#ef4444">Delete</button>';
+          html += '<button class="btn btn-sm" data-action="graphNodeEdit" data-project="' + esc(lf.project) + '" data-finding="' + esc(lfText) + '" style="padding:3px 10px;font-size:11px">Edit</button>';
+          html += '<button class="btn btn-sm" data-action="graphNodeDelete" data-project="' + esc(lf.project) + '" data-finding="' + esc(lfText) + '" style="padding:3px 10px;font-size:11px;color:#ef4444;border-color:#ef4444">Delete</button>';
           html += '</div></div>';
         }
       }
@@ -2056,11 +2056,25 @@ export function renderGraphScript() {
     renderGraphDetails(null);
   };
 
+  /* ── delegated click handler for graph detail panel buttons ─────────── */
+  document.addEventListener('click', function(e) {
+    var target = e.target;
+    if (!target || typeof target.closest !== 'function') return;
+    var actionEl = target.closest('[data-action]');
+    if (!actionEl) return;
+    var action = actionEl.getAttribute('data-action');
+    var project = actionEl.getAttribute('data-project');
+    var finding = actionEl.getAttribute('data-finding');
+    if (action === 'graphNodeEdit' && project && finding) { window.graphNodeEdit(project, finding); }
+    else if (action === 'graphNodeDelete' && project && finding) { window.graphNodeDelete(project, finding); }
+  });
+
   /* ── node edit/delete actions ────────────────────────────────────────── */
 
-  function fetchCsrfToken(cb) {
-    fetch('/api/csrf-token').then(function(r) { return r.json(); }).then(function(d) { cb(d.token || ''); }).catch(function() { cb(''); });
-  }
+  var authUrl = window._phrenAuthUrl || function(u) { return u; };
+  var fetchCsrfToken = window._phrenFetchCsrfToken || function(cb) {
+    fetch(authUrl('/api/csrf-token')).then(function(r) { return r.json(); }).then(function(d) { cb(d.token || ''); }).catch(function() { cb(''); });
+  };
 
   window.graphNodeEdit = function(project, findingText) {
     var panel = document.getElementById('graph-detail-panel');
@@ -2096,7 +2110,7 @@ export function renderGraphScript() {
         body.set('old_text', findingText);
         body.set('new_text', newText);
         if (csrf) body.set('_csrf', csrf);
-        fetch('/api/findings/' + encodeURIComponent(project), { method: 'PUT', headers: { 'Content-Type': 'application/x-www-form-urlencoded' }, body: body.toString() })
+        fetch(authUrl('/api/findings/' + encodeURIComponent(project)), { method: 'PUT', headers: { 'Content-Type': 'application/x-www-form-urlencoded' }, body: body.toString() })
           .then(function(r) { return r.json(); })
           .then(function(d) {
             if (d.ok) {
@@ -2122,7 +2136,7 @@ export function renderGraphScript() {
       var body = new URLSearchParams();
       body.set('text', findingText);
       if (csrf) body.set('_csrf', csrf);
-      fetch('/api/findings/' + encodeURIComponent(project), { method: 'DELETE', headers: { 'Content-Type': 'application/x-www-form-urlencoded' }, body: body.toString() })
+      fetch(authUrl('/api/findings/' + encodeURIComponent(project)), { method: 'DELETE', headers: { 'Content-Type': 'application/x-www-form-urlencoded' }, body: body.toString() })
         .then(function(r) { return r.json(); })
         .then(function(d) {
           if (d.ok) {

package/mcp/dist/memory-ui-page.js

@@ -98,24 +98,11 @@ ${TASK_UI_STYLES}
       </div>
     </div>
     <details class="review-help" style="margin-bottom:16px">
-      <summary>Help: How the Review Queue works</summary>
-      <dl>
-        <dt>What is the Review Queue?</dt>
-        <dd>Fragments flagged by governance for human review. Items accumulate here when <code>phren maintain govern</code> is run.</dd>
-        <dt>Can I approve, reject, or edit items here?</dt>
-        <dd>Yes. Each review card has <strong>Approve</strong>, <strong>Reject</strong>, and <strong>Edit</strong> buttons. Approve accepts the fragment, Reject removes it, and Edit lets you revise the text before accepting. You can also use batch actions to approve or reject multiple items at once.</dd>
-        <dt>How do I clear items?</dt>
-        <dd>Approve or reject items directly in the UI, or use maintenance flows such as <code>phren maintain prune</code>.</dd>
-        <dt>Is this automatic?</dt>
-        <dd>No. Agents do not auto-accept review-queue items.</dd>
-        <dt>How do items get here?</dt>
-        <dd><code>phren maintain govern</code> flags stale or low-confidence fragments for review.</dd>
-        <dt>How to reduce noise?</dt>
-        <dd>Run <code>phren maintain prune</code> to auto-remove expired items without manual review.</dd>
-      </dl>
+      <summary>How review works</summary>
+      <p style="margin-top:8px;font-size:var(--text-sm);color:var(--muted)">Items waiting for your review. Approve to keep, reject to remove. You can also edit the text before approving, or use the checkboxes to bulk approve or reject multiple items at once.</p>
     </details>
 
-    <p style="font-size:var(--text-sm);color:var(--muted);margin-bottom:12px;letter-spacing:-0.01em">Fragments flagged for review. Approve, reject, or edit items directly from this tab.</p>
+    <p style="font-size:var(--text-sm);color:var(--muted);margin-bottom:12px;letter-spacing:-0.01em">Items waiting for your review. Approve to keep, reject to remove.</p>
 
     <div id="review-summary-banner" style="display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px;align-items:center"></div>
 
@@ -130,7 +117,18 @@ ${TASK_UI_STYLES}
         <option value="">All models</option>
       </select>
       <span id="review-filter-count" class="text-muted" style="font-size:var(--text-sm);margin-left:8px"></span>
-      <button class="btn btn-sm" id="highlight-only-btn" style="margin-left:auto">Flagged only</button>
+      <label id="review-select-all" style="display:none;margin-left:auto;align-items:center;gap:6px;font-size:var(--text-sm);color:var(--muted);cursor:pointer;user-select:none">
+        <input type="checkbox" onchange="toggleSelectAll(this.checked)" style="width:14px;height:14px;cursor:pointer;accent-color:var(--accent)" />
+        Select all
+      </label>
+      <button class="btn btn-sm" id="highlight-only-btn">Flagged only</button>
+    </div>
+
+    <div id="batch-bar" class="batch-bar">
+      <span id="batch-count" class="batch-bar-count"></span>
+      <button class="btn btn-sm btn-approve" onclick="batchAction('approve')">Approve selected</button>
+      <button class="btn btn-sm btn-reject" onclick="batchAction('reject')">Reject selected</button>
+      <button class="btn btn-sm" onclick="clearBatchSelection()">Clear</button>
     </div>
 
     <div id="review-kbd-hints" style="font-size:var(--text-xs);color:var(--muted);margin-bottom:12px;display:none;gap:16px;flex-wrap:wrap">
@@ -224,7 +222,7 @@ ${TASK_UI_STYLES}
         <div style="padding:20px;color:var(--muted)">Loading...</div>
       </div>
       <div class="split-reader" id="hooks-reader">
-        <div class="reader-empty">Select a hook config to view its contents.</div>
+        <div class="reader-empty">Select a hook config to view its contents.<br/><span style="font-size:var(--text-sm);color:var(--muted);margin-top:8px;display:inline-block">Per-project hooks can also be configured in Settings &gt; [project name].</span></div>
       </div>
     </div>
   </div>
@@ -321,7 +319,7 @@ ${TASK_UI_STYLES}
 </div>
 
 <script${nonceAttr}>
-${renderWebUiScript(h(authToken || ""))}
+${renderWebUiScript(authToken || "")}
 </script>
 <script${nonceAttr}>
 ${renderGraphScript()}
@@ -330,7 +328,7 @@ ${renderGraphScript()}
 ${renderReviewQueueEditSyncScript()}
 </script>
 <script${nonceAttr}>
-${renderSharedWebUiHelpers(h(authToken || ""))}
+${renderSharedWebUiHelpers(authToken || "")}
 </script>
 <script${nonceAttr}>
 ${renderSkillUiEnhancementScript(h(authToken || ""))}

package/mcp/dist/memory-ui-scripts.js

@@ -7,8 +7,9 @@
  *   window._phrenFetchCsrfToken(cb) — fetch the CSRF token and call cb(token)
  */
 export function renderSharedWebUiHelpers(authToken) {
+    const safeToken = JSON.stringify(authToken).slice(1, -1); // escape for JS string literal
     return `(function() {
-  window._phrenAuthToken = '${authToken}';
+  window._phrenAuthToken = '${safeToken}';
   window._phrenEsc = function(s) {
     return String(s).replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;').replace(/"/g,'&quot;');
   };
@@ -604,6 +605,8 @@ export function renderTasksAndSettingsScript(authToken) {
       return fetch(url).then(function(r) { return r.json(); });
     }
 
+    var _taskViewMode = 'list';
+
     function priorityBadge(p) {
       if (!p) return '';
       var colors = { high: '#ef4444', medium: '#f59e0b', low: '#6b7280' };
@@ -611,6 +614,12 @@ export function renderTasksAndSettingsScript(authToken) {
       return '<span class="task-priority-badge task-priority-' + esc(p) + '">' + esc(p) + '</span>';
     }
 
+    function sessionBadge(sessionId) {
+      if (!sessionId) return '';
+      var short = sessionId.length > 8 ? sessionId.slice(0, 8) : sessionId;
+      return '<span class="task-session-badge" title="Session ' + esc(sessionId) + '">' + esc(short) + '</span>';
+    }
+
     function statusChip(section, checked) {
       if (checked || section === 'Done') return '<span class="task-status-chip task-status-done" title="Done"><svg width="12" height="12" viewBox="0 0 16 16" fill="none"><path d="M3 8.5l3.5 3.5 6.5-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg> Done</span>';
       if (section === 'Active') return '<span class="task-status-chip task-status-active" title="In Progress">In Progress</span>';
@@ -683,6 +692,7 @@ export function renderTasksAndSettingsScript(authToken) {
     };
 
     window.toggleDoneSection = function(btn) {
+      if (!btn) return;
       var list = btn.nextElementSibling;
       var arrow = btn.querySelector('.task-toggle-arrow');
       if (!list) return;
@@ -712,10 +722,10 @@ export function renderTasksAndSettingsScript(authToken) {
       });
       var doneTasks = showDone ? [] : _allTasks.filter(function(t) {
         if (projectFilter && t.project !== projectFilter) return false;
-        return t.section === 'Done';
+        return t.section === 'Done' || t.checked;
       });
 
-      var activeCount = tasks.filter(function(t) { return t.section !== 'Done'; }).length;
+      var activeCount = tasks.filter(function(t) { return t.section !== 'Done' && !t.checked; }).length;
       var countEl = document.getElementById('tasks-count');
       if (countEl) countEl.textContent = activeCount + ' active' + (doneTasks.length ? ', ' + doneTasks.length + ' done' : '');
 
@@ -729,19 +739,26 @@ export function renderTasksAndSettingsScript(authToken) {
       // Group by priority within sections
       var priorityOrder = { high: 0, medium: 1, low: 2 };
       function sortByPriority(a, b) {
-        var pa = priorityOrder[a.priority] !== undefined ? priorityOrder[a.priority] : 1;
-        var pb = priorityOrder[b.priority] !== undefined ? priorityOrder[b.priority] : 1;
+        // Unchecked before checked
+        var aChecked = a.checked || a.section === 'Done' ? 1 : 0;
+        var bChecked = b.checked || b.section === 'Done' ? 1 : 0;
+        if (aChecked !== bChecked) return aChecked - bChecked;
+        // Pinned first
         if (a.pinned && !b.pinned) return -1;
         if (!a.pinned && b.pinned) return 1;
+        // Then by priority
+        var pa = priorityOrder[a.priority] !== undefined ? priorityOrder[a.priority] : 1;
+        var pb = priorityOrder[b.priority] !== undefined ? priorityOrder[b.priority] : 1;
         return pa - pb;
       }
 
-      // Separate into priority groups
-      var high = tasks.filter(function(t) { return t.priority === 'high' && t.section !== 'Done'; }).sort(sortByPriority);
-      var medium = tasks.filter(function(t) { return t.priority === 'medium' && t.section !== 'Done'; }).sort(sortByPriority);
-      var low = tasks.filter(function(t) { return t.priority === 'low' && t.section !== 'Done'; }).sort(sortByPriority);
-      var noPriority = tasks.filter(function(t) { return !t.priority && t.section !== 'Done'; }).sort(sortByPriority);
-      var doneVisible = tasks.filter(function(t) { return t.section === 'Done'; });
+      // Separate into priority groups (exclude checked tasks even if not in Done section)
+      function isActive(t) { return t.section !== 'Done' && !t.checked; }
+      var high = tasks.filter(function(t) { return t.priority === 'high' && isActive(t); }).sort(sortByPriority);
+      var medium = tasks.filter(function(t) { return t.priority === 'medium' && isActive(t); }).sort(sortByPriority);
+      var low = tasks.filter(function(t) { return t.priority === 'low' && isActive(t); }).sort(sortByPriority);
+      var noPriority = tasks.filter(function(t) { return !t.priority && isActive(t); }).sort(sortByPriority);
+      var doneVisible = tasks.filter(function(t) { return t.section === 'Done' || t.checked; });
 
       function renderTaskCard(t) {
         var borderClass = t.priority === 'high' ? ' task-card-high' : t.priority === 'medium' ? ' task-card-medium' : t.priority === 'low' ? ' task-card-low' : '';
@@ -753,16 +770,17 @@ export function renderTasksAndSettingsScript(authToken) {
         html += pinIndicator(t.pinned);
         html += githubBadge(t.githubIssue, t.githubUrl);
         html += priorityBadge(t.priority);
+        html += sessionBadge(t.sessionId);
         html += '</div>';
         html += '<div class="task-card-body">';
         html += '<span class="task-card-text">' + esc(t.line) + '</span>';
         if (t.context) html += '<span class="task-card-context">' + esc(t.context) + '</span>';
         html += '</div>';
         html += '<div class="task-card-actions">';
-        if (t.section !== 'Done') {
-          html += '<button class="task-done-btn" onclick="completeTaskFromUi(\\'' + esc(t.project).replace(/'/g, "\\\\'") + '\\', \\'' + esc(t.line).replace(/'/g, "\\\\'") + '\\')" title="Mark done"><svg width="14" height="14" viewBox="0 0 16 16" fill="none"><path d="M3 8.5l3.5 3.5 6.5-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg> Done</button>';
+        if (t.section !== 'Done' && !t.checked) {
+          html += '<button class="task-done-btn" data-ts-action="completeTask" data-project="' + esc(t.project) + '" data-item="' + esc(t.line) + '" title="Mark done"><svg width="14" height="14" viewBox="0 0 16 16" fill="none"><path d="M3 8.5l3.5 3.5 6.5-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg> Done</button>';
         }
-        html += '<button class="task-remove-btn" onclick="removeTaskFromUi(\\'' + esc(t.project).replace(/'/g, "\\\\'") + '\\', \\'' + esc(t.line).replace(/'/g, "\\\\'") + '\\')" title="Delete task" style="background:none;border:1px solid var(--border);border-radius:var(--radius-sm);padding:2px 8px;cursor:pointer;color:var(--muted);font-size:var(--text-xs)"><svg width="12" height="12" viewBox="0 0 16 16" fill="none"><path d="M4 4l8 8M12 4l-8 8" stroke="currentColor" stroke-width="2" stroke-linecap="round"/></svg></button>';
+        html += '<button class="task-remove-btn" data-ts-action="removeTask" data-project="' + esc(t.project) + '" data-item="' + esc(t.line) + '" title="Delete task" style="background:none;border:1px solid var(--border);border-radius:var(--radius-sm);padding:2px 8px;cursor:pointer;color:var(--muted);font-size:var(--text-xs)"><svg width="12" height="12" viewBox="0 0 16 16" fill="none"><path d="M4 4l8 8M12 4l-8 8" stroke="currentColor" stroke-width="2" stroke-linecap="round"/></svg></button>';
         html += '</div>';
         html += '</div>';
         return html;
@@ -770,21 +788,46 @@ export function renderTasksAndSettingsScript(authToken) {
 
       var html = '';
 
-      // Add task input at top
-      var projects = projectFilter ? [projectFilter] : Array.from(new Set(_allTasks.map(function(t) { return t.project; }))).sort();
+      // Summary bar
+      var allActive = _allTasks.filter(function(t) { return t.section !== 'Done' && !t.checked; });
+      var highCount = allActive.filter(function(t) { return t.priority === 'high'; }).length;
+      var medCount = allActive.filter(function(t) { return t.priority === 'medium'; }).length;
+      var lowCount = allActive.filter(function(t) { return t.priority === 'low'; }).length;
+      var projectCounts = {};
+      allActive.forEach(function(t) { projectCounts[t.project] = (projectCounts[t.project] || 0) + 1; });
+      var topProjects = Object.keys(projectCounts).sort(function(a, b) { return projectCounts[b] - projectCounts[a]; }).slice(0, 3);
+      html += '<div class="task-summary-bar">';
+      html += '<span class="task-summary-total">' + allActive.length + ' active</span>';
+      if (highCount) html += '<span class="task-summary-pill task-summary-high">' + highCount + ' high</span>';
+      if (medCount) html += '<span class="task-summary-pill task-summary-medium">' + medCount + ' medium</span>';
+      if (lowCount) html += '<span class="task-summary-pill task-summary-low">' + lowCount + ' low</span>';
+      if (topProjects.length) {
+        html += '<span class="task-summary-projects">';
+        topProjects.forEach(function(p) { html += '<span class="task-summary-project">' + esc(p) + ' (' + projectCounts[p] + ')</span>'; });
+        html += '</span>';
+      }
+      html += '<span class="task-view-toggle" style="margin-left:auto">';
+      html += '<button class="task-view-btn' + (_taskViewMode === 'list' ? ' active' : '') + '" data-ts-action="setTaskView" data-mode="list" title="List view"><svg width="14" height="14" viewBox="0 0 16 16" fill="none"><path d="M2 4h12M2 8h12M2 12h12" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/></svg></button>';
+      html += '<button class="task-view-btn' + (_taskViewMode === 'compact' ? ' active' : '') + '" data-ts-action="setTaskView" data-mode="compact" title="Compact view"><svg width="14" height="14" viewBox="0 0 16 16" fill="none"><rect x="1" y="2" width="6" height="5" rx="1" stroke="currentColor" stroke-width="1.2"/><rect x="9" y="2" width="6" height="5" rx="1" stroke="currentColor" stroke-width="1.2"/><rect x="1" y="9" width="6" height="5" rx="1" stroke="currentColor" stroke-width="1.2"/><rect x="9" y="9" width="6" height="5" rx="1" stroke="currentColor" stroke-width="1.2"/></svg></button>';
+      html += '</span>';
+      html += '</div>';
+
+      // Add task input at top (only when a specific project is selected)
+      var projects = projectFilter ? [projectFilter] : [];
       projects.forEach(function(proj) {
         html += '<div class="task-add-bar">';
-        html += '<input id="task-add-input-' + esc(proj) + '" type="text" class="task-add-input" placeholder="Add a task to ' + esc(proj) + '\u2026" onkeydown="if(event.key===\\\'Enter\\\')addTaskFromUi(\\'' + esc(proj).replace(/'/g, "\\\\'") + '\\')">';
-        html += '<button class="task-add-btn" onclick="addTaskFromUi(\\'' + esc(proj).replace(/'/g, "\\\\'") + '\\')"><svg width="14" height="14" viewBox="0 0 16 16" fill="none"><path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="2" stroke-linecap="round"/></svg> Add</button>';
+        html += '<input id="task-add-input-' + esc(proj) + '" type="text" class="task-add-input" placeholder="Add a task to ' + esc(proj) + '\u2026" data-ts-action="addTaskKeydown" data-project="' + esc(proj) + '">';
+        html += '<button class="task-add-btn" data-ts-action="addTask" data-project="' + esc(proj) + '"><svg width="14" height="14" viewBox="0 0 16 16" fill="none"><path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="2" stroke-linecap="round"/></svg> Add</button>';
         html += '</div>';
       });
 
       // Priority sections
       function renderSection(title, items, icon) {
         if (!items.length) return '';
+        var gridClass = _taskViewMode === 'compact' ? 'task-card-grid task-card-grid-compact' : 'task-card-grid';
         var shtml = '<div class="task-priority-section">';
         shtml += '<div class="task-section-header"><span class="task-section-icon">' + icon + '</span> ' + title + ' <span class="task-section-count">' + items.length + '</span></div>';
-        shtml += '<div class="task-card-grid">';
+        shtml += '<div class="' + gridClass + '">';
         items.forEach(function(t) { shtml += renderTaskCard(t); });
         shtml += '</div></div>';
         return shtml;
@@ -801,7 +844,7 @@ export function renderTasksAndSettingsScript(authToken) {
       var allDone = showDone ? doneVisible : doneTasks;
       if (allDone.length) {
         html += '<div class="task-done-section">';
-        html += '<button class="task-done-toggle" onclick="toggleDoneSection(this)">';
+        html += '<button class="task-done-toggle" data-ts-action="toggleDoneSection">';
         html += '<span class="task-toggle-arrow">\u25B6</span> Completed <span class="task-section-count">' + allDone.length + '</span></button>';
         html += '<div class="task-done-list" style="display:none">';
         html += '<div class="task-card-grid">';
@@ -1221,7 +1264,12 @@ export function renderTasksAndSettingsScript(authToken) {
       var actionEl = target.closest('[data-ts-action]');
       if (!actionEl) return;
       var action = actionEl.getAttribute('data-ts-action');
-      if (action === 'setFindingSensitivity') { setFindingSensitivity(actionEl.getAttribute('data-level')); }
+      if (action === 'toggleDoneSection') { toggleDoneSection(actionEl); }
+      else if (action === 'completeTask') { completeTaskFromUi(actionEl.getAttribute('data-project'), actionEl.getAttribute('data-item')); }
+      else if (action === 'removeTask') { removeTaskFromUi(actionEl.getAttribute('data-project'), actionEl.getAttribute('data-item')); }
+      else if (action === 'addTask') { addTaskFromUi(actionEl.getAttribute('data-project')); }
+      else if (action === 'setTaskView') { _taskViewMode = actionEl.getAttribute('data-mode') || 'list'; filterTasks(); }
+      else if (action === 'setFindingSensitivity') { setFindingSensitivity(actionEl.getAttribute('data-level')); }
       else if (action === 'toggleAutoCapture') { setAutoCapture(actionEl.getAttribute('data-enabled') !== 'true'); }
       else if (action === 'setTaskMode') { setTaskMode(actionEl.getAttribute('data-mode')); }
       else if (action === 'setProactivity') { setProactivity(actionEl.getAttribute('data-level')); }
@@ -1258,6 +1306,15 @@ export function renderTasksAndSettingsScript(authToken) {
       }
     });
 
+    // Keydown delegation for add-task inputs (Enter key)
+    document.addEventListener('keydown', function(e) {
+      var target = e.target;
+      if (!target || !target.getAttribute) return;
+      if (target.getAttribute('data-ts-action') === 'addTaskKeydown' && e.key === 'Enter') {
+        addTaskFromUi(target.getAttribute('data-project'));
+      }
+    });
+
     window.setFindingSensitivity = function(level) {
       var descriptions = {
         high: 'Capture findings proactively, including minor observations.',

package/mcp/dist/memory-ui-server.js

@@ -7,12 +7,12 @@ import * as querystring from "querystring";
 import { spawn, execFileSync } from "child_process";
 import { computePhrenLiveStateToken, getProjectDirs, } from "./shared.js";
 import { editFinding, readReviewQueue, removeFinding, readFindings, addFinding as addFindingStore, readTasksAcrossProjects, addTask as addTaskStore, completeTask as completeTaskStore, removeTask as removeTaskStore, TASKS_FILENAME, } from "./data-access.js";
-import { isValidProjectName, errorMessage, queueFilePath } from "./utils.js";
+import { isValidProjectName, errorMessage, queueFilePath, safeProjectPath } from "./utils.js";
 import { readInstallPreferences, writeInstallPreferences, writeGovernanceInstallPreferences } from "./init-preferences.js";
 import { buildGraph, collectProjectsForUI, collectSkillsForUI, getHooksData, isAllowedFilePath, readSyncSnapshot, recentAccepted, recentUsage, } from "./memory-ui-data.js";
 import { CONSOLIDATION_ENTRY_THRESHOLD } from "./content-validate.js";
 import { ensureTopicReferenceDoc, getProjectTopicsResponse, listProjectReferenceDocs, pinProjectTopicSuggestion, readReferenceContent, reclassifyLegacyTopicDocs, unpinProjectTopicSuggestion, writeProjectTopics, } from "./project-topics.js";
-import { getWorkflowPolicy, updateWorkflowPolicy, mergeConfig, getRetentionPolicy, getProjectConfigOverrides } from "./governance-policy.js";
+import { getWorkflowPolicy, updateWorkflowPolicy, mergeConfig, getRetentionPolicy, getProjectConfigOverrides, VALID_TASK_MODES } from "./governance-policy.js";
 import { updateProjectConfigOverrides } from "./project-config.js";
 import { findSkill } from "./skill-registry.js";
 import { setSkillEnabledAndSync } from "./skill-files.js";
@@ -193,6 +193,8 @@ function readFormBody(req, res) {
         req.on("data", (chunk) => {
             received += chunk.length;
             if (received > MAX_FORM_BODY_BYTES) {
+                res.writeHead(413, { "Content-Type": "application/json" });
+                res.end(JSON.stringify({ ok: false, error: "Request body too large" }));
                 req.destroy();
                 resolve(null);
                 return;
@@ -508,7 +510,12 @@ export function createWebUiHttpServer(phrenPath, renderPage, profile, opts) {
                 res.end(JSON.stringify({ ok: false, error: `File not allowed: ${file}` }));
                 return;
             }
-            const filePath = path.join(phrenPath, project, file);
+            const filePath = safeProjectPath(phrenPath, project, file);
+            if (!filePath) {
+                res.writeHead(400, { "content-type": "application/json" });
+                res.end(JSON.stringify({ ok: false, error: "Invalid project or file path" }));
+                return;
+            }
             if (!fs.existsSync(filePath)) {
                 res.writeHead(200, { "content-type": "application/json; charset=utf-8" });
                 res.end(JSON.stringify({ ok: false, error: `File not found: ${file}` }));
@@ -847,6 +854,7 @@ export function createWebUiHttpServer(phrenPath, renderPage, profile, opts) {
                                 githubUrl: item.githubUrl,
                                 context: item.context,
                                 checked: item.checked,
+                                sessionId: item.sessionId,
                             });
                         }
                     }
@@ -1024,7 +1032,7 @@ export function createWebUiHttpServer(phrenPath, renderPage, profile, opts) {
                 if (!requireCsrf(res, parsed, csrfTokens, true))
                     return;
                 const value = String(parsed.value || "").trim().toLowerCase();
-                const valid = ["off", "manual", "auto"];
+                const valid = VALID_TASK_MODES;
                 if (!valid.includes(value)) {
                     res.writeHead(200, { "content-type": "application/json; charset=utf-8" });
                     res.end(JSON.stringify({ ok: false, error: `Invalid task mode: "${value}". Must be one of: ${valid.join(", ")}` }));
@@ -1161,7 +1169,7 @@ export function createWebUiHttpServer(phrenPath, renderPage, profile, opts) {
                     });
                     const merged = mergeConfig(phrenPath, project);
                     res.writeHead(200, { "content-type": "application/json; charset=utf-8" });
-                    res.end(JSON.stringify({ ok: true, config: merged }));
+                    res.end(JSON.stringify({ ok: true, config: merged, ...(registrationWarning ? { warning: registrationWarning } : {}) }));
                 }
                 catch (err) {
                     res.writeHead(200, { "content-type": "application/json; charset=utf-8" });

package/mcp/dist/memory-ui-styles.js

@@ -552,4 +552,106 @@ export const TASK_UI_STYLES = `
     transition: transform 0.2s;
   }
   .task-done-list { padding-top: 8px; }
+
+  /* ── Task Summary Bar ──────────────────────────── */
+  .task-summary-bar {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+    padding: 10px 14px;
+    background: var(--surface-sunken, var(--surface));
+    border: 1px solid var(--border);
+    border-radius: var(--radius);
+    margin-bottom: 16px;
+    flex-wrap: wrap;
+    font-size: var(--text-sm);
+  }
+  .task-summary-total {
+    font-weight: 600;
+    color: var(--ink);
+    font-size: var(--text-base);
+  }
+  .task-summary-pill {
+    display: inline-flex;
+    align-items: center;
+    padding: 2px 8px;
+    border-radius: 999px;
+    font-size: 11px;
+    font-weight: 600;
+  }
+  .task-summary-high { background: #ef444422; color: #ef4444; }
+  .task-summary-medium { background: #f59e0b22; color: #f59e0b; }
+  .task-summary-low { background: #6b728022; color: #6b7280; }
+  .task-summary-projects {
+    display: flex;
+    gap: 6px;
+    align-items: center;
+  }
+  .task-summary-project {
+    font-size: 11px;
+    color: var(--muted);
+    padding: 1px 6px;
+    border: 1px solid var(--border);
+    border-radius: var(--radius-sm);
+  }
+
+  /* ── Task Session Badge ──────────────────────────── */
+  .task-session-badge {
+    display: inline-block;
+    padding: 1px 6px;
+    border-radius: var(--radius-sm);
+    font-size: 10px;
+    font-family: var(--mono, monospace);
+    background: var(--surface-sunken, var(--surface));
+    color: var(--muted);
+    border: 1px solid var(--border);
+  }
+
+  /* ── Task View Toggle ──────────────────────────── */
+  .task-view-toggle {
+    display: flex;
+    gap: 2px;
+    border: 1px solid var(--border);
+    border-radius: var(--radius-sm);
+    overflow: hidden;
+  }
+  .task-view-btn {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 30px;
+    height: 28px;
+    background: var(--surface);
+    border: none;
+    color: var(--muted);
+    cursor: pointer;
+    transition: background 0.15s, color 0.15s;
+  }
+  .task-view-btn:hover { color: var(--ink); }
+  .task-view-btn.active {
+    background: var(--accent-dim);
+    color: var(--accent);
+  }
+
+  /* ── Task Compact Grid ──────────────────────────── */
+  .task-card-grid-compact {
+    display: grid !important;
+    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
+    gap: 8px;
+  }
+  .task-card-grid-compact .task-card {
+    padding: 10px 12px;
+  }
+  .task-card-grid-compact .task-card-body {
+    gap: 2px;
+  }
+  .task-card-grid-compact .task-card-text {
+    font-size: var(--text-sm);
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    -webkit-box-orient: vertical;
+    overflow: hidden;
+  }
+  .task-card-grid-compact .task-card-context { display: none; }
+  .task-card-grid-compact .task-card-actions { margin-top: 6px; }
 `;

package/mcp/dist/phren-paths.js

@@ -305,6 +305,23 @@ export function findProjectNameCaseInsensitive(phrenPath, name) {
     }
     return null;
 }
+export function findArchivedProjectNameCaseInsensitive(phrenPath, name) {
+    const needle = name.toLowerCase();
+    try {
+        for (const entry of fs.readdirSync(phrenPath, { withFileTypes: true })) {
+            if (!entry.isDirectory() || !entry.name.endsWith(".archived"))
+                continue;
+            const archivedName = entry.name.slice(0, -".archived".length);
+            if (archivedName.toLowerCase() === needle)
+                return archivedName;
+        }
+    }
+    catch (err) {
+        if ((process.env.PHREN_DEBUG))
+            process.stderr.write(`[phren] findArchivedProjectNameCaseInsensitive: ${errorMessage(err)}\n`);
+    }
+    return null;
+}
 function getLocalProjectDirs(phrenPath, manifest) {
     const primaryProject = manifest.primaryProject;
     if (!primaryProject || !isValidProjectName(primaryProject))

package/mcp/dist/shared.js

@@ -4,7 +4,7 @@ import { debugLog, runtimeFile } from "./phren-paths.js";
 import { errorMessage } from "./utils.js";
 export { HOOK_TOOL_NAMES, hookConfigPath } from "./provider-adapters.js";
 export { EXEC_TIMEOUT_MS, EXEC_TIMEOUT_QUICK_MS, PhrenError, phrenOk, phrenErr, forwardErr, parsePhrenErrorCode, isRecord, withDefaults, FINDING_TYPES, FINDING_TAGS, KNOWN_OBSERVATION_TAGS, DOC_TYPES, capCache, RESERVED_PROJECT_DIR_NAMES, } from "./phren-core.js";
-export { ROOT_MANIFEST_FILENAME, homeDir, homePath, expandHomePath, defaultPhrenPath, rootManifestPath, readRootManifest, writeRootManifest, resolveInstallContext, findNearestPhrenPath, isProjectLocalMode, runtimeDir, tryUnlink, sessionsDir, runtimeFile, installPreferencesFile, runtimeHealthFile, shellStateFile, sessionMetricsFile, memoryScoresFile, memoryUsageLogFile, sessionMarker, debugLog, appendIndexEvent, resolveFindingsPath, findPhrenPath, ensurePhrenPath, findPhrenPathWithArg, normalizeProjectNameForCreate, findProjectNameCaseInsensitive, getProjectDirs, collectNativeMemoryFiles, computePhrenLiveStateToken, getPhrenPath, qualityMarkers, atomicWriteText, } from "./phren-paths.js";
+export { ROOT_MANIFEST_FILENAME, homeDir, homePath, expandHomePath, defaultPhrenPath, rootManifestPath, readRootManifest, writeRootManifest, resolveInstallContext, findNearestPhrenPath, isProjectLocalMode, runtimeDir, tryUnlink, sessionsDir, runtimeFile, installPreferencesFile, runtimeHealthFile, shellStateFile, sessionMetricsFile, memoryScoresFile, memoryUsageLogFile, sessionMarker, debugLog, appendIndexEvent, resolveFindingsPath, findPhrenPath, ensurePhrenPath, findPhrenPathWithArg, normalizeProjectNameForCreate, findProjectNameCaseInsensitive, findArchivedProjectNameCaseInsensitive, getProjectDirs, collectNativeMemoryFiles, computePhrenLiveStateToken, getPhrenPath, qualityMarkers, atomicWriteText, } from "./phren-paths.js";
 export { PROACTIVITY_LEVELS, getProactivityLevel, getProactivityLevelForFindings, getProactivityLevelForTask, hasExplicitFindingSignal, hasExplicitTaskSignal, hasExecutionIntent, hasDiscoveryIntent, shouldAutoCaptureFindingsForLevel, shouldAutoCaptureTaskForLevel, } from "./proactivity.js";
 const MEMORY_SCOPE_PATTERN = /^[a-z][a-z0-9_-]{0,63}$/;
 export function normalizeMemoryScope(scope) {

package/mcp/dist/skill-registry.js

@@ -3,6 +3,7 @@ import * as path from "path";
 import { getProjectDirs } from "./shared.js";
 import { parseSkillFrontmatter } from "./link-skills.js";
 import { isSkillEnabled } from "./skill-state.js";
+import { safeProjectPath } from "./utils.js";
 function normalizeCommand(raw, fallbackName) {
     const value = typeof raw === "string" && raw.trim() ? raw.trim() : `/${fallbackName}`;
     return value.startsWith("/") ? value : `/${value}`;
@@ -28,13 +29,35 @@ function collectSkills(phrenPath, root, sourceLabel, scopeType, sourceKind, seen
     if (!fs.existsSync(root))
         return [];
     const results = [];
+    const realRoot = (() => {
+        try {
+            return fs.realpathSync(root);
+        }
+        catch {
+            return path.resolve(root);
+        }
+    })();
     for (const entry of fs.readdirSync(root, { withFileTypes: true })) {
         const isFolder = entry.isDirectory();
-        const filePath = isFolder
+        const candidatePath = isFolder
             ? path.join(root, entry.name, "SKILL.md")
             : entry.name.endsWith(".md") ? path.join(root, entry.name) : null;
-        if (!filePath || seen.has(filePath) || !fs.existsSync(filePath))
+        if (!candidatePath)
+            continue;
+        const safeCandidate = safeProjectPath(root, path.relative(root, candidatePath));
+        if (!safeCandidate || seen.has(safeCandidate) || !fs.existsSync(safeCandidate))
             continue;
+        try {
+            if (fs.lstatSync(safeCandidate).isSymbolicLink())
+                continue;
+            const realCandidate = fs.realpathSync(safeCandidate);
+            if (realCandidate !== realRoot && !realCandidate.startsWith(realRoot + path.sep))
+                continue;
+        }
+        catch {
+            continue;
+        }
+        const filePath = safeCandidate;
         seen.add(filePath);
         const name = isFolder ? entry.name : entry.name.replace(/\.md$/, "");
         const { frontmatter } = parseSkillFrontmatter(fs.readFileSync(filePath, "utf8"));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@phren/cli",
-  "version": "0.0.15",
+  "version": "0.0.17",
   "description": "Knowledge layer for AI agents. Phren learns and recalls.",
   "type": "module",
   "bin": {