@cat-factory/app 0.180.0 → 0.182.0

package/README.md

@@ -131,7 +131,10 @@ example ships in [`deploy/frontend`](../../deploy/frontend) (the `acme:security`
 
 - **Board canvas** (`components/board`) — `BoardCanvas` + `nodes/` (`BlockNode`,
   `ModuleFrame`, `TaskCard`), dependency edges, the per-block `AgentFailureCard` /
-  `AgentStopButton`, and a deep-zoom `focus/BlockFocusView`.
+  `AgentStopButton`, and a deep-zoom `focus/BlockFocusView`. A running task card expands
+  its build pipeline (`TaskPipelineMini`) on hover at any zoom level, and across every
+  on-screen card past the `steps` zoom band — the two grants are combined in the
+  `taskExpansion` store and driven by `useTaskExpansion`.
 - **Sidebar & chrome** (`components/layout`) — board/account switchers, palettes
   entry points, the language + [interface-mode](#interface-modes-basic--advanced)
   switchers, the `SpendWarningBanner`, and the toolbar (zoom, LOD, decision queue).
@@ -148,7 +151,10 @@ example ships in [`deploy/frontend`](../../deploy/frontend) (the `acme:security`
 - **Context attachments** (`components/context`) — `ContextAttachmentFields`, the
   shared staged-attachment form used by both the add-task and create-initiative
   modals. Picks are held locally and import-and-linked once the block exists (see
-  `composables/useContextLinking`), because linking needs a block id.
+  `composables/useContextLinking`), because linking needs a block id. Both hosts
+  attach to the SAME per-block linkage, so the inspector's `TaskContextDocs` /
+  `TaskContextIssues` sections render for a task AND an initiative — an initiative's
+  attachments would otherwise be invisible the moment the create modal closed.
 - **Integrations** — modals/panels for `github` (the source-control panel, shared
   by every VCS provider), `vcs` (the GitLab personal-access-token connect),
   `bootstrap`, `documents`, `tasks`, `requirements` (review), `scenarios`

package/app/components/board/nodes/DraggableTask.vue

@@ -10,8 +10,9 @@ const task = computed(() => board.getBlock(props.taskId))
 const { draggingId, startDrag } = useBlockDrag()
 
 // An expanded pipeline grows downward over its neighbours, so it must stack above the
-// other (compact) task cards — never let a neighbour render on top of the pipeline.
-const expanded = computed(() => expansion.allowed.has(props.taskId))
+// other (compact) task cards — never let a neighbour render on top of the pipeline. Reads
+// the same predicate the pipeline itself renders on, so the two can't disagree.
+const expanded = computed(() => expansion.isExpanded(props.taskId))
 
 // Once a task is merged it stops being a unit of work and becomes part of the
 // architecture: it no longer renders as a draggable card (arrows fall back to its

package/app/components/board/nodes/TaskPipelineMini.vue

@@ -12,11 +12,11 @@ import { lodAtLeast } from '~/composables/useSemanticZoom'
 import { prReviewPhase } from '~/utils/prReviewProgress'
 import PrReviewPhaseBadge from '~/components/prReview/PrReviewPhaseBadge.vue'
 
-// Spatial drill-down inside a task card: at the `steps` zoom band the task's
-// build-pipeline steps appear, and one band deeper (`subtasks`) each step's live
-// todo breakdown expands — done / in-progress / pending — exactly the way a
-// zoomed-in bootstrap card reads. Renders nothing until the task has a run and
-// the user has zoomed in far enough, so it's safe to mount on every task card.
+// Drill-down inside a task card: the task's build-pipeline steps appear on hover (at any
+// zoom level) or once the `steps` zoom band is reached, and one band deeper (`subtasks`)
+// each step's live todo breakdown expands — done / in-progress / pending — exactly the way
+// a zoomed-in bootstrap card reads. Renders nothing until the task has a run and the card
+// is expanded, so it's safe to mount on every task card.
 const props = defineProps<{ taskId: string }>()
 
 const execution = useExecutionStore()
@@ -40,13 +40,10 @@ const runFailed = computed(() => instance.value?.status === 'failed')
 // (spinning "Running") rather than a frozen subtask list.
 const companionByStep = computed(() => steps.value.map((s) => gateCompanionFor(s, runFailed.value)))
 
-// Expand the pipeline list only when zoomed in far enough AND the board driver
-// permits this card — on-screen, and the centre-most of any cards that would
-// otherwise overlap (see useTaskExpansion) — so deep-zoom expansions don't pile up.
-const showSteps = computed(
-  () =>
-    lodAtLeast(lod.value, 'steps') && steps.value.length > 0 && expansion.canExpand(props.taskId),
-)
+// Expand the pipeline list when the board driver says so: this card is hovered (at any
+// zoom level), or the deep zoom bands granted it — on-screen, and the centre-most of any
+// cards that would otherwise overlap. See stores/taskExpansion.ts.
+const showSteps = computed(() => steps.value.length > 0 && expansion.isExpanded(props.taskId))
 const showItems = computed(() => lodAtLeast(lod.value, 'subtasks'))
 
 // Clicking a step opens the full agent step-detail overlay — execution metadata

package/app/components/docs/DocInterviewWindow.vue

@@ -19,7 +19,11 @@
 import { computed, reactive, watch } from 'vue'
 import InterviewGateNotice from '~/components/common/InterviewGateNotice.vue'
 import ResultWindowShell from '~/components/panels/ResultWindowShell.vue'
-import { interviewGatePhase } from '~/utils/interviewGate'
+import {
+  DOC_INTERVIEWER_KIND,
+  interviewGatePhase,
+  interviewStepReached,
+} from '~/utils/interviewGate'
 
 const board = useBoardStore()
 const docInterview = useDocInterviewStore()
@@ -63,7 +67,13 @@ const resuming = computed(() => docInterview.resuming)
  * actually says, so the questions come back rather than the window sticking on a spinner.
  */
 const phase = computed(() =>
-  resuming.value ? 'working' : interviewGatePhase(session.value?.status, run.value?.status),
+  resuming.value
+    ? 'working'
+    : interviewGatePhase(
+        session.value?.status,
+        run.value?.status,
+        interviewStepReached(run.value, DOC_INTERVIEWER_KIND),
+      ),
 )
 /** The interview converged: the synthesized authoring brief is what the window shows. */
 const converged = computed(() => phase.value === 'converged')
@@ -133,10 +143,21 @@ const onProceed = () => flushThen((id) => docInterview.proceedInterview(id))
           {{ t('docInterview.intro') }}
         </p>
 
+        <!-- The run is still ahead of the interview (the researcher + outliner steps). Same
+             chrome, different claim: nothing has been asked yet, so the "working on your answers"
+             copy below would describe answers that do not exist. -->
+        <InterviewGateNotice
+          v-if="phase === 'preparing'"
+          variant="working"
+          :title="t('docInterview.preparing')"
+          :hint="t('docInterview.preparingHint')"
+          testid="doc-interview-preparing"
+        />
+
         <!-- A pass is running: the human is waiting on the interviewer. Without this the window is
              byte-identical to the parked state and the submit reads as a no-op. -->
         <InterviewGateNotice
-          v-if="phase === 'working'"
+          v-else-if="phase === 'working'"
           variant="working"
           :title="t('docInterview.working')"
           :hint="t('docInterview.workingHint')"

package/app/components/documents/TaskContextDocs.vue

@@ -4,8 +4,12 @@ import type { Block } from '~/types/domain'
 import ContextDocumentPicker from '~/components/documents/ContextDocumentPicker.vue'
 import InspectorSection from '~/components/panels/inspector/InspectorSection.vue'
 
-// Documents (from any source) attached to a task as agent context, shown inside
-// the InspectorPanel. Attaching uses the SAME inline picker as task creation
+// Documents (from any source) attached to a task OR an initiative as agent
+// context, shown inside the InspectorPanel. An initiative takes the same
+// attachments (the create-initiative modal stages them exactly as the add-task one
+// does) and its whole planning pipeline reads them, so it gets the same section —
+// only the prose differs, which is why the hint/empty copy is level-keyed below.
+// Attaching uses the SAME inline picker as task creation
 // (source selector + repo→file browse + free-text search + paste-by-reference —
 // ContextDocumentPicker), NOT the old dropdown that opened a second, page-level
 // "Import a page…" modal on top of the inspector. Stacked page-level modals don't
@@ -27,6 +31,18 @@ onMounted(() => {
 })
 
 const linked = computed(() => documents.docsForBlock(props.block.id))
+
+// Two STATIC literal keys per string, picked by level — the copy names what reads the
+// document (the agents implementing a task vs the pipeline that plans an initiative), which
+// is the whole point of the hint. Assembling one key from `block.level` would defeat the
+// typed message-key check for a two-member choice that gains nothing from being dynamic.
+const isInitiative = computed(() => props.block.level === 'initiative')
+const hint = computed(() =>
+  isInitiative.value ? t('documents.taskDocs.hintInitiative') : t('documents.taskDocs.hint'),
+)
+const emptyHint = computed(() =>
+  isInitiative.value ? t('documents.taskDocs.emptyInitiative') : t('documents.taskDocs.empty'),
+)
 // Already-linked docs, so the inline picker filters them out / never re-offers them.
 const chosenKeys = computed(() =>
   linked.value.map((d) =>
@@ -71,7 +87,7 @@ async function attach(item: PendingContext) {
   <InspectorSection
     v-if="documents.available"
     :title="t('documents.taskDocs.heading')"
-    :hint="t('documents.taskDocs.hint')"
+    :hint="hint"
     :count="linked.length"
   >
     <template #actions>
@@ -130,7 +146,7 @@ async function attach(item: PendingContext) {
       </a>
     </div>
     <p v-else class="text-[11px] text-slate-500">
-      {{ t('documents.taskDocs.empty') }}
+      {{ emptyHint }}
     </p>
   </InspectorSection>
 </template>

package/app/components/initiative/InitiativePlanningWindow.vue

@@ -4,8 +4,9 @@
 // (pending `qa` entries with an empty answer) are shown here; the human answers them, then either
 // SUBMITS them (the `continue` action: the interviewer re-runs and may ask follow-ups) or plans
 // now (the `proceed` action: skip the remaining questions — the interviewer converges and the run
-// advances to the analyst/planner). The labels say submit/plan-now rather than continue/proceed
-// because the latter pair both read as "go forward" and were indistinguishable in use.
+// advances to the planner; the analyst already ran, ahead of this gate). The labels say
+// submit/plan-now rather than continue/proceed because the latter pair both read as "go forward"
+// and were indistinguishable in use.
 // Opened via the universal result-view host: from the inspector / card
 // (`ui.openInitiativePlanning`) or as the interviewer step's result view. Live `initiative`
 // stream events patch the store, so an open window follows the interview as it progresses.
@@ -29,21 +30,44 @@ import {
   isPendingQuestion,
   orderInterviewQuestions,
 } from '~/utils/initiative'
-import { interviewGatePhase } from '~/utils/interviewGate'
+import {
+  INITIATIVE_INTERVIEWER_KIND,
+  interviewGatePhase,
+  interviewStepReached,
+} from '~/utils/interviewGate'
 import ResultWindowShell from '~/components/panels/ResultWindowShell.vue'
+import StepRunMeta from '~/components/panels/StepRunMeta.vue'
 
 const board = useBoardStore()
 const initiatives = useInitiativesStore()
-const execution = useExecutionStore()
 const { t } = useI18n()
 
-const { open, blockId, close } = useResultView('initiative-planning', {
+const { open, blockId, instanceId, stepIndex, close } = useResultView('initiative-planning', {
   onOpen: ({ blockId }) => void initiatives.load(blockId),
 })
 
 const block = computed(() => (blockId.value ? board.getBlock(blockId.value) : undefined))
 const initiative = computed(() => (blockId.value ? initiatives.forBlock(blockId.value) : null))
-const run = computed(() => (blockId.value ? execution.getByBlock(blockId.value) : undefined))
+
+/**
+ * The planning run + the interviewer step's run details, resolved through the shared seam so this
+ * window reports the same "which run is this / how did the model do" facts as every other agent
+ * window — including on the card/inspector entry point, which carries no step (see
+ * `useResultViewRunMeta`). `run` is the same instance the phase below reads.
+ */
+const {
+  instance: run,
+  step: metaStep,
+  instanceId: runId,
+  position,
+  totalSteps,
+  runFailed,
+  failureAt,
+} = useResultViewRunMeta('initiative-planning', {
+  blockId: () => blockId.value,
+  instanceId: () => instanceId.value,
+  stepIndex: () => stepIndex.value,
+})
 
 /** Every interview exchange, with a stable key for the list + draft map. */
 const questions = computed(() =>
@@ -98,7 +122,11 @@ const resuming = computed(() => initiatives.resuming)
 const phase = computed(() =>
   resuming.value
     ? 'working'
-    : interviewGatePhase(initiative.value?.interview?.status, run.value?.status),
+    : interviewGatePhase(
+        initiative.value?.interview?.status,
+        run.value?.status,
+        interviewStepReached(run.value, INITIATIVE_INTERVIEWER_KIND),
+      ),
 )
 
 /**
@@ -184,7 +212,7 @@ async function onDiscard() {
     icon-class="bg-indigo-500/15 text-indigo-300"
     :title="initiative?.title ?? block?.title ?? t('initiative.planning.title')"
     :subtitle="t('initiative.planning.subtitle')"
-    width="3xl"
+    width="4xl"
     testid="initiative-planning-window"
     @close="close"
   >
@@ -194,86 +222,122 @@ async function onDiscard() {
       </UBadge>
     </template>
 
-    <div class="min-h-0 flex-1 overflow-y-auto px-5 py-4">
-      <!-- No entity yet -->
-      <div
-        v-if="!initiative"
-        class="flex h-full flex-col items-center justify-center gap-2 text-center text-slate-400"
-      >
-        <UIcon name="i-lucide-messages-square" class="h-8 w-8 opacity-40" />
-        <p class="text-sm">{{ t('initiative.planning.empty') }}</p>
-      </div>
+    <div class="flex min-h-0 flex-1">
+      <div class="min-w-0 flex-1 overflow-y-auto px-5 py-4">
+        <!-- No entity yet -->
+        <div
+          v-if="!initiative"
+          class="flex h-full flex-col items-center justify-center gap-2 text-center text-slate-400"
+        >
+          <UIcon name="i-lucide-messages-square" class="h-8 w-8 opacity-40" />
+          <p class="text-sm">{{ t('initiative.planning.empty') }}</p>
+        </div>
 
-      <template v-else>
-        <p class="mb-4 text-[13px] leading-relaxed text-slate-300">
-          {{ t('initiative.planning.intro') }}
-        </p>
+        <template v-else>
+          <p class="mb-4 text-[13px] leading-relaxed text-slate-300">
+            {{ t('initiative.planning.intro') }}
+          </p>
 
-        <!-- A pass is running: the human is waiting on the planner. Without this the window is
-             byte-identical to the parked state and the submit reads as a no-op. -->
-        <InterviewGateNotice
-          v-if="phase === 'working'"
-          variant="working"
-          :title="t('initiative.planning.working')"
-          :hint="t('initiative.planning.workingHint')"
-          testid="initiative-planning-working"
-        />
+          <!-- The run is still ahead of the interview — the codebase analysis that grounds it. It
+               wears the working chrome but says something different on purpose: nothing has been
+               asked yet, so "working on your answers" would describe answers that do not exist. -->
+          <InterviewGateNotice
+            v-if="phase === 'preparing'"
+            variant="working"
+            :title="t('initiative.planning.preparing')"
+            :hint="t('initiative.planning.preparingHint')"
+            testid="initiative-planning-preparing"
+          />
 
-        <!-- The planning run stopped before the interview settled — a dead end otherwise. -->
-        <InterviewGateNotice
-          v-else-if="phase === 'failed'"
-          variant="failed"
-          :title="t('initiative.planning.failed')"
-          :hint="t('initiative.planning.failedHint')"
-          testid="initiative-planning-failed"
-        />
+          <!-- A pass is running: the human is waiting on the planner. Without this the window is
+               byte-identical to the parked state and the submit reads as a no-op. -->
+          <InterviewGateNotice
+            v-else-if="phase === 'working'"
+            variant="working"
+            :title="t('initiative.planning.working')"
+            :hint="t('initiative.planning.workingHint')"
+            testid="initiative-planning-working"
+          />
 
-        <!-- Planning was never started, so there is nothing to answer YET (distinct from
-             converged, which means the planner already has what it needs). -->
-        <div
-          v-else-if="phase === 'idle' && questions.length === 0"
-          class="rounded-lg border border-slate-800 bg-slate-950/40 p-4 text-center text-[13px] text-slate-400"
-          data-testid="initiative-planning-idle"
-        >
-          {{ t('initiative.planning.idle') }}
-        </div>
+          <!-- The planning run stopped before the interview settled — a dead end otherwise. -->
+          <InterviewGateNotice
+            v-else-if="phase === 'failed'"
+            variant="failed"
+            :title="t('initiative.planning.failed')"
+            :hint="t('initiative.planning.failedHint')"
+            testid="initiative-planning-failed"
+          />
 
-        <!-- Converged / no pending questions -->
-        <div
-          v-else-if="phase === 'converged' || questions.length === 0"
-          class="rounded-lg border border-slate-800 bg-slate-950/40 p-4 text-center text-[13px] text-slate-400"
-          data-testid="initiative-planning-converged"
-        >
-          {{ t('initiative.planning.converged') }}
-        </div>
+          <!-- Planning was never started, so there is nothing to answer YET (distinct from
+               converged, which means the planner already has what it needs). -->
+          <div
+            v-else-if="phase === 'idle' && questions.length === 0"
+            class="rounded-lg border border-slate-800 bg-slate-950/40 p-4 text-center text-[13px] text-slate-400"
+            data-testid="initiative-planning-idle"
+          >
+            {{ t('initiative.planning.idle') }}
+          </div>
 
-        <!-- Interview questions — the shared clarification surface (answer / not-relevant /
-                 recommend), reused with the requirements-review window. -->
-        <ul v-else class="space-y-4">
-          <li v-for="q in orderedQuestions" :key="q.key" data-testid="initiative-planning-question">
-            <ClarificationItem
-              v-model:answer="drafts[q.key]"
-              :prompt="q.question"
-              :dismissed="q.status === 'dismissed'"
-              :recommendation="q.recommendation"
-              :recommending="!!q.id && initiatives.recommending.has(q.id)"
-              :answer-placeholder="t('initiative.planning.answerPlaceholder')"
-              @persist="persist(q)"
-              @dismiss="setStatus(q, 'dismissed')"
-              @reopen="setStatus(q, 'open')"
-              @recommend="recommend(q)"
-              @use-recommendation="useRecommendation(q)"
-            />
-          </li>
-        </ul>
-      </template>
+          <!-- Converged / no pending questions -->
+          <div
+            v-else-if="phase === 'converged' || questions.length === 0"
+            class="rounded-lg border border-slate-800 bg-slate-950/40 p-4 text-center text-[13px] text-slate-400"
+            data-testid="initiative-planning-converged"
+          >
+            {{ t('initiative.planning.converged') }}
+          </div>
+
+          <!-- Interview questions — the shared clarification surface (answer / not-relevant /
+                   recommend), reused with the requirements-review window. -->
+          <ul v-else class="space-y-4">
+            <li
+              v-for="q in orderedQuestions"
+              :key="q.key"
+              data-testid="initiative-planning-question"
+            >
+              <ClarificationItem
+                v-model:answer="drafts[q.key]"
+                :prompt="q.question"
+                :dismissed="q.status === 'dismissed'"
+                :recommendation="q.recommendation"
+                :recommending="!!q.id && initiatives.recommending.has(q.id)"
+                :answer-placeholder="t('initiative.planning.answerPlaceholder')"
+                @persist="persist(q)"
+                @dismiss="setStatus(q, 'dismissed')"
+                @reopen="setStatus(q, 'open')"
+                @recommend="recommend(q)"
+                @use-recommendation="useRecommendation(q)"
+              />
+            </li>
+          </ul>
+        </template>
+      </div>
+
+      <!-- Run details: the shared run-metadata + LLM model-activity block every agent window
+           carries (step position, live duration, model, run id, calls + token usage). Resolved
+           through `useResultViewRunMeta`, so it is present on the card / inspector entry point
+           too — where this window carries no step index of its own. -->
+      <aside
+        v-if="metaStep"
+        data-testid="initiative-planning-run-meta"
+        class="hidden w-60 shrink-0 flex-col gap-4 overflow-y-auto border-s border-slate-800 bg-slate-900/50 px-4 py-4 lg:flex"
+      >
+        <StepRunMeta
+          :step="metaStep"
+          :instance-id="runId"
+          :step-number="position"
+          :total-steps="totalSteps"
+          :run-failed="runFailed"
+          :failure-at="failureAt"
+        />
+      </aside>
     </div>
 
     <!-- Action rail. The submit/plan-now pair shows only while the run is actually parked on the
          human: mid-pass they would re-submit a question set already in flight, and the resume is a
          no-op once it isn't. Discard is the opposite — it is offered for as long as a run owns the
-         block, because the phases where those two are hidden (working, failed) are exactly the ones
-         a wedged run sits in. -->
+         block, because the phases where those two are hidden (preparing, working, failed) are
+         exactly the ones a wedged run sits in. -->
     <footer
       v-if="initiative && (canDiscard || (phase === 'awaiting' && questions.length > 0))"
       class="flex items-center justify-between gap-3 border-t border-slate-800 px-5 py-3"