@yemi33/minions 0.1.2321 → 0.1.2323

package/dashboard/docs/typography.md

@@ -41,7 +41,7 @@ two stay in lockstep.
 | Token              | Value | Common use                                                |
 | ------------------ | ----- | --------------------------------------------------------- |
 | `--text-xs`        | 10px  | Smallest legitimate text; sidebar badges, count pills     |
-| `--text-sm`        | 11px  | Status badges, chip / tag labels                          |
+| `--text-sm`        | 12px  | Status badges, chip / tag labels                          |
 | `--text-base`      | 12px  | Captions, secondary metadata, dense table cells           |
 | `--text-md`        | 13px  | Default for slim chat / detail tables / button labels     |
 | `--text-lg`        | 14px  | Body text, modal textarea, card titles                    |
@@ -57,6 +57,25 @@ two stay in lockstep.
 > token that breaks the "all px" rule and is explicitly allowlisted in
 > the tripwire.
 
+### 12px readability floor (W-mr3xgejt0008d3a5)
+
+`--text-sm` was raised from an 11px base to **12px** so it clears the 12px
+readability floor in both stylesheets: classic renders it at `12 × 1.05 =
+12.6px`, slim at `12 × 1 = 12px`. `--text-xs` (10px base) stays below the
+floor and is reserved for the very smallest chrome. To lift the
+highest-signal small-text callsites off `--text-xs`, these selectors were
+reassigned to `--text-sm`:
+
+- `.sidebar-count` — primary nav count pill
+- `.dispatch-stuck` — uppercase red "stuck" status badge
+- `.pl-node-meta` — muted plan-node secondary text
+- `.error-details-btn` — uppercase error-details button label
+
+The `--text-sm` selectors already on the token (`.table th`, `.pr-table th`,
+`.token-agent-table th`, `.status-badge`, `.sidebar-link`, slim
+`.tile-item-subtle`) now clear the floor automatically via the token bump —
+no per-callsite change needed.
+
 ## Role aliases (preferred for new code)
 
 Use the role token when adding new UI. It survives a future size-scale
@@ -70,7 +89,7 @@ redesign without callsite edits.
 | `--text-body`          | `--text-lg` (14px)  | Default body text, paragraphs             |
 | `--text-meta`          | `--text-md` (13px)  | Captions, timestamps, secondary metadata  |
 | `--text-caption`       | `--text-base` (12px)| Small labels, table cells                 |
-| `--text-micro`         | `--text-sm` (11px)  | Chip / tag pill labels                    |
+| `--text-micro`         | `--text-sm` (12px)  | Chip / tag pill labels                    |
 | `--text-code`          | (`0.9em`)           | Inline code                               |
 
 ## Utility classes

package/dashboard/js/render-other.js

@@ -69,8 +69,24 @@ function _renderProjectBranch(p) {
     ? ' <span class="muted">→ ' + mainBranch + '</span>'
     : '';
   const detachedSuffix = p.gitDetached ? ' <span class="muted">(detached)</span>' : '';
+  // opg-microsoft/minions#664 — the counts are always vs origin/<comparator>
+  // (configured mainBranch, falling back to remoteDefaultBranch; see
+  // engine/queries.js _probeProjectGitStatus), never vs the checked-out
+  // branch's own upstream. When branchDiffersFromMain the bare "↑N ↓M" chip
+  // reads as ambiguous (looks like it could be vs the current branch's
+  // tracking ref), so append the comparator name to the VISIBLE text too —
+  // not just the hover title — so the disambiguation doesn't require a
+  // hover. Skip the suffix when the checked-out branch IS the comparator
+  // since there's nothing to disambiguate.
+  const comparatorBranch = mainBranch || remoteDefault;
+  // Deliberately separate from branchDiffersFromMain (which only fires when a
+  // configured mainBranch is set, driving the "→ main" suffix): the ahead/
+  // behind comparator falls back to remoteDefaultBranch too, so the chip must
+  // disambiguate against whichever one actually produced the counts.
+  const branchDiffersFromComparator = !!(comparatorBranch && p.gitBranch !== (p.mainBranch || p.remoteDefaultBranch));
+  const comparatorSuffix = branchDiffersFromComparator ? ' vs ' + comparatorBranch : '';
   const aheadBehind = (ahead !== null && behind !== null && (ahead > 0 || behind > 0))
-    ? ' <span class="project-ab" title="' + escHtml('Ahead ' + ahead + ' / behind ' + behind + ' vs origin/' + (p.mainBranch || p.remoteDefaultBranch)) + '">↑' + ahead + ' ↓' + behind + '</span>'
+    ? ' <span class="project-ab" title="' + escHtml('Ahead ' + ahead + ' / behind ' + behind + ' vs origin/' + (p.mainBranch || p.remoteDefaultBranch)) + '">↑' + ahead + ' ↓' + behind + comparatorSuffix + '</span>'
     : '';
   // Warning chip surfaces when the configured main disagrees with the remote
   // default branch (the #2732 case: config=master, origin/HEAD=main) OR when

package/dashboard/js/render-prs.js

@@ -49,8 +49,14 @@ async function fetchPullRequestsFromDisk(projects) {
       out.push(pr);
     }
   }
-  // Same sort the engine applies: most recent created first, fall back to id.
+  // Same sort the engine applies (engine/queries.js#getPullRequests): group
+  // terminal (merged/abandoned/closed) PRs to the bottom, then most recent
+  // created first within each group, falling back to id.
+  const _isTerminalPr = (pr) => pr.status === 'merged' || pr.status === 'abandoned' || pr.status === 'closed';
   out.sort((a, b) => {
+    const at = _isTerminalPr(a) ? 1 : 0;
+    const bt = _isTerminalPr(b) ? 1 : 0;
+    if (at !== bt) return at - bt;
     const ac = a.created || '';
     const bc = b.created || '';
     if (ac && bc) return bc.localeCompare(ac);
@@ -196,8 +202,13 @@ function prRow(pr) {
   // clearly-labeled indicator — a still-red build after an unchanged fix
   // attempt usually means the failure isn't fixable by another agent pass
   // (flaky infra, external outage, etc.), hence "infra issue suspected".
-  // No resume action is wired here (clearing this record is an engine-side
-  // change out of scope for this UI-only follow-up) — informational only.
+  // Issue #671 — clicking resumes it via /api/pull-requests/clear-build-fix-ineffective
+  // (resumeBuildFixIneffective below), which clears _buildFixIneffective so
+  // BUILD_FAILURE auto-fix dispatch can resume. A new push already resets
+  // this pause automatically (see shared.isBuildFixIneffectivePaused); the
+  // click handler exists for the case where an operator has already
+  // confirmed (e.g. a fresh CI run queued against a rebased/retried head)
+  // and doesn't want to wait for the next poll to notice.
   var buildFixIneffective = pr._buildFixIneffective;
   if (buildFixIneffective && typeof buildFixIneffective === 'object' && buildFixIneffective.paused === true) {
     var bfiTitle = 'Build-fix reported no branch change, and a live CI re-poll confirmed the build is still "'
@@ -205,11 +216,14 @@ function prRow(pr) {
       + (buildFixIneffective.headSha || 'unknown head') + ') after '
       + (buildFixIneffective.count || '?') + ' ineffective attempt(s). Reason: '
       + (buildFixIneffective.reason || 'unknown')
-      + '. A new push to this branch will reset this pause.';
-    pausedChips += ' <span class="pr-badge rejected pr-build-fix-ineffective-chip" '
-      + 'style="font-size:var(--text-xs)" '
-      + 'title="' + escapeHtml(bfiTitle) + '">'
-      + '⏸ infra issue suspected ▶</span>';
+      + '. A new push to this branch will reset this pause automatically, or click to resume now.';
+    pausedChips += ' <button class="pr-badge rejected pr-build-fix-ineffective-chip" '
+      + 'style="font-size:var(--text-xs);cursor:pointer;border:none" '
+      + 'title="' + escapeHtml(bfiTitle) + '" '
+      + 'data-pr-id="' + escapeHtml(String(pr.id || '')) + '" '
+      + 'data-pr-head-sha="' + escapeHtml(String(buildFixIneffective.headSha || '')) + '" '
+      + 'onclick="event.stopPropagation();resumeBuildFixIneffective(this)">'
+      + '⏸ infra issue suspected ▶</button>';
   }
   const titleText = pr.title || 'Untitled';
   // Polish (W-mqv5ccn7): flatten Markdown in the body so the preview shows
@@ -264,15 +278,23 @@ function prRow(pr) {
   // ellipsis-truncated content reveals the full text. Cell tags stay bare so
   // the header-to-cell count assertion in test/unit.test.js continues to
   // balance.
+  // First-column secondary project label (W-mr3mowg9) — mirrors the pr-desc
+  // secondary-text pattern used in the Title cell so reviewers can see at a
+  // glance which project a PR belongs to. `_project` is stamped by the engine
+  // enrichment / getAllPrs stamping (see top-of-file note + line ~33).
+  const projectName = pr._project ? String(pr._project) : '';
+  const projectLabelHtml = projectName
+    ? '<div class="pr-desc pr-id-project" title="' + escapeHtml(projectName) + '">' + escapeHtml(projectName) + '</div>'
+    : '';
   return '<tr>' +
-    '<td><span class="pr-id" title="' + escapeHtml(String(prId)) + '">' + escapeHtml(prShortId(String(prId))) + '</span></td>' +
+    '<td><span class="pr-id" title="' + escapeHtml(String(prId)) + '">' + escapeHtml(prShortId(String(prId))) + '</span>' + projectLabelHtml + '</td>' +
     '<td><a class="pr-title" title="' + escapeHtml(titleText) + '" href="' + escapeHtml(safeUrl(url)) + '" target="_blank" rel="noopener">' + escapeHtml(titleText) + '</a>' + followupChip + pausedChips + (descPreview ? '<div class="pr-desc" title="' + escapeHtml(descPreview) + '">' + escapeHtml(descPreview.length > 120 ? descPreview.slice(0, 120) + '...' : descPreview) + '</div>' : '') + '</td>' +
-    '<td><span class="pr-agent" title="' + escapeHtml(agentText) + '">' + escapeHtml(agentText) + '</span></td>' +
-    '<td><span class="' + branchClass + '" title="' + escapeHtml(branchError || branchLabel) + '">' + escapeHtml(branchLabel) + '</span>' + pendingReasonHtml + '</td>' +
+    '<td><span class="pr-badge ' + statusClass + '" title="' + escapeHtml(statusLabel) + '">' + escapeHtml(statusLabel) + '</span></td>' +
     '<td><span class="pr-badge ' + reviewClass + '" title="' + escapeHtml(reviewTitle || reviewLabel) + '">' + escapeHtml(reviewLabel) + '</span></td>' +
+    '<td><span class="' + branchClass + '" title="' + escapeHtml(branchError || branchLabel) + '">' + escapeHtml(branchLabel) + '</span>' + pendingReasonHtml + '</td>' +
+    '<td><span class="pr-agent" title="' + escapeHtml(agentText) + '">' + escapeHtml(agentText) + '</span></td>' +
     '<td>' + reviewerCell + '</td>' +
     '<td><span class="pr-badge ' + buildClass + '" title="' + escapeHtml(buildTitle || buildLabel) + '">' + escapeHtml(buildLabel) + '</span></td>' +
-    '<td><span class="pr-badge ' + statusClass + '" title="' + escapeHtml(statusLabel) + '">' + escapeHtml(statusLabel) + '</span></td>' +
     '<td>' + (observeBtn || '<span style="color:var(--muted);font-size:var(--text-base)">—</span>') + '</td>' +
     '<td><span class="pr-date" title="' + escapeHtml(createdLabel) + '">' + escapeHtml(createdLabel) + '</span></td>' +
     '<td><button class="pr-info-pill" data-pr-id="' + escapeHtml(String(prId)) + '" onclick="event.stopPropagation();openPrDetail(this.dataset.prId)" title="Open PR detail (in-stack modal)">&#x2197;</button>' +
@@ -286,14 +308,14 @@ function prRow(pr) {
 // the viewport (sticky scrollbar — see styles.css).
 const PRS_COLGROUP =
   '<colgroup>' +
-    '<col style="width:110px">' +   // PR id (short label: `gh #481` / `ado #5383607`)
+    '<col style="width:130px">' +   // PR id (short label: `gh #481` / `ado #5383607`) + project label
     '<col style="width:320px">' +   // Title
-    '<col style="width:140px">' +   // Agent
-    '<col style="width:200px">' +   // Branch
+    '<col style="width:110px">' +   // Status
     '<col style="width:130px">' +   // Review
+    '<col style="width:200px">' +   // Branch
+    '<col style="width:140px">' +   // Agent
     '<col style="width:140px">' +   // Signed Off By
     '<col style="width:130px">' +   // Build
-    '<col style="width:110px">' +   // Status
     '<col style="width:100px">' +   // Observe
     '<col style="width:130px">' +   // Created
     '<col style="width:80px">' +    // Actions (info-pill + remove)
@@ -303,7 +325,7 @@ function prTableHtml(rows) {
   return '<div class="pr-table-wrap pr-table-wrap--prs"><table class="pr-table pr-table--prs">' +
     PRS_COLGROUP +
     '<thead><tr>' +
-    '<th>PR</th><th>Title</th><th>Agent</th><th>Branch</th><th>Review</th><th>Signed Off By</th><th>Build</th><th>Status</th><th>Observe</th><th>Created</th><th></th>' +
+    '<th>PR</th><th>Title</th><th>Status</th><th>Review</th><th>Branch</th><th>Agent</th><th>Signed Off By</th><th>Build</th><th>Observe</th><th>Created</th><th></th>' +
     '</tr></thead><tbody>' + rows + '</tbody></table></div>';
 }
 
@@ -735,4 +757,38 @@ async function resumePausedCause(btn) {
   }
 }
 
-window.MinionsPrs = { prRow, prTableHtml, renderPrs, prPrev, prNext, openAllPrs, openModal, openAddPrModal, openPrDetail, unlinkPr, togglePrObserve, resumePausedCause };
+// Issue #671 — resume a paused build-fix-ineffective ("infra issue
+// suspected") pause. Mirrors resumePausedCause above but targets the
+// headSha-keyed _buildFixIneffective record via its own endpoint. Sends the
+// headSha the chip was rendered with so the server can reject the clear as
+// stale if the pause has since moved to a different commit.
+async function resumeBuildFixIneffective(btn) {
+  if (!btn || btn.disabled) return;
+  const prId = btn.dataset.prId;
+  const headSha = btn.dataset.prHeadSha || '';
+  if (!prId) return;
+  if (!confirm('Resume build-fix automation on ' + prId + '?\n\nThis clears the "infra issue suspected" pause so the engine can re-dispatch build fixes on the next discovery pass.')) return;
+  btn.disabled = true;
+  const prevDisplay = btn.style.display;
+  btn.style.display = 'none';
+  showToast('pr-toast', 'Resumed build-fix automation on ' + prId, true);
+  try {
+    const res = await fetch('/api/pull-requests/clear-build-fix-ineffective', {
+      method: 'POST', headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ prId, headSha })
+    });
+    if (!res.ok) {
+      const d = await res.json().catch(() => ({}));
+      btn.style.display = prevDisplay;
+      btn.disabled = false;
+      showToast('pr-toast', 'Failed: ' + (d.error || 'unknown'), false);
+      return;
+    }
+  } catch (e) {
+    btn.style.display = prevDisplay;
+    btn.disabled = false;
+    showToast('pr-toast', 'Error: ' + e.message, false);
+  }
+}
+
+window.MinionsPrs = { prRow, prTableHtml, renderPrs, prPrev, prNext, openAllPrs, openModal, openAddPrModal, openPrDetail, unlinkPr, togglePrObserve, resumePausedCause, resumeBuildFixIneffective };

package/dashboard/slim/body.html

@@ -231,7 +231,12 @@
      the standard TILE_VIEWS path in modals-tiles.js#renderPlansBody. There is no
      slim-specific Plans/PRD flyout markup anymore (W-mr28ko750010199f / "reuse,
      don't fork"): the classic /plans screen is the single source of truth for the
-     Plans + PRD tabs and every lifecycle action. -->
+     Plans + PRD tabs and every lifecycle action.
+     The "Active PRs" cockpit tile follows the same iframe-embed pattern
+     (W-mr3l7y0m0007102a): it opens the LITERAL classic /prs screen in a chrome-off
+     iframe (/prs?embed=1) via modals-tiles.js#renderPrsBody, so the full PR
+     filter/sort UI + row actions (comment/track/link/pr-action) are the classic
+     screen — no slim-specific PR list to maintain. -->
 
 <!-- Pin editor — create (Pin Content action / "+ Pin") or edit an existing
      note. Submits to POST /api/pinned (create) or /api/pinned/update (edit). -->

package/dashboard/slim/js/modals-tiles.js

@@ -81,17 +81,6 @@
     return card;
   }
 
-  // Parse the org/project slug from a canonical PR id, dropping the host prefix
-  // and the trailing "#<num>". E.g. "ado:office/iss/constellation#5315603" →
-  // "office/iss/constellation", "github:yemi33/minions#2911" → "yemi33/minions".
-  function parsePrSlug(id) {
-    if (!id || typeof id !== 'string') return '';
-    var hash = id.indexOf('#');
-    var head = hash >= 0 ? id.slice(0, hash) : id;
-    var colon = head.indexOf(':');
-    return colon >= 0 ? head.slice(colon + 1) : head;
-  }
-
   // Per-tile body renderers for the detail modal. Each reads the latest status
   // snapshot and fills the modal body; openTileModal looks them up by key.
   function renderEngineTileBody(body, data) {
@@ -160,107 +149,23 @@
     body.appendChild(frame);
   }
 
-  function renderPrTileBody(body, data) {
-    // Emoji glyphs make build/review status scannable at a glance; the
-    // accompanying label keeps the row readable when the glyph alone is
-    // ambiguous (✅ vs ✅, ❌ vs ❌, ⏳ vs 💬). The raw status string also
-    // stays in the title attribute for hover discoverability.
-    // Keyed by normalized (lowercased) status; missing/unknown → ➖.
-    var BUILD_STATUS = {
-      success:     { glyph: '✅', label: 'passing' },
-      succeeded:   { glyph: '✅', label: 'passing' },
-      passing:     { glyph: '✅', label: 'passing' },
-      failing:     { glyph: '❌', label: 'failing' },
-      failed:      { glyph: '❌', label: 'failing' },
-      error:       { glyph: '❌', label: 'failing' },
-      pending:     { glyph: '⏳', label: 'pending' },
-      running:     { glyph: '⏳', label: 'running' },
-      queued:      { glyph: '⏳', label: 'queued' },
-      in_progress: { glyph: '⏳', label: 'in progress' },
-    };
-    var REVIEW_STATUS = {
-      approved:              { glyph: '✅', label: 'approved' },
-      'changes-requested':   { glyph: '❌', label: 'changes requested' },
-      changes_requested:     { glyph: '❌', label: 'changes requested' },
-      'requested-changes':   { glyph: '❌', label: 'changes requested' },
-      rejected:              { glyph: '❌', label: 'rejected' },
-      pending:               { glyph: '💬', label: 'pending' },
-      commented:             { glyph: '💬', label: 'commented' },
-    };
-    function statusSpan(subsystem, raw, table) {
-      var info = table[String(raw || '').toLowerCase()];
-      var glyph = info ? info.glyph : '➖';
-      var label = info ? info.label : (raw ? String(raw) : 'none');
-      var span = document.createElement('span');
-      span.className = 'pr-status';
-      span.textContent = glyph + ' ' + subsystem + ' ' + label;
-      span.title = subsystem + ': ' + (raw || 'unknown');
-      return span;
-    }
-    var prs = Array.isArray(data.pullRequests) ? data.pullRequests : [];
-    if (!prs.length) { tileEmpty(body, 'No tracked pull requests.'); return; }
-    function prCard(p) {
-      var num = p.prNumber || p.number || p.id;
-      var build = p.buildStatus || '';
-      var review = p.reviewStatus || '';
-      var cls = p.status === 'merged' ? 'green'
-              : (build === 'failing' ? 'red'
-              : ((p.status === 'active' || p.status === 'linked') ? 'blue' : ''));
-      var statusText = document.createElement('span');
-      statusText.textContent = p.status || 'unknown';
-      return tileCard({
-        title: (num ? '#' + num + ' ' : '') + (p.title || '(untitled PR)'),
-        // Project slug first (under title), then build/review row below — the
-        // project is the strongest disambiguator across PRs and benefits from
-        // being adjacent to the title.
-        subtle: parsePrSlug(p.id),
-        subtleBeforeMeta: true,
-        metaNodes: [statusText, statusSpan('build', build, BUILD_STATUS), statusSpan('review', review, REVIEW_STATUS)],
-        chip: { text: p.status || '—', cls: cls },
-        href: p.url || null,
-      });
-    }
-    // Partition once into three fixed buckets (status normalized to lowercase),
-    // preserving each PR's relative order within its bucket. Mirrors shared
-    // PR_STATUS (active/merged/abandoned/closed/linked); anything that does not
-    // match the merged/abandoned buckets defaults to Active so a PR with an
-    // unexpected status never silently disappears.
-    var buckets = { active: [], merged: [], abandoned: [] };
-    prs.forEach(function(p) {
-      var s = String(p.status || '').toLowerCase();
-      if (s === 'abandoned') buckets.abandoned.push(p);
-      else if (s === 'merged' || s === 'completed' || s === 'closed') buckets.merged.push(p);
-      else buckets.active.push(p);
-    });
-    // Fixed section order: Active (open) → Merged / Completed → Abandoned.
-    // Empty sections are omitted entirely.
-    var sections = [
-      { label: 'Active', prs: buckets.active, open: true },
-      { label: 'Merged / Completed', prs: buckets.merged, open: false },
-      { label: 'Abandoned', prs: buckets.abandoned, open: false },
-    ];
-    sections.forEach(function(section) {
-      if (!section.prs.length) return;
-      var details = document.createElement('details');
-      details.className = 'tile-section';
-      if (section.open) details.open = true;
-      var summary = document.createElement('summary');
-      summary.className = 'tile-section-summary';
-      var label = document.createElement('span');
-      label.className = 'tile-section-label';
-      label.textContent = section.label;
-      var count = document.createElement('span');
-      count.className = 'tile-section-count';
-      count.textContent = '(' + section.prs.length + ')';
-      summary.appendChild(label);
-      summary.appendChild(count);
-      details.appendChild(summary);
-      var sectionBody = document.createElement('div');
-      sectionBody.className = 'tile-section-body';
-      section.prs.forEach(function(p) { sectionBody.appendChild(prCard(p)); });
-      details.appendChild(sectionBody);
-      body.appendChild(details);
-    });
+  // Pull-requests tile body — reuses the LITERAL classic dashboard /prs screen
+  // instead of a slim-specific bucketed PR list, so there is one PRs UI, not two
+  // (W-mr3l7y0m0007102a / "reuse, don't fork" — mirrors renderQueuedWorkBody for
+  // the Work tile and renderPlansBody for the Plans tile). Slim and classic are
+  // two separate IIFE bundles with no shared scope, so we embed the real /prs
+  // screen in an iframe with the chrome-off ?embed=1 mode. The iframed page IS
+  // the classic screen — the full PR list with every filter/sort + row action
+  // (comment/track/link/pr-action), backed by the same /api/status pullRequests
+  // data + endpoints — with zero duplicated rendering logic. Classic is reachable
+  // at /prs even with slim-ux ON (only / is taken over). Built with createElement
+  // (no innerHTML) to satisfy the dashboard no-unsanitized lint gate.
+  function renderPrsBody(body) {
+    var frame = document.createElement('iframe');
+    frame.className = 'slim-prs-embed';
+    frame.src = '/prs?embed=1';
+    frame.title = 'Pull Requests';
+    body.appendChild(frame);
   }
 
   function renderWatchTileBody(body, data) {
@@ -283,7 +188,7 @@
     dispatches: { title: 'Active dispatches', render: function(body, data) { renderDispatchTileBody(body, data, true); } },
     queued:     { title: 'Queued work',       render: function(body) { renderQueuedWorkBody(body); } },
     plans:      { title: 'Plans',             render: function(body) { renderPlansBody(body); } },
-    prs:        { title: 'Pull requests',     render: renderPrTileBody },
+    prs:        { title: 'Pull requests',     render: function(body) { renderPrsBody(body); } },
     watches:    { title: 'Watches',           render: renderWatchTileBody },
   };
 
@@ -304,11 +209,13 @@
     // The "+ Link PR" header chip only applies to the PR list.
     var headerChip = document.getElementById('slim-tile-modal-linkpr');
     if (headerChip) headerChip.style.display = (key === 'prs') ? '' : 'none';
-    // The queued + plans tiles embed a full classic screen (/work, /plans) in an
-    // iframe — widen the modal + drop the body padding so the embedded screen
-    // gets real estate. Both reuse the shared wide-modal treatment.
+    // The queued, plans + prs tiles embed a full classic screen (/work, /plans,
+    // /prs) in an iframe — widen the modal + drop the body padding so the
+    // embedded screen gets real estate. All three reuse the shared wide-modal
+    // treatment.
     modal.classList.toggle('tile-modal--work', key === 'queued');
     modal.classList.toggle('tile-modal--plans', key === 'plans');
+    modal.classList.toggle('tile-modal--prs', key === 'prs');
     view.render(body, lastStatusData || {});
     modal.classList.add('open');
   }

package/dashboard/slim/styles.css

@@ -42,7 +42,7 @@
          the slim UI at its current text size — the global bump is excluded
          here by design. Do NOT raise this value to match main. */
       --minions-text-scale: 1;
-      --text-xs: calc(10px * var(--minions-text-scale)); --text-sm: calc(11px * var(--minions-text-scale)); --text-base: calc(12px * var(--minions-text-scale));
+      --text-xs: calc(10px * var(--minions-text-scale)); --text-sm: calc(12px * var(--minions-text-scale)); --text-base: calc(12px * var(--minions-text-scale));
       --text-md: calc(13px * var(--minions-text-scale)); --text-lg: calc(14px * var(--minions-text-scale)); --text-xl: calc(16px * var(--minions-text-scale)); --text-2xl: calc(18px * var(--minions-text-scale));
       --text-stat: calc(22px * var(--minions-text-scale)); --text-stat-lg: calc(28px * var(--minions-text-scale)); --text-display: calc(32px * var(--minions-text-scale));
       --text-role-display:    var(--text-display);
@@ -680,15 +680,19 @@
     /* Cockpit-tile detail modal: list of dispatches / PRs / watches, or a
        key/value engine readout (reuses .agent-detail-row). */
     #slim-tile-modal .modal { width: 720px; max-width: calc(100vw - 32px); }
-    /* W-mqrdggys000f94a4 / W-mr28ko750010199f — the Queued-work + Plans tiles
-       embed a full classic screen (/work, /plans) in an iframe; widen the modal +
-       remove body padding so the embedded screen gets the full width/height. */
+    /* W-mqrdggys000f94a4 / W-mr28ko750010199f / W-mr3l7y0m0007102a — the
+       Queued-work + Plans + PRs tiles embed a full classic screen (/work,
+       /plans, /prs) in an iframe; widen the modal + remove body padding so the
+       embedded screen gets the full width/height. */
     #slim-tile-modal.tile-modal--work .modal,
-    #slim-tile-modal.tile-modal--plans .modal { width: 1180px; }
+    #slim-tile-modal.tile-modal--plans .modal,
+    #slim-tile-modal.tile-modal--prs .modal { width: 1180px; }
     #slim-tile-modal.tile-modal--work .modal-body,
-    #slim-tile-modal.tile-modal--plans .modal-body { padding: 0; }
+    #slim-tile-modal.tile-modal--plans .modal-body,
+    #slim-tile-modal.tile-modal--prs .modal-body { padding: 0; }
     .slim-work-embed,
-    .slim-plans-embed {
+    .slim-plans-embed,
+    .slim-prs-embed {
       display: block; width: 100%; height: calc(100vh - 160px); min-height: 360px;
       border: 0; background: var(--bg);
     }
@@ -711,7 +715,6 @@
     }
     .tile-item-meta { font-size: var(--text-base); color: var(--muted); margin-top: 3px; word-break: break-word; }
     .tile-item-subtle { font-size: var(--text-sm); color: var(--muted); margin-top: 2px; word-break: break-word; }
-    .pr-status { display: inline-block; margin: 0 1px; text-decoration: none; }
     .tile-chip {
       flex: 0 0 auto;
       font-size: var(--text-base); font-weight: 700; letter-spacing: 0.4px; text-transform: uppercase;
@@ -724,26 +727,6 @@
     .tile-chip.blue  { background: rgba(88, 166, 255, 0.12); color: var(--blue);  border-color: var(--blue); }
     .tile-empty { color: var(--muted); font-style: italic; font-size: var(--text-md); }
 
-    /* Collapsible PR sections (Active / Merged-Completed / Abandoned). Uses
-       native <details>/<summary> — no JS wiring needed for the toggle. */
-    .tile-section { margin-bottom: 10px; }
-    .tile-section:last-child { margin-bottom: 0; }
-    .tile-section-summary {
-      display: flex; align-items: center; gap: 6px;
-      cursor: pointer; user-select: none;
-      padding: 4px 2px; margin-bottom: 6px;
-      list-style: none;
-      font-size: var(--text-base); color: var(--muted);
-    }
-    .tile-section-summary::-webkit-details-marker { display: none; }
-    .tile-section-summary::before {
-      content: "▸"; color: var(--muted); font-size: var(--text-sm);
-      transition: transform 0.15s ease;
-    }
-    .tile-section[open] > .tile-section-summary::before { content: "▾"; }
-    .tile-section-label { font-weight: 700; letter-spacing: 0.3px; text-transform: uppercase; color: var(--text); }
-    .tile-section-count { color: var(--muted); }
-
     /* Pinned-context list rows (Knowledge modal → Pinned Context tab). */
     .pinned-row {
       border: 1px solid var(--border);

package/dashboard/styles.css

@@ -28,7 +28,7 @@
        its own (un-scaled) factor of 1, so the slim UI is excluded from the
        bump by construction. */
     --minions-text-scale: 1.05;
-    --text-xs: calc(10px * var(--minions-text-scale)); --text-sm: calc(11px * var(--minions-text-scale)); --text-base: calc(12px * var(--minions-text-scale));
+    --text-xs: calc(10px * var(--minions-text-scale)); --text-sm: calc(12px * var(--minions-text-scale)); --text-base: calc(12px * var(--minions-text-scale));
     --text-md: calc(13px * var(--minions-text-scale)); --text-lg: calc(14px * var(--minions-text-scale)); --text-xl: calc(16px * var(--minions-text-scale)); --text-2xl: calc(18px * var(--minions-text-scale));
     --text-stat: calc(22px * var(--minions-text-scale)); --text-stat-lg: calc(28px * var(--minions-text-scale)); --text-display: calc(32px * var(--minions-text-scale));
 
@@ -45,7 +45,7 @@
     --text-body:            var(--text-lg);       /* 14px — default body text */
     --text-meta:            var(--text-md);       /* 13px — captions, timestamps, secondary metadata */
     --text-caption:         var(--text-base);     /* 12px — small labels, table cells */
-    --text-micro:           var(--text-sm);       /* 11px — chip / tag pill labels */
+    --text-micro:           var(--text-sm);       /* 12px — chip / tag pill labels */
     --text-code:            0.9em;                /* inline code; relative so it scales with the surrounding text */
 
     /* Border radius */
@@ -107,7 +107,7 @@
   .sidebar-link .notif-badge.done { top: 50%; right: 6px; transform: translateY(-50%); width: 6px; height: 6px; }
   .sidebar-link:hover { color: var(--text); background: var(--surface2); }
   .sidebar-link.active { color: var(--blue); border-left-color: var(--blue); background: var(--surface2); font-weight: 600; }
-  .sidebar-count { font-size: var(--text-xs); color: var(--muted); background: var(--surface2); padding: 1px 5px; border-radius: 8px; min-width: 16px; text-align: center; }
+  .sidebar-count { font-size: var(--text-sm); color: var(--muted); background: var(--surface2); padding: 1px 5px; border-radius: 8px; min-width: 16px; text-align: center; }
   .page-content { flex: 1; overflow-y: auto; min-width: 0; }
   .page { display: none; }
   .page.active { display: block; }
@@ -264,7 +264,7 @@
   .pl-node-box.condition { border-style: dashed; }
   .pl-node-box.pl-node-stop { border-style: dotted; border-color: var(--muted); opacity: 0.7; }
   .pl-node-arrow { display: flex; align-items: center; padding: 0 2px; color: var(--muted); font-size: var(--text-md); flex-shrink: 0; margin-top: 8px; }
-  .pl-node-meta { font-size: var(--text-xs); color: var(--muted); margin-top: 2px; text-align: center; max-width: 120px; overflow: hidden; text-overflow: ellipsis; }
+  .pl-node-meta { font-size: var(--text-sm); color: var(--muted); margin-top: 2px; text-align: center; max-width: 120px; overflow: hidden; text-overflow: ellipsis; }
   .pl-node-loop { font-size: var(--text-sm); color: var(--muted); margin-top: 6px; display: flex; align-items: center; gap: 6px; }
   .pipeline-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 12px 16px; margin-bottom: var(--space-4); cursor: pointer; transition: border-color var(--transition-fast), transform var(--transition-fast); }
   .pipeline-card:hover { border-color: var(--blue); transform: translateY(-1px); }
@@ -358,6 +358,7 @@
   .pr-title:hover { text-decoration: underline; }
   .pr-desc { color: var(--muted); font-size: var(--text-sm); font-weight: 400; margin-top: 2px; line-height: 1.4; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 400px; }
   .pr-id { color: var(--muted); font-family: Consolas, monospace; font-size: var(--text-base); }
+  .pr-id-project { max-width: 120px; font-size: var(--text-xs); }
   .pr-agent { font-size: var(--text-base); color: var(--text); }
   .pr-branch { display: inline-block; max-width: 280px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; font-family: Consolas, monospace; font-size: var(--text-sm); color: var(--muted); background: var(--bg); padding: var(--space-1) var(--space-3); border-radius: 3px; border: 1px solid var(--border); }
   .pr-branch.branch-missing { color: var(--red); border-color: var(--red); background: rgba(248,81,73,0.12); }
@@ -377,7 +378,7 @@
   .pr-badge.build-escalated { background: rgba(248,81,73,0.25); color: var(--red); border: 2px solid var(--red); font-weight: 600; }
   /* W-mq08kuog001110a6 — Needs-Attention chip for stuck pending work items. */
   .pr-badge.needs-attention { background: rgba(210,153,34,0.15); color: var(--yellow); border: 1px solid var(--yellow); font-weight: 600; cursor: help; }
-  .error-details-btn { font-size: var(--text-xs); padding: var(--space-1) var(--space-3); margin-left: var(--space-2); background: rgba(248,81,73,0.15); color: var(--red); border: 1px solid var(--red); border-radius: var(--radius-lg); cursor: pointer; font-weight: 600; text-transform: uppercase; letter-spacing: 0.3px; }
+  .error-details-btn { font-size: var(--text-sm); padding: var(--space-1) var(--space-3); margin-left: var(--space-2); background: rgba(248,81,73,0.15); color: var(--red); border: 1px solid var(--red); border-radius: var(--radius-lg); cursor: pointer; font-weight: 600; text-transform: uppercase; letter-spacing: 0.3px; }
   .error-details-btn:hover { background: rgba(248,81,73,0.3); }
   .pr-empty { color: var(--muted); font-style: italic; font-size: var(--text-md); padding: var(--space-6) 0; }
   .pr-pager { display: flex; align-items: center; justify-content: space-between; margin-top: 10px; }
@@ -670,7 +671,8 @@
      in render-other.js, but with a dashed border + green text to read as
      a placeholder/call-to-action. */
   .empty-state-add {
-    display: inline-block;
+    display: inline-flex; align-items: center; justify-content: center;
+    min-height: 24px; min-width: 24px;
     background: var(--surface2);
     border: 1px dashed var(--border);
     color: var(--green);
@@ -786,7 +788,15 @@
   .cmd-chip.priority-medium { color: var(--yellow); border-color: rgba(210,153,34,0.3); background: rgba(210,153,34,0.08); }
   .cmd-chip.priority-low { color: var(--muted); }
   .cmd-chip.project-chip { color: var(--green); border-color: rgba(63,185,80,0.3); background: rgba(63,185,80,0.08); }
-  .cmd-chip .chip-x { cursor: pointer; opacity: 0.5; margin-left: 2px; font-size: var(--text-lg); }
+  /* Close/remove affordance on command chips. Sized as a >=24x24px hit target
+     (W-mr3xgo9a a11y sweep) via inline-flex box + min dimensions rather than
+     relying on the bare glyph; the glyph stays centered. Negative vertical
+     margins keep the enlarged tap box from inflating the parent chip's height. */
+  .cmd-chip .chip-x {
+    display: inline-flex; align-items: center; justify-content: center;
+    min-width: 24px; min-height: 24px; margin: -4px -4px -4px 2px;
+    cursor: pointer; opacity: 0.5; font-size: var(--text-lg);
+  }
   .cmd-chip .chip-x:hover { opacity: 1; }
   .cmd-chip select {
     background: transparent; border: none; color: inherit; font-size: var(--text-base);
@@ -978,7 +988,7 @@
   .dispatch-agent { font-weight: 600; color: var(--text); }
   .dispatch-task { flex: 1; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
   .dispatch-time { font-size: var(--text-sm); color: var(--border); }
-  .dispatch-stuck { font-size: var(--text-xs); font-weight: 700; padding: var(--space-1) var(--space-3); border-radius: var(--radius-sm); text-transform: uppercase; letter-spacing: 0.3px; background: rgba(248,81,73,0.18); color: var(--red); border: 1px dashed var(--red); margin-left: var(--space-2); animation: pulse 1.5s infinite; cursor: help; }
+  .dispatch-stuck { font-size: var(--text-sm); font-weight: 700; padding: var(--space-1) var(--space-3); border-radius: var(--radius-sm); text-transform: uppercase; letter-spacing: 0.3px; background: rgba(248,81,73,0.18); color: var(--red); border: 1px dashed var(--red); margin-left: var(--space-2); animation: pulse 1.5s infinite; cursor: help; }
 
   /* Engine Log */
   .log-list { max-height: 280px; overflow-y: auto; display: flex; flex-direction: column; gap: var(--space-1); }