@phren/cli 0.0.16 → 0.0.18

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

@@ -86,55 +86,29 @@ ${TASK_UI_STYLES}
 
   <!-- ── Review Tab ────────────────────────────────────────── -->
   <div id="tab-review" class="tab-content">
-    <div class="card" style="margin-bottom:16px">
-      <div class="card-header"><h2>Sync State</h2></div>
-      <div class="card-body">
-        <div id="sync-state-summary" style="display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;font-size:var(--text-base)">
-          <div><strong>Auto-save</strong><div class="text-muted">${h(sync.autoSaveStatus || "n/a")}</div></div>
-          <div><strong>Last pull</strong><div class="text-muted">${h(sync.lastPullStatus || "n/a")} ${h(sync.lastPullAt || "")}</div></div>
-          <div><strong>Last push</strong><div class="text-muted">${h(sync.lastPushStatus || "n/a")} ${h(sync.lastPushAt || "")}</div></div>
-          <div><strong>Unsynced commits</strong><div class="text-muted">${h(String(sync.unsyncedCommits || 0))}</div></div>
-        </div>
-      </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>
-    </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>
-
-    <div id="review-summary-banner" style="display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px;align-items:center"></div>
-
-    <div class="review-filters" id="review-filters" style="display:none">
+    <div class="review-toolbar" id="review-filters" style="display:none">
       <select id="review-filter-project">
         <option value="">All projects</option>
       </select>
-      <select id="review-filter-machine">
-        <option value="">All machines</option>
-      </select>
-      <select id="review-filter-model">
-        <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 class="review-flagged-toggle" id="review-flagged-toggle">
+        <input type="checkbox" id="highlight-only-btn" />
+        <span>Flagged only</span>
+      </label>
+      <span id="review-filter-count" class="text-muted" style="font-size:var(--text-sm);margin-left:auto"></span>
+      <label id="review-select-all" style="display:none;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>
+      <span id="review-sync-status" class="review-sync-dot" title="Sync status">
+        <span class="review-sync-indicator" id="review-sync-indicator"></span>
+      </span>
     </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">
-      <span><kbd>j</kbd>/<kbd>k</kbd> navigate</span>
+    <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 class="review-cards" id="review-cards-list">
@@ -158,9 +132,10 @@ ${TASK_UI_STYLES}
     <div style="max-width:720px;margin:0 auto">
       <div style="display:flex;gap:8px;margin-bottom:16px">
         <input type="text" id="search-query" placeholder="Search fragments, findings, tasks..." style="flex:1;border:1px solid var(--border);border-radius:var(--radius-sm);padding:8px 12px;background:var(--surface);color:var(--ink);font-size:var(--text-base);font-family:var(--font);outline:none" />
-        <select id="search-project-filter" style="border:1px solid var(--border);border-radius:var(--radius-sm);padding:6px 10px;background:var(--surface);color:var(--ink);font-size:var(--text-sm)">
-          <option value="">All projects</option>
-        </select>
+        <div id="search-project-wrap" style="position:relative">
+          <button id="search-project-btn" type="button" onclick="window._phrenToggleProjectDropdown()" style="border:1px solid var(--border);border-radius:var(--radius-sm);padding:6px 10px;background:var(--surface);color:var(--ink);font-size:var(--text-sm);cursor:pointer;font-family:var(--font);min-width:120px;text-align:left;white-space:nowrap">All projects</button>
+          <div id="search-project-dropdown" style="display:none;position:absolute;top:100%;left:0;z-index:50;margin-top:4px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);box-shadow:0 4px 12px rgba(0,0,0,.15);max-height:240px;overflow-y:auto;min-width:160px"></div>
+        </div>
         <select id="search-type-filter" style="border:1px solid var(--border);border-radius:var(--radius-sm);padding:6px 10px;background:var(--surface);color:var(--ink);font-size:var(--text-sm)">
           <option value="">All types</option>
           <option value="finding">Findings</option>
@@ -224,7 +199,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>
@@ -277,6 +252,12 @@ ${TASK_UI_STYLES}
           <div id="settings-scope-note" style="font-size:var(--text-sm);color:var(--muted)">Showing global settings. Select a project to view and edit per-project overrides.</div>
         </div>
       </section>
+      <section id="settings-project-info-section" class="settings-section" style="display:none;border-top:3px solid color-mix(in srgb, var(--accent) 45%, var(--border))">
+        <div class="settings-section-header">Project Info</div>
+        <div class="settings-section-body">
+          <div id="settings-project-info" style="color:var(--muted)"></div>
+        </div>
+      </section>
       <section class="settings-section settings-section-findings">
         <div class="settings-section-header">Findings</div>
         <div class="settings-section-body">

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

@@ -605,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' };
@@ -612,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>';
@@ -731,10 +739,16 @@ 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;
       }
 
@@ -756,6 +770,7 @@ 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>';
@@ -773,6 +788,30 @@ export function renderTasksAndSettingsScript(authToken) {
 
       var html = '';
 
+      // 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) {
@@ -785,9 +824,10 @@ export function renderTasksAndSettingsScript(authToken) {
       // 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;
@@ -934,6 +974,35 @@ export function renderTasksAndSettingsScript(authToken) {
 
         var isProject = Boolean(selectedProject);
 
+        // Render project info section
+        var infoSection = document.getElementById('settings-project-info-section');
+        var infoEl = document.getElementById('settings-project-info');
+        if (infoSection && infoEl) {
+          if (isProject && data.projectInfo) {
+            var pi = data.projectInfo;
+            infoSection.style.display = '';
+            var infoHtml = '<div style="display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;font-size:var(--text-sm)">';
+            infoHtml += '<div><strong style="color:var(--ink)">Disk path</strong><div class="text-muted" style="font-family:var(--mono);font-size:var(--text-xs);word-break:break-all">' + esc(pi.diskPath) + '</div></div>';
+            infoHtml += '<div><strong style="color:var(--ink)">Ownership</strong><div class="text-muted">' + esc(pi.ownership) + '</div></div>';
+            infoHtml += '<div><strong style="color:var(--ink)">Config file</strong><div class="text-muted" style="font-family:var(--mono);font-size:var(--text-xs);word-break:break-all">' + esc(pi.configFile) + '</div>' + (pi.configExists ? '<span style="color:var(--green);font-size:var(--text-xs)">exists</span>' : '<span style="color:var(--muted);font-size:var(--text-xs)">not created</span>') + '</div>';
+            infoHtml += '<div><strong style="color:var(--ink)">Findings</strong><div class="text-muted">' + pi.findingCount + ' entries</div></div>';
+            infoHtml += '<div><strong style="color:var(--ink)">Tasks</strong><div class="text-muted">' + pi.taskCount + ' in queue</div></div>';
+            infoHtml += '</div>';
+            var files = [];
+            if (pi.hasFindings) files.push('FINDINGS.md');
+            if (pi.hasTasks) files.push('tasks.md');
+            if (pi.hasSummary) files.push('summary.md');
+            if (pi.hasClaudeMd) files.push('CLAUDE.md');
+            if (files.length) {
+              infoHtml += '<div style="margin-top:10px;font-size:var(--text-xs);color:var(--muted)">Files: ' + files.map(function(f) { return '<span class="badge" style="margin-right:4px">' + esc(f) + '</span>'; }).join('') + '</div>';
+            }
+            infoEl.innerHTML = infoHtml;
+          } else {
+            infoSection.style.display = 'none';
+            infoEl.innerHTML = '';
+          }
+        }
+
         function sourceBadge(isOverride) {
           if (!isProject) return '';
           return isOverride
@@ -1149,21 +1218,21 @@ export function renderTasksAndSettingsScript(authToken) {
       }
       list.innerHTML = '<table style="width:100%;border-collapse:collapse;font-size:var(--text-sm)">' +
         '<thead><tr style="border-bottom:1px solid var(--border);text-align:left">' +
-        '<th style="padding:8px">Session</th><th style="padding:8px">Project</th><th style="padding:8px">Date</th>' +
-        '<th style="padding:8px">Duration</th><th style="padding:8px">Findings</th><th style="padding:8px">Status</th></tr></thead><tbody>' +
+        '<th style="padding:8px">Session</th><th style="padding:8px">Project</th><th style="padding:8px">Started</th>' +
+        '<th style="padding:8px">Ended</th><th style="padding:8px">Duration</th><th style="padding:8px">Findings</th></tr></thead><tbody>' +
         sessions.map(function(s) {
           var id = s.sessionId.slice(0, 8);
-          var date = (s.startedAt || '').slice(0, 16).replace('T', ' ');
+          var startDate = (s.startedAt || '').slice(0, 16).replace('T', ' ');
+          var endDate = s.endedAt ? (s.endedAt || '').slice(0, 16).replace('T', ' ') : '<span style="color:var(--green)">active</span>';
           var dur = s.durationMins != null ? s.durationMins + 'm' : '—';
-          var status = s.status === 'active' ? '<span style="color:var(--green)">● active</span>' : 'ended';
           var summarySnip = s.summary ? '<div class="text-muted" style="font-size:var(--text-xs);max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">' + esc(s.summary.slice(0, 80)) + '</div>' : '';
           return '<tr style="border-bottom:1px solid var(--border);cursor:pointer" data-ts-action="showSessionDetail" data-session-id="' + esc(s.sessionId) + '">' +
             '<td style="padding:8px;font-family:monospace">' + esc(id) + summarySnip + '</td>' +
             '<td style="padding:8px">' + esc(s.project || '—') + '</td>' +
-            '<td style="padding:8px">' + esc(date) + '</td>' +
+            '<td style="padding:8px">' + esc(startDate) + '</td>' +
+            '<td style="padding:8px">' + endDate + '</td>' +
             '<td style="padding:8px">' + esc(dur) + '</td>' +
-            '<td style="padding:8px">' + (s.findingsAdded || 0) + '</td>' +
-            '<td style="padding:8px">' + status + '</td></tr>';
+            '<td style="padding:8px">' + (s.findingsAdded || 0) + '</td></tr>';
         }).join('') + '</tbody></table>';
     }
 
@@ -1228,6 +1297,7 @@ export function renderTasksAndSettingsScript(authToken) {
       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')); }
@@ -1318,94 +1388,161 @@ export function renderSearchScript(authToken) {
 
   var esc = window._phrenEsc;
 
+  function relativeDate(iso) {
+    if (!iso) return '';
+    var d = new Date(iso);
+    var now = new Date();
+    var diff = now.getTime() - d.getTime();
+    var days = Math.floor(diff / 86400000);
+    if (days < 1) return 'today';
+    if (days === 1) return '1d ago';
+    if (days < 7) return days + 'd ago';
+    if (days < 30) return Math.floor(days / 7) + 'w ago';
+    var months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
+    return months[d.getMonth()] + ' ' + d.getDate();
+  }
+
+  // Multi-select project filter
+  var _selectedProjects = [];
+  function getSelectedProjects() { return _selectedProjects.slice(); }
+  function toggleProjectFilter(name) {
+    var idx = _selectedProjects.indexOf(name);
+    if (idx === -1) _selectedProjects.push(name);
+    else _selectedProjects.splice(idx, 1);
+    renderProjectFilterLabel();
+    renderProjectFilterChecks();
+  }
+  function renderProjectFilterLabel() {
+    var btn = document.getElementById('search-project-btn');
+    if (!btn) return;
+    if (!_selectedProjects.length) btn.textContent = 'All projects';
+    else if (_selectedProjects.length === 1) btn.textContent = _selectedProjects[0];
+    else btn.textContent = _selectedProjects.length + ' projects';
+  }
+  function renderProjectFilterChecks() {
+    var items = document.querySelectorAll('#search-project-dropdown input[type=checkbox]');
+    for (var i = 0; i < items.length; i++) {
+      items[i].checked = _selectedProjects.indexOf(items[i].value) !== -1;
+    }
+  }
+  window._phrenToggleProjectDropdown = function() {
+    var dd = document.getElementById('search-project-dropdown');
+    if (dd) dd.style.display = dd.style.display === 'none' ? 'block' : 'none';
+  };
+  document.addEventListener('click', function(e) {
+    var wrap = document.getElementById('search-project-wrap');
+    var dd = document.getElementById('search-project-dropdown');
+    if (wrap && dd && !wrap.contains(e.target)) dd.style.display = 'none';
+  });
+
+  function parseResults(lines) {
+    var cards = [];
+    var current = null;
+    for (var i = 0; i < lines.length; i++) {
+      var line = lines[i];
+      if (!line.trim()) continue;
+      if (line.startsWith('[') && line.indexOf(']') > 0) {
+        if (current) cards.push(current);
+        var bracket = line.indexOf(']');
+        var source = line.slice(1, bracket);
+        var meta = line.slice(bracket + 1).trim();
+        current = { source: source, meta: meta, snippets: [] };
+      } else if (line === '(keyword fallback)') {
+        // skip
+      } else if (current) {
+        current.snippets.push(line);
+      } else {
+        cards.push({ source: '', meta: '', snippets: [line] });
+      }
+    }
+    if (current) cards.push(current);
+    return cards;
+  }
+  function renderCards(cards) {
+    var html = '';
+    for (var c = 0; c < cards.length; c++) {
+      var card = cards[c];
+      html += '<div class="card" style="margin-bottom:8px">';
+      html += '<div class="card-header" style="padding:10px 14px;display:flex;align-items:center">';
+      if (card.source) {
+        html += '<span style="font-weight:500;font-size:var(--text-sm)">' + esc(card.source) + '</span>';
+      }
+      if (card.meta) {
+        html += '<span class="text-muted" style="font-size:var(--text-xs);margin-left:8px">' + esc(card.meta) + '</span>';
+      }
+      html += '</div>';
+      if (card.snippets.length) {
+        html += '<div class="card-body" style="padding:10px 14px;font-size:var(--text-sm);white-space:pre-wrap;color:var(--ink-secondary)">';
+        html += esc(card.snippets.join('\\n'));
+        html += '</div>';
+      }
+      html += '</div>';
+    }
+    return html;
+  }
+
   function doSearch() {
     var q = document.getElementById('search-query').value.trim();
     if (!q) return;
-    var project = document.getElementById('search-project-filter').value;
+    var projects = getSelectedProjects();
     var type = document.getElementById('search-type-filter').value;
     var statusEl = document.getElementById('search-status');
     var resultsEl = document.getElementById('search-results');
     statusEl.textContent = 'Searching...';
     resultsEl.innerHTML = '';
 
-    var url = '/api/search?q=' + encodeURIComponent(q) + '&limit=20';
-    if (project) url += '&project=' + encodeURIComponent(project);
-    if (type) url += '&type=' + encodeURIComponent(type);
-
-    fetch(searchAuthUrl(url)).then(function(r) { return r.json(); }).then(function(data) {
-      if (!data.ok) {
-        statusEl.textContent = '';
-        resultsEl.innerHTML = '<div style="padding:24px;color:var(--muted);text-align:center">' + esc(data.error || 'Search failed') + '</div>';
-        return;
-      }
-      var lines = data.results || [];
-      if (!lines.length) {
-        statusEl.textContent = 'No results.';
-        resultsEl.innerHTML = '<div style="padding:40px;color:var(--muted);text-align:center">No results for \\u201c' + esc(q) + '\\u201d</div>';
-        return;
+    var fetches = [];
+    if (projects.length <= 1) {
+      var url = '/api/search?q=' + encodeURIComponent(q) + '&limit=20';
+      if (projects.length === 1) url += '&project=' + encodeURIComponent(projects[0]);
+      if (type) url += '&type=' + encodeURIComponent(type);
+      fetches.push(fetch(searchAuthUrl(url)).then(function(r) { return r.json(); }));
+    } else {
+      for (var pi = 0; pi < projects.length; pi++) {
+        (function(proj) {
+          var purl = '/api/search?q=' + encodeURIComponent(q) + '&limit=20&project=' + encodeURIComponent(proj);
+          if (type) purl += '&type=' + encodeURIComponent(type);
+          fetches.push(fetch(searchAuthUrl(purl)).then(function(r) { return r.json(); }));
+        })(projects[pi]);
       }
+    }
 
-      // Parse lines into result cards: lines starting with [ are headers, others are content
-      var cards = [];
-      var current = null;
-      for (var i = 0; i < lines.length; i++) {
-        var line = lines[i];
-        if (!line.trim()) continue;
-        if (line.startsWith('[') && line.indexOf(']') > 0) {
-          if (current) cards.push(current);
-          var bracket = line.indexOf(']');
-          var source = line.slice(1, bracket);
-          var meta = line.slice(bracket + 1).trim();
-          current = { source: source, meta: meta, snippets: [] };
-        } else if (line === '(keyword fallback)') {
-          // skip
-        } else if (current) {
-          current.snippets.push(line);
-        } else {
-          // orphan line, show as standalone
-          cards.push({ source: '', meta: '', snippets: [line] });
-        }
+    Promise.all(fetches).then(function(results) {
+      var allCards = [];
+      var hasError = false;
+      for (var ri = 0; ri < results.length; ri++) {
+        if (!results[ri].ok) { hasError = true; continue; }
+        var parsed = parseResults(results[ri].results || []);
+        allCards = allCards.concat(parsed);
       }
-      if (current) cards.push(current);
-
-      statusEl.textContent = cards.length + ' result(s)';
-      var html = '';
-      for (var c = 0; c < cards.length; c++) {
-        var card = cards[c];
-        html += '<div class="card" style="margin-bottom:8px">';
-        html += '<div class="card-header" style="padding:10px 14px">';
-        if (card.source) {
-          html += '<span style="font-weight:500;font-size:var(--text-sm)">' + esc(card.source) + '</span>';
-        }
-        if (card.meta) {
-          html += '<span class="text-muted" style="font-size:var(--text-xs);margin-left:8px">' + esc(card.meta) + '</span>';
-        }
-        html += '</div>';
-        if (card.snippets.length) {
-          html += '<div class="card-body" style="padding:10px 14px;font-size:var(--text-sm);white-space:pre-wrap;color:var(--ink-secondary)">';
-          html += esc(card.snippets.join('\\n'));
-          html += '</div>';
-        }
-        html += '</div>';
+      if (!allCards.length) {
+        statusEl.textContent = hasError ? 'Search error.' : 'No results.';
+        resultsEl.innerHTML = '<div style="padding:40px;color:var(--muted);text-align:center">' + (hasError ? 'Search failed' : 'No results for \\u201c' + esc(q) + '\\u201d') + '</div>';
+        return;
       }
-      resultsEl.innerHTML = html;
+      statusEl.textContent = allCards.length + ' result(s)';
+      resultsEl.innerHTML = renderCards(allCards);
     }).catch(function(err) {
       statusEl.textContent = '';
       resultsEl.innerHTML = '<div style="padding:24px;color:var(--muted);text-align:center">Search error: ' + esc(String(err)) + '</div>';
     });
   }
 
-  // Populate project filter
+  // Populate project filter dropdown
   function loadSearchProjects() {
     if (_searchProjectsLoaded) return;
     _searchProjectsLoaded = true;
     fetch(searchAuthUrl('/api/projects')).then(function(r) { return r.json(); }).then(function(data) {
       if (!data.ok) return;
-      var sel = document.getElementById('search-project-filter');
+      var dd = document.getElementById('search-project-dropdown');
+      if (!dd) return;
+      var html = '';
       (data.projects || []).forEach(function(p) {
-        var opt = document.createElement('option');
-        opt.value = p.name; opt.textContent = p.name;
-        sel.appendChild(opt);
+        html += '<label class="search-ms-item" style="display:flex;align-items:center;gap:8px;padding:6px 12px;cursor:pointer;font-size:var(--text-sm);white-space:nowrap"><input type="checkbox" value="' + esc(p.name) + '" style="accent-color:var(--accent);cursor:pointer" /><span>' + esc(p.name) + '</span></label>';
+      });
+      dd.innerHTML = html;
+      dd.querySelectorAll('input[type=checkbox]').forEach(function(cb) {
+        cb.addEventListener('change', function() { toggleProjectFilter(cb.value); });
       });
     }).catch(function() {});
   }
@@ -1454,13 +1591,9 @@ export function renderEventWiringScript() {
   // --- Review filters ---
   var reviewFilterProject = document.getElementById('review-filter-project');
   if (reviewFilterProject) reviewFilterProject.addEventListener('change', function() { filterReviewCards(); });
-  var reviewFilterMachine = document.getElementById('review-filter-machine');
-  if (reviewFilterMachine) reviewFilterMachine.addEventListener('change', function() { filterReviewCards(); });
-  var reviewFilterModel = document.getElementById('review-filter-model');
-  if (reviewFilterModel) reviewFilterModel.addEventListener('change', function() { filterReviewCards(); });
 
   var highlightBtn = document.getElementById('highlight-only-btn');
-  if (highlightBtn) highlightBtn.addEventListener('click', function() { toggleHighlightOnly(this); });
+  if (highlightBtn) highlightBtn.addEventListener('change', function() { filterReviewCards(); });
 
   // --- Graph controls ---
   var graphZoomIn = document.getElementById('graph-zoom-in');
@@ -1480,6 +1613,20 @@ export function renderEventWiringScript() {
   var sessionsFilterProject = document.getElementById('sessions-filter-project');
   if (sessionsFilterProject) sessionsFilterProject.addEventListener('change', function() { loadSessions(); });
 
+  // --- Mascot click animation ---
+  var mascotSvg = document.querySelector('.header-brand svg');
+  if (mascotSvg) {
+    mascotSvg.addEventListener('click', function() {
+      mascotSvg.classList.remove('popped');
+      void mascotSvg.offsetWidth;
+      mascotSvg.classList.add('popped');
+      mascotSvg.addEventListener('animationend', function handler() {
+        mascotSvg.classList.remove('popped');
+        mascotSvg.removeEventListener('animationend', handler);
+      });
+    });
+  }
+
   // --- Command palette ---
   var cmdpal = document.getElementById('cmdpal');
   if (cmdpal) cmdpal.addEventListener('click', function(e) { closeCmdPal(e); });

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

@@ -13,7 +13,7 @@ import { buildGraph, collectProjectsForUI, collectSkillsForUI, getHooksData, isA
 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, VALID_TASK_MODES } from "./governance-policy.js";
-import { updateProjectConfigOverrides } from "./project-config.js";
+import { readProjectConfig, updateProjectConfigOverrides } from "./project-config.js";
 import { findSkill } from "./skill-registry.js";
 import { setSkillEnabledAndSync } from "./skill-files.js";
 import { listAllSessions, getSessionArtifacts } from "./mcp-session.js";
@@ -803,8 +803,31 @@ export function createWebUiHttpServer(phrenPath, renderPage, profile, opts) {
             try {
                 const { runSearch } = await import("./cli-search.js");
                 const result = await runSearch({ query, limit: Math.min(searchLimit, 50), project: searchProject, type: searchType }, phrenPath, profile || "");
+                // Build file date map from source headers like [project/filename]
+                const fileDates = {};
+                for (const line of result.lines) {
+                    const srcMatch = line.match(/^\[([^\]]+)\]\s/);
+                    if (srcMatch) {
+                        const sourceKey = srcMatch[1];
+                        if (fileDates[sourceKey])
+                            continue;
+                        const slashIdx = sourceKey.indexOf("/");
+                        if (slashIdx > 0) {
+                            const proj = sourceKey.slice(0, slashIdx);
+                            const file = sourceKey.slice(slashIdx + 1);
+                            try {
+                                const filePath = path.join(phrenPath, proj, file);
+                                if (fs.existsSync(filePath)) {
+                                    const stat = fs.statSync(filePath);
+                                    fileDates[sourceKey] = stat.mtime.toISOString();
+                                }
+                            }
+                            catch { /* skip */ }
+                        }
+                    }
+                }
                 res.writeHead(200, { "content-type": "application/json; charset=utf-8" });
-                res.end(JSON.stringify({ ok: true, query, results: result.lines }));
+                res.end(JSON.stringify({ ok: true, query, results: result.lines, fileDates }));
             }
             catch (err) {
                 res.writeHead(200, { "content-type": "application/json; charset=utf-8" });
@@ -854,6 +877,7 @@ export function createWebUiHttpServer(phrenPath, renderPage, profile, opts) {
                                 githubUrl: item.githubUrl,
                                 context: item.context,
                                 checked: item.checked,
+                                sessionId: item.sessionId,
                             });
                         }
                     }
@@ -976,6 +1000,37 @@ export function createWebUiHttpServer(phrenPath, renderPage, profile, opts) {
                 const settingsProject = String(qs.project || "");
                 const merged = settingsProject && isValidProjectName(settingsProject) ? mergeConfig(phrenPath, settingsProject) : null;
                 const overrides = settingsProject && isValidProjectName(settingsProject) ? getProjectConfigOverrides(phrenPath, settingsProject) : null;
+                // Build project info when a specific project is selected
+                let projectInfo = null;
+                if (settingsProject && isValidProjectName(settingsProject)) {
+                    const projectDir = path.join(phrenPath, settingsProject);
+                    const configFile = path.join(projectDir, "phren.project.yaml");
+                    const projConfig = readProjectConfig(phrenPath, settingsProject);
+                    const findingsPath = path.join(projectDir, "FINDINGS.md");
+                    const taskPath = path.join(projectDir, "tasks.md");
+                    let findingCount = 0;
+                    if (fs.existsSync(findingsPath)) {
+                        findingCount = (fs.readFileSync(findingsPath, "utf8").match(/^- /gm) || []).length;
+                    }
+                    let taskCount = 0;
+                    if (fs.existsSync(taskPath)) {
+                        const queueMatch = fs.readFileSync(taskPath, "utf8").match(/## Queue[\s\S]*?(?=## |$)/);
+                        if (queueMatch)
+                            taskCount = (queueMatch[0].match(/^- /gm) || []).length;
+                    }
+                    projectInfo = {
+                        diskPath: projConfig.sourcePath || projectDir,
+                        ownership: projConfig.ownership || "default",
+                        configFile,
+                        configExists: fs.existsSync(configFile),
+                        hasFindings: fs.existsSync(findingsPath),
+                        hasTasks: fs.existsSync(taskPath),
+                        hasSummary: fs.existsSync(path.join(projectDir, "summary.md")),
+                        hasClaudeMd: fs.existsSync(path.join(projectDir, "CLAUDE.md")),
+                        findingCount,
+                        taskCount,
+                    };
+                }
                 res.writeHead(200, { "content-type": "application/json; charset=utf-8" });
                 res.end(JSON.stringify({
                     ok: true,
@@ -993,6 +1048,7 @@ export function createWebUiHttpServer(phrenPath, renderPage, profile, opts) {
                     workflowPolicy,
                     merged,
                     overrides,
+                    projectInfo,
                 }));
             }
             catch (err) {