@yemi33/minions 0.1.2195 → 0.1.2197

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

@@ -668,6 +668,19 @@ async function _submitCreateWorkItem(e) {
   } catch (e) { alert('Error: ' + e.message); openCreateWorkItemModal(); }
 }
 
+// P-79b47b0c — Derive a canonical PR id (`<host>:<slug>#<number>`) from a
+// GitHub or ADO PR URL. Matches the format produced by engine/queries.js
+// when stamping pr.id. Returns null when the URL doesn't match a known
+// host pattern.
+function _wiDeriveCanonicalPrIdFromUrl(url) {
+  if (!url || typeof url !== 'string') return null;
+  var ghMatch = url.match(/https?:\/\/github\.com\/([^/]+\/[^/]+)\/pull\/(\d+)/i);
+  if (ghMatch) return 'github:' + ghMatch[1] + '#' + ghMatch[2];
+  var adoMatch = url.match(/https?:\/\/dev\.azure\.com\/([^/]+)\/([^/]+)\/_git\/([^/?]+)\/pullrequest\/(\d+)/i);
+  if (adoMatch) return 'ado:' + adoMatch[1] + '/' + adoMatch[2] + '/' + adoMatch[3] + '#' + adoMatch[4];
+  return null;
+}
+
 function _wiRenderDetail(item) {
   const field = (label, value) => value ? '<div style="margin-bottom:8px"><span style="color:var(--muted);font-size:var(--text-sm);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>';
@@ -753,8 +766,18 @@ function _wiRenderDetail(item) {
   // Defensive: CC dispatches can land here with these fields as strings
   // (e.g. acceptanceCriteria: "fix the login bug"). Coerce to arrays so
   // .map() doesn't throw and crash the modal.
+  // P-79b47b0c — depends_on[] now renders as WI chips routed through
+  // renderArtifactLink (was bare <code> spans). Each chip clicks into the
+  // dependency's WI detail modal in-stack.
   var deps = Array.isArray(item.depends_on) ? item.depends_on : [];
-  if (deps.length) html += field('Depends On', deps.map(d => '<code>' + escapeHtml(d) + '</code>').join(', '));
+  if (deps.length) {
+    html += field('Depends On', deps.map(d => renderArtifactLink({ type: 'wi', id: String(d), label: String(d), title: 'Depends on ' + d })).join(' '));
+  }
+  // P-79b47b0c — parent_id chip (when present). Surfaces the parent WI that
+  // decomposed/spawned this child item.
+  if (item.parent_id) {
+    html += field('Parent Work Item', renderArtifactLink({ type: 'wi', id: String(item.parent_id), label: String(item.parent_id), title: 'Parent: ' + item.parent_id }));
+  }
   var ac = Array.isArray(item.acceptanceCriteria)
     ? item.acceptanceCriteria
     : (typeof item.acceptanceCriteria === 'string' && item.acceptanceCriteria.trim()
@@ -774,38 +797,114 @@ function _wiRenderDetail(item) {
     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>');
+  // P-79b47b0c — PR chip routed through renderArtifactLink so click opens the
+  // PR detail modal in-stack (was a raw <a target="_blank">).
+  if (item._pr) html += field('Pull Request', renderArtifactLink({ type: 'pr', id: item._pr, label: item._pr, title: item._prUrl || item._pr }));
+  // P-79b47b0c — follow-up parent PR chip. WIs spawned by PR review/build-fix
+  // dispatchers stamp meta.pr_followup.{parent_pr_url, parent_pr_id} on the
+  // child item; surface that lineage as a clickable in-stack PR chip. Prefer
+  // parent_pr_id when stamped; otherwise parse the URL into a canonical id.
+  var followup = item.meta && item.meta.pr_followup;
+  if (followup && (followup.parent_pr_id || followup.parent_pr_url)) {
+    var parentPrId = followup.parent_pr_id || _wiDeriveCanonicalPrIdFromUrl(followup.parent_pr_url);
+    if (parentPrId) {
+      html += field('Parent PR (follow-up)', renderArtifactLink({ type: 'pr', id: parentPrId, label: parentPrId, title: 'Follow-up from ' + (followup.parent_pr_url || parentPrId) }));
+    } else if (followup.parent_pr_url) {
+      // Couldn't derive a canonical id (unknown host?). Fall back to plain link.
+      html += field('Parent PR (follow-up)', '<a href="' + escapeHtml(followup.parent_pr_url) + '" target="_blank" rel="noopener" style="color:var(--blue)">' + escapeHtml(followup.parent_pr_url) + '</a>');
+    }
+  }
 
-  // Artifacts — output log, branch, skills, etc.
+  // P-c549d07e — "Spawned by" back-link chip. The schedule/pipeline that
+  // dispatched this WI is the natural Back target from the WI modal. The
+  // primary source is meta.spawnedBy ('schedule:<id>' | 'pipeline:<id>'),
+  // stamped by engine/scheduler.js + engine/pipeline.js on new dispatches.
+  // For older WIs already in state we fall back to (a) item._scheduleId
+  // and (b) item.createdBy when it starts with 'pipeline:' so historical
+  // items still light up the chip — purely additive, no behavior change.
+  (function() {
+    var meta = item.meta || {};
+    var spawnedBy = typeof meta.spawnedBy === 'string' ? meta.spawnedBy : '';
+    if (!spawnedBy && item._scheduleId) spawnedBy = 'schedule:' + item._scheduleId;
+    if (!spawnedBy && typeof item.createdBy === 'string' && item.createdBy.indexOf('pipeline:') === 0) {
+      spawnedBy = item.createdBy;
+    }
+    if (!spawnedBy) return;
+    var colonIdx = spawnedBy.indexOf(':');
+    if (colonIdx <= 0) return;
+    var kind = spawnedBy.slice(0, colonIdx);
+    var dispatcherId = spawnedBy.slice(colonIdx + 1);
+    if (!dispatcherId) return;
+    var chip;
+    if (kind === 'schedule') {
+      chip = renderArtifactLink({ type: 'schedule', id: dispatcherId, label: dispatcherId, title: 'Open schedule ' + dispatcherId });
+    } else if (kind === 'pipeline') {
+      chip = renderArtifactLink({ type: 'pipeline', id: dispatcherId, label: dispatcherId, title: 'Open pipeline ' + dispatcherId });
+    } else {
+      return;
+    }
+    html += field('Spawned by', chip);
+  })();
+
+  // Artifacts — branch (non-navigation) + navigation chips routed through
+  // renderArtifactLink so chip click → openArtifact() → modal-stack push +
+  // URL hash + browser-Back integration come for free (P-e265cd31).
+  // P-79b47b0c — also surface item._source (the WI's raw source file) as a
+  // dedicated chip when it isn't already covered by arts.plan / arts.prd /
+  // arts.sourcePlan. Chip type is inferred from the file extension (.md →
+  // plan, .json → prd).
   var arts = item._artifacts || {};
   var artPills = '';
-  var pillStyle = 'display:inline-flex;align-items:center;gap:3px;padding:2px 8px;border-radius:10px;font-size:var(--text-sm);cursor:pointer;background:var(--surface2);border:1px solid var(--border);color:var(--text)';
-  // Output log pill removed — raw stream-json output is not human-readable
-  var artBackFn = "pushModalBack(function(){openWorkItemDetail('" + escapeHtml(item.id) + "')});";
-  if (arts.branch) artPills += '<span style="' + pillStyle + ';cursor:default">🌿 ' + escapeHtml(arts.branch) + '</span> ';
-  if (arts.plan) artPills += '<span onclick="' + artBackFn + 'planView(\'' + escapeHtml(arts.plan) + '\')" style="' + pillStyle + '">📋 Plan</span> ';
-  if (arts.prd) artPills += '<span onclick="' + artBackFn + 'planView(\'' + escapeHtml(arts.prd) + '\')" style="' + pillStyle + '">📄 PRD</span> ';
-  if (arts.sourcePlan) artPills += '<span onclick="' + artBackFn + 'planView(\'' + escapeHtml(arts.sourcePlan) + '\')" style="' + pillStyle + '">📋 Source Plan</span> ';
+  var branchStyle = 'display:inline-flex;align-items:center;gap:3px;padding:2px 8px;border-radius:10px;font-size:var(--text-sm);background:var(--surface2);border:1px solid var(--border);color:var(--text);cursor:default';
+  if (arts.branch) artPills += '<span style="' + branchStyle + '">🌿 ' + escapeHtml(arts.branch) + '</span> ';
+  if (arts.plan) artPills += renderArtifactLink({ type: 'plan', id: arts.plan, label: 'Plan' }) + ' ';
+  if (arts.prd) artPills += renderArtifactLink({ type: 'prd', id: arts.prd, label: 'PRD' }) + ' ';
+  if (arts.sourcePlan) artPills += renderArtifactLink({ type: 'plan', id: arts.sourcePlan, label: 'Source Plan' }) + ' ';
+  // Source chip (item._source) — render when it's a file path that isn't
+  // already represented in arts.plan / arts.prd / arts.sourcePlan.
+  if (item._source && typeof item._source === 'string' && item._source !== 'central') {
+    var sourceAlreadyShown = arts.plan === item._source || arts.prd === item._source || arts.sourcePlan === item._source;
+    if (!sourceAlreadyShown) {
+      var sourceType = item._source.endsWith('.json') ? 'prd' : 'plan';
+      artPills += renderArtifactLink({ type: sourceType, id: item._source, label: 'Source', title: item._source }) + ' ';
+    }
+  }
   if (arts.notes && arts.notes.length > 0) {
     arts.notes.forEach(function(n) {
       var noteFile = (n && typeof n === 'object') ? (n.file || n) : String(n || '');
       if (noteFile.startsWith('kb:')) {
-        var kbParts = noteFile.slice(3).split('/');
-        var kbCat = kbParts[0];
-        var kbFile = kbParts.slice(1).join('/');
+        var kbBody = noteFile.slice(3);
+        var slashIdx = kbBody.indexOf('/');
+        if (slashIdx <= 0) return;
+        var kbFile = kbBody.slice(slashIdx + 1);
         var kbLabel = kbFile.replace(/\.md$/, '').slice(0, 30);
-        artPills += '<span onclick="' + artBackFn + 'kbOpenItem(\'' + escapeHtml(kbCat) + '\',\'' + escapeHtml(kbFile) + '\')" style="' + pillStyle + '">📚 ' + escapeHtml(kbLabel) + '</span> ';
+        artPills += renderArtifactLink({ type: 'kb', id: kbBody, label: kbLabel, title: 'KB: ' + kbFile }) + ' ';
       } else if (noteFile.startsWith('archive:')) {
-        var archLabel = noteFile.slice(8).replace(/\.md$/, '').replace(/^\d{4}-\d{2}-\d{2}-/, '').slice(0, 30);
-        artPills += '<span onclick="' + artBackFn + 'openInboxNote(\'' + escapeHtml(noteFile.slice(8)) + '\')" style="' + pillStyle + ';opacity:0.7">📄 ' + escapeHtml(archLabel) + ' <span style="font-size:var(--text-xs)">(archived)</span></span> ';
+        var archFile = noteFile.slice(8);
+        var archLabel = archFile.replace(/\.md$/, '').replace(/^\d{4}-\d{2}-\d{2}-/, '').slice(0, 30) + ' (archived)';
+        artPills += renderArtifactLink({ type: 'note', id: archFile, label: archLabel, icon: '📄', title: 'Archived note: ' + archFile }) + ' ';
       } else {
         var noteLabel = noteFile.replace(/\.md$/, '').slice(0, 30);
-        artPills += '<span onclick="' + artBackFn + 'openInboxNote(\'' + escapeHtml(noteFile) + '\')" style="' + pillStyle + '">📝 ' + escapeHtml(noteLabel) + '</span> ';
+        artPills += renderArtifactLink({ type: 'note', id: noteFile, label: noteLabel, title: 'Note: ' + noteFile }) + ' ';
       }
     });
   }
   if (artPills) html += field('Artifacts', '<div style="display:flex;flex-wrap:wrap;gap:4px">' + artPills + '</div>');
 
+  // P-34fa5d79 — Mentions: notes whose YAML frontmatter cites this WI
+  // (work_item: / wi: / sourceItem:). Slim string[] field set by
+  // engine/queries.js#getWorkItems from _buildNotesByWiMap. Each entry is
+  // either a bare inbox filename or `archive:<filename>` for archive notes.
+  if (Array.isArray(item._notes) && item._notes.length > 0) {
+    var mentionPills = item._notes.map(function(token) {
+      var isArchive = token.indexOf('archive:') === 0;
+      var fname = isArchive ? token.slice(8) : token;
+      var label = fname.replace(/\.md$/, '').slice(0, 30) + (isArchive ? ' (archived)' : '');
+      return renderArtifactLink({ type: 'note', id: fname, label: label, title: 'Note: ' + fname });
+    }).join(' ');
+    html += field('Mentions', '<div style="display:flex;flex-wrap:wrap;gap:4px">' + mentionPills + '</div>');
+  }
+
   if (item._totalCostUsd != null) html += field('Cumulative Cost', '$' + Number(item._totalCostUsd).toFixed(4));
   if (item._totalInputTokens) html += field('Total Input Tokens', Number(item._totalInputTokens).toLocaleString());
   if (item._totalOutputTokens) html += field('Total Output Tokens', Number(item._totalOutputTokens).toLocaleString());
@@ -856,8 +955,14 @@ function openWorkItemDetail(id) {
       merged.description = full.description || cached.description || '';
       if (Array.isArray(full.acceptanceCriteria)) merged.acceptanceCriteria = full.acceptanceCriteria;
       if (Array.isArray(full.references)) merged.references = full.references;
-      // eslint-disable-next-line no-unsanitized/property -- reason: structural HTML is a string literal; all user data wrapped in escapeHtml() or renderMd() by _wiRenderDetail() (fields: title, description, agent, source, reasons, references, artifacts, PR links)
-      document.getElementById('modal-body').innerHTML = _wiRenderDetail(merged);
+      // P-ce1e5e47 — withTopFrame skips the re-render when the user has
+      // stacked another modal on top of this work-item view.
+      var applyHydration = function() {
+        // eslint-disable-next-line no-unsanitized/property -- reason: structural HTML is a string literal; all user data wrapped in escapeHtml() or renderMd() by _wiRenderDetail() (fields: title, description, agent, source, reasons, references, artifacts, PR links)
+        document.getElementById('modal-body').innerHTML = _wiRenderDetail(merged);
+      };
+      if (typeof withTopFrame === 'function') withTopFrame('wi', id, applyHydration);
+      else applyHydration();
     })
     .catch(function() {
       var desc = document.getElementById('wi-detail-desc');
@@ -895,7 +1000,17 @@ function viewAgentOutput(logPath) {
 
 function openInboxNote(filename) {
   var idx = (inboxData || []).findIndex(function(item) { return item.name === filename; });
-  if (idx >= 0) { openModal(idx); return; }
+  if (idx >= 0) {
+    openModal(idx);
+    // P-34fa5d79 — Source-WI chip for live inbox notes. openModal() above
+    // paints the modal body from inboxData[idx].content; we parse the
+    // frontmatter here and inject a back-link chip when wi: / work_item: /
+    // sourceItem: is present. Append to body so the existing "Add to KB"
+    // button + rendered content stay intact.
+    var live = inboxData[idx];
+    if (live) _wiInjectSourceChipFromFrontmatter(live.content, 'modal-body');
+    return;
+  }
   // Not in the live inbox — it's an archived note (the common case for a
   // completed work item's note pill, which the rewriter re-encodes as an
   // 'archive:<name>' token). Fetch it from notes/archive/ and show it in the
@@ -911,6 +1026,9 @@ function openInboxNote(filename) {
       // eslint-disable-next-line no-unsanitized/property -- reason: renderMd() escapes note content before assembling HTML; filename is set via textContent
       bodyEl.innerHTML = '<div style="font-size:var(--text-md);line-height:1.7;color:var(--muted)">' + renderMd(content) + '</div>';
       document.getElementById('modal').classList.add('open');
+      // P-34fa5d79 — Source-WI chip for archive notes. Same convention as the
+      // live-inbox branch above; parsed off the freshly-fetched content.
+      _wiInjectSourceChipFromFrontmatter(content, 'modal-body');
     })
     .catch(function() {
       closeModal();
@@ -918,6 +1036,29 @@ function openInboxNote(filename) {
     });
 }
 
+// P-34fa5d79 — shared frontmatter → source-WI chip injector. Parses the YAML
+// frontmatter block at the start of `content`, looks for the WI fields the
+// repo uses (work_item / wi / sourceItem), and prepends a renderArtifactLink
+// chip to the named modal body container so the operator can click back to
+// the WI that the note cites. No-op when no frontmatter / no WI field.
+function _wiInjectSourceChipFromFrontmatter(content, containerId) {
+  var bodyEl = document.getElementById(containerId);
+  if (!bodyEl) return;
+  var m = String(content || '').match(/^---\n([\s\S]*?)\n---/);
+  if (!m) return;
+  var fm = {};
+  m[1].split('\n').forEach(function(line) {
+    var lm = line.match(/^([\w-]+):\s*(.*)$/);
+    if (lm) fm[lm[1]] = lm[2].trim();
+  });
+  var wiId = fm.work_item || fm.wi || fm.sourceItem;
+  if (!wiId) return;
+  var chip = renderArtifactLink({ type: 'wi', id: wiId, label: wiId, title: 'Source work item: ' + wiId });
+  var sourceBlock = '<div style="margin-bottom:10px;padding:6px 10px;background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius-sm)"><span style="color:var(--muted);font-size:var(--text-sm);text-transform:uppercase;letter-spacing:0.5px;margin-right:8px">Source</span>' + chip + '</div>';
+  // eslint-disable-next-line no-unsanitized/method -- reason: structural HTML is a string literal; chip HTML produced by renderArtifactLink() which escapes label + id via escapeHtml
+  bodyEl.insertAdjacentHTML('afterbegin', sourceBlock);
+}
+
 if (typeof window !== 'undefined') {
   window.MinionsWork = { wiRow, renderWorkItems, editWorkItem, submitWorkItemEdit, deleteWorkItem, archiveWorkItem, toggleWorkItemArchive, retryWorkItem, wiPrev, wiNext, feedbackWorkItem, submitFeedback, openCreateWorkItemModal, openWorkItemDetail, openAllWorkItems, viewAgentOutput, openInboxNote, needsAttentionInfo };
 }

package/dashboard/js/state.js

@@ -70,6 +70,10 @@ function _invokePageHooks(names) {
 
 function switchPage(page, pushState) {
   _invokePageHooks(PAGE_LEAVE_HOOKS);
+  // P-ce1e5e47 — page change clears the modal stack and closes any open modal.
+  // Per-modal polls observe withTopFrame and self-stop when the frame goes away.
+  if (typeof resetModalStack === 'function') resetModalStack();
+  if (typeof _physicallyCloseModal === 'function') _physicallyCloseModal();
 
   currentPage = page;
   document.querySelectorAll('.page').forEach(p => p.classList.remove('active'));
@@ -109,8 +113,113 @@ function switchPage(page, pushState) {
 
 // Browser back/forward navigation
 window.addEventListener('popstate', (e) => {
-  switchPage(e.state?.page || getPageFromUrl(), false);
+  // P-ce1e5e47 — modal-stack-aware popstate. State shape (per history.pushState
+  // in pushModalFrame / pushModalBack):
+  //   { page: 'home', modal: { breadcrumbs: [{type,id}, ...], current: {type,id} | null } }
+  // The "page" key takes precedence: a real page navigation (sidebar / browser
+  // back across tabs) clears the modal stack entirely.
+  const newPage = e.state?.page || getPageFromUrl();
+  if (newPage !== currentPage) {
+    // Page change wipes any open modal stack.
+    if (typeof resetModalStack === 'function') resetModalStack();
+    if (typeof _physicallyCloseModal === 'function') _physicallyCloseModal();
+    switchPage(newPage, false);
+    return;
+  }
+  // Same page — diff the modal stack and pop frames to match. We compute the
+  // desired total depth from breadcrumbs.length + (current ? 1 : 0).
+  if (typeof _popOneFrameInternal !== 'function' || typeof _modalStackDepth !== 'function') return;
+  const desired = e.state?.modal;
+  const desiredDepth = desired
+    ? (Array.isArray(desired.breadcrumbs) ? desired.breadcrumbs.length : 0) + (desired.current ? 1 : 0)
+    : 0;
+  const currentDepth = _modalStackDepth();
+  if (currentDepth <= desiredDepth) {
+    // No frames to pop. Refresh chrome and bail.
+    if (typeof _updateModalChrome === 'function') _updateModalChrome();
+    return;
+  }
+  _suppressHistoryFromPopstate = true;
+  try {
+    let safety = 0;
+    while (_modalStackDepth() > desiredDepth && safety++ < 32) {
+      _popOneFrameInternal();
+    }
+    if (typeof _updateModalChrome === 'function') _updateModalChrome();
+  } finally {
+    _suppressHistoryFromPopstate = false;
+  }
 });
+
+// P-ce1e5e47 — parse #modal=type:id,type:id,… and return an array of
+// { type, id } frames in bottom→top order. Used both for replay on initial
+// page load and for unit tests of the URL contract.
+// P-3ed68b1e — separator is ',' (was '>'); '>' is in the WHATWG URL
+// fragment percent-encode set and Chromium serialises it as '%3E' on
+// history.pushState — that broke split('>') for every multi-frame hash.
+// We also still accept the legacy '>' / '%3E' separators so any bookmark
+// or in-flight URL from before the fix continues to replay correctly.
+function getModalStackFromUrl() {
+  const hash = window.location.hash || '';
+  const idx = hash.indexOf('modal=');
+  if (idx < 0) return [];
+  const raw = hash.slice(idx + 'modal='.length);
+  if (!raw) return [];
+  const out = [];
+  const parts = raw.split(/,|%3E|>/i);
+  for (let i = 0; i < parts.length; i++) {
+    const seg = parts[i];
+    if (!seg) continue;
+    // type:id — id may contain encoded ':' so split on the first ':' only.
+    const colon = seg.indexOf(':');
+    if (colon < 0) continue;
+    let type, id;
+    try {
+      type = decodeURIComponent(seg.slice(0, colon));
+      id = decodeURIComponent(seg.slice(colon + 1));
+    } catch { continue; }
+    if (!type || !id) continue;
+    out.push({ type, id });
+  }
+  // Cap at MAX (defined in utils.js); take the last N.
+  const cap = (typeof MODAL_STACK_MAX_DEPTH === 'number') ? MODAL_STACK_MAX_DEPTH : 5;
+  return out.length > cap ? out.slice(-cap) : out;
+}
+
+// P-ce1e5e47 — replay the modal stack encoded in the URL hash on initial load.
+// Uses history.replaceState (via pushModalFrame's history call only if we
+// skip it) — we want a single history entry after replay, not N. We achieve
+// this by suppressing pushState for the first N-1 pushes and letting the
+// final push collapse into a replaceState.
+function replayModalStackFromUrl() {
+  const frames = (typeof getModalStackFromUrl === 'function') ? getModalStackFromUrl() : [];
+  if (!frames.length) return;
+  if (typeof openArtifact !== 'function') return;
+  // Suppress per-push pushState during replay; afterward write a single
+  // replaceState that captures the assembled stack.
+  if (typeof _suppressHistoryFromPopstate !== 'undefined') _suppressHistoryFromPopstate = true;
+  try {
+    for (let i = 0; i < frames.length; i++) {
+      try { openArtifact(frames[i].type, frames[i].id); } catch {}
+    }
+  } finally {
+    if (typeof _suppressHistoryFromPopstate !== 'undefined') _suppressHistoryFromPopstate = false;
+  }
+  try {
+    const state = { page: currentPage, modal: _serializeStackForHistory() };
+    history.replaceState(state, '', _buildModalHash());
+  } catch {}
+}
+
+// Kick off replay once the DOM (and all renderer modules) is in place.
+if (typeof document !== 'undefined') {
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', function() { try { replayModalStackFromUrl(); } catch {} });
+  } else if (typeof setTimeout !== 'undefined') {
+    // Defer to next tick so all openXxxDetail functions are registered first.
+    setTimeout(function() { try { replayModalStackFromUrl(); } catch {} }, 0);
+  }
+}
 window._prdRequeueUi = window._prdRequeueUi || {};
 
 function getPrdRequeueState(workItemId) {

package/dashboard/js/utils.js

@@ -80,24 +80,256 @@ function _togglePinAndRefresh(key, source) {
   else if (source === 'kb') renderKnowledgeBase({ preserveScroll: false });
 }
 
-// Modal navigation stack — enables back button when opening a modal from another modal
-var _modalBackStack = [];
-function pushModalBack(reopenFn) {
-  _modalBackStack.push(reopenFn);
-  var btn = document.getElementById('modal-back-btn');
-  if (btn) btn.style.display = '';
+// Modal navigation stack — frames for nested modal layers (P-ce1e5e47)
+// _modalStack holds breadcrumb frames the user can navigate BACK to.
+// _currentVisibleArtifact tracks the currently-shown modal's identity (set by
+// openArtifact / pushModalFrame). Direct row-click openers may leave this null;
+// the back stack still works via the legacy pushModalBack snapshot path.
+//
+// Each frame: { type, id, scrollY, titleHtml, bodyHtml, openFn, openArgs }.
+// Frames whose type starts with "_" (e.g. _legacy, _direct) are opaque
+// breadcrumb-only frames that are NOT mirrored to the URL hash and are NOT
+// replayed on refresh — they exist only for in-session back navigation.
+var MODAL_STACK_MAX_DEPTH = 5;
+var _modalStack = [];
+var _currentVisibleArtifact = null;
+var _legacyFrameSeq = 0;
+var _suppressHistoryFromPopstate = false;
+
+function _captureModalSnapshot() {
+  var titleEl = document.getElementById('modal-title');
+  var bodyEl = document.getElementById('modal-body');
+  return {
+    titleHtml: titleEl ? titleEl.innerHTML : '',
+    bodyHtml: bodyEl ? bodyEl.innerHTML : '',
+    scrollY: bodyEl ? (bodyEl.scrollTop || 0) : 0,
+  };
+}
+function _modalIsOpen() {
+  var el = document.getElementById('modal');
+  return !!(el && el.classList.contains('open'));
+}
+function _modalStackDepth() {
+  return _modalStack.length + (_currentVisibleArtifact ? 1 : 0);
+}
+function _capModalStackDepth() {
+  // Cap at MODAL_STACK_MAX_DEPTH: a 6th push evicts the OLDEST breadcrumb
+  // (index 0 of _modalStack), never the visible top.
+  while (_modalStackDepth() > MODAL_STACK_MAX_DEPTH && _modalStack.length > 0) {
+    _modalStack.shift();
+  }
 }
-function modalGoBack() {
-  var fn = _modalBackStack.pop();
+function _updateModalChrome() {
+  var depth = _modalStackDepth();
   var btn = document.getElementById('modal-back-btn');
-  if (btn && _modalBackStack.length === 0) btn.style.display = 'none';
-  if (fn) fn();
+  if (btn) btn.style.display = depth > 1 ? '' : 'none';
+  var chip = document.getElementById('modal-stack-chip');
+  if (chip) {
+    if (depth > 1) {
+      chip.style.display = '';
+      chip.textContent = depth + '/' + MODAL_STACK_MAX_DEPTH;
+    } else {
+      chip.style.display = 'none';
+    }
+  }
 }
-function clearModalBackStack() {
-  _modalBackStack = [];
-  var btn = document.getElementById('modal-back-btn');
-  if (btn) btn.style.display = 'none';
+function _buildModalHash() {
+  var entries = [];
+  for (var i = 0; i < _modalStack.length; i++) {
+    var f = _modalStack[i];
+    if (f && f.type && f.id && String(f.type).charAt(0) !== '_') {
+      entries.push(encodeURIComponent(f.type) + ':' + encodeURIComponent(f.id));
+    }
+  }
+  if (_currentVisibleArtifact && _currentVisibleArtifact.type && _currentVisibleArtifact.id) {
+    entries.push(
+      encodeURIComponent(_currentVisibleArtifact.type) + ':' +
+      encodeURIComponent(_currentVisibleArtifact.id)
+    );
+  }
+  var base = window.location.pathname + window.location.search;
+  if (entries.length === 0) return base;
+  // Cap URL to last MODAL_STACK_MAX_DEPTH entries (truncate oldest)
+  if (entries.length > MODAL_STACK_MAX_DEPTH) entries = entries.slice(-MODAL_STACK_MAX_DEPTH);
+  // P-3ed68b1e — frame separator is ',' (not '>'); '>' is in the WHATWG URL
+  // fragment percent-encode set and Chromium rewrites it to '%3E' on
+  // history.pushState, which broke deep-link replay (split('>') saw zero
+  // separators). ',' survives history serialisation intact, and since type
+  // + id are individually encodeURIComponent'd (',' itself encodes to
+  // '%2C'), no frame field can collide with the separator.
+  return base + '#modal=' + entries.join(',');
+}
+function _serializeStackForHistory() {
+  return {
+    breadcrumbs: _modalStack.map(function(f) { return { type: f.type, id: f.id }; }),
+    current: _currentVisibleArtifact
+      ? { type: _currentVisibleArtifact.type, id: _currentVisibleArtifact.id }
+      : null,
+  };
+}
+function _pushModalHistoryState() {
+  if (_suppressHistoryFromPopstate) return;
+  try {
+    var state = { page: (typeof currentPage !== 'undefined' ? currentPage : null), modal: _serializeStackForHistory() };
+    history.pushState(state, '', _buildModalHash());
+  } catch { /* history disabled (e.g. file://) — fall back to in-memory stack */ }
+}
+
+function pushModalFrame(frame) {
+  // frame: { type, id, openFn?, openArgs? } — describes the NEW visible modal.
+  // The current visible (if any) is snapshotted and pushed onto _modalStack as
+  // a breadcrumb; scrollY is captured here so popping restores the user's
+  // place in the parent view.
+  if (_currentVisibleArtifact) {
+    var snap = _captureModalSnapshot();
+    _modalStack.push({
+      type: _currentVisibleArtifact.type,
+      id: _currentVisibleArtifact.id,
+      titleHtml: snap.titleHtml,
+      bodyHtml: snap.bodyHtml,
+      scrollY: snap.scrollY,
+      openFn: _currentVisibleArtifact.openFn || null,
+      openArgs: _currentVisibleArtifact.openArgs || null,
+    });
+  } else if (_modalIsOpen()) {
+    // Modal was direct-opened (row click) without going through openArtifact.
+    // Snapshot it as an opaque _direct breadcrumb so Back still restores it.
+    var snap2 = _captureModalSnapshot();
+    _modalStack.push({
+      type: '_direct',
+      id: '_direct_' + (++_legacyFrameSeq),
+      titleHtml: snap2.titleHtml,
+      bodyHtml: snap2.bodyHtml,
+      scrollY: snap2.scrollY,
+      openFn: null,
+      openArgs: null,
+    });
+  }
+  _currentVisibleArtifact = {
+    type: frame.type,
+    id: frame.id,
+    openFn: typeof frame.openFn === 'function' ? frame.openFn : null,
+    openArgs: Array.isArray(frame.openArgs) ? frame.openArgs : null,
+  };
+  _capModalStackDepth();
+  _updateModalChrome();
+  _pushModalHistoryState();
+}
+
+function popModalFrame() {
+  // Esc / X / back-btn / browser Back all funnel here. Use history.back() so
+  // the popstate listener is the single source of truth for stack diffing.
+  if (_modalStackDepth() === 0) {
+    if (_modalIsOpen()) _physicallyCloseModal();
+    return;
+  }
+  try { history.back(); }
+  catch { _popOneFrameInternal(); _updateModalChrome(); }
+}
+
+function peekTopFrame() {
+  if (_currentVisibleArtifact) {
+    return Object.assign({}, _currentVisibleArtifact);
+  }
+  if (_modalStack.length > 0) {
+    return Object.assign({}, _modalStack[_modalStack.length - 1]);
+  }
+  return null;
+}
+
+function resetModalStack() {
+  _modalStack = [];
+  _currentVisibleArtifact = null;
+  _updateModalChrome();
+}
+
+function withTopFrame(type, id, fn) {
+  // Guard for per-modal poll bodies: only invoke `fn` when the named frame is
+  // still the visible top, so a stale poll on a lower frame can't clobber the
+  // user's currently-stacked modal. When no stack is tracked (direct-opened
+  // modal — _currentVisibleArtifact is null and _modalStack is empty) the
+  // poll proceeds unconditionally; row-click openers haven't routed through
+  // openArtifact, so we have no identity to check.
+  var top = peekTopFrame();
+  if (top && (top.type !== type || String(top.id) !== String(id))) return false;
+  try { fn(); } catch (e) { try { console.error(e); } catch {} }
+  return true;
+}
+
+function _restoreFrameToVisible(frame) {
+  // Synchronously restore a snapshotted frame as the visible modal layer.
+  // scrollY is restored after a double-rAF so layout settles first.
+  var titleEl = document.getElementById('modal-title');
+  var bodyEl = document.getElementById('modal-body');
+  if (titleEl) {
+    // eslint-disable-next-line no-unsanitized/property -- reason: snapshot of previously-rendered (already-escaped) modal title HTML; round-trip restore only
+    titleEl.innerHTML = frame.titleHtml || '';
+  }
+  if (bodyEl) {
+    // eslint-disable-next-line no-unsanitized/property -- reason: snapshot of previously-rendered (already-escaped) modal body HTML; round-trip restore only
+    bodyEl.innerHTML = frame.bodyHtml || '';
+  }
+  var modalEl = document.getElementById('modal');
+  if (modalEl && !modalEl.classList.contains('open')) modalEl.classList.add('open');
+  requestAnimationFrame(function() {
+    requestAnimationFrame(function() {
+      var b = document.getElementById('modal-body');
+      if (b) b.scrollTop = frame.scrollY || 0;
+    });
+  });
+}
+
+function _popOneFrameInternal() {
+  // Pop one breadcrumb and restore it as the visible modal. Used by the
+  // popstate handler (and as a fallback when history.back is unavailable).
+  if (_modalStack.length === 0) {
+    // Nothing to fall back to — close the modal entirely.
+    _currentVisibleArtifact = null;
+    if (_modalIsOpen()) _physicallyCloseModal();
+    return;
+  }
+  var frame = _modalStack.pop();
+  _currentVisibleArtifact = {
+    type: frame.type,
+    id: frame.id,
+    openFn: frame.openFn,
+    openArgs: frame.openArgs,
+  };
+  _restoreFrameToVisible(frame);
+}
+
+function _physicallyCloseModal() {
+  // Close the modal DOM without going through closeModal() (which would itself
+  // call popModalFrame and recurse). Mirrors the visible side-effects of
+  // closeModal but skips stack management.
+  var modalEl = document.getElementById('modal');
+  if (modalEl) modalEl.classList.remove('open');
+  var inner = document.querySelector('#modal .modal');
+  if (inner) inner.classList.remove('modal-wide');
+}
+
+// ─── Deprecation shims (legacy back-stack API) ───────────────────────────────
+// Existing callers in render-work-items.js and render-pipelines.js still use
+// pushModalBack(closure); on Back the closure re-renders the prior modal.
+// We translate this into a breadcrumb push that carries the snapshot of the
+// outgoing modal, so the new popstate-driven Back returns the same view.
+function pushModalBack(reopenFn) {
+  var snap = _captureModalSnapshot();
+  _modalStack.push({
+    type: '_legacy',
+    id: '_legacy_' + (++_legacyFrameSeq),
+    titleHtml: snap.titleHtml,
+    bodyHtml: snap.bodyHtml,
+    scrollY: snap.scrollY,
+    openFn: typeof reopenFn === 'function' ? reopenFn : null,
+    openArgs: null,
+  });
+  _capModalStackDepth();
+  _updateModalChrome();
+  _pushModalHistoryState();
 }
+function modalGoBack() { popModalFrame(); }
+function clearModalBackStack() { resetModalStack(); }
 
 function updateModalPinBtn() {
   var btn = document.getElementById('modal-pin-btn');