@cat-factory/app 0.111.3 → 0.113.0

package/app/components/forkDecision/ForkDecisionWindow.vue

@@ -0,0 +1,300 @@
+<script setup lang="ts">
+// Implementation-fork decision window — the dedicated surface for the read-only proposer's
+// materially different implementation approaches, opened via the universal result-view host
+// (`ui.openForkDecision`). It reads the live fork state straight off the run's Coder step
+// (`step.forkDecision`, kept fresh by the execution stream) and lets a human pick a proposed
+// fork OR enter their own free-text approach. Once chosen, the Coder re-runs with the chosen
+// approach folded in. Chat is added in a later slice.
+import { computed, ref, watch } from 'vue'
+import { useResultView } from '~/composables/useResultView'
+import { useExecutionStore } from '~/stores/execution'
+import { useBoardStore } from '~/stores/board'
+import { useForkDecisionStore } from '~/stores/forkDecision'
+import type { ForkDecisionStepState, ForkOption } from '~/types/execution'
+import { FORK_DECISION_META } from '~/utils/catalog'
+
+const execution = useExecutionStore()
+const board = useBoardStore()
+const forkDecision = useForkDecisionStore()
+
+const { t } = useI18n()
+
+// Hybrid: state rides the coder step (like follow-ups), but warm it from the GET on open too.
+const { open, blockId, instanceId, stepIndex, close } = useResultView('fork-decision', {
+  onOpen: (id) => void forkDecision.load(id),
+})
+
+const block = computed(() => (blockId.value ? board.getBlock(blockId.value) : undefined))
+const instance = computed(() =>
+  instanceId.value === null ? null : (execution.getInstance(instanceId.value) ?? null),
+)
+const step = computed(() => {
+  if (instance.value === null || stepIndex.value === null) return null
+  return instance.value.steps[stepIndex.value] ?? null
+})
+const state = computed<ForkDecisionStepState | null>(() => step.value?.forkDecision ?? null)
+const status = computed(() => state.value?.status ?? null)
+const forks = computed<ForkOption[]>(() => state.value?.forks ?? [])
+const awaiting = computed(() => status.value === 'awaiting_choice')
+
+// The human's selection: a proposed fork id, or the sentinel 'custom' for the free-text path.
+const selected = ref<string | null>(null)
+const customText = ref('')
+const note = ref('')
+
+// Default the selection to the recommended fork whenever the fork set changes.
+watch(
+  forks,
+  (list) => {
+    if (
+      selected.value &&
+      (selected.value === 'custom' || list.some((f) => f.id === selected.value))
+    )
+      return
+    selected.value = list.find((f) => f.recommended)?.id ?? list[0]?.id ?? null
+  },
+  { immediate: true },
+)
+
+const canChoose = computed(() => {
+  if (!awaiting.value || forkDecision.choosing) return false
+  if (selected.value === 'custom') return customText.value.trim().length > 0
+  return selected.value != null
+})
+
+async function onChoose() {
+  const id = instanceId.value
+  if (!id || !canChoose.value) return
+  const noteText = note.value.trim() || undefined
+  const choice =
+    selected.value === 'custom'
+      ? { custom: customText.value.trim(), note: noteText }
+      : { forkId: selected.value!, note: noteText }
+  await forkDecision.choose(id, choice).catch(() => {})
+}
+</script>
+
+<template>
+  <Teleport to="body">
+    <div
+      v-if="open"
+      data-testid="fork-decision-window"
+      class="fixed inset-0 z-50 flex max-h-[100dvh] items-stretch justify-center bg-slate-950/70 backdrop-blur-sm"
+      @click.self="close"
+    >
+      <div
+        class="m-4 flex w-full max-w-3xl flex-col overflow-hidden rounded-2xl border border-slate-800 bg-slate-900 shadow-2xl"
+        role="dialog"
+        aria-modal="true"
+      >
+        <!-- Header -->
+        <header class="flex items-center gap-3 border-b border-slate-800 px-5 py-3">
+          <span
+            class="flex h-8 w-8 items-center justify-center rounded-lg bg-violet-500/15 text-violet-300"
+          >
+            <UIcon :name="FORK_DECISION_META.icon" class="h-4 w-4" />
+          </span>
+          <div class="min-w-0 flex-1">
+            <h2 class="truncate text-sm font-semibold text-slate-100">
+              {{
+                block
+                  ? t('forkDecision.titleWithBlock', { title: block.title })
+                  : t('forkDecision.title')
+              }}
+            </h2>
+            <p class="truncate text-[11px] text-slate-400">{{ t('forkDecision.subtitle') }}</p>
+          </div>
+          <button
+            class="rounded-md p-1.5 text-slate-400 hover:bg-slate-800 hover:text-slate-200"
+            @click="close"
+          >
+            <UIcon name="i-lucide-x" class="h-4 w-4" />
+          </button>
+        </header>
+
+        <div class="min-h-0 flex-1 overflow-y-auto px-5 py-4">
+          <!-- Proposing: the read-only proposer is still working. -->
+          <div
+            v-if="status === 'proposing'"
+            class="flex h-full flex-col items-center justify-center gap-2 py-10 text-center text-slate-400"
+          >
+            <UIcon name="i-lucide-loader-circle" class="h-8 w-8 animate-spin opacity-60" />
+            <p class="text-sm">{{ t('forkDecision.proposing.title') }}</p>
+            <p class="max-w-sm text-[11px] text-slate-500">
+              {{ t('forkDecision.proposing.hint') }}
+            </p>
+          </div>
+
+          <!-- A single path (no materially different alternatives): a read-only record. -->
+          <div
+            v-else-if="status === 'single_path'"
+            class="rounded-xl border border-slate-800 bg-slate-900/60 px-4 py-3 text-slate-300"
+          >
+            <p class="text-[13px] font-medium text-slate-100">
+              {{ t('forkDecision.singlePath.title') }}
+            </p>
+            <p v-if="state?.singlePathReason" class="mt-1 text-[12px]">
+              {{ state.singlePathReason }}
+            </p>
+          </div>
+
+          <!-- Chosen: a read-only record of what was decided. -->
+          <div
+            v-else-if="status === 'chosen'"
+            class="rounded-xl border border-violet-500/40 bg-slate-900/60 px-4 py-3 text-slate-300"
+          >
+            <p class="text-[13px] font-medium text-violet-200">
+              {{ t('forkDecision.chosen.title') }}
+            </p>
+            <p v-if="state?.chosen?.custom" class="mt-1 whitespace-pre-wrap text-[12px]">
+              {{ state.chosen.custom }}
+            </p>
+            <p v-else-if="state?.chosen?.forkId" class="mt-1 text-[12px]">
+              {{ forks.find((f) => f.id === state?.chosen?.forkId)?.title }}
+            </p>
+            <p v-if="state?.chosen?.note" class="mt-1 text-[11px] text-slate-400">
+              {{ t('forkDecision.chosen.note', { note: state.chosen.note }) }}
+            </p>
+          </div>
+
+          <!-- Awaiting the human's choice. -->
+          <div v-else-if="awaiting" class="space-y-3">
+            <p
+              v-if="forkDecision.error"
+              class="rounded-md bg-rose-500/10 px-3 py-2 text-[12px] text-rose-300"
+            >
+              {{ forkDecision.error }}
+            </p>
+
+            <p
+              v-if="state?.seamSummary"
+              class="rounded-md bg-slate-800/50 px-3 py-2 text-[12px] text-slate-300"
+            >
+              <span class="text-slate-500">{{ t('forkDecision.seam') }}</span>
+              {{ state.seamSummary }}
+            </p>
+
+            <!-- Proposed fork cards -->
+            <article
+              v-for="fork in forks"
+              :key="fork.id"
+              data-testid="fork-option-card"
+              class="cursor-pointer rounded-xl border px-4 py-3 transition"
+              :class="
+                selected === fork.id
+                  ? 'border-violet-500/70 bg-violet-500/5'
+                  : 'border-slate-800 bg-slate-900/60 hover:border-slate-700'
+              "
+              @click="selected = fork.id"
+            >
+              <div class="flex items-start gap-2">
+                <input
+                  type="radio"
+                  class="mt-1 accent-violet-500"
+                  :checked="selected === fork.id"
+                  @change="selected = fork.id"
+                />
+                <div class="min-w-0 flex-1">
+                  <div class="flex items-center gap-2">
+                    <h3 class="min-w-0 flex-1 text-[13px] font-medium text-slate-100">
+                      {{ fork.title }}
+                    </h3>
+                    <UBadge v-if="fork.recommended" color="primary" variant="subtle" size="sm">
+                      {{ t('forkDecision.recommended') }}
+                    </UBadge>
+                  </div>
+                  <p v-if="fork.summary" class="mt-0.5 text-[12px] text-slate-400">
+                    {{ fork.summary }}
+                  </p>
+                  <p class="mt-1.5 whitespace-pre-wrap text-[12px] text-slate-300">
+                    {{ fork.approach }}
+                  </p>
+                  <ul v-if="fork.tradeoffs.length" class="mt-1.5 space-y-0.5">
+                    <li
+                      v-for="(tr, i) in fork.tradeoffs"
+                      :key="i"
+                      class="flex gap-1.5 text-[11px] text-slate-400"
+                    >
+                      <span class="text-slate-600">•</span>{{ tr }}
+                    </li>
+                  </ul>
+                  <p v-if="fork.riskNotes" class="mt-1.5 text-[11px] text-amber-300/90">
+                    <span class="text-amber-500/70">{{ t('forkDecision.riskNotes') }}</span>
+                    {{ fork.riskNotes }}
+                  </p>
+                </div>
+              </div>
+            </article>
+
+            <!-- Custom approach -->
+            <article
+              class="rounded-xl border px-4 py-3 transition"
+              :class="
+                selected === 'custom'
+                  ? 'border-violet-500/70 bg-violet-500/5'
+                  : 'border-slate-800 bg-slate-900/60'
+              "
+            >
+              <label class="flex cursor-pointer items-center gap-2" @click="selected = 'custom'">
+                <input type="radio" class="accent-violet-500" :checked="selected === 'custom'" />
+                <span class="text-[13px] font-medium text-slate-100">{{
+                  t('forkDecision.custom.title')
+                }}</span>
+              </label>
+              <textarea
+                v-model="customText"
+                data-testid="fork-custom-input"
+                rows="3"
+                :placeholder="t('forkDecision.custom.placeholder')"
+                class="mt-2 w-full resize-y rounded-md border border-slate-700 bg-slate-950/60 px-2.5 py-1.5 text-[12px] text-slate-100 placeholder:text-slate-600 focus:border-violet-500 focus:outline-none focus-visible:ring-2 focus-visible:ring-violet-500/60"
+                @focus="selected = 'custom'"
+              />
+            </article>
+
+            <!-- Optional steering note -->
+            <div>
+              <label class="mb-1 block text-[11px] text-slate-400">{{
+                t('forkDecision.noteLabel')
+              }}</label>
+              <input
+                v-model="note"
+                type="text"
+                :placeholder="t('forkDecision.notePlaceholder')"
+                class="w-full rounded-md border border-slate-700 bg-slate-950/60 px-2.5 py-1.5 text-[12px] text-slate-100 placeholder:text-slate-600 focus:border-violet-500 focus:outline-none"
+              />
+            </div>
+          </div>
+
+          <!-- Skipped / no state: nothing to decide. -->
+          <div
+            v-else
+            class="flex h-full flex-col items-center justify-center gap-2 py-10 text-center text-slate-400"
+          >
+            <UIcon :name="FORK_DECISION_META.icon" class="h-8 w-8 opacity-40" />
+            <p class="text-sm">{{ t('forkDecision.empty.title') }}</p>
+          </div>
+        </div>
+
+        <footer
+          v-if="awaiting"
+          class="flex items-center justify-end gap-2 border-t border-slate-800 px-5 py-3"
+        >
+          <UButton color="neutral" variant="ghost" size="sm" @click="close">
+            {{ t('common.cancel') }}
+          </UButton>
+          <UButton
+            data-testid="fork-option-choose"
+            color="primary"
+            size="sm"
+            icon="i-lucide-check"
+            :loading="forkDecision.choosing"
+            :disabled="!canChoose"
+            @click="onChoose"
+          >
+            {{ t('forkDecision.choose') }}
+          </UButton>
+        </footer>
+      </div>
+    </div>
+  </Teleport>
+</template>

package/app/components/layout/NotificationsInbox.vue

@@ -60,6 +60,10 @@ const META: Record<Notification['type'], { icon: string; color: Accent }> = {
   // Clicking the title opens the Follow-up companion window for the run (see `reveal`); "act"
   // just marks it read (items are decided in that window — file / send back / answer — not here).
   followup_pending: { icon: 'i-lucide-compass', color: 'warning' },
+  // The fork-decision phase surfaced materially different implementation approaches. Clicking
+  // the title opens the fork-decision window (see `reveal`); "act" just marks it read (the
+  // choice is made in that window — pick a fork / enter a custom approach — not here).
+  fork_decision_pending: { icon: 'i-lucide-git-fork', color: 'warning' },
   // The initiative loop needs attention (a blocked task, or completion). Clicking the title
   // opens the initiative tracker window; "act" just marks it read.
   initiative: { icon: 'i-lucide-milestone', color: 'primary' },
@@ -81,6 +85,7 @@ const ACTION_KEYS: Record<Notification['type'], string> = {
   visual_confirmation_ready: 'layout.notifications.action.visual_confirmation_ready',
   human_review: 'layout.notifications.action.human_review',
   followup_pending: 'layout.notifications.action.followup_pending',
+  fork_decision_pending: 'layout.notifications.action.fork_decision_pending',
   initiative: 'layout.notifications.action.initiative',
 }
 
@@ -151,6 +156,7 @@ function reveal(n: Notification) {
   else if (n.type === 'visual_confirmation_ready') revealVisualConfirm(n)
   else if (n.type === 'human_review') revealHumanReview(n)
   else if (n.type === 'followup_pending') revealFollowUps(n)
+  else if (n.type === 'fork_decision_pending') revealForkDecision(n)
   else if (n.type === 'initiative') ui.openInitiativeTracker(n.blockId)
   else ui.select(n.blockId)
 }
@@ -176,6 +182,15 @@ function revealFollowUps(n: Notification) {
   else if (n.blockId) ui.select(n.blockId)
 }
 
+/**
+ * Open the implementation-fork decision window for a run parked awaiting a fork choice.
+ * Falls back to focusing the block when the run isn't loaded.
+ */
+function revealForkDecision(n: Notification) {
+  if (n.executionId && execution.getInstance(n.executionId)) ui.openForkDecision(n.executionId)
+  else if (n.blockId) ui.select(n.blockId)
+}
+
 /**
  * Open the human-testing window for a parked `human-test` gate: find the run's parked
  * human-test step and open it through the universal step dispatch (its archetype declares

package/app/components/panels/StepResultViewHost.vue

@@ -22,6 +22,7 @@ import ConsensusSessionWindow from '~/components/consensus/ConsensusSessionWindo
 import GenericStructuredResultView from '~/components/panels/GenericStructuredResultView.vue'
 import ServiceSpecWindow from '~/components/spec/ServiceSpecWindow.vue'
 import FollowUpWindow from '~/components/followUp/FollowUpWindow.vue'
+import ForkDecisionWindow from '~/components/forkDecision/ForkDecisionWindow.vue'
 import MergerResultView from '~/components/panels/MergerResultView.vue'
 import InitiativeTrackerWindow from '~/components/initiative/InitiativeTrackerWindow.vue'
 import InitiativePlanningWindow from '~/components/initiative/InitiativePlanningWindow.vue'
@@ -52,6 +53,10 @@ const STEP_RESULT_VIEWS: Record<string, Component> = {
   // The future-looking Follow-up companion: the Coder's surfaced loose ends / questions.
   // Opened directly via `ui.openFollowUps` (the blinking chip + the `followup_pending` card).
   'follow-ups': FollowUpWindow,
+  // The implementation-fork decision: the proposer's materially different approaches + the
+  // human's pick / custom approach. Opened directly via `ui.openForkDecision` (the pipeline
+  // chip, the inspector button, and the `fork_decision_pending` card).
+  'fork-decision': ForkDecisionWindow,
   // The merger's verdict: the PR's complexity/risk/impact scores + the engine's auto-merge
   // or awaiting-review decision (and why), instead of the agent's raw JSON.
   merger: MergerResultView,

package/app/components/panels/inspector/TaskAprioriBranches.vue

@@ -0,0 +1,247 @@
+<script setup lang="ts">
+// Pre-existing branches of a task's PRIMARY target repo handed to the run as input, in two
+// deliberately-disjoint modes (see `backend/docs/adr/0021-apriori-branches.md`):
+//
+//  - `reference` — read-only context (a spike / prototype / prior-art branch). The consuming
+//    agents may read it (log/diff/open files) but never commit to or push it.
+//  - `working` — the branch the run keeps building inside: it starts from and continues
+//    committing into this branch instead of minting `cat-factory/<blockId>` off the default,
+//    and the PR / CI-gate / merger all ride it.
+//
+// The cross-entry invariants the backend enforces at the write boundary are mirrored here so a
+// forbidden combination is prevented in the UI rather than surfaced as a rejected write: at most
+// ONE working entry, no duplicate names, the working entry frozen once a PR exists (its head is
+// already pinned everywhere), and no working entry on a multi-repo task (v1 — peer legs would
+// mint the user's branch name across every involved repo).
+import { aprioriWorkingBranch } from '@cat-factory/contracts'
+import type { AprioriBranch, Block } from '~/types/domain'
+
+const props = defineProps<{ block: Block }>()
+
+const { t } = useI18n()
+const github = useGitHubStore()
+const board = useBoardStore()
+
+// The primary target repo is the one bound to the task's owning service frame — the sole
+// repo↔frame linkage. Branch options come from the existing per-repo branches projection.
+const frame = computed(() => board.serviceOf(props.block))
+const repo = computed(() => (frame.value ? github.repoForBlock(frame.value.id) : undefined))
+const repoBranches = computed(() => {
+  const id = repo.value?.githubId
+  return id != null ? (github.branches[id] ?? []) : []
+})
+
+// Load (and cache) the target repo's branches once it's resolved. Best-effort — a fetch failure
+// just leaves the picker empty (the same repo the run clones, so a real failure is rare).
+watch(
+  () => repo.value?.githubId,
+  (id) => {
+    if (id != null) void github.loadBranches(id).catch(() => {})
+  },
+  { immediate: true },
+)
+
+// Write-boundary mirrors:
+//  - a PR pins the run's branch, so the working entry is FROZEN (references stay editable);
+//  - a multi-repo task (any involved service) BLOCKS working mode entirely.
+const hasPullRequest = computed(() => !!props.block.pullRequest)
+const isMultiRepo = computed(() => (props.block.involvedServiceIds ?? []).length > 0)
+
+// A working entry set while single-repo becomes invalid the moment the task gains a second
+// involved service (the backend rejects a working entry on a multi-repo task). Rather than let
+// that stale entry ride along and fail the NEXT write wholesale, demote any working entry to
+// `reference` on a multi-repo task — applied both to what we render and to what we persist, so
+// the invariant is mirrored (not surfaced as a rejected write) and self-heals on the next save.
+function normalize(entries: AprioriBranch[]): AprioriBranch[] {
+  if (!isMultiRepo.value) return entries
+  return entries.map((b) => (b.mode === 'working' ? { ...b, mode: 'reference' } : b))
+}
+
+const attached = computed<AprioriBranch[]>(() => normalize(props.block.aprioriBranches ?? []))
+const attachedNames = computed(() => new Set(attached.value.map((b) => b.name)))
+const workingName = computed(() => aprioriWorkingBranch(attached.value))
+
+function isProtected(name: string): boolean {
+  return repoBranches.value.find((b) => b.name === name)?.protected === true
+}
+// Building the run inside the repo's base branch has nothing to diff and no PR to open, so it's
+// rejected at dispatch — surface it here as a non-selectable working target.
+function isBaseBranch(name: string): boolean {
+  return repo.value?.defaultBranch != null && name === repo.value.defaultBranch
+}
+
+function save(next: AprioriBranch[]) {
+  board.updateBlock(props.block.id, { aprioriBranches: normalize(next) })
+}
+
+// ---- add / remove -----------------------------------------------------------
+// The picker adds a branch as `reference` (the safe default — promoting to working is an
+// explicit second action, guarded below).
+const pickedName = ref<string | undefined>(undefined)
+watch(pickedName, (name) => {
+  if (name === undefined) return
+  pickedName.value = undefined
+  if (attachedNames.value.has(name)) return
+  save([...attached.value, { name, mode: 'reference' }])
+})
+
+const branchItems = computed(() =>
+  repoBranches.value.map((b) => ({
+    label: b.name,
+    value: b.name,
+    disabled: attachedNames.value.has(b.name),
+  })),
+)
+
+function remove(name: string) {
+  save(attached.value.filter((b) => b.name !== name))
+}
+
+// ---- mode toggle ------------------------------------------------------------
+// Promoting an entry to `working` demotes any existing working entry to `reference` in the same
+// write, so the single-working invariant holds without an intermediate rejected state.
+function setMode(name: string, mode: AprioriBranch['mode']) {
+  save(
+    attached.value.map((b) => {
+      if (b.name === name) return { ...b, mode }
+      if (mode === 'working' && b.mode === 'working') return { ...b, mode: 'reference' }
+      return b
+    }),
+  )
+}
+
+// Whether a reference entry may be promoted to working: blocked outright on a multi-repo task,
+// on the base branch, and once a PR has frozen the working slot.
+function canPromote(name: string): boolean {
+  return !isMultiRepo.value && !hasPullRequest.value && !isBaseBranch(name)
+}
+// The working entry is frozen once the PR exists (changing/dropping it would silently diverge).
+const workingFrozen = computed(() => hasPullRequest.value && workingName.value !== undefined)
+
+function modeMenu(entry: AprioriBranch) {
+  const items: Array<{ label: string; icon: string; onSelect: () => void }> = []
+  if (entry.mode === 'working') {
+    if (!workingFrozen.value) {
+      items.push({
+        label: t('inspector.aprioriBranches.mode.reference'),
+        icon: 'i-lucide-book-open-text',
+        onSelect: () => setMode(entry.name, 'reference'),
+      })
+    }
+  } else if (canPromote(entry.name)) {
+    items.push({
+      label: t('inspector.aprioriBranches.mode.working'),
+      icon: 'i-lucide-hammer',
+      onSelect: () => setMode(entry.name, 'working'),
+    })
+  }
+  return [items]
+}
+// The mode dropdown is inert when there's no alternative mode to switch to.
+function modeToggleDisabled(entry: AprioriBranch): boolean {
+  return modeMenu(entry)[0]!.length === 0
+}
+// The working entry can't be removed while frozen by a PR; reference entries are always removable.
+function removeDisabled(entry: AprioriBranch): boolean {
+  return entry.mode === 'working' && workingFrozen.value
+}
+</script>
+
+<template>
+  <div v-if="repo" data-testid="apriori-branches">
+    <div class="mb-1 flex items-center justify-between">
+      <span class="text-[11px] font-semibold uppercase tracking-wide text-slate-400">
+        {{ t('inspector.aprioriBranches.title') }}
+      </span>
+    </div>
+
+    <!-- Attached branches: one row each — name, mode badge + toggle, remove. -->
+    <div v-if="attached.length" class="mb-1.5 space-y-1">
+      <div
+        v-for="entry in attached"
+        :key="entry.name"
+        class="flex items-center gap-1.5"
+        data-testid="apriori-branch-row"
+      >
+        <UBadge
+          size="sm"
+          variant="soft"
+          :color="entry.mode === 'working' ? 'primary' : 'neutral'"
+          class="min-w-0"
+          :data-mode="entry.mode"
+          data-testid="apriori-branch-chip"
+        >
+          <UIcon
+            :name="entry.mode === 'working' ? 'i-lucide-hammer' : 'i-lucide-book-open-text'"
+            class="me-1 h-3 w-3 shrink-0"
+          />
+          <span class="truncate">{{ entry.name }}</span>
+        </UBadge>
+
+        <UDropdownMenu :items="modeMenu(entry)">
+          <UButton
+            size="xs"
+            variant="ghost"
+            color="neutral"
+            trailing-icon="i-lucide-chevron-down"
+            :disabled="modeToggleDisabled(entry)"
+            data-testid="apriori-branch-mode"
+          >
+            {{
+              entry.mode === 'working'
+                ? t('inspector.aprioriBranches.mode.working')
+                : t('inspector.aprioriBranches.mode.reference')
+            }}
+          </UButton>
+        </UDropdownMenu>
+
+        <UButton
+          color="neutral"
+          variant="link"
+          size="xs"
+          icon="i-lucide-x"
+          class="ms-auto"
+          :disabled="removeDisabled(entry)"
+          :aria-label="t('inspector.aprioriBranches.remove', { branch: entry.name })"
+          data-testid="apriori-branch-remove"
+          @click="remove(entry.name)"
+        />
+      </div>
+    </div>
+
+    <!-- The picker: only usable once the workspace's GitHub App is connected. -->
+    <UInputMenu
+      v-if="github.connected"
+      v-model="pickedName"
+      :items="branchItems"
+      value-key="value"
+      icon="i-lucide-git-branch"
+      :placeholder="t('inspector.aprioriBranches.searchPlaceholder')"
+      class="w-full"
+      data-testid="apriori-branch-search"
+    />
+    <div v-else class="text-[11px] text-slate-500">
+      {{ t('inspector.aprioriBranches.connectFirst') }}
+    </div>
+
+    <!-- A protected branch pushed to by the run is likely to be rejected — warn, don't block. -->
+    <div
+      v-if="workingName && isProtected(workingName)"
+      class="mt-1.5 flex items-start gap-1.5 rounded-md border border-amber-500/40 bg-amber-950/40 p-2 text-[11px] text-amber-200/90"
+      data-testid="apriori-branch-protected-warning"
+    >
+      <UIcon name="i-lucide-triangle-alert" class="mt-0.5 h-3.5 w-3.5 shrink-0 text-amber-400" />
+      <span>{{ t('inspector.aprioriBranches.protectedWarning', { branch: workingName }) }}</span>
+    </div>
+
+    <div class="mt-1 text-[11px] text-slate-500">
+      {{ t('inspector.aprioriBranches.hint') }}
+      <template v-if="isMultiRepo">
+        {{ t('inspector.aprioriBranches.multiRepoHint') }}
+      </template>
+      <template v-else-if="workingFrozen">
+        {{ t('inspector.aprioriBranches.frozenHint') }}
+      </template>
+    </div>
+  </div>
+</template>

package/app/components/panels/inspector/TaskExecution.vue

@@ -136,6 +136,11 @@ function openStep(i: number) {
   if (instance.value) ui.openStepDetail(instance.value.id, i)
 }
 
+// Open the implementation-fork decision window for a coder step parked awaiting a choice.
+function openForkFor(i: number) {
+  if (instance.value) ui.openForkDecision(instance.value.id, i)
+}
+
 // Stop the run WITHOUT deleting it: halts the container + driver and records a
 // `cancelled` failure, leaving the run readable + retryable (the block goes
 // `blocked`). The destructive reset (delete the run, return the task to `planned`)
@@ -335,6 +340,22 @@ async function mergePr() {
             >
               {{ t('inspector.execution.decide') }}
             </UButton>
+            <!-- A coder step parked on the implementation-fork decision: pick an approach
+                 (or enter a custom one) in the dedicated window, not a plain approval. -->
+            <UButton
+              v-else-if="
+                s.approval &&
+                s.approval.status === 'pending' &&
+                s.forkDecision?.status === 'awaiting_choice'
+              "
+              color="primary"
+              variant="soft"
+              size="xs"
+              icon="i-lucide-git-fork"
+              @click="openForkFor(i)"
+            >
+              {{ t('inspector.execution.chooseApproach') }}
+            </UButton>
             <UButton
               v-else-if="s.approval && s.approval.status === 'pending'"
               color="warning"

package/app/components/panels/inspector/TaskRunSettings.vue

@@ -6,6 +6,7 @@ import type { WritebackOverride } from '~/types/tracker'
 import { riskPolicyOptionLabel, riskPolicySummary } from '~/utils/riskPolicy'
 import { pipelineAllowedForManualStart } from '~/utils/pipeline'
 import InspectorSection from '~/components/panels/inspector/InspectorSection.vue'
+import TaskAprioriBranches from '~/components/panels/inspector/TaskAprioriBranches.vue'
 
 const props = defineProps<{ block: Block }>()
 
@@ -480,6 +481,10 @@ const technicalLabel = computed(() => {
       </div>
     </div>
 
+    <!-- apriori branches: pre-existing branches of the target repo handed to the run as input
+         (a read-only reference, or the working branch the run builds inside) -->
+    <TaskAprioriBranches :block="block" />
+
     <!-- reference repositories: read-only repos the doc-writer reads while drafting (doc tasks) -->
     <DocReferenceRepos v-if="block.taskType === 'document'" :block="block" />