@hanzlaa/rcode 4.6.0 → 4.7.1

package/server/lib/html/client/components/shared.js

@@ -7,12 +7,12 @@
  * Import from here; do NOT inline these in view modules.
  */
 
-import { html, useState } from '../preact.js';
+import { html, useState, useEffect } from '../preact.js';
 import { pctNum, chip as chipDesc, humanDate, pct, currentPhaseId } from '../util.js';
 import {
   isSessionRunning, runningInSprint, runningInPhase,
 } from '../orchestrator.js';
-import { getState } from '../store.js';
+import { getState, openFileViewer } from '../store.js';
 import { Icon } from '../icons-client.js';
 import { TaskPipeline } from './TaskPipeline.js';
 import { openRunnerPicker } from './RunnerPicker.js';
@@ -264,11 +264,20 @@ export function SprintCard({ sprint: s, S }) {
   const borderStyle = isCur
     ? 'border-left-color:var(--accent-amber);background:rgba(245,158,11,0.04)'
     : '';
+  function handleViewFile(e) {
+    e.stopPropagation();
+    openFileViewer(s.file, 'Sprint ' + s.id);
+  }
   return html`
     <div class=${'item item-clickable' + (isCur ? ' sprint-current' : '')} style=${borderStyle}
       ...${pressable(() => { location.hash = 'sprints/' + s.id; })}>
       <div class="item-title">
         <${RunBtn} storyId=${'sprint-' + s.id} cmd=${'/rcode-execute-sprint ' + s.id} label=${'Sprint ' + s.id}/>
+        ${s.file ? html`
+          <button class="card-file-btn" title=${'View ' + s.file} onClick=${handleViewFile}>
+            <${Icon} name="file-text" size=${11}/> File
+          </button>
+        ` : null}
         Sprint ${s.id} — ${s.goal || 'No goal'}
         ${isCur ? html`<${Tag}>current</${Tag}>` : null}
         <${Chip} status=${s.status}/>
@@ -321,6 +330,10 @@ export function TaskCard({ task: t }) {
     }
   }
 
+  function handleViewFile(e) {
+    e.stopPropagation();
+    openFileViewer(t.file, t.title);
+  }
   return html`
     <div class="item item-clickable" data-status=${t.status || ''}
       style=${done ? 'opacity:.65' : ''}
@@ -328,6 +341,11 @@ export function TaskCard({ task: t }) {
       ...${pressable(() => setExpanded(e => !e))}>
       <div class="item-title" style=${done ? 'text-decoration:line-through' : ''}>
         ${t.id && !done ? html`<${RunBtn} storyId=${t.id} cmd=${'/rcode-dev-story ' + t.id} label=${'Story ' + t.id}/>` : null}
+        ${t.file ? html`
+          <button class="card-file-btn" title=${'View ' + t.file} onClick=${handleViewFile}>
+            <${Icon} name="file-text" size=${11}/> File
+          </button>
+        ` : null}
         ${done ? '✓ ' : ''}${t.title}
         <${Chip} status=${t.status}/>
         <span class="task-expand-icon">${expanded ? '▼' : '▶'}</span>
@@ -378,3 +396,94 @@ export function TaskCard({ task: t }) {
     </div>
   `;
 }
+
+// ---- DecisionDrawer ----
+/**
+ * Same slide-over shell as FileReader (.reader-*) but shows a decision
+ * record's own fields instead of fetching a file — decisions have no
+ * backing markdown file, only whatever state.json recorded for them.
+ * @param {{ decision: object|null, onClose: function }} props
+ */
+export function DecisionDrawer({ decision: d, onClose }) {
+  // Hooks run unconditionally (Rules of Hooks) even though the component
+  // renders null below when there's nothing open.
+  useEffect(() => {
+    function onKey(e) { if (e.key === 'Escape' && onClose) onClose(); }
+    document.addEventListener('keydown', onKey);
+    return () => document.removeEventListener('keydown', onKey);
+  }, [onClose]);
+
+  if (!d) return null;
+  const title = d.title || d.summary || d.decision || 'Decision';
+
+  // state.json only records a short summary + a few fields for each entry —
+  // the full write-up (rationale, alternatives considered) lives in the
+  // separate, manually-curated decision log. There's no reliable way to
+  // match this specific record to one entry in that file, so this opens the
+  // whole log rather than pretending to jump to the right spot.
+  function handleOpenLog(e) {
+    e.stopPropagation();
+    onClose();
+    openFileViewer('.rcode/memory/project/decisions.md', 'Decision Log');
+  }
+
+  return html`
+    <div class="reader-backdrop" onClick=${onClose}></div>
+    <div class="reader-panel" role="dialog" aria-label=${title}>
+      <div class="reader-header">
+        <div class="reader-heading">
+          <div class="reader-title">${title}</div>
+          ${d.phase ? html`<div class="reader-path">Phase ${d.phase}</div>` : null}
+        </div>
+        <div class="reader-actions">
+          <button class="reader-copy" onClick=${handleOpenLog}>View decision log →</button>
+          <button class="reader-close" aria-label="Close" onClick=${onClose}>×</button>
+        </div>
+      </div>
+      <div class="reader-body">
+        ${d.status ? html`<div class="task-detail-row"><strong>Status:</strong> <${Chip} status=${d.status}/></div>` : null}
+        ${d.date ? html`<div class="task-detail-row"><strong>Date:</strong> ${humanDate(d.date)}</div>` : null}
+        ${d.plan != null ? html`<div class="task-detail-row"><strong>Plan:</strong> ${d.plan}</div>` : null}
+        ${d.rationale ? html`<div class="task-detail-row"><strong>Rationale:</strong> ${d.rationale}</div>` : null}
+        <div class="dash-empty">
+          <span>This is everything state.json recorded for this entry. Full rationale and alternatives (when written up) live in the decision log.</span>
+        </div>
+      </div>
+    </div>
+  `;
+}
+
+// ---- BlockerDrawer ----
+/**
+ * Same slide-over shell as DecisionDrawer — blockers are plain
+ * { title, desc, severity } records in state.json, no backing file.
+ * @param {{ blocker: object|null, onClose: function }} props
+ */
+export function BlockerDrawer({ blocker: b, onClose }) {
+  useEffect(() => {
+    function onKey(e) { if (e.key === 'Escape' && onClose) onClose(); }
+    document.addEventListener('keydown', onKey);
+    return () => document.removeEventListener('keydown', onKey);
+  }, [onClose]);
+
+  if (!b) return null;
+  const sev = ['high', 'medium', 'low'].includes(b.severity) ? b.severity : 'low';
+
+  return html`
+    <div class="reader-backdrop" onClick=${onClose}></div>
+    <div class="reader-panel" role="dialog" aria-label=${b.title}>
+      <div class="reader-header">
+        <div class="reader-heading">
+          <div class="reader-title">${b.title}</div>
+        </div>
+        <div class="reader-actions">
+          <button class="reader-close" aria-label="Close" onClick=${onClose}>×</button>
+        </div>
+      </div>
+      <div class="reader-body">
+        <div class="task-detail-row"><strong>Severity:</strong> <span class=${'bk-pill bk-sev-' + sev}>${sev}</span></div>
+        ${b.desc ? html`<div class="task-detail-row"><strong>Details:</strong> ${b.desc}</div>` : null}
+      </div>
+    </div>
+  `;
+}

package/server/lib/html/client/store.js

@@ -23,6 +23,7 @@ let _state = {
   timeline:         _seed.timeline         || null,
   tasks:            _seed.tasks            || null,
   health:           _seed.health           || null,
+  backlog:          _seed.backlog          || [],
   // Fields injected by client.js / window.__S__
   phases:           _seed.phases           || [],
   milestone:        _seed.milestone        || '',
@@ -81,11 +82,57 @@ let _state = {
   // renders and the spawn waits for explicit user approval.
   // { kind: 'story'|'command', storyId?, cmd, title, opts }
   runConfirm:       null,
+  // Global file-viewer drawer state — opens FileReader over whatever view is
+  // currently active (Overview, Phases, Sprints, Tasks, Roadmap, ...) without
+  // navigating away, unlike the older requestedFile→Files-view bridge above.
+  // { path, title } | null. Driven by openFileViewer()/closeFileViewer() below.
+  fileViewer:       null,
+  // Global decision-detail drawer state. Decisions have no backing file (they
+  // live as plain records in state.json), so this shows the record's own
+  // fields rather than fetching anything. The raw decision object | null.
+  decisionViewer:   null,
+  // Global blocker-detail drawer state — same reasoning as decisionViewer:
+  // blockers are plain { title, desc, severity } records with no backing
+  // file. The raw blocker object | null.
+  blockerViewer:    null,
 };
 
 /** Registered subscriber functions. */
 const _subscribers = new Set();
 
+/** Open the global file-viewer drawer over the current view. No-op when path is falsy. */
+export function openFileViewer(path, title) {
+  if (!path) return;
+  setState({ fileViewer: { path, title: title || path.split('/').pop() } });
+}
+
+/** Close the global file-viewer drawer. */
+export function closeFileViewer() {
+  setState({ fileViewer: null });
+}
+
+/** Open the global decision-detail drawer. No-op when decision is falsy. */
+export function openDecisionViewer(decision) {
+  if (!decision) return;
+  setState({ decisionViewer: decision });
+}
+
+/** Close the global decision-detail drawer. */
+export function closeDecisionViewer() {
+  setState({ decisionViewer: null });
+}
+
+/** Open the global blocker-detail drawer. No-op when blocker is falsy. */
+export function openBlockerViewer(blocker) {
+  if (!blocker) return;
+  setState({ blockerViewer: blocker });
+}
+
+/** Close the global blocker-detail drawer. */
+export function closeBlockerViewer() {
+  setState({ blockerViewer: null });
+}
+
 /** Return a shallow copy of the current state. */
 export function getState() {
   return { ..._state };

package/server/lib/html/client/util.js

@@ -75,7 +75,7 @@ export function allSprints(phases) {
 export function allTasks(phases) {
   return (phases || []).flatMap(p =>
     (p.sprints || []).flatMap(s =>
-      (s.stories || []).map(t => Object.assign({}, t, { sprintId: s.id, phaseId: p.id, phaseName: p.name }))
+      (s.stories || []).map(t => Object.assign({}, t, { sprintId: s.id, phaseId: p.id, phaseName: p.name, file: s.file || null }))
     )
   );
 }
@@ -139,27 +139,6 @@ export function sessionChip(status) {
   return { cls, label: status };
 }
 
-/**
- * Props for a clickable card row that navigates to a hash route.
- * Spread onto a list row (`<li ...${rowLink('tasks')}>`) to make it act like
- * a link: pointer + keyboard activation and an accessible role. Pair with the
- * `ovr-link` class for the hover/focus affordance.
- *
- * @param {string} hash — target hash route without the leading '#'.
- * @returns {object} Preact props (role, tabindex, onClick, onKeyDown).
- */
-export function rowLink(hash) {
-  const go = () => { location.hash = hash; };
-  return {
-    role: 'link',
-    tabindex: 0,
-    onClick: go,
-    onKeyDown: (e) => {
-      if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); go(); }
-    },
-  };
-}
-
 /**
  * Human-readable elapsed time since an ISO timestamp.
  * Ported from _orchElapsed() in client-main.js.

package/server/lib/html/client/views/BacklogView.js

@@ -0,0 +1,44 @@
+/**
+ * BacklogView — Preact component.
+ *
+ * Lists phases that haven't started yet (state.dashboard.backlog, derived
+ * server-side in scanner.js from phases with state === 'todo'). Each row
+ * links to that phase's detail page — same navigation PhaseCard/SprintCard
+ * already use elsewhere, no new routing concept.
+ */
+
+import { html } from '../preact.js';
+import { useStore } from '../store.js';
+import { pressable } from '../components/shared.js';
+import { Icon } from '../icons-client.js';
+
+export function BacklogView() {
+  const S = useStore();
+  const backlog = S.backlog || [];
+
+  return html`
+    <div id="view-backlog" class="view active">
+      <div class="view-title">Backlog</div>
+      ${backlog.length === 0
+        ? html`
+          <div class="empty">
+            No phases waiting in the backlog.
+            <div class="empty-action">Run /rcode-add-phase to queue up new work</div>
+          </div>
+        `
+        : html`
+          <div class="phase-list">
+            ${backlog.map(p => html`
+              <div key=${p.id} class="item item-clickable"
+                ...${pressable(() => { location.hash = 'phases/' + p.id; })}>
+                <div class="item-title">
+                  <${Icon} name="clipboard-list" size=${16}/> Phase ${p.id} — ${p.name}
+                </div>
+                ${p.range ? html`<div class="item-meta">${p.range}</div>` : null}
+              </div>
+            `)}
+          </div>
+        `}
+    </div>
+  `;
+}

package/server/lib/html/client/views/DecisionsView.js

@@ -7,9 +7,9 @@
  */
 
 import { html, useState } from '../preact.js';
-import { useStore } from '../store.js';
+import { useStore, openDecisionViewer } from '../store.js';
 import { humanDate } from '../util.js';
-import { CmdHint, CmdHints, showToast } from '../components/shared.js';
+import { CmdHint, CmdHints, showToast, pressable } from '../components/shared.js';
 
 const CMD_HINTS = [
   ['/rcode-council',                   'Convene the council for a new decision'],
@@ -83,8 +83,9 @@ export function DecisionsView() {
                   const rationale = (typeof d === 'object' && d.rationale)
                     ? html`<div style="color:var(--text-secondary);font-size:var(--text-sm);margin-top:4px;">${d.rationale}</div>`
                     : null;
+                  const decisionObj = typeof d === 'object' ? d : { title: d };
                   return html`
-                    <div key=${i} class="item">
+                    <div key=${i} class="item item-clickable" ...${pressable(() => openDecisionViewer(decisionObj))}>
                       <div class="item-title">${title}${dateInfo}</div>
                       <div class="item-meta">${phaseInfo}</div>
                       ${rationale}

package/server/lib/html/client/views/FilesView.js

@@ -10,20 +10,27 @@
  * clears the field so subsequent renders don't re-trigger.
  */
 
-import { html, useState, useEffect } from '../preact.js';
+import { html, useState, useEffect, useMemo } from '../preact.js';
 import { useStore, setState } from '../store.js';
 import { FileReader } from '../components/FileReader.js';
+import { Icon } from '../icons-client.js';
+
+// File-type icon — markdown gets its own glyph, everything else a plain file.
+function fileIcon(label) {
+  return /\.md$/i.test(label || '') ? 'file-text' : 'file';
+}
 
 // ---- File tree components ----
-function FileEntry({ file, extraText, onSelect, isSelected }) {
+function FileEntry({ file, onSelect, isSelected }) {
   return html`
     <div
-      class=${'item item-clickable inline-file-entry' + (isSelected ? ' selected' : '')}
+      class=${'inline-file-entry' + (isSelected ? ' selected' : '')}
       data-path=${file.path}
+      title=${file.path}
       onClick=${() => onSelect(file)}
-      style="padding:var(--space-2) var(--space-3);font-family:'SF Mono',Monaco,Consolas,monospace;font-size:var(--text-xs);"
     >
-      ${file.label}
+      <${Icon} name=${fileIcon(file.label)} size=${13}/>
+      <span class="inline-file-label">${file.label}</span>
     </div>
   `;
 }
@@ -36,31 +43,31 @@ function FileGroup({ group, onSelect, selectedPath, filter }) {
   }
 
   if (group.subGroups) {
+    const subGroupsVisible = group.subGroups
+      .map(sg => ({ sg, visible: sg.files.filter(f => matchesFilter(f, sg.subGroup)) }))
+      .filter(x => x.visible.length);
+    if (!subGroupsVisible.length) return null;
+    const total = subGroupsVisible.reduce((n, x) => n + x.visible.length, 0);
     return html`
-      <div class="inline-file-group" style="margin-bottom:var(--space-3);">
-        <div style="font-size:var(--text-xs);font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:0.07em;padding:var(--space-1) var(--space-3);">
-          ${group.group}
+      <div class="inline-file-group">
+        <div class="inline-file-group-title">
+          ${group.group} <span class="inline-file-group-count">${total}</span>
         </div>
-        ${group.subGroups.map(sg => {
-          const visible = sg.files.filter(f => matchesFilter(f, sg.subGroup));
-          if (!visible.length) return null;
-          return html`
-            <details class="inline-subgroup" open style="margin-left:var(--space-2);margin-bottom:var(--space-1);">
-              <summary style="font-size:var(--text-xs);font-weight:500;color:var(--text-secondary);cursor:pointer;padding:var(--space-1) var(--space-3);user-select:none;">
-                ${sg.subGroup} <span style="color:var(--text-muted);font-weight:400;">(${visible.length})</span>
-              </summary>
-              ${visible.map(f => html`
-                <${FileEntry}
-                  key=${f.path}
-                  file=${f}
-                  extraText=${sg.subGroup}
-                  onSelect=${onSelect}
-                  isSelected=${selectedPath === f.path}
-                />
-              `)}
-            </details>
-          `;
-        })}
+        ${subGroupsVisible.map(({ sg, visible }) => html`
+          <details class="inline-subgroup" open>
+            <summary class="inline-subgroup-summary">
+              ${sg.subGroup} <span class="inline-file-group-count">${visible.length}</span>
+            </summary>
+            ${visible.map(f => html`
+              <${FileEntry}
+                key=${f.path}
+                file=${f}
+                onSelect=${onSelect}
+                isSelected=${selectedPath === f.path}
+              />
+            `)}
+          </details>
+        `)}
       </div>
     `;
   }
@@ -69,9 +76,9 @@ function FileGroup({ group, onSelect, selectedPath, filter }) {
     const visible = group.files.filter(f => matchesFilter(f, ''));
     if (!visible.length) return null;
     return html`
-      <div class="inline-file-group" style="margin-bottom:var(--space-3);">
-        <div style="font-size:var(--text-xs);font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:0.07em;padding:var(--space-1) var(--space-3);">
-          ${group.group}
+      <div class="inline-file-group">
+        <div class="inline-file-group-title">
+          ${group.group} <span class="inline-file-group-count">${visible.length}</span>
         </div>
         ${visible.map(f => html`
           <${FileEntry}
@@ -116,9 +123,15 @@ export function FilesView() {
     setState({ requestedFile: null });
   }, [requestedFile]);
 
+  const total = useMemo(() => groups.reduce((n, g) =>
+    n + (g.files ? g.files.length : (g.subGroups || []).reduce((m, sg) => m + sg.files.length, 0)), 0),
+    [groups]);
+
   return html`
     <div class="view active" id="view-files">
-      <div class="view-title">Files</div>
+      <div class="view-title">
+        Files ${total > 0 ? html`<span class="inline-file-total">${total}</span>` : null}
+      </div>
       <div id="file-list-inline">
         <div class="filter-bar">
           <input
@@ -131,9 +144,9 @@ export function FilesView() {
         </div>
         <div id="inline-file-items" class="phase-list">
           ${loading
-            ? html`<div class="empty" style="margin:16px;">Loading…</div>`
+            ? html`<div class="empty">Loading…</div>`
             : groups.length === 0
-              ? html`<div class="empty" style="margin:16px;">No files found.</div>`
+              ? html`<div class="empty">No files found.</div>`
               : groups.map(g => html`
                   <${FileGroup}
                     key=${g.group}

package/server/lib/html/client/views/KanbanView.js

@@ -11,6 +11,7 @@ import { html, useState, useCallback } from '../preact.js';
 import { useStore, refresh } from '../store.js';
 import { allTasks, currentPhaseName } from '../util.js';
 import { stopStory, openOrchPanel, openTermPanel, setTaskStatus } from '../orchestrator.js';
+import { openFileViewer } from '../store.js';
 import { openRunnerPicker } from '../components/RunnerPicker.js';
 import { showToast } from '../components/shared.js';
 
@@ -66,6 +67,10 @@ function KanbanCard({ task, col, live, orchDown, onDragStart, onDragEnd }) {
     e.stopPropagation();
     openOrchPanel(sid);
   }
+  function handleViewFile(e) {
+    e.stopPropagation();
+    openFileViewer(task.file, task.title || sid);
+  }
 
   return html`
     <div
@@ -92,6 +97,9 @@ function KanbanCard({ task, col, live, orchDown, onDragStart, onDragEnd }) {
       ` : null}
       ${sid ? html`
         <div class="kanban-card-actions">
+          ${task.file ? html`
+            <button class="kanban-view-btn" title=${'View ' + task.file} onClick=${handleViewFile}>📄 File</button>
+          ` : null}
           ${canRun ? html`
             <button class="kanban-run-btn" disabled=${orchDown}
               title=${orchDown ? 'Orchestrator unreachable' : 'Run ' + sid}

package/server/lib/html/client/views/PhasesView.js

@@ -14,6 +14,7 @@ import {
   Chip, ProgressBar, Breadcrumb, CmdHints, RunningBadge, SprintCard, PhaseCard,
 } from '../components/shared.js';
 import { openTermPanel, runningInPhase } from '../orchestrator.js';
+import { openFileViewer } from '../store.js';
 import { openRunnerPicker } from '../components/RunnerPicker.js';
 import { Icon } from '../icons-client.js';
 import { StatusSummaryBar } from '../components/StatusSummaryBar.js';
@@ -71,10 +72,12 @@ function PhaseDetail({ phase: p, S }) {
     e.stopPropagation();
     openTermPanel('phase-' + p.id, 'Phase ' + p.id);
   }
+  // First sprint that has a resolved SPRINT.md path — the phase-level "view
+  // plan" entry point; each SprintCard below also gets its own precise button.
+  const planFile = (sps.find(s => s.file) || {}).file || null;
   function handleViewPlan(e) {
     e.stopPropagation();
-    // Navigate to files view — viewPlanFile was a legacy DOM function
-    window.location.hash = 'files';
+    openFileViewer(planFile, 'Phase ' + p.id + ' plan');
   }
 
   return html`
@@ -99,7 +102,9 @@ function PhaseDetail({ phase: p, S }) {
       <div class="term-action-bar">
         <button class="term-run-btn" onClick=${handleRun}>▶ Run Phase</button>
         <button class="term-run-btn outline" onClick=${handleTerm}><${Icon} name="monitor" size=${14}/> Terminal</button>
-        <button class="back-btn" onClick=${handleViewPlan}><${Icon} name="file-text" size=${14}/> View plan file →</button>
+        ${planFile ? html`
+          <button class="back-btn" onClick=${handleViewPlan}><${Icon} name="file-text" size=${14}/> View plan file →</button>
+        ` : null}
       </div>
       <${VelocityBars} sprints=${sps}/>
       <div class="view-title" style="margin-top:var(--space-6)">Sprints</div>

package/server/lib/html/client/views/SprintsView.js

@@ -15,6 +15,7 @@ import {
   Chip, ProgressBar, Breadcrumb, CmdHints, RunningBadge, SprintCard, TaskCard,
 } from '../components/shared.js';
 import { openTermPanel, runningInSprint } from '../orchestrator.js';
+import { openFileViewer } from '../store.js';
 import { openRunnerPicker } from '../components/RunnerPicker.js';
 import { Icon } from '../icons-client.js';
 import { StatusSummaryBar } from '../components/StatusSummaryBar.js';
@@ -37,6 +38,7 @@ function SprintDetail({ sprint: s, S }) {
       sprintGoal: s.goal || '',
       phaseId: s.phaseId,
       phaseName: s.phaseName,
+      file: s.file || null,
     }),
   );
   const done = stories.filter(t => t.status === 'done' || t.status === 'completed').length;
@@ -60,6 +62,10 @@ function SprintDetail({ sprint: s, S }) {
     e.stopPropagation();
     openTermPanel('sprint-' + s.id, 'Sprint ' + s.id);
   }
+  function handleViewPlan(e) {
+    e.stopPropagation();
+    openFileViewer(s.file, 'Sprint ' + s.id);
+  }
 
   return html`
     <div>
@@ -88,6 +94,9 @@ function SprintDetail({ sprint: s, S }) {
       <div class="term-action-bar">
         <button class="term-run-btn" onClick=${handleRun}>▶ Run Sprint</button>
         <button class="term-run-btn outline" onClick=${handleTerm}><${Icon} name="monitor" size=${14}/> Terminal</button>
+        ${s.file ? html`
+          <button class="back-btn" onClick=${handleViewPlan}><${Icon} name="file-text" size=${14}/> View plan file →</button>
+        ` : null}
       </div>
       <div class="view-title" style="margin-top:var(--space-4)">Tasks</div>
       <div class="phase-list">

package/server/lib/html/client.js

@@ -34,6 +34,7 @@ function clientState(state) {
     timeline:         d.timeline     || null,
     tasks:            d.tasks        || null,
     health:           d.health       || null,
+    backlog:          d.backlog      || [],
     // Colliding keys — the contract shapes are supersets, so legacy views and
     // the redesign read the same field. currentPhase becomes the contract object.
     phases:           d.phases       || state.phaseTree || state.raw?.phases || [],