@yemi33/minions 0.1.2037 → 0.1.2038

package/dashboard/js/refresh.js

@@ -84,6 +84,12 @@ const RENDER_VERSIONS = {
 const _sectionCache = {};
 const _lastValueByKey = {};
 const _sectionCacheVersions = {};
+// Refresh diagnostics: when refresh() opens a tick, it sets _lastChangedFlags
+// to a fresh object so every _changed() call publishes its boolean result
+// here. After _processStatusUpdate() returns, refresh() captures the map
+// into the ring-buffer entry then resets _lastChangedFlags to null so steady-
+// state has no side effect. See "Refresh diagnostics" block below.
+let _lastChangedFlags = null;
 function _changed(key, value, version) {
   var v = version == null ? (RENDER_VERSIONS[key] || 0) : version;
   // Drop the stale-version entry so the cache doesn't grow unbounded across bumps.
@@ -98,11 +104,18 @@ function _changed(key, value, version) {
   var cacheKey = key + ':v' + v;
   // Reference-equality short-circuit: skip the stringify entirely when the
   // server returned 304 and the same object reference is being re-checked.
-  if (_lastValueByKey[key] === value) return false;
+  if (_lastValueByKey[key] === value) {
+    if (_lastChangedFlags) _lastChangedFlags[key] = false;
+    return false;
+  }
   _lastValueByKey[key] = value;
   var json = JSON.stringify(value);
-  if (_sectionCache[cacheKey] === json) return false;
+  if (_sectionCache[cacheKey] === json) {
+    if (_lastChangedFlags) _lastChangedFlags[key] = false;
+    return false;
+  }
   _sectionCache[cacheKey] = json;
+  if (_lastChangedFlags) _lastChangedFlags[key] = true;
   return true;
 }
 
@@ -320,9 +333,78 @@ let _lastStatusData = null;
 // when the first hasn't finished — the next interval fire picks up the
 // fresh state anyway.
 let _refreshInFlight = false;
+
+// ── Refresh diagnostics (W-mphejzx100081972) ─────────────────────────────
+// Ring buffer capturing the last 50 /api/status poll cycles so a user
+// reporting "the dashboard didn't auto-update when X changed" can paste
+// `window._refreshDiagnostics()` from devtools or click the "diag" footer
+// chip to surface a table. Gated behind feature flag
+// `dashboard-refresh-diagnostics` (engine/features.js) — disabled in
+// production, enabled in dev. When disabled, the helpers below are no-ops
+// (the boolean check is the first line of every collection path) so the
+// steady-state poll loop is byte-identical to its pre-flag behaviour.
+const _DIAG_RING_SIZE = 50;
+const _refreshDiagBuf = [];
+let _prevRefreshTs = 0;
+let _diagHiddenSinceMs = 0; // ts when tab last went hidden; 0 when visible
+let _lastVisibilityChangeAt = 0;
+function _isRefreshDiagOn() {
+  try {
+    return !!(window.MinionsFeatures && window.MinionsFeatures.isOn('dashboard-refresh-diagnostics'));
+  } catch { return false; }
+}
+function _pushDiagEntry(entry) {
+  _refreshDiagBuf.push(entry);
+  if (_refreshDiagBuf.length > _DIAG_RING_SIZE) _refreshDiagBuf.shift();
+}
+// Expose a copy of the ring buffer so devtools paste-back captures a
+// stable snapshot — not a live reference the user could accidentally mutate.
+window._refreshDiagnostics = function() { return _refreshDiagBuf.slice(); };
+window._refreshDiagnosticsClear = function() { _refreshDiagBuf.length = 0; };
+document.addEventListener('visibilitychange', function() {
+  if (!_isRefreshDiagOn()) return;
+  const now = Date.now();
+  const vs = document.visibilityState;
+  let hiddenForMs = null;
+  if (vs === 'visible' && _diagHiddenSinceMs > 0) {
+    hiddenForMs = now - _diagHiddenSinceMs;
+    _diagHiddenSinceMs = 0;
+  } else if (vs === 'hidden') {
+    _diagHiddenSinceMs = now;
+  }
+  _pushDiagEntry({
+    ts: now,
+    kind: 'visibility',
+    visibility: vs,
+    hidden_for_ms: hiddenForMs,
+    gap_since_prev_ms: _lastVisibilityChangeAt ? now - _lastVisibilityChangeAt : null,
+  });
+  _lastVisibilityChangeAt = now;
+});
+
 async function refresh() {
   if (_refreshInFlight) return;
   _refreshInFlight = true;
+  const _diagOn = _isRefreshDiagOn();
+  const _t0 = _diagOn ? Date.now() : 0;
+  const _gap = _diagOn && _prevRefreshTs ? _t0 - _prevRefreshTs : null;
+  if (_diagOn) _prevRefreshTs = _t0;
+  const _diagEntry = _diagOn ? {
+    ts: _t0,
+    kind: 'refresh',
+    gap_since_prev_ms: _gap,
+    visibility: (typeof document !== 'undefined' && document.visibilityState) || null,
+    response_status: null,
+    etag_sent: _lastStatusEtag,
+    etag_received: null,
+    bytes_received: null,
+    statusCacheVersion: null,
+    workItems_changed: null,
+    workItems_count: null,
+    changed: null,
+    render_duration_ms: null,
+    error_message: null,
+  } : null;
   try {
     const headers = {};
     if (_lastStatusEtag) headers['If-None-Match'] = _lastStatusEtag;
@@ -331,6 +413,10 @@ async function refresh() {
     if (res.status === 304 && _lastStatusData) {
       // Cache hit — reuse last payload, skip parsing entirely.
       data = _lastStatusData;
+      if (_diagEntry) {
+        _diagEntry.response_status = '304';
+        _diagEntry.bytes_received = 0;
+      }
     } else {
       data = await res.json();
       const etag = res.headers && (res.headers.get ? res.headers.get('etag') : null);
@@ -338,6 +424,12 @@ async function refresh() {
         _lastStatusEtag = etag;
         _lastStatusData = data;
       }
+      if (_diagEntry) {
+        _diagEntry.response_status = String(res.status);
+        _diagEntry.etag_received = etag || null;
+        const cl = res.headers && (res.headers.get ? res.headers.get('content-length') : null);
+        _diagEntry.bytes_received = cl != null && cl !== '' ? Number(cl) : null;
+      }
     }
     // Auto-reload when dashboard restarts (stale connections cause "Failed to fetch" on CC/doc-chat)
     const dashId = (data.version && data.version.dashboardStartedAt) || null;
@@ -357,9 +449,37 @@ async function refresh() {
       return;
     }
     if (buildId) _knownDashboardBuildId = buildId;
-    _processStatusUpdate(data);
-  } catch(e) { console.error('refresh error', e); }
-  finally { _refreshInFlight = false; }
+    const _renderStart = _diagOn ? Date.now() : 0;
+    let _diagChanges = null;
+    if (_diagOn) {
+      _diagChanges = {};
+      _lastChangedFlags = _diagChanges;
+    }
+    try {
+      _processStatusUpdate(data);
+    } finally {
+      if (_diagOn) {
+        _lastChangedFlags = null;
+        _diagEntry.render_duration_ms = Date.now() - _renderStart;
+        _diagEntry.changed = _diagChanges;
+        _diagEntry.workItems_changed = !!(_diagChanges && _diagChanges.workItems);
+        _diagEntry.workItems_count = (data.workItems || []).length;
+        _diagEntry.statusCacheVersion = (data.version && data.version.statusCacheVersion) != null
+          ? data.version.statusCacheVersion
+          : null;
+      }
+    }
+  } catch(e) {
+    console.error('refresh error', e);
+    if (_diagEntry && !_diagEntry.response_status) {
+      _diagEntry.response_status = (e && e.name === 'AbortError') ? 'abort' : 'error';
+      _diagEntry.error_message = String((e && e.message) || e);
+    }
+  }
+  finally {
+    _refreshInFlight = false;
+    if (_diagEntry) _pushDiagEntry(_diagEntry);
+  }
 }
 
 refresh();
@@ -375,3 +495,134 @@ document.querySelectorAll('.sidebar-link').forEach(link => {
 switchPage(currentPage);
 
 window.MinionsRefresh = { refresh };
+
+// ── Refresh-diagnostic footer chip + modal (W-mphejzx100081972) ───────────
+// Injected only when the dashboard-refresh-diagnostics feature flag is on
+// (engine/features.js → MINIONS_FEATURES.flags). The chip floats bottom-right
+// and opens a simple table view of the ring buffer plus a "send to engine"
+// button that POSTs the snapshot to /api/diagnostics/refresh. No DOM is
+// touched (and no listeners installed beyond the visibilitychange handler
+// above, which itself short-circuits when the flag is off) when the flag is
+// disabled — production behaviour stays untouched.
+(function installRefreshDiagChip() {
+  if (!_isRefreshDiagOn()) return;
+  try {
+    const chip = document.createElement('button');
+    chip.id = 'refresh-diag-chip';
+    chip.type = 'button';
+    chip.textContent = 'diag';
+    chip.title = 'Open dashboard refresh diagnostics';
+    chip.style.cssText = 'position:fixed;right:12px;bottom:12px;z-index:9999;background:var(--surface,#222);color:var(--muted,#aaa);border:1px solid var(--border,#444);border-radius:10px;padding:3px 8px;font-size:10px;font-family:inherit;cursor:pointer;opacity:0.75';
+    chip.addEventListener('click', _openRefreshDiagModal);
+    document.body.appendChild(chip);
+  } catch { /* DOM may not be ready in unusual test embeds */ }
+})();
+
+function _openRefreshDiagModal() {
+  // Remove any prior instance so re-clicks re-render against the latest buffer.
+  const prior = document.getElementById('refresh-diag-modal');
+  if (prior) prior.remove();
+  const entries = window._refreshDiagnostics();
+  const overlay = document.createElement('div');
+  overlay.id = 'refresh-diag-modal';
+  overlay.style.cssText = 'position:fixed;inset:0;background:rgba(0,0,0,0.5);z-index:10000;display:flex;align-items:center;justify-content:center;padding:24px';
+  overlay.addEventListener('click', function(e) { if (e.target === overlay) overlay.remove(); });
+  const panel = document.createElement('div');
+  panel.style.cssText = 'background:var(--surface,#1c1c1c);color:var(--text,#ddd);border:1px solid var(--border,#444);border-radius:8px;max-width:1200px;max-height:80vh;width:100%;display:flex;flex-direction:column;overflow:hidden;font-family:inherit;font-size:11px';
+  const head = document.createElement('div');
+  head.style.cssText = 'padding:10px 14px;border-bottom:1px solid var(--border,#444);display:flex;align-items:center;justify-content:space-between;gap:8px';
+  const title = document.createElement('div');
+  title.style.cssText = 'font-weight:700;color:var(--blue,#58a6ff);font-size:13px';
+  title.textContent = 'Refresh diagnostics — ' + entries.length + ' / ' + _DIAG_RING_SIZE + ' entries';
+  const actions = document.createElement('div');
+  actions.style.cssText = 'display:flex;gap:6px';
+  const sendBtn = document.createElement('button');
+  sendBtn.type = 'button';
+  sendBtn.textContent = 'Send to engine';
+  sendBtn.style.cssText = 'background:var(--blue,#1f6feb);color:#fff;border:none;border-radius:4px;padding:4px 10px;font-size:11px;cursor:pointer';
+  sendBtn.addEventListener('click', function() {
+    sendBtn.disabled = true;
+    sendBtn.textContent = 'Sending…';
+    safeFetch('/api/diagnostics/refresh', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ entries: window._refreshDiagnostics() }),
+    })
+      .then(function(r) { return r.json().catch(function() { return {}; }).then(function(j) { return { ok: r.ok, body: j }; }); })
+      .then(function(r) {
+        sendBtn.textContent = r.ok ? ('Sent (' + (r.body && r.body.written) + ')') : ('Failed: ' + (r.body && r.body.error || r.ok));
+      })
+      .catch(function(e) { sendBtn.textContent = 'Error: ' + (e && e.message || e); })
+      .finally(function() { setTimeout(function() { sendBtn.disabled = false; sendBtn.textContent = 'Send to engine'; }, 2500); });
+  });
+  const clearBtn = document.createElement('button');
+  clearBtn.type = 'button';
+  clearBtn.textContent = 'Clear';
+  clearBtn.style.cssText = 'background:none;color:var(--muted,#aaa);border:1px solid var(--border,#444);border-radius:4px;padding:4px 10px;font-size:11px;cursor:pointer';
+  clearBtn.addEventListener('click', function() { window._refreshDiagnosticsClear(); overlay.remove(); });
+  const closeBtn = document.createElement('button');
+  closeBtn.type = 'button';
+  closeBtn.textContent = 'Close';
+  closeBtn.style.cssText = 'background:none;color:var(--muted,#aaa);border:1px solid var(--border,#444);border-radius:4px;padding:4px 10px;font-size:11px;cursor:pointer';
+  closeBtn.addEventListener('click', function() { overlay.remove(); });
+  actions.appendChild(sendBtn);
+  actions.appendChild(clearBtn);
+  actions.appendChild(closeBtn);
+  head.appendChild(title);
+  head.appendChild(actions);
+  const body = document.createElement('div');
+  body.style.cssText = 'overflow:auto;padding:8px 14px';
+  body.appendChild(_renderRefreshDiagTable(entries));
+  panel.appendChild(head);
+  panel.appendChild(body);
+  overlay.appendChild(panel);
+  document.body.appendChild(overlay);
+}
+
+function _renderRefreshDiagTable(entries) {
+  const table = document.createElement('table');
+  table.style.cssText = 'width:100%;border-collapse:collapse;font-family:monospace;font-size:11px';
+  const cols = ['ts', 'kind', 'gap', 'vis', 'status', 'etag↓', 'bytes', 'cacheV', 'wi', 'wiΔ', 'changed', 'render(ms)', 'note'];
+  const thead = document.createElement('thead');
+  const trh = document.createElement('tr');
+  for (const c of cols) {
+    const th = document.createElement('th');
+    th.textContent = c;
+    th.style.cssText = 'text-align:left;padding:3px 6px;border-bottom:1px solid var(--border,#444);color:var(--muted,#aaa);font-weight:600';
+    trh.appendChild(th);
+  }
+  thead.appendChild(trh);
+  table.appendChild(thead);
+  const tbody = document.createElement('tbody');
+  for (let i = entries.length - 1; i >= 0; i--) {
+    const e = entries[i];
+    const tr = document.createElement('tr');
+    const changedKeys = e.changed ? Object.keys(e.changed).filter(function(k) { return e.changed[k]; }) : [];
+    const isVis = e.kind === 'visibility';
+    const cells = [
+      new Date(e.ts).toLocaleTimeString(),
+      e.kind || 'refresh',
+      e.gap_since_prev_ms != null ? e.gap_since_prev_ms + 'ms' : '',
+      e.visibility || '',
+      isVis ? (e.hidden_for_ms != null ? 'hidden ' + e.hidden_for_ms + 'ms' : '—') : (e.response_status || ''),
+      e.etag_received ? String(e.etag_received).slice(0, 12) + '…' : '',
+      e.bytes_received != null ? e.bytes_received : '',
+      e.statusCacheVersion != null ? e.statusCacheVersion : '',
+      e.workItems_count != null ? e.workItems_count : '',
+      e.workItems_changed === true ? '✓' : (e.workItems_changed === false ? '' : ''),
+      changedKeys.join(',') || '',
+      e.render_duration_ms != null ? e.render_duration_ms : '',
+      e.error_message || '',
+    ];
+    for (const v of cells) {
+      const td = document.createElement('td');
+      td.textContent = String(v);
+      td.style.cssText = 'padding:3px 6px;border-bottom:1px solid rgba(255,255,255,0.05);vertical-align:top';
+      tr.appendChild(td);
+    }
+    if (isVis) tr.style.background = 'rgba(63,185,80,0.05)';
+    tbody.appendChild(tr);
+  }
+  table.appendChild(tbody);
+  return table;
+}

package/dashboard/js/render-work-items.js

@@ -82,8 +82,20 @@ function wiRow(item) {
     '<td>' + prLink + '</td>' +
     '<td><span class="pr-date">' + escapeHtml((item.created || '').slice(0, 16).replace('T', ' ')) + '</span></td>' +
     '<td style="white-space:nowrap;font-size:9px;color:var(--muted)">' +
-      (item.references && item.references.length ? '<span title="' + item.references.length + ' reference(s)" style="margin-right:4px">&#x1F517;' + item.references.length + '</span>' : '') +
-      (item.acceptanceCriteria && item.acceptanceCriteria.length ? '<span title="' + item.acceptanceCriteria.length + ' acceptance criteria">&#x2611;' + item.acceptanceCriteria.length + '</span>' : '') +
+      (function() {
+        // /api/status slims the full arrays into integer counts
+        // (dashboard.js:1796-1797: referencesCount / acceptanceCriteriaCount).
+        // Read those first; fall back to the array length for callers that
+        // still pass the full record (e.g. legacy fixtures, hydrated detail).
+        var refCount = (typeof item.referencesCount === 'number')
+          ? item.referencesCount
+          : (Array.isArray(item.references) ? item.references.length : 0);
+        var acCount = (typeof item.acceptanceCriteriaCount === 'number')
+          ? item.acceptanceCriteriaCount
+          : (Array.isArray(item.acceptanceCriteria) ? item.acceptanceCriteria.length : 0);
+        return (refCount ? '<span title="' + refCount + ' reference(s)" style="margin-right:4px">&#x1F517;' + refCount + '</span>' : '') +
+               (acCount ? '<span title="' + acCount + ' acceptance criteria">&#x2611;' + acCount + '</span>' : '');
+      })() +
     '</td>' +
     '<td style="white-space:nowrap">' +
       ((item.status === 'pending' || item.status === 'failed') ? '<button class="pr-pager-btn" style="font-size:9px;padding:1px 6px;color:var(--blue);border-color:var(--blue);margin-right:4px" onclick="event.stopPropagation();editWorkItem(\'' + escapeHtml(item.id) + '\',\'' + escapeHtml(item._source || '') + '\')" title="Edit work item">&#x270E;</button>' : '') +
@@ -144,9 +156,42 @@ function renderWorkItems(items) {
   }
 }
 
-function editWorkItem(id, source) {
-  const item = allWorkItems.find(i => i.id === id);
-  if (!item) return;
+async function editWorkItem(id, source) {
+  const cached = allWorkItems.find(i => i.id === id);
+  if (!cached) return;
+  // Hydrate the full record before rendering the form. The /api/status slice
+  // strips `description`, `references`, and `acceptanceCriteria` (replacing
+  // the arrays with referencesCount / acceptanceCriteriaCount integers — see
+  // dashboard.js:1796-1797). Without hydration the textareas would pre-fill
+  // with empty values, and Save would POST description='', references=[],
+  // acceptanceCriteria=[] back to handleWorkItemsUpdate, which treats those
+  // as defined (dashboard.js:5157, :5164-5165) and silently wipes the stored
+  // values: data-loss on every pencil-edit of a pending/failed WI.
+  // See PR #2816 review feedback.
+  let item = cached;
+  const needsHydration = !cached.description ||
+    (cached.acceptanceCriteriaCount > 0 && !Array.isArray(cached.acceptanceCriteria)) ||
+    (cached.referencesCount > 0 && !Array.isArray(cached.references));
+  if (needsHydration) {
+    try {
+      const r = await fetch('/api/work-items/' + encodeURIComponent(id));
+      if (!r.ok) throw new Error('HTTP ' + r.status);
+      const data = await r.json();
+      const full = data && data.item;
+      if (!full) throw new Error('no item in response');
+      // Cached cross-slice fields (_pr, _source, _artifacts, _pendingReason,
+      // etc.) WIN over the on-disk record — they only exist on the engine's
+      // in-memory enrichment pass. The full record contributes description,
+      // acceptanceCriteria, and references back.
+      item = Object.assign({}, full, cached);
+      if (full.description != null) item.description = full.description;
+      if (Array.isArray(full.acceptanceCriteria)) item.acceptanceCriteria = full.acceptanceCriteria;
+      if (Array.isArray(full.references)) item.references = full.references;
+    } catch (e) {
+      alert('Failed to load work item for editing: ' + (e && e.message ? e.message : e) + '. Refusing to open the edit form with empty fields — saving would wipe the stored values.');
+      return;
+    }
+  }
   const types = ['implement', 'fix', 'review', 'plan', 'verify', 'decompose', 'meeting', 'investigate', 'refactor', 'test', 'explore', 'ask', 'docs', 'setup'];
   const priorities = ['critical', 'high', 'medium', 'low'];
   const agentOpts = (cmdAgents || []).map(a => '<option value="' + escapeHtml(a.id) + '"' + (item.agent === a.id ? ' selected' : '') + '>' + escapeHtml(a.name) + '</option>').join('');
@@ -467,11 +512,7 @@ async function _submitCreateWorkItem(e) {
   } catch (e) { alert('Error: ' + e.message); openCreateWorkItemModal(); }
 }
 
-function openWorkItemDetail(id) {
-  if (window.getSelection && window.getSelection().toString().length > 0) return;
-  const item = allWorkItems.find(i => i.id === id);
-  if (!item) return;
-
+function _wiRenderDetail(item) {
   const field = (label, value) => value ? '<div style="margin-bottom:8px"><span style="color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:0.5px">' + label + '</span><div style="margin-top:2px">' + value + '</div></div>' : '';
   const badge = (cls, text) => '<span class="pr-badge ' + cls + '">' + escapeHtml(text) + '</span>';
   const statusCls = item.status === 'failed' ? 'rejected' : item.status === 'dispatched' ? 'building' : item.status === 'done' ? 'approved' : 'active';
@@ -483,7 +524,20 @@ function openWorkItemDetail(id) {
     '<span class="dispatch-type ' + (item.type || 'implement') + '">' + escapeHtml(item.type || 'implement') + '</span>' +
     '<span class="prd-item-priority ' + (item.priority || '') + '">' + escapeHtml(item.priority || 'medium') + '</span>' +
     '</div>';
-  html += field('Description', '<div style="font-size:12px;max-height:320px;overflow-y:auto;padding:8px 10px;background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius-sm)">' + renderMd(item.description || item.title || '—') + '</div>');
+  // Description: rendered from the FULL record once it's hydrated. The /api/status
+  // slice drops `description` to keep the SPA payload <500KB; on first paint we
+  // either render the title as a placeholder or, when description is already
+  // present (legacy/full record), render it directly. The hydration pass below
+  // re-renders this section in place once the fetch lands.
+  var _descHtml;
+  if (item.description) {
+    _descHtml = renderMd(item.description);
+  } else if (item._descriptionLoading) {
+    _descHtml = '<span style="color:var(--muted)">Loading description…</span>';
+  } else {
+    _descHtml = escapeHtml(item.title || '—');
+  }
+  html += field('Description', '<div id="wi-detail-desc" style="font-size:12px;max-height:320px;overflow-y:auto;padding:8px 10px;background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius-sm)">' + _descHtml + '</div>');
   html += field('Agent', escapeHtml(item.dispatched_to || item.agent || 'Auto'));
   html += field('Source', escapeHtml(item._source || 'central'));
   if (item.created) html += field('Created', escapeHtml(formatLocalDateTime(item.created)));
@@ -522,9 +576,19 @@ function openWorkItemDetail(id) {
     : (typeof item.acceptanceCriteria === 'string' && item.acceptanceCriteria.trim()
         ? item.acceptanceCriteria.split(/\r?\n/).map(s => s.trim()).filter(Boolean)
         : []);
-  if (ac.length) html += field('Acceptance Criteria', '<ul style="margin:0;padding-left:20px">' + ac.map(c => '<li>' + escapeHtml(c) + '</li>').join('') + '</ul>');
+  if (ac.length) {
+    html += field('Acceptance Criteria', '<ul style="margin:0;padding-left:20px">' + ac.map(c => '<li>' + escapeHtml(c) + '</li>').join('') + '</ul>');
+  } else if (item.acceptanceCriteriaCount > 0) {
+    // Count-only marker from the slim /api/status slice; full list arrives
+    // on the next hydration pass (or is already loading).
+    html += field('Acceptance Criteria', '<span style="color:var(--muted)">' + item.acceptanceCriteriaCount + ' criteria — loading…</span>');
+  }
   var refs = Array.isArray(item.references) ? item.references.filter(r => r && typeof r === 'object' && r.url) : [];
-  if (refs.length) html += field('References', refs.map(r => '<a href="' + escapeHtml(r.url) + '" target="_blank" style="color:var(--blue)">' + escapeHtml(r.title || r.url) + '</a>' + (r.type ? ' <span style="color:var(--muted);font-size:10px">(' + escapeHtml(r.type) + ')</span>' : '')).join('<br>'));
+  if (refs.length) {
+    html += field('References', refs.map(r => '<a href="' + escapeHtml(r.url) + '" target="_blank" style="color:var(--blue)">' + escapeHtml(r.title || r.url) + '</a>' + (r.type ? ' <span style="color:var(--muted);font-size:10px">(' + escapeHtml(r.type) + ')</span>' : '')).join('<br>'));
+  } else if (item.referencesCount > 0) {
+    html += field('References', '<span style="color:var(--muted)">' + item.referencesCount + ' reference(s) — loading…</span>');
+  }
   if (item._humanFeedback) html += field('Human Feedback', (item._humanFeedback.rating === 'up' ? '👍' : '👎') + (item._humanFeedback.comment ? ' — ' + escapeHtml(item._humanFeedback.comment) : ''));
   if (item._pr) html += field('Pull Request', '<a href="' + escapeHtml(item._prUrl || '#') + '" target="_blank" style="color:var(--blue)">' + escapeHtml(item._pr) + '</a>');
 
@@ -562,12 +626,55 @@ function openWorkItemDetail(id) {
   if (item._totalInputTokens) html += field('Total Input Tokens', Number(item._totalInputTokens).toLocaleString());
   if (item._totalOutputTokens) html += field('Total Output Tokens', Number(item._totalOutputTokens).toLocaleString());
   html += '</div>';
+  return html;
+}
 
-  document.getElementById('modal-title').textContent = item.title || item.id;
-  document.getElementById('modal-body').innerHTML = html;
+function openWorkItemDetail(id) {
+  if (window.getSelection && window.getSelection().toString().length > 0) return;
+  const cached = allWorkItems.find(i => i.id === id);
+  if (!cached) return;
+
+  // Render the modal immediately from the cached (slim) record so the click
+  // feels instant. The /api/status slice is the source of badges, status,
+  // PR link, artifacts, etc. — everything except the heavy free-text fields
+  // (description, full acceptanceCriteria, full references) — see
+  // W-mphejzmj000718bf. We then hydrate the missing fields from
+  // GET /api/work-items/<id> and re-render in place.
+  const needsHydration = !cached.description ||
+    (cached.acceptanceCriteriaCount > 0 && !Array.isArray(cached.acceptanceCriteria)) ||
+    (cached.referencesCount > 0 && !Array.isArray(cached.references));
+
+  const initial = needsHydration ? Object.assign({}, cached, { _descriptionLoading: true }) : cached;
+  document.getElementById('modal-title').textContent = initial.title || initial.id;
+  document.getElementById('modal-body').innerHTML = _wiRenderDetail(initial);
   document.getElementById('modal-body').style.fontFamily = "'Segoe UI', system-ui, sans-serif";
   document.getElementById('modal-body').style.whiteSpace = 'normal';
   document.getElementById('modal').classList.add('open');
+
+  if (!needsHydration) return;
+
+  fetch('/api/work-items/' + encodeURIComponent(id))
+    .then(function(r) { if (!r.ok) throw new Error('HTTP ' + r.status); return r.json(); })
+    .then(function(data) {
+      // Guard against modal navigation away from this WI during the fetch.
+      var title = document.getElementById('modal-title');
+      if (!title || title.textContent !== (initial.title || initial.id)) return;
+      var full = data && data.item;
+      if (!full) return;
+      // Merge: cached cross-slice fields (_pr, _artifacts, etc.) WIN over
+      // the on-disk record so we don't lose engine enrichment that lives
+      // only on the in-memory pass. The full record contributes description,
+      // acceptanceCriteria, and references back to the rendered shape.
+      var merged = Object.assign({}, full, cached);
+      merged.description = full.description || cached.description || '';
+      if (Array.isArray(full.acceptanceCriteria)) merged.acceptanceCriteria = full.acceptanceCriteria;
+      if (Array.isArray(full.references)) merged.references = full.references;
+      document.getElementById('modal-body').innerHTML = _wiRenderDetail(merged);
+    })
+    .catch(function() {
+      var desc = document.getElementById('wi-detail-desc');
+      if (desc) desc.innerHTML = '<span style="color:var(--red)">Failed to load full record.</span>';
+    });
 }
 
 function openAllWorkItems() {

package/dashboard/js/settings.js

@@ -88,6 +88,7 @@ async function openSettings() {
       settingsField('Restart Grace Period', 'set-restartGracePeriod', e.restartGracePeriod || 1200000, 'ms', 'Grace period before orphan detection on restart') +
       settingsField('Meeting Round Timeout', 'set-meetingRoundTimeout', e.meetingRoundTimeout || 900000, 'ms', 'Auto-advance meeting round after this') +
       settingsField('Operator login (used in branch names)', 'set-operatorLogin', e.operatorLogin || '', '', 'Override the human operator login used in user/<loginname>/<wi-id>-<slug> branches. Empty = auto-resolve via gh / git email / OS username (currently resolves to: ' + (e._resolvedOperatorLogin || 'unknown') + ')') +
+      settingsField('Status WorkItems Retention', 'set-statusWorkItemsRetentionDays', e.statusWorkItemsRetentionDays ?? 7, 'days', 'Trim done/failed/cancelled work items older than N days from the /api/status workItems slice (active items are always shipped). Cuts SPA payload from ~3MB to <500KB. Set to 0 to disable trimming (full list shipped, restoring legacy behavior).') +
     '</div>' +
     '<h3 style="font-size:13px;color:var(--blue);margin-bottom:8px">Automation</h3>' +
     '<div style="display:flex;flex-direction:column;gap:6px;margin-bottom:16px">' +
@@ -597,6 +598,7 @@ async function saveSettings() {
       restartGracePeriod: document.getElementById('set-restartGracePeriod').value,
       meetingRoundTimeout: document.getElementById('set-meetingRoundTimeout').value,
       operatorLogin: (document.getElementById('set-operatorLogin')?.value ?? '').trim(),
+      statusWorkItemsRetentionDays: document.getElementById('set-statusWorkItemsRetentionDays').value,
       autoApprovePlans: document.getElementById('set-autoApprovePlans').checked,
       evalLoop: document.getElementById('set-evalLoop').checked,
       autoDecompose: document.getElementById('set-autoDecompose').checked,

package/dashboard.js

@@ -1708,7 +1708,7 @@ function _buildStatusFastState() {
     dispatch: getDispatchQueue(),
     engineLog: getEngineLog(),
     metrics: getMetrics(),
-    workItems: getWorkItems(),
+    workItems: _slimWorkItemsForStatus(getWorkItems()),
     watches: watchesMod.getWatches(),
     meetings: _safeStatusSlice('meetings', () => meetingMod.getMeetings(), []),
     // QA runs — surfaced for the sidebar activity-dot counter and any future
@@ -1745,6 +1745,105 @@ function _safeStatusSlice(name, fn, fallback) {
   }
 }
 
+// ── /api/status workItems slimming (W-mphejzmj000718bf) ─────────────────────
+// Strip down the workItems slice shipped on /api/status to (a) drop terminal
+// (done/failed/cancelled) items older than engine.statusWorkItemsRetentionDays
+// and (b) project each surviving item onto a narrow shape that omits the
+// large free-text fields (description, full acceptanceCriteria, full
+// references). The dashboard never renders description/AC/references-detail
+// off the cached slice — `wiRow` only needs counts + status/badge fields,
+// and `openWorkItemDetail` fetches the full record on demand via
+// GET /api/work-items/<id>. Live measurement at task time: 796 items / ~3MB
+// → ~50–100 items / <500KB typical. Active items (pending/dispatched/queued)
+// are ALWAYS kept regardless of age.
+//
+// Set engine.statusWorkItemsRetentionDays = 0 to disable trimming entirely
+// (returns the full list unchanged, restoring legacy behavior).
+const _ACTIVE_WI_STATUSES_FOR_STATUS = new Set(['pending', 'dispatched', 'queued', 'paused', 'decomposed']);
+const _TERMINAL_WI_STATUSES_FOR_STATUS = new Set(['done', 'failed', 'cancelled']);
+function _resolveStatusWorkItemsRetentionDays() {
+  const raw = CONFIG?.engine?.statusWorkItemsRetentionDays;
+  if (raw === 0 || raw === '0') return 0;
+  const n = Number(raw);
+  if (Number.isFinite(n) && n >= 0) return n;
+  return shared.ENGINE_DEFAULTS.statusWorkItemsRetentionDays;
+}
+function _slimWorkItemForStatus(item) {
+  const slim = {
+    id: item.id,
+    title: item.title,
+    status: item.status,
+    type: item.type,
+    priority: item.priority,
+    _source: item._source,
+    created: item.created,
+  };
+  if (item.dispatched_to !== undefined) slim.dispatched_to = item.dispatched_to;
+  if (item.agent !== undefined) slim.agent = item.agent;
+  if (item._pr !== undefined) slim._pr = item._pr;
+  if (item._prUrl !== undefined) slim._prUrl = item._prUrl;
+  if (item._skipReason !== undefined) slim._skipReason = item._skipReason;
+  if (item._blockedBy !== undefined) slim._blockedBy = item._blockedBy;
+  if (item._humanFeedback !== undefined) slim._humanFeedback = item._humanFeedback;
+  if (Array.isArray(item.completedAgents)) slim.completedAgents = item.completedAgents;
+  if (item.failReason !== undefined) slim.failReason = item.failReason;
+  if (item.branchStrategy !== undefined) slim.branchStrategy = item.branchStrategy;
+  if (item.scope !== undefined) slim.scope = item.scope;
+  if (item.completedAt !== undefined) slim.completedAt = item.completedAt;
+  if (item.dispatched_at !== undefined) slim.dispatched_at = item.dispatched_at;
+  if (item._reopened !== undefined) slim._reopened = item._reopened;
+  if (item._pendingReason !== undefined) slim._pendingReason = item._pendingReason;
+  if (item._managedSpawnPartial !== undefined) slim._managedSpawnPartial = item._managedSpawnPartial;
+  if (item._securityFlag !== undefined) slim._securityFlag = item._securityFlag;
+  if (item._artifacts !== undefined) slim._artifacts = item._artifacts;
+  // Cross-slice fields read by derivePlanStatus / render-prd / refresh.js
+  // (sourcePlan, planFile, itemType, project, parent_id). Without these the
+  // plan-status derivation and decomposed-children rollup regress.
+  if (item.sourcePlan !== undefined) slim.sourcePlan = item.sourcePlan;
+  if (item.planFile !== undefined) slim.planFile = item.planFile;
+  if (item.itemType !== undefined) slim.itemType = item.itemType;
+  if (item.project !== undefined) slim.project = item.project;
+  if (item.parent_id !== undefined) slim.parent_id = item.parent_id;
+  // PR follow-up subobject is small and drives the +N chip + row badge.
+  if (item.meta && item.meta.pr_followup) slim.meta = { pr_followup: item.meta.pr_followup };
+  // Counts only — the modal fetches full arrays on demand via /api/work-items/<id>.
+  slim.referencesCount = Array.isArray(item.references) ? item.references.length : 0;
+  slim.acceptanceCriteriaCount = Array.isArray(item.acceptanceCriteria) ? item.acceptanceCriteria.length : 0;
+  return slim;
+}
+function _slimWorkItemsForStatus(items) {
+  if (!Array.isArray(items)) return items;
+  const retentionDays = _resolveStatusWorkItemsRetentionDays();
+  if (retentionDays <= 0) {
+    // Trimming disabled — keep full list but still flatten via slim shape
+    // so wire format is consistent (renderers never have to handle the old
+    // heavy fields). Set retentionDays to a huge value if you want EVERY
+    // terminal item, not just recent ones — 0 means "skip the date filter".
+    return items.map(_slimWorkItemForStatus);
+  }
+  const cutoffMs = Date.now() - retentionDays * 24 * 60 * 60 * 1000;
+  const surviving = [];
+  for (const item of items) {
+    if (!item) continue;
+    const status = item.status || 'pending';
+    if (_TERMINAL_WI_STATUSES_FOR_STATUS.has(status)) {
+      const ts = item.completedAt || item.dispatched_at || item.created || '';
+      const tsMs = ts ? Date.parse(ts) : NaN;
+      // Drop only when we have a parseable timestamp and it's beyond the
+      // window. Items with missing/unparseable timestamps stay visible —
+      // we'd rather over-include than silently hide them.
+      if (Number.isFinite(tsMs) && tsMs < cutoffMs) {
+        continue;
+      }
+    } else if (!_ACTIVE_WI_STATUSES_FOR_STATUS.has(status)) {
+      // Unknown status — keep, so a future status value isn't silently
+      // hidden until the constant set is updated.
+    }
+    surviving.push(_slimWorkItemForStatus(item));
+  }
+  return surviving;
+}
+
 // Build the slow-state slice (rarely-changing data: ~60s TTL).
 function _buildStatusSlowState() {
   const prdInfo = getPrdInfo();
@@ -1812,6 +1911,13 @@ function _buildStatusSlowState() {
         // on the client (R3, W-mpgb0xgc000hf1d3). Quotes stripped from the
         // weak/strong ETag form so consumers see a bare hex digest.
         dashboardBuildId: HTML_ETAG ? HTML_ETAG.replace(/^"|"$/g, '') : null,
+        // Monotonic counter bumped on every successful /api/status cache rebuild.
+        // Surfaced so the dashboard refresh-diagnostics ring buffer
+        // (dashboard/js/refresh.js, W-mphejzx100081972) can correlate "did the
+        // server cache actually advance between two ticks" — distinguishes
+        // (b) server kept returning 304 with stale data from (c) renderer
+        // change-detection caches skipped the render on fresh data.
+        statusCacheVersion: _statusCacheVersion,
         disk: diskVersion,
         diskCommit,
         engineStale,
@@ -4821,6 +4927,31 @@ const server = http.createServer(async (req, res) => {
     } catch (e) { console.error('Archive fetch error:', e.message); return jsonReply(res, e.statusCode || 500, { error: e.message }); }
   }
 
+  // GET /api/work-items/<id> — return a single FULL work-item record by id
+  // (W-mphejzmj000718bf). The /api/status workItems slice ships a slimmed
+  // shape that omits description, full acceptanceCriteria, and full references
+  // to keep the SPA payload <500KB. The work-item detail modal calls this
+  // endpoint on click to fetch the full record on demand.
+  async function handleWorkItemsById(req, res, match) {
+    try {
+      const id = decodeURIComponent(match[1] || '').trim();
+      if (!id) return jsonReply(res, 400, { error: 'id required' });
+      // Reserved sub-paths handled by their own static routes — never fall
+      // through to this regex; defense-in-depth in case ordering ever
+      // changes.
+      if (id === 'archive' || id === 'retry' || id === 'update' || id === 'delete' ||
+          id === 'cancel' || id === 'reopen' || id === 'feedback') {
+        return jsonReply(res, 404, { error: 'work item not found' });
+      }
+      // Search central + every project's work-items.json for this id. The
+      // engine never enforces global id uniqueness in the file system, but
+      // collisions in practice are nil — first hit wins.
+      const found = getWorkItems().find(w => w && w.id === id);
+      if (!found) return jsonReply(res, 404, { error: 'work item not found' });
+      return jsonReply(res, 200, { item: found });
+    } catch (e) { return jsonReply(res, 500, { error: e.message }); }
+  }
+
   async function handleWorkItemsReopen(req, res) {
     try {
       const body = await readBody(req);
@@ -8392,6 +8523,21 @@ What would you like to discuss or change? When you're happy, say "approve" and I
         }
         // String fields
         if (e.worktreeRoot !== undefined) _setEngineConfig('worktreeRoot', String(e.worktreeRoot || D.worktreeRoot));
+        // W-mphejzmj000718bf: /api/status workItems retention window. Handled
+        // outside the numericFields loop because `Number(0) || D[key]`
+        // collapses the "disable trim" value (0) back to the default — we
+        // want 0 to actually persist as "skip the date filter".
+        if (e.statusWorkItemsRetentionDays !== undefined) {
+          const raw = e.statusWorkItemsRetentionDays;
+          if (raw === '' || raw === null) {
+            _deleteEngineConfig('statusWorkItemsRetentionDays');
+          } else {
+            let val = Number(raw);
+            if (!Number.isFinite(val) || val < 0) val = D.statusWorkItemsRetentionDays;
+            if (val > 365) { _clamped.push(`statusWorkItemsRetentionDays: ${val} → 365 (range: 0–365)`); val = 365; }
+            _setEngineConfig('statusWorkItemsRetentionDays', val);
+          }
+        }
         // W-mpejf0fq000e84d6: operator login override. Empty string clears
         // the override (engine falls back to gh/git/os resolution); any other
         // value pins the login used in `user/<login>/<wi-id>-<slug>` branches.
@@ -8723,6 +8869,52 @@ What would you like to discuss or change? When you're happy, say "approve" and I
     } catch (e) { return jsonReply(res, e.statusCode || 500, { error: e.message }); }
   }
 
+  // Refresh diagnostics — append the browser-side ring buffer to a rotating
+  // log so a user clicking "send to engine" from the diag chip persists the
+  // last ~50 /api/status polls for offline triage (W-mphejzx100081972).
+  // Rotated at 1 MB to bound disk usage; CSRF/origin-gated by the dispatcher
+  // (MUTATING_METHODS guard at dashboard.js:4337+).
+  const DASHBOARD_DIAGNOSTICS_LOG = path.join(ENGINE_DIR, 'dashboard-diagnostics.log');
+  const DASHBOARD_DIAGNOSTICS_ROTATE_BYTES = 1024 * 1024;
+  const DASHBOARD_DIAGNOSTICS_MAX_ENTRIES = 500;
+
+  async function handleDiagnosticsRefresh(req, res) {
+    try {
+      const body = await readBody(req);
+      const entries = body && Array.isArray(body.entries) ? body.entries : null;
+      if (!entries) return jsonReply(res, 400, { error: 'entries array required' });
+      if (entries.length > DASHBOARD_DIAGNOSTICS_MAX_ENTRIES) {
+        return jsonReply(res, 400, { error: `entries length ${entries.length} exceeds cap ${DASHBOARD_DIAGNOSTICS_MAX_ENTRIES}` });
+      }
+      // Rotate before write if the existing log is already at/over the cap.
+      // Single rolled file (.1) — older rotations are discarded; this is a
+      // diagnostic capture surface, not a long-term audit log.
+      try {
+        const st = fs.statSync(DASHBOARD_DIAGNOSTICS_LOG);
+        if (st.size >= DASHBOARD_DIAGNOSTICS_ROTATE_BYTES) {
+          const rolled = DASHBOARD_DIAGNOSTICS_LOG + '.1';
+          try { fs.unlinkSync(rolled); } catch { /* may not exist */ }
+          try { fs.renameSync(DASHBOARD_DIAGNOSTICS_LOG, rolled); } catch { /* best effort */ }
+        }
+      } catch { /* file may not exist yet */ }
+      const header = {
+        ts: new Date().toISOString(),
+        ua: String(req.headers['user-agent'] || '').slice(0, 200),
+        tab: String(req.headers['x-minions-dashboard-tab'] || '').slice(0, 80),
+        url: String(req.headers['x-minions-dashboard-url'] || '').slice(0, 200),
+        count: entries.length,
+      };
+      // One line per record: header line followed by one line per entry. JSON-
+      // Lines makes the file trivially `jq`-able for later analysis.
+      const lines = [JSON.stringify({ kind: 'batch', ...header })];
+      for (const e of entries) {
+        try { lines.push(JSON.stringify(e)); } catch { /* skip un-serialisable entry */ }
+      }
+      fs.appendFileSync(DASHBOARD_DIAGNOSTICS_LOG, lines.join('\n') + '\n');
+      return jsonReply(res, 200, { ok: true, written: entries.length, path: path.relative(MINIONS_DIR, DASHBOARD_DIAGNOSTICS_LOG) });
+    } catch (e) { return jsonReply(res, e.statusCode || 500, { error: e.message }); }
+  }
+
   // Slim UX surface for the experimental redesigned dashboard.
   // The HTML lives in dashboard/slim.html so the human can iterate on the
   // markup directly — we read the file from disk on each request (no in-
@@ -9593,6 +9785,13 @@ What would you like to discuss or change? When you're happy, say "approve" and I
       invalidateStatusCache();
       return jsonReply(res, 200, { ok: true });
     }},
+    // GET /api/work-items/<id> — fetch a single FULL work-item record by id.
+    // Registered AFTER all static /api/work-items/* routes so the regex never
+    // shadows them (route matching is sequential, first match wins).
+    // W-mphejzmj000718bf: the /api/status workItems slice drops description /
+    // acceptanceCriteria-detail / references-detail to cut payload size; the
+    // detail modal calls this endpoint on click to fetch the full record.
+    { method: 'GET', path: /^\/api\/work-items\/([^/?]+)$/, template: '/api/work-items/<id>', desc: 'Fetch a single full work-item record by id (description, acceptanceCriteria, references). The /api/status workItems slice ships a slimmed shape; this endpoint backs the detail modal.', handler: handleWorkItemsById },
 
     // Pinned notes
     { method: 'GET', path: '/api/pinned', desc: 'Get pinned notes', handler: async (req, res) => {
@@ -10205,6 +10404,9 @@ What would you like to discuss or change? When you're happy, say "approve" and I
     // Feature flags (experimental / in-progress UX gates — see engine/features.js)
     { method: 'GET', path: '/api/features', desc: 'List registered feature flags with current enabled state', handler: handleFeaturesList },
     { method: 'POST', path: '/api/features/toggle', desc: 'Enable/disable a registered feature flag', params: 'id, enabled', handler: handleFeaturesToggle },
+
+    // Diagnostics — refresh ring buffer persistence (W-mphejzx100081972).
+    { method: 'POST', path: '/api/diagnostics/refresh', desc: 'Append a dashboard refresh-diagnostic ring buffer batch to engine/dashboard-diagnostics.log (rotated at 1 MB)', params: 'entries[]', handler: handleDiagnosticsRefresh },
   ];
 
   // ── Route Dispatcher ────────────────────────────────────────────────────────

package/engine/features.js

@@ -53,6 +53,20 @@ const FEATURES = {
     addedIn: '0.1.1916',
     requiredCcRuntime: 'copilot',
   },
+  // dashboard-refresh-diagnostics — W-mphejzx100081972. Enables the in-browser
+  // /api/status poll telemetry ring buffer in dashboard/js/refresh.js: per-cycle
+  // ETag/status/bytes/render-duration capture, visibility-transition tracking,
+  // a small "diag" footer chip that opens a table modal, and a "send to engine"
+  // button that POSTs the buffer to /api/diagnostics/refresh for offline triage.
+  // Default OFF in production; flip ON in dev (or via env-var override) before
+  // reproducing a "didn't auto-update" complaint so the telemetry is captured.
+  // Disabled => the poll loop is byte-identical to its pre-flag steady state
+  // (the diagnostic helpers no-op via _isRefreshDiagOn() at the top of refresh()).
+  'dashboard-refresh-diagnostics': {
+    description: 'Capture the last 50 dashboard /api/status poll cycles (timing, ETag, status code, render duration, per-renderer change flags) in a browser-side ring buffer accessible via window._refreshDiagnostics, a footer "diag" chip, and POST /api/diagnostics/refresh.',
+    default: false,
+    addedIn: '0.1.2034',
+  },
 };
 
 const ENV_TRUTHY = new Set(['1', 'true', 'on', 'yes']);

package/engine/shared.js

@@ -2032,6 +2032,15 @@ const ENGINE_DEFAULTS = {
   // Settings UI exposes this as a free-text input; clearing the field deletes
   // the override and falls back to auto-resolution.
   operatorLogin: null,
+  // ── /api/status workItems retention (W-mphejzmj000718bf) ────────────────────
+  // Trim done/failed/cancelled work items older than this many days from the
+  // /api/status workItems slice to cut the SPA payload (live: 796 items / 3MB
+  // → ~50–100 items / <500KB typical). Active items (pending/dispatched/queued)
+  // are ALWAYS shipped regardless of age — only terminal items past the
+  // window are dropped. The detail modal fetches the full record on demand
+  // via GET /api/work-items/<id> when description/references/AC are needed.
+  // 0 disables the trim (full list shipped, restoring legacy behavior).
+  statusWorkItemsRetentionDays: 7,
 };
 
 // ─── Runtime Fleet Resolution (P-3b8e5f1d) ──────────────────────────────────

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yemi33/minions",
-  "version": "0.1.2037",
+  "version": "0.1.2038",
   "description": "Multi-agent AI dev team that runs from ~/.minions/ — five autonomous agents share a single engine, dashboard, and knowledge base",
   "bin": {
     "minions": "bin/minions.js"