@yemi33/minions 0.1.2194 → 0.1.2196

package/dashboard/js/command-center.js

@@ -476,6 +476,8 @@ function ccAbort() {
 
 function toggleCommandCenter() {
   _ccOpen = !_ccOpen;
+  // Opening CC means the operator found it — retire the first-use coachmark.
+  if (_ccOpen && typeof dismissCcHint === 'function') dismissCcHint();
   var drawer = document.getElementById('cc-drawer');
   var overlay = document.getElementById('cc-overlay');
   if (_ccOpen) ccApplySavedWidth();

package/dashboard/js/fre.js

@@ -188,4 +188,128 @@ function renderFre(statusOrProjects) {
     '</div>';
 }
 
-window.MinionsFre = { renderFre, dismissFre, openSettingsToDefaultCli, _freReset, FRE_DISMISS_KEY };
+// ── Command Center first-use coachmark ──────────────────────────────────────
+// A small popup anchored under the Command Center header button, shown to
+// brand-new operators who have never used CC. Teaches the primary entry point:
+// "prompt the Command Center to ask it to dispatch work." Self-contained and
+// idempotent — safe to call renderCcHint() every refresh tick.
+//
+// Trigger: NOT dismissed AND the operator has never sent a CC message (no
+// 'cc-tabs' entry carries any messages). Auto-suppressed while the CC drawer
+// is open. Dismissed permanently when the user opens CC (see
+// toggleCommandCenter in command-center.js) or clicks "Got it".
+
+const CC_HINT_DISMISS_KEY = 'minions_cc_hint_dismissed';
+const CC_HINT_MOUNT_ID = 'cc-hint-coachmark';
+
+function _ccHintIsDismissed() {
+  try { return localStorage.getItem(CC_HINT_DISMISS_KEY) === '1'; } catch { return false; }
+}
+
+// "Brand new" = the operator has never sent a Command Center message. Reads the
+// same 'cc-tabs' localStorage key command-center.js persists; any tab carrying
+// at least one message means CC has been used and the hint has served its
+// purpose. Absent/empty/parse-error all read as new (fail toward showing).
+function _ccHintUserIsNew() {
+  try {
+    const raw = localStorage.getItem('cc-tabs');
+    if (!raw) return true;
+    const tabs = JSON.parse(raw);
+    if (!Array.isArray(tabs) || tabs.length === 0) return true;
+    return !tabs.some(function(t) { return t && Array.isArray(t.messages) && t.messages.length > 0; });
+  } catch { return true; }
+}
+
+function _ccHintRemove() {
+  const mount = document.getElementById(CC_HINT_MOUNT_ID);
+  if (mount && mount.parentNode) mount.parentNode.removeChild(mount);
+}
+
+function dismissCcHint() {
+  try { localStorage.setItem(CC_HINT_DISMISS_KEY, '1'); } catch { /* expected */ }
+  _ccHintRemove();
+}
+
+// Reset helper (exposed for tests / debugging only). Not wired to UI.
+function _ccHintReset() {
+  try { localStorage.removeItem(CC_HINT_DISMISS_KEY); } catch { /* expected */ }
+}
+
+// Open the Command Center from the coachmark CTA, then dismiss the hint.
+function openCcFromHint() {
+  dismissCcHint();
+  if (typeof toggleCommandCenter === 'function' && !window._ccOpen) {
+    try { toggleCommandCenter(); } catch { /* drawer not mounted yet */ }
+  }
+}
+
+// Re-anchor the coachmark under the CC button. Called on render and on resize.
+function _ccHintPosition() {
+  const mount = document.getElementById(CC_HINT_MOUNT_ID);
+  const btn = document.getElementById('cc-toggle-btn');
+  if (!mount || !btn) return;
+  const rect = btn.getBoundingClientRect();
+  mount.style.top = (rect.bottom + 10) + 'px';
+  // Right-align the card to the button's right edge.
+  mount.style.right = Math.max(8, window.innerWidth - rect.right) + 'px';
+  // Point the caret at the button's horizontal centre.
+  const arrow = document.getElementById('cc-hint-arrow');
+  if (arrow) arrow.style.right = Math.max(12, (rect.width / 2) - 6) + 'px';
+}
+
+let _ccHintResizeBound = false;
+
+// Render the coachmark into document.body. Idempotent — bails out (and removes
+// any stale mount) when dismissed, when CC has been used, when the header
+// button isn't mounted yet, or while the drawer is open.
+function renderCcHint() {
+  if (_ccHintIsDismissed() || !_ccHintUserIsNew()) {
+    _ccHintRemove();
+    return;
+  }
+  const btn = document.getElementById('cc-toggle-btn');
+  if (!btn) return; // header not assembled yet
+  const drawer = document.getElementById('cc-drawer');
+  if (drawer && drawer.style.display === 'flex') {
+    // User already found CC — don't hover the hint over the open drawer.
+    _ccHintRemove();
+    return;
+  }
+
+  let mount = document.getElementById(CC_HINT_MOUNT_ID);
+  if (!mount) {
+    mount = document.createElement('div');
+    mount.id = CC_HINT_MOUNT_ID;
+    mount.style.cssText = [
+      'position:fixed',
+      'z-index:330',
+      'width:260px',
+      'padding:14px 16px',
+      'background:var(--surface)',
+      'border:1px solid var(--blue)',
+      'border-radius:var(--radius-lg)',
+      'box-shadow:var(--shadow-md)',
+      'color:var(--text)',
+      'font-size:var(--text-md)',
+      'line-height:1.5',
+    ].join(';');
+    document.body.appendChild(mount);
+    // eslint-disable-next-line no-unsanitized/property -- reason: static string literal — no user-controlled data is interpolated
+    mount.innerHTML =
+      '<div id="cc-hint-arrow" style="position:absolute;top:-7px;width:12px;height:12px;background:var(--surface);border-left:1px solid var(--blue);border-top:1px solid var(--blue);transform:rotate(45deg)"></div>' +
+      '<div style="font-weight:700;color:var(--blue);margin-bottom:4px">&#x1F44B; Start here</div>' +
+      '<div style="color:var(--text)">Prompt your <strong>Command Center</strong> here to ask it to dispatch work.</div>' +
+      '<div style="display:flex;gap:8px;margin-top:12px">' +
+        '<button onclick="openCcFromHint()" class="btn-primary-solid" style="padding:5px 12px;font-size:var(--text-sm)">Open Command Center</button>' +
+        '<button onclick="dismissCcHint()" style="padding:5px 12px;font-size:var(--text-sm);background:transparent;color:var(--muted);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer">Got it</button>' +
+      '</div>';
+  }
+  _ccHintPosition();
+  if (!_ccHintResizeBound) {
+    _ccHintResizeBound = true;
+    window.addEventListener('resize', _ccHintPosition);
+  }
+}
+
+window.MinionsFre = { renderFre, dismissFre, openSettingsToDefaultCli, _freReset, FRE_DISMISS_KEY,
+  renderCcHint, dismissCcHint, openCcFromHint, _ccHintReset, _ccHintUserIsNew, CC_HINT_DISMISS_KEY };

package/dashboard/js/modal.js

@@ -1,10 +1,22 @@
 // modal.js — Modal and notification badge functions extracted from dashboard.html
 
 function closeModal() {
+  // P-ce1e5e47 — Esc / X / back-button all route through popModalFrame(),
+  // which itself calls history.back(); the popstate listener then pops one
+  // breadcrumb and restores the previous modal. When the stack still has
+  // depth > 1, the modal stays open with the parent view restored, so we
+  // must NOT tear down Q&A / edit / pin state here — only when the modal is
+  // actually about to be hidden (depth <= 1).
+  var depth = (typeof _modalStackDepth === 'function') ? _modalStackDepth() : 0;
+  if (depth > 1) {
+    if (typeof popModalFrame === 'function') popModalFrame();
+    return;
+  }
   const modalEl = document.querySelector('#modal .modal');
   if (modalEl) modalEl.classList.remove('modal-wide');
   document.getElementById('modal').classList.remove('open');
-  clearModalBackStack();
+  if (typeof popModalFrame === 'function') popModalFrame();
+  else if (typeof clearModalBackStack === 'function') clearModalBackStack();
   // Hide Q&A section (only shown for document modals)
   document.getElementById('modal-qa').style.display = 'none';
   // Remove settings-body marker so the next modal opens with the default
@@ -132,4 +144,26 @@ function renderArchiveButtons(archives) {
   ).join(' ');
 }
 
+// P-3ed68b1e — Esc key closes the active modal layer. Routes through
+// closeModal() so the depth-aware logic (pop one frame vs full teardown) is
+// the single source of truth. Bubble phase + early-out when the QA review
+// modal is on top so qa.js's own Escape handler isn't shadowed. Inputs and
+// textareas inside the modal are exempt so typing Esc inside Q&A / steering
+// inputs still reaches qa.js / cancel handlers (those listeners use
+// stopPropagation; this guard is belt-and-braces for any future inputs).
+if (typeof document !== 'undefined' && typeof document.addEventListener === 'function') {
+  document.addEventListener('keydown', function(ev) {
+    if (ev.key !== 'Escape' && ev.keyCode !== 27) return;
+    if (typeof _qaModalState !== 'undefined' && _qaModalState) return;
+    var modalEl = document.getElementById('modal');
+    if (!modalEl || !modalEl.classList.contains('open')) return;
+    var t = ev.target;
+    if (t && t.tagName) {
+      var tag = String(t.tagName).toUpperCase();
+      if (tag === 'INPUT' || tag === 'TEXTAREA' || t.isContentEditable) return;
+    }
+    closeModal();
+  });
+}
+
 window.MinionsModal = { closeModal, copyModalContent, showNotifBadge, clearNotifBadge, restoreNotifBadges, findCardForFile, renderArchiveButtons };

package/dashboard/js/refresh.js

@@ -153,7 +153,7 @@ const RENDER_VERSIONS = {
   mcpServers: 1,
   harnessDiag: 1,
   schedules: 1,
-  watches: 2,
+  watches: 3,
   meetings: 1,
   pipelines: 1,
   pinned: 1,
@@ -612,6 +612,12 @@ function _processStatusUpdate(data, opts) {
   if (typeof renderFre === 'function') {
     _safeRender('fre', function() { renderFre(data); });
   }
+  // Command Center first-use coachmark — anchored under the CC header button
+  // for brand-new operators who have never sent a CC message. Idempotent +
+  // cheap; self-suppresses once CC is used or dismissed.
+  if (typeof renderCcHint === 'function') {
+    _safeRender('ccHint', function() { renderCcHint(); });
+  }
   // Notes file (notes.md) is now sourced from /state/notes.md. Same shape
   // as the legacy /api/status notes slice ({ content, updatedAt }); the
   // ETag mtime is parsed out of the response header for updatedAt.

package/dashboard/js/render-agents.js

@@ -71,6 +71,24 @@ function renderAgents(agents) {
   restoreDashboardScrollState(grid, scrollState);
 }
 
+/**
+ * Open the right-side agent detail panel.
+ *
+ * P-30b6cf8a — Detail-panel exception. This panel is intentionally NOT a
+ * modal-stack frame; it is a peer of the stack. Routing comes through
+ * openArtifact('agent', id) in dashboard/js/render-utils.js, which:
+ *   1. Calls resetModalStack() + _physicallyCloseModal() so the modal-stack
+ *      identity goes back to empty (any prior modal is dismissed).
+ *   2. Calls openAgentDetail(id), which opens this slide-in panel.
+ *
+ * Reverse direction is symmetric: clicking a WI/PR/plan chip from inside
+ * the panel calls openArtifact('<type>', id), which closes this panel and
+ * starts a fresh modal stack. This is the one documented exception to
+ * in-stack chip behaviour — do NOT refactor it into a normal modal frame.
+ * The panel UI (tabs, live-output stream, charter editor) does not fit
+ * the single-shell modal contract; trying to force it into pushModalFrame
+ * would lose the tabbed layout and the persistent live-stream socket.
+ */
 async function openAgentDetail(id) {
   const agent = agentData.find(a => a.id === id);
   if (!agent) return;

package/dashboard/js/render-kb.js

@@ -251,8 +251,33 @@ async function kbOpenItem(category, file) {
     const display = content.replace(/^---[\s\S]*?---\n*/m, '');
     document.getElementById('modal-title').textContent = file;
     const modalBody = document.getElementById('modal-body');
-    // eslint-disable-next-line no-unsanitized/property -- reason: renderMd() escapes all user-controlled fields before assembling HTML (see dashboard/js/utils.js)
-    modalBody.innerHTML = renderMd(display);
+    // P-34fa5d79 — KB modal renders "From note: …" and "From WI: …" chips
+    // when the entry was promoted via /api/inbox/promote-kb (which stamps
+    // source_note + source_wi). Parse the frontmatter block off the raw
+    // fetched content (we already strip it for `display`).
+    var _fmChipsHtml = '';
+    var _fmMatch = String(content || '').match(/^---\n([\s\S]*?)\n---/);
+    if (_fmMatch) {
+      var _fm = {};
+      _fmMatch[1].split('\n').forEach(function(line) {
+        var lm = line.match(/^([\w-]+):\s*(.*)$/);
+        if (lm) _fm[lm[1]] = lm[2].trim();
+      });
+      var _chips = [];
+      if (_fm.source_note) {
+        _chips.push('<span style="color:var(--muted);font-size:var(--text-sm);text-transform:uppercase;letter-spacing:0.5px;margin-right:4px">From note</span>' +
+          renderArtifactLink({ type: 'note', id: _fm.source_note, label: _fm.source_note.replace(/\.md$/, '').slice(0, 30), title: 'Source note: ' + _fm.source_note }));
+      }
+      if (_fm.source_wi) {
+        _chips.push('<span style="color:var(--muted);font-size:var(--text-sm);text-transform:uppercase;letter-spacing:0.5px;margin-right:4px">From WI</span>' +
+          renderArtifactLink({ type: 'wi', id: _fm.source_wi, label: _fm.source_wi, title: 'Source work item: ' + _fm.source_wi }));
+      }
+      if (_chips.length > 0) {
+        _fmChipsHtml = '<div style="margin-bottom:10px;padding:6px 10px;background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius-sm);display:flex;flex-wrap:wrap;gap:12px;align-items:center">' + _chips.join('') + '</div>';
+      }
+    }
+    // eslint-disable-next-line no-unsanitized/property -- reason: renderMd() escapes all user-controlled fields before assembling HTML (see dashboard/js/utils.js); _fmChipsHtml is built from renderArtifactLink() chips which escape id+label via escapeHtml
+    modalBody.innerHTML = _fmChipsHtml + renderMd(display);
     _modalDocContext = { title: file, content: display, selection: '' };
     _modalFilePath = 'knowledge/' + category + '/' + file; showModalQa();
     // Clear notification badge when opening this document

package/dashboard/js/render-meetings.js

@@ -196,6 +196,30 @@ function _renderMeetingDetail(m) {
         '<span style="font-size:var(--text-sm);color:var(--muted)">' + escHtml(m.createdAt?.slice(0, 16).replace('T', ' ') || '') + '</span>' +
       '</div>';
 
+      // P-30b6cf8a — Linked-artifact chip row. Renders the meeting.linkedPlan
+      // (derived by _findLinkedPlan from conclusion text / title-slug match)
+      // and the participants list as in-stack renderArtifactLink chips.
+      // Plan chip routes through openArtifact -> planView (in-stack modal
+      // push, browser Back returns here). Agent chips route through the
+      // detail-panel exception in openArtifact (resetModalStack + open the
+      // slide-in panel); see render-utils.js openArtifact comment.
+      const _linkedPlanForChip = _findLinkedPlan(m);
+      const _hasChipRenderer = typeof renderArtifactLink === 'function';
+      if (_hasChipRenderer && (_linkedPlanForChip || (m.participants || []).length > 0)) {
+        let chipRow = '<div style="display:flex;gap:6px;flex-wrap:wrap;align-items:center;font-size:var(--text-sm)">';
+        if (_linkedPlanForChip) {
+          chipRow += '<span style="color:var(--muted)">Linked plan:</span> ' +
+            renderArtifactLink({ type: 'plan', id: _linkedPlanForChip.file, label: _linkedPlanForChip.file, title: _linkedPlanForChip.summary || _linkedPlanForChip.file });
+        }
+        if ((m.participants || []).length > 0) {
+          chipRow += (_linkedPlanForChip ? ' <span style="color:var(--border)">·</span> ' : '') +
+            '<span style="color:var(--muted)">Participants:</span> ' +
+            (m.participants || []).map(a => renderArtifactLink({ type: 'agent', id: a, label: a, title: 'Open ' + a + ' detail panel' })).join(' ');
+        }
+        chipRow += '</div>';
+        html += chipRow;
+      }
+
       // Agenda — render markdown-like formatting
       html += '<div style="background:var(--surface2);padding:8px 12px;border-radius:6px;font-size:var(--text-md);white-space:pre-wrap;line-height:1.6">' +
         '<strong>Agenda:</strong>\n' + renderMd(m.agenda || '') + '</div>';
@@ -203,7 +227,13 @@ function _renderMeetingDetail(m) {
       // Per-agent panels
       for (const agent of (m.participants || [])) {
         html += '<div style="border:1px solid var(--border);border-radius:6px;overflow:hidden">';
-        html += '<div style="background:var(--surface2);padding:6px 12px;font-weight:600;font-size:var(--text-md)">' + escHtml(agent) + '</div>';
+        // P-30b6cf8a — agent header is a chip so it routes through the
+        // detail-panel exception in openArtifact (resetModalStack + open
+        // slide-in panel).
+        const _agentChip = _hasChipRenderer
+          ? renderArtifactLink({ type: 'agent', id: agent, label: agent, title: 'Open ' + agent + ' detail panel' })
+          : escHtml(agent);
+        html += '<div style="background:var(--surface2);padding:6px 12px;font-weight:600;font-size:var(--text-md)">' + _agentChip + '</div>';
 
         // Findings
         if (m.findings?.[agent]) {
@@ -322,8 +352,11 @@ function openMeetingDetail(id) {
             if (d.meeting && _meetingPollId === id) {
               const hash = JSON.stringify(d.meeting);
               if (hash === _lastMeetingHash) return; // no change — skip re-render
-              _lastMeetingHash = hash;
-              _renderMeetingDetail(d.meeting);
+              // P-ce1e5e47 — withTopFrame skips the re-render when the user
+              // has stacked another modal on top of this meeting view.
+              const apply = function() { _lastMeetingHash = hash; _renderMeetingDetail(d.meeting); };
+              if (typeof withTopFrame === 'function') withTopFrame('meeting', id, apply);
+              else apply();
             }
           })
           .catch(function() {});

package/dashboard/js/render-pipelines.js

@@ -98,29 +98,34 @@ function _getPipelineDisplayTitle(pipeline) {
 
 /**
  * Render clickable artifact links for a pipeline stage.
- * Each artifact type gets an icon and navigates to the relevant detail view.
+ * Navigation chips (workItems / meetings / plans / prds) route through
+ * renderArtifactLink → openArtifact() so the modal stack push and URL hash
+ * come for free (P-e265cd31). PRs / notes / subStages stay inline: PRs and
+ * notes page-switch instead of opening a detail modal, and subStages are
+ * non-clickable — none has an openArtifact path, so the "View PR" / "View
+ * Note" pills render identically to today.
  * @param {Object} artifacts - artifact map from stage run
- * @param {string} [pipelineId] - pipeline ID for modal back-navigation
+ * @param {string} [pipelineId] - retained for back-compat; unused now that
+ *   openArtifact captures the current visible modal automatically.
  */
-function _renderArtifactLinks(artifacts, pipelineId) {
+function _renderArtifactLinks(artifacts /* , pipelineId — unused since P-e265cd31 */) {
   if (!artifacts) return '';
   var links = [];
   var linkStyle = 'display:inline-flex;align-items:center;gap:2px;padding:1px 6px;border-radius:10px;font-size:var(--text-sm);cursor:pointer;text-decoration:none;color:var(--blue);background:color-mix(in srgb, var(--blue) 10%, transparent);border:1px solid color-mix(in srgb, var(--blue) 20%, transparent)';
 
-  // Pushes current pipeline modal onto back stack so detail modals can navigate back
-  var backFn = pipelineId ? "pushModalBack(function(){openPipelineDetail('" + escHtml(pipelineId) + "')});" : '';
-
   (artifacts.workItems || []).forEach(function(id) {
-    links.push('<span style="' + linkStyle + '" onclick="event.stopPropagation();' + backFn + 'openWorkItemDetail(\'' + escHtml(id) + '\')" title="Open work item ' + escHtml(id) + '">⚙ ' + escHtml(id) + '</span>');
+    links.push(renderArtifactLink({ type: 'wi', id: id, label: id, title: 'Open work item ' + id }));
   });
   (artifacts.meetings || []).forEach(function(id) {
-    links.push('<span style="' + linkStyle + '" onclick="event.stopPropagation();' + backFn + 'openMeetingDetail(\'' + escHtml(id) + '\')" title="Open meeting ' + escHtml(id) + '">💬 ' + escHtml(id) + '</span>');
+    links.push(renderArtifactLink({ type: 'meeting', id: id, label: id, title: 'Open meeting ' + id }));
   });
   (artifacts.plans || []).forEach(function(name) {
-    links.push('<span style="' + linkStyle + '" onclick="event.stopPropagation();' + backFn + 'planView(\'' + escHtml(name) + '\')" title="Plan: ' + escHtml(name) + '">📋 ' + escHtml(name.replace(/\.md$/, '').slice(0, 30)) + '</span>');
+    var label = String(name).replace(/\.md$/, '').slice(0, 30);
+    links.push(renderArtifactLink({ type: 'plan', id: name, label: label, title: 'Plan: ' + name }));
   });
   (artifacts.prds || []).forEach(function(name) {
-    links.push('<span style="' + linkStyle + '" onclick="event.stopPropagation();' + backFn + 'planView(\'' + escHtml(name) + '\')" title="PRD: ' + escHtml(name) + '">📄 ' + escHtml(name.replace(/\.json$/, '').slice(0, 30)) + '</span>');
+    var label = String(name).replace(/\.json$/, '').slice(0, 30);
+    links.push(renderArtifactLink({ type: 'prd', id: name, label: label, title: 'PRD: ' + name }));
   });
   (artifacts.prs || []).forEach(function(id) {
     links.push('<span style="' + linkStyle + '" onclick="event.stopPropagation();closeModal();switchPage(\'prs\')" title="Pull request ' + escHtml(id) + '">🔀 PR-' + escHtml(id) + '</span>');

package/dashboard/js/render-plans.js

@@ -697,11 +697,73 @@ function _renderPlanModal(normalizedFile, raw, lastMod) {
     modalActions += '<button class="pr-pager-btn" style="' + bs + ';color:var(--red)" onclick="planDelete(\'' + escapeHtml(normalizedFile) + '\')">Delete</button>';
   }
 
+  // P-79b47b0c — surface linked artifacts (PRD + verify-guide) as in-stack
+  // renderArtifactLink chips alongside the plan modal action buttons.
+  // P-30b6cf8a — also surface the source-meeting chip when the PRD JSON
+  // carries a `meetingId` field or the .md plan body contains the
+  // `**Source Meeting:** MTG-…` header line (the dashboard convention
+  // written by POST /api/plans/create when a plan is created from a
+  // meeting). Chip routes through openArtifact → openMeetingDetail for
+  // in-stack push (Back returns here).
+  let linkedChips = '';
+  if (typeof renderArtifactLink === 'function') {
+    if (prdFile && prdFile !== normalizedFile) {
+      linkedChips += renderArtifactLink({ type: 'prd', id: prdFile, label: 'PRD', title: prdFile }) + ' ';
+    }
+    let meetingChipId = '';
+    if (normalizedFile.endsWith('.json')) {
+      try {
+        const _parsedForMtg = JSON.parse(raw);
+        if (_parsedForMtg && typeof _parsedForMtg.meetingId === 'string' && /^MTG-[\w-]+$/.test(_parsedForMtg.meetingId)) {
+          meetingChipId = _parsedForMtg.meetingId;
+        }
+      } catch { /* JSON parse already surfaced upstream */ }
+    } else {
+      const _mtgMatch = (raw || '').match(/\*\*Source Meeting:\*\*\s+(MTG-[\w-]+)/);
+      if (_mtgMatch) meetingChipId = _mtgMatch[1];
+    }
+    if (meetingChipId) {
+      linkedChips += renderArtifactLink({ type: 'meeting', id: meetingChipId, label: meetingChipId, title: 'Source meeting: ' + meetingChipId }) + ' ';
+    }
+    const guidesForChip = window._lastVerifyGuides || [];
+    const guideForChip = guidesForChip.find(g => g && g.planFile === (prdFile || normalizedFile));
+    if (guideForChip && guideForChip.file) {
+      // Verify guides live at prd/guides/verify-<slug>.md and are fetched via
+      // /api/plans/<file>, so a plain {type:'plan'} chip resolves correctly
+      // through openArtifact -> planView. openVerifyGuide() is the legacy
+      // helper that does the same thing — we keep the modal-stack semantics
+      // by routing through openArtifact instead.
+      linkedChips += renderArtifactLink({ type: 'plan', id: guideForChip.file, label: 'Verify Guide', icon: '&#x1F4D6;', title: 'Manual testing guide (openVerifyGuide)' }) + ' ';
+    }
+    // P-e6093f70 — cross-repo plan ↔ plan sibling chips. When the plan
+    // fans out across ≥2 projects (lifecycle.checkPlanCompletion creates
+    // one verify WI per touched project — see CLAUDE.md §"Cross-repo
+    // plans" invariant 5), surface a clickable WI chip per sibling so
+    // operators can hop between the per-project verify WIs without
+    // leaving the modal stack. The chip label is the project slug so each
+    // sibling is identifiable at a glance (mirrors _renderVerifyBadge's
+    // projectLabel handling at line ~1042). Gate matches the existing
+    // per-project verify-badge fanout gate at line ~689 so single-project
+    // plans are unaffected.
+    if (modalVerifyWis.length >= 2) {
+      for (const v of modalVerifyWis) {
+        const projLabel = v.project || 'verify';
+        linkedChips += renderArtifactLink({
+          type: 'wi',
+          id: v.id,
+          label: projLabel,
+          title: 'Sibling verify WI for ' + projLabel + ' (cross-repo plan fanout)',
+        }) + ' ';
+      }
+    }
+  }
+
   const lastModLabel = lastMod ? '<div style="font-size:var(--text-sm);color:var(--muted);font-weight:400;margin-top:2px">Last updated: ' + formatLocalDateTime(lastMod) + '</div>' : '';
+  const linkedChipsRow = linkedChips ? '<div style="display:flex;gap:4px;flex-wrap:wrap;margin-top:4px">' + linkedChips + '</div>' : '';
   const actionBtns = '<div style="display:flex;gap:4px;flex-wrap:wrap;margin-top:4px">' + modalActions + '</div>';
 
-  // eslint-disable-next-line no-unsanitized/property -- reason: structural HTML is a string literal; all user data wrapped in escapeHtml() (fields: plan title, version label, action target files)
-  document.getElementById('modal-title').innerHTML = escapeHtml(title) + (versionLabel ? ' <span style="font-size:var(--text-base);font-weight:700;padding:1px 6px;border-radius:3px;background:rgba(56,139,253,0.15);color:var(--blue)">' + escapeHtml(versionLabel) + '</span>' : '') + lastModLabel + actionBtns;
+  // eslint-disable-next-line no-unsanitized/property -- reason: structural HTML is a string literal; all user data wrapped in escapeHtml() (fields: plan title, version label, action target files); linkedChipsRow output is renderArtifactLink chips (escapes internally) or empty
+  document.getElementById('modal-title').innerHTML = escapeHtml(title) + (versionLabel ? ' <span style="font-size:var(--text-base);font-weight:700;padding:1px 6px;border-radius:3px;background:rgba(56,139,253,0.15);color:var(--blue)">' + escapeHtml(versionLabel) + '</span>' : '') + lastModLabel + linkedChipsRow + actionBtns;
   const modalBody = document.getElementById('modal-body');
   const scrollTop = modalBody.scrollTop;
   if (normalizedFile.endsWith('.json')) {
@@ -748,7 +810,15 @@ async function planView(file) {
       }
       fetch('/api/plans/' + encodeURIComponent(normalizedFile))
         .then(function(r) { return r.text().then(function(raw) { return { raw: raw, lastMod: r.headers.get('Last-Modified') }; }); })
-        .then(function(d) { if (_planPollFile === normalizedFile && d.raw !== _planPollLastRaw) { _planPollLastRaw = d.raw; _renderPlanModal(normalizedFile, d.raw, d.lastMod); } })
+        .then(function(d) {
+          // P-ce1e5e47 — withTopFrame guards a stacked modal: if the user
+          // navigated to a deeper modal on top of this plan view, skip the
+          // re-render so we don't clobber the visible top frame.
+          if (_planPollFile !== normalizedFile || d.raw === _planPollLastRaw) return;
+          var apply = function() { _planPollLastRaw = d.raw; _renderPlanModal(normalizedFile, d.raw, d.lastMod); };
+          if (typeof withTopFrame === 'function') withTopFrame('plan', normalizedFile, apply);
+          else apply();
+        })
         .catch(function() {});
     }, 3000);
   } catch (e) { console.error(e); }

package/dashboard/js/render-prd.js

@@ -144,9 +144,16 @@ function renderPrd(prd, prog) {
 
 function _renderPrLink(pr, opts) {
   var size = (opts && opts.size) || '10px';
-  var statusColor = pr.status === 'merged' ? 'var(--green)' : pr.status === 'abandoned' ? 'var(--red)' : 'var(--blue)';
   var statusIcon = pr.status === 'merged' ? '✓' : pr.status === 'abandoned' ? '✗' : '○';
-  return '<a href="' + escHtml(pr.url || '#') + '" target="_blank" rel="noopener" onclick="event.stopPropagation()" style="font-size:' + size + ';color:' + statusColor + ';text-decoration:underline;cursor:pointer;margin-left:4px" title="' + escHtml((pr.title || '') + ' (' + (pr.status || 'active') + ')') + '">' + statusIcon + ' ' + escHtml(pr.id) + '</a>';
+  // P-79b47b0c — render as an in-stack modal chip via renderArtifactLink
+  // (was a raw <a target="_blank">). The status icon stays as a non-link
+  // prefix so the chip body remains the canonical id, matching the WI/PRD
+  // chip pattern. Click is gated by openArtifact -> openPrDetail.
+  var chip = (typeof renderArtifactLink === 'function')
+    ? renderArtifactLink({ type: 'pr', id: pr.id, label: pr.id, title: (pr.title || '') + ' (' + (pr.status || 'active') + ')' })
+    : '<code>' + escHtml(pr.id) + '</code>';
+  return '<span style="font-size:' + size + ';margin-left:4px;display:inline-flex;align-items:center;gap:3px">' +
+    '<span title="' + escHtml(pr.status || 'active') + '">' + statusIcon + '</span>' + chip + '</span>';
 }
 
 function _renderPrdWorkItemIdBadge(workItemId, prdItemId, size, padding) {
@@ -288,9 +295,19 @@ function renderPrdProgress(prog) {
       ? '<span onclick="event.stopPropagation();prdItemReopen(\'' + escHtml(i.source || '') + '\',\'' + escHtml(i.id) + '\')" style="color:var(--blue);cursor:pointer;font-size:var(--text-xs);padding:1px 5px;background:rgba(56,139,253,0.1);border:1px solid rgba(56,139,253,0.3);border-radius:3px" title="Re-open: set to updated so engine re-dispatches on existing branch">re-open</span>'
       : '';
 
+    // P-79b47b0c — replace the bare prd-item-id span with a renderArtifactLink
+    // chip pointing at the backing WI (when one exists). The chip's onclick
+    // calls event.stopPropagation, so the parent row's prdItemEdit() still
+    // fires only on row-body clicks; clicking the chip opens the WI detail
+    // modal in-stack. When there's no backing WI, fall back to the legacy
+    // bare-id span (clicking the row still opens prdItemEdit).
+    const idChip = (wi && typeof renderArtifactLink === 'function')
+      ? renderArtifactLink({ type: 'wi', id: wi.id, label: i.id, title: i.name || wi.title || i.id })
+      : '<span class="prd-item-id">' + escHtml(i.id) + '</span>';
+
     return '<div class="prd-item-row st-' + (i.status || 'missing') + '" style="flex-wrap:wrap;cursor:pointer" onclick="if(shouldIgnoreSelectionClick(event))return;prdItemEdit(\'' + src + '\',\'' + iid + '\')">' +
       statusBadge(i.status, i.id) +
-      '<span class="prd-item-id">' + escHtml(i.id) + '</span>' +
+      idChip +
       '<span class="prd-item-name" title="' + escHtml(i.name) + '">' + escHtml(i.name) + '</span>' +
       wiLabel +
       agentLabel +
@@ -600,9 +617,13 @@ function renderPrdProgress(prog) {
       html += '<div style="font-size:var(--text-sm);font-weight:600;color:var(--blue);margin-bottom:4px">E2E Aggregate PRs</div>';
       html += prs.map(pr => {
         const statusColor = pr.status === 'active' ? 'var(--green)' : pr.status === 'merged' ? 'var(--purple)' : 'var(--muted)';
+        // P-79b47b0c — render PR id as in-stack chip (was raw <a target="_blank">).
+        const prChip = (typeof renderArtifactLink === 'function')
+          ? renderArtifactLink({ type: 'pr', id: pr.id, label: pr.id, title: pr.title || pr.id })
+          : '<code>' + escHtml(pr.id) + '</code>';
         return '<div style="display:flex;align-items:center;gap:6px;padding:2px 0;font-size:var(--text-base)">' +
           '<span style="color:' + statusColor + ';font-size:var(--text-xs);font-weight:600;padding:1px 4px;border:1px solid;border-radius:3px">' + escHtml(pr.status || 'active') + '</span>' +
-          '<a href="' + escHtml(pr.url || '#') + '" target="_blank" rel="noopener" style="color:var(--blue);text-decoration:underline;font-weight:500">' + escHtml(pr.id) + '</a>' +
+          prChip +
           '<span style="color:var(--text);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">' + escHtml(pr.title || '') + '</span>' +
           '<span style="color:var(--muted);font-size:var(--text-xs)">' + escHtml(pr._project || '') + '</span>' +
         '</div>';
@@ -791,7 +812,10 @@ async function prdItemEdit(source, itemId) {
     const completedAt = wi?.completedAt || completedEntry?.completed_at || '';
     const summary = completedEntry?.resultSummary || '';
     const prLinks = (item.prs || []).map(function(pr) {
-      return '<a href="' + escHtml(pr.url || '#') + '" target="_blank" rel="noopener" style="color:var(--green);text-decoration:underline">' + escHtml(pr.id) + '</a>';
+      // P-79b47b0c — render as in-stack chip (was raw <a target="_blank">).
+      return (typeof renderArtifactLink === 'function')
+        ? renderArtifactLink({ type: 'pr', id: pr.id, label: pr.id, title: pr.title || pr.id })
+        : '<code>' + escHtml(pr.id) + '</code>';
     }).join(', ');
 
     const statusColor = isDone ? 'var(--green)' : isFailed ? 'var(--red)' : 'var(--blue)';