@cat-factory/app 0.280.0 → 0.280.2

package/app/components/docs/DocInterviewWindow.vue

@@ -16,7 +16,7 @@
 // identically before and after the click, which reads as the button having done nothing. The
 // phase below folds the document RUN's status in, so the wait is visible and a failed pass says
 // so instead of leaving the human staring at questions they already submitted.
-import { computed, reactive, watch } from 'vue'
+import { computed } from 'vue'
 import InterviewGateNotice from '~/components/common/InterviewGateNotice.vue'
 import ResultWindowShell from '~/components/panels/ResultWindowShell.vue'
 import {
@@ -33,6 +33,11 @@ const access = useWorkspaceAccess()
 
 const { open, blockId, close } = useResultView('doc-interview', {
   onOpen: ({ blockId }) => void docInterview.load(blockId),
+  // Persist any typed-but-unsubmitted answer before the view tears down (X, backdrop, Escape), so
+  // closing the window never silently drops it (UX-79). The flush seam is right here rather than a
+  // discard prompt because saving ONE answer is a plain save: it records the reply without
+  // resolving the interview, which is what the window's own two commands do.
+  onClose: () => flushOnClose(),
 })
 
 const block = computed(() => (blockId.value ? board.getBlock(blockId.value) : undefined))
@@ -45,18 +50,25 @@ const questions = computed(() =>
 )
 const pending = computed(() => questions.value.filter((q) => !(q.answer ?? '').trim()))
 
-// Per-question answer drafts, seeded from the entity and refreshed as new rounds arrive without
-// clobbering an answer the human is mid-edit on.
-const drafts = reactive<Record<string, string>>({})
-watch(
-  questions,
-  (list) => {
-    for (const q of list) {
-      if (!(q.key in drafts)) drafts[q.key] = q.answer ?? ''
-    }
-  },
-  { immediate: true },
-)
+// Per-question answer drafts, plus the two ways they leave the browser: one on blur, all of them on
+// the way out. The shared seam with the initiative planner's interviewer, which holds the same kind
+// of draft for the same reason; `useInterviewDrafts` records what a per-window copy kept getting
+// wrong, including the flush that used to abandon every answer after the first failed write.
+const { drafts, addressable, unanswered, saveAnswer, flushDrafts, flushThen } = useInterviewDrafts({
+  blockId: () => blockId.value,
+  questions: () => questions.value,
+  pending: () => pending.value,
+  write: (block, questionId, answer) => docInterview.answerQuestion(block, questionId, answer),
+  failureTitleKeys: { one: 'docInterview.saveFailed', many: 'docInterview.saveFailedCount' },
+})
+
+/**
+ * A hoisted indirection for the close hook above. The seam that owns `flushDrafts` needs the
+ * `blockId` this very `useResultView` call produces, so the hook cannot name the const directly.
+ */
+function flushOnClose(): void {
+  flushDrafts()
+}
 
 const resuming = computed(() => docInterview.resuming)
 
@@ -78,12 +90,6 @@ const phase = computed(() =>
 /** The interview converged: the synthesized authoring brief is what the window shows. */
 const converged = computed(() => phase.value === 'converged')
 
-/**
- * Questions still missing a drafted answer. Submit is only meaningful once this is empty — but a
- * disabled button with no stated reason is itself a "nothing happened", so the count is rendered.
- */
-const unanswered = computed(() => pending.value.filter((q) => !drafts[q.key]?.trim()).length)
-
 /** Why Submit is unavailable, or undefined when it is. RBAC first: it outranks a draft gap. */
 const continueBlockedReason = computed(() => {
   if (!access.canExecuteRuns.value) return t('access.noRunExecute')
@@ -91,24 +97,10 @@ const continueBlockedReason = computed(() => {
   return undefined
 })
 
-/** Persist one answer if its draft differs from what's recorded. */
-async function persist(q: { id?: string; key: string; answer?: string }) {
-  const id = q.id
-  if (!id || !blockId.value) return
-  const next = (drafts[q.key] ?? '').trim()
-  if (!next || next === (q.answer ?? '').trim()) return
-  await docInterview.answerQuestion(blockId.value, id, next)
-}
-
-/** Flush all dirty drafts, then run a window action (continue / proceed). */
-async function flushThen(action: (id: string) => Promise<unknown>) {
-  if (!blockId.value) return
-  for (const q of questions.value) await persist(q)
-  await action(blockId.value)
-}
-
-const onContinue = () => flushThen((id) => docInterview.continueInterview(id))
-const onProceed = () => flushThen((id) => docInterview.proceedInterview(id))
+const onContinue = () =>
+  flushThen((id) => docInterview.continueInterview(id), 'docInterview.continueFailed')
+const onProceed = () =>
+  flushThen((id) => docInterview.proceedInterview(id), 'docInterview.proceedFailed')
 </script>
 
 <template>
@@ -210,11 +202,21 @@ const onProceed = () => flushThen((id) => docInterview.proceedInterview(id))
               v-model="drafts[q.key]"
               :rows="2"
               autoresize
+              :disabled="!addressable(q)"
               :placeholder="t('docInterview.answerPlaceholder')"
               class="w-full"
               data-testid="doc-interview-answer"
-              @blur="persist(q)"
+              @blur="saveAnswer(q)"
             />
+            <!-- The answer write addresses a question by id, so an exchange without one has nowhere
+                 for an answer to go. Saying so beats taking text the flush could only drop. -->
+            <p
+              v-if="!addressable(q)"
+              class="mt-1 text-[11px] text-amber-300"
+              data-testid="doc-interview-unanswerable"
+            >
+              {{ t('docInterview.unanswerable') }}
+            </p>
           </li>
         </ul>
       </template>

package/app/components/followUp/FollowUpWindow.vue

@@ -59,13 +59,43 @@ async function onQueue(item: FollowUpItem) {
 async function onAnswer(item: FollowUpItem) {
   const id = execId()
   const answer = (drafts[item.id] ?? '').trim()
-  if (id && answer) await followUps.answerItem(id, item.id, answer).catch(() => {})
+  if (!id || !answer) return
+  // Clear the draft only once the answer is actually recorded: clearing first would make a failed
+  // send cost the typed answer, and would also leave the unsaved guard below with nothing to protect.
+  await followUps
+    .answerItem(id, item.id, answer)
+    .then(() => {
+      delete drafts[item.id]
+    })
+    // The store records the message; the inline error strip renders it.
+    .catch(() => {})
 }
 async function onDismiss(item: FollowUpItem) {
   const id = execId()
   if (id) await followUps.dismissItem(id, item.id).catch(() => {})
 }
 
+/**
+ * Confirm before discarding typed answers (UX-79). Each draft answers a question the Coder is
+ * blocked on, is held only in this component until "Answer & send" is pressed, and the window is
+ * dismissible by Escape and by a backdrop click. Auto-sending them on close is deliberately NOT
+ * the fix: sending an answer DECIDES the item and re-arms the run, which is not something a stray
+ * Escape may do on the user's behalf.
+ */
+const { requestClose } = useUnsavedGuard({
+  open,
+  close: () => close(),
+  // Any item mid-action is about to rewrite the list; don't interrupt it with a prompt.
+  saving: () => followUps.acting.size > 0,
+  // Only drafts against items still awaiting a decision count: one left over from an item that has
+  // since been filed or dismissed elsewhere can no longer be sent anywhere.
+  snapshot: () =>
+    items.value
+      .filter((item) => item.status === 'pending')
+      .map((item) => (drafts[item.id] ?? '').trim())
+      .filter(Boolean),
+})
+
 // Exhaustive map of the item status enum → label key (literal keys keep the typed-key
 // drift guard live, vs a runtime-built `followUp.status.${status}`).
 const STATUS_LABEL_KEYS: Record<FollowUpItem['status'], string> = {
@@ -96,7 +126,7 @@ const STATUS_META: Record<
     :title="headerTitle"
     :subtitle="t('followUp.subtitle')"
     width="3xl"
-    @close="close"
+    @close="requestClose"
   >
     <template #header-extras>
       <UBadge :color="pendingCount > 0 ? 'warning' : 'success'" variant="subtle" size="sm">

package/app/components/forkDecision/ForkDecisionWindow.vue

@@ -96,16 +96,55 @@ async function onChoose() {
     selected.value === 'custom'
       ? { custom: customText.value.trim(), note: noteText }
       : { forkId: selected.value!, note: noteText }
-  await forkDecision.choose(id, choice).catch(() => {})
+  const chosen = await forkDecision
+    .choose(id, choice)
+    .then(() => true)
+    // The store records the message; the inline error strip above renders it.
+    .catch(() => false)
+  // Drop the drafts once the decision is committed. The window stays open as the RECORD of what was
+  // chosen, so leaving the approach and the steering note in their boxes would have the unsaved
+  // guard below prompt to discard work that was submitted seconds ago.
+  if (chosen) {
+    customText.value = ''
+    note.value = ''
+  }
 }
 
 async function onSend() {
   const id = instanceId.value
   const text = chatInput.value.trim()
   if (!id || !text || !canChat.value) return
-  chatInput.value = ''
-  await forkDecision.chat(id, text).catch(() => {})
+  // Clear the box only once the turn is actually recorded: clearing first made a failed send cost
+  // the typed question, with nothing on screen saying the send had failed.
+  await forkDecision
+    .chat(id, text)
+    .then(() => {
+      chatInput.value = ''
+    })
+    // The store records the message; the inline error strip above renders it.
+    .catch(() => {})
 }
+
+/**
+ * Confirm before discarding typed input (UX-79). A custom approach, a steering note and an
+ * unsent chat question are all things the human WROTE, none of them are persisted anywhere until
+ * the matching button is pressed, and this window is dismissible by Escape and by a backdrop
+ * click. Flushing them instead is not an option: sending a chat turn spends the run's bounded
+ * human-turn budget and choosing a fork commits the whole decision, so an accidental dismissal
+ * must never do either on the user's behalf. A window with nothing typed closes as before.
+ */
+const { requestClose } = useUnsavedGuard({
+  open,
+  close: () => close(),
+  saving: () => forkDecision.choosing,
+  snapshot: () => ({
+    // Only counts while the custom path is actually selected — text left in the box under a
+    // proposed fork is not part of the decision being made and would prompt for nothing.
+    custom: selected.value === 'custom' ? customText.value.trim() : '',
+    note: note.value.trim(),
+    chat: chatInput.value.trim(),
+  }),
+})
 </script>
 
 <template>
@@ -117,7 +156,7 @@ async function onSend() {
     :subtitle="t('forkDecision.subtitle')"
     width="3xl"
     testid="fork-decision-window"
-    @close="close"
+    @close="requestClose"
   >
     <div class="min-h-0 flex-1 overflow-y-auto px-5 py-4">
       <!-- Proposing: the read-only proposer is still working. -->
@@ -352,7 +391,7 @@ async function onSend() {
       v-if="interactive"
       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">
+      <UButton color="neutral" variant="ghost" size="sm" @click="requestClose">
         {{ t('common.cancel') }}
       </UButton>
       <UButton

package/app/components/gates/GateResultView.vue

@@ -75,6 +75,19 @@ async function submitFix() {
   fixInstructions.value = ''
 }
 
+/**
+ * Confirm before discarding drafted fix instructions (UX-79). The box is the only thing that tells
+ * the fixer WHAT to change, it is held here until Request fix is pressed, and this window closes on
+ * Escape and on a backdrop click. Sending it on close is not the fix: it resolves the human-review
+ * gate and dispatches an agent.
+ */
+const { requestClose } = useUnsavedGuard({
+  open,
+  close: () => close(),
+  saving: () => fixBusy.value,
+  snapshot: () => fixInstructions.value.trim(),
+})
+
 // The displayed "required approvals" is derived from the cached branch-protection count via
 // the gate's effective floor (`max(1, …)`, see review.logic.ts) rather than persisted twice.
 const requiredApprovals = computed(() => Math.max(1, gate.value?.requiredApprovingReviewCount ?? 1))
@@ -183,7 +196,7 @@ const conflictVerdict = computed(() => {
     :subtitle="subtitle"
     :step-ref="{ instanceId, stepIndex }"
     width="3xl"
-    @close="close"
+    @close="requestClose"
   >
     <template #header-extras>
       <UBadge

package/app/components/humanTest/HumanTestWindow.vue

@@ -89,6 +89,18 @@ const ROUND_OUTCOME_LABEL: Record<HumanTestRoundOutcome, string> = {
 const findings = ref('')
 const showFindings = ref(false)
 
+/**
+ * Confirm before discarding typed findings (UX-79). This box is what a human tester saw go wrong —
+ * the one record of it anywhere — held here until Request fix is pressed, on a window Escape and a
+ * backdrop click both close. Sending it on close would resolve the gate and dispatch a fixer.
+ */
+const { requestClose } = useUnsavedGuard({
+  open,
+  close: () => close(),
+  saving: () => busy.value,
+  snapshot: () => findings.value.trim(),
+})
+
 async function confirm() {
   if (!blockId.value) return
   await humanTest.confirm(blockId.value)
@@ -142,7 +154,7 @@ const canDestroy = computed(
     :title="headerTitle"
     :subtitle="phase ? t(PHASE_LABEL[phase]) : t('humanTest.subtitle')"
     width="3xl"
-    @close="close"
+    @close="requestClose"
   >
     <div class="flex min-h-0 flex-1 flex-col gap-4 overflow-y-auto px-5 py-4">
       <div

package/app/components/initiative/InitiativePlanDecision.vue

@@ -13,7 +13,7 @@
 // an edit typed over it would reach nothing, and the engine refuses it outright
 // (`outputIsRendered` → 422). Requesting changes is the route for a correction, which is why an
 // anchored comment is worth having: it quotes the planner's own text back to it on the re-plan.
-import { computed, ref, watch } from 'vue'
+import { computed, onUnmounted, ref, watch } from 'vue'
 import type { RequestStepChangesInput } from '@cat-factory/contracts'
 
 const props = defineProps<{
@@ -30,8 +30,16 @@ const props = defineProps<{
   comments?: RequestStepChangesInput['comments']
 }>()
 
-/** A send-back succeeded: the surface drops its anchored drafts (the feedback is cleared here). */
-const emit = defineEmits<{ sent: [] }>()
+const emit = defineEmits<{
+  /** A send-back succeeded: the surface drops its anchored drafts (the feedback is cleared here). */
+  sent: []
+  /**
+   * Whether unsent feedback is typed here right now. Reported UPWARD because the field lives two
+   * components below the window that owns closing, and the window is what Escape and a backdrop
+   * click reach (UX-79) — without this the host has no way to know a review is in progress.
+   */
+  'update:dirty': [boolean]
+}>()
 
 const execution = useExecutionStore()
 const { t } = useI18n()
@@ -39,6 +47,11 @@ const { t } = useI18n()
 const feedback = ref('')
 const submitting = ref(false)
 
+watch(feedback, (value) => emit('update:dirty', value.trim().length > 0))
+// The gate resolving unmounts this surface; retract the claim rather than leaving the host holding
+// a dirty flag for a field that no longer exists.
+onUnmounted(() => emit('update:dirty', false))
+
 /** Changes can only be requested with something to act on — an empty send would re-plan blind. */
 const canRequestChanges = computed(
   () => !!feedback.value.trim() || (props.comments?.length ?? 0) > 0,

package/app/components/initiative/InitiativePlanReview.vue

@@ -25,7 +25,7 @@
 // for the outline/collapse/scroll-spy, `useProseComments` for the anchoring, `InitiativePlanDecision`
 // for the two commands, and the global `.reader-prose` sheet for the presentation — so the surfaces
 // cannot drift.
-import { ref, watch } from 'vue'
+import { onUnmounted, ref, watch } from 'vue'
 import type { StepApproval } from '~/types/execution'
 import { useStepProse } from '~/composables/useStepProse'
 import { useProseComments } from '~/composables/useProseComments'
@@ -97,6 +97,20 @@ watch(
   },
 )
 
+/**
+ * Whether this review holds work that is not on the server yet, relayed to the window that owns
+ * closing (UX-79). Three things count and all three are lost on a stray Escape: anchored comments
+ * already placed, a comment being typed, and the decision's overall feedback. They are reported
+ * rather than auto-sent, because sending them RESOLVES the gate and re-plans the initiative.
+ */
+const emit = defineEmits<{ 'update:dirty': [boolean] }>()
+const decisionDirty = ref(false)
+watch(
+  () => decisionDirty.value || planComments.value.length > 0 || draftBody.value.trim().length > 0,
+  (dirty) => emit('update:dirty', dirty),
+)
+onUnmounted(() => emit('update:dirty', false))
+
 /** Whether the sidebar's run-details stack is expanded (it is, until a reviewer wants the outline). */
 const runDetailsOpen = ref(true)
 
@@ -386,6 +400,7 @@ async function copyPlan() {
         :can-execute="canExecute"
         :comments="wireComments"
         @sent="resetComments"
+        @update:dirty="decisionDirty = $event"
       />
     </aside>
   </div>

package/app/components/initiative/InitiativePlanningWindow.vue

@@ -22,7 +22,7 @@
 // identically before and after the click, which reads as the button having done nothing. The
 // phase below folds the planning RUN's status in, so the wait is visible and a failed pass says
 // so instead of leaving the human staring at questions they already submitted.
-import { computed, reactive, ref, watch } from 'vue'
+import { computed, ref, watch } from 'vue'
 import ClarificationItem from '~/components/common/ClarificationItem.vue'
 import InterviewGateNotice from '~/components/common/InterviewGateNotice.vue'
 import {
@@ -44,6 +44,11 @@ const { t } = useI18n()
 
 const { open, blockId, instanceId, stepIndex, close } = useResultView('initiative-planning', {
   onOpen: ({ blockId }) => void initiatives.load(blockId),
+  // Persist any typed-but-unsubmitted answer before the view tears down (X, backdrop, Escape), so
+  // closing the window never silently drops it (UX-79). A flush rather than a discard prompt because
+  // saving ONE answer is a plain save: it records the reply without resuming the interview, which is
+  // what this window's own two commands do.
+  onClose: () => flushOnClose(),
 })
 
 const block = computed(() => (blockId.value ? board.getBlock(blockId.value) : undefined))
@@ -76,18 +81,32 @@ const questions = computed(() =>
 /** Questions still needing an answer: not dismissed, and not yet answered (mirrors backend). */
 const pending = computed(() => questions.value.filter(isPendingQuestion))
 
-// Per-question answer drafts, seeded from the entity and refreshed as new rounds arrive
-// without clobbering an answer the human is mid-edit on.
-const drafts = reactive<Record<string, string>>({})
-watch(
-  questions,
-  (list) => {
-    for (const q of list) {
-      if (!(q.key in drafts)) drafts[q.key] = q.answer ?? ''
-    }
+// Per-question answer drafts, plus the two ways they leave the browser: one on blur, all of them on
+// the way out. The shared seam with the doc-authoring interviewer, which holds the same kind of draft
+// for the same reason; `useInterviewDrafts` records what a per-window copy kept getting wrong.
+//
+// `writable` is this window's own rule: a question set aside as not-relevant had its recorded answer
+// CLEARED, so writing a stale local draft back would silently re-answer it and leak it into the
+// converged digest.
+const { drafts, addressable, unanswered, saveAnswer, flushDrafts, flushThen } = useInterviewDrafts({
+  blockId: () => blockId.value,
+  questions: () => questions.value,
+  pending: () => pending.value,
+  write: (block, questionId, answer) => initiatives.answerQuestion(block, questionId, answer),
+  writable: (q) => q.status !== 'dismissed',
+  failureTitleKeys: {
+    one: 'initiative.planning.saveFailed',
+    many: 'initiative.planning.saveFailedCount',
   },
-  { immediate: true },
-)
+})
+
+/**
+ * A hoisted indirection for the close hook above. The seam that owns `flushDrafts` needs the
+ * `blockId` this very `useResultView` call produces, so the hook cannot name the const directly.
+ */
+function flushOnClose(): void {
+  flushDrafts()
+}
 
 /**
  * Render order (pending first — see `orderInterviewQuestions`), re-snapshotted ONLY when the
@@ -129,33 +148,6 @@ const phase = computed(() =>
       ),
 )
 
-/**
- * Questions still missing a drafted answer. Continue is only meaningful once this is empty — but a
- * disabled button with no stated reason is itself a "nothing happened", so the count is rendered.
- * A dismissed question doesn't count (it was set aside), so an all-dismissed round is trivially
- * answered.
- */
-const unanswered = computed(() => pending.value.filter((q) => !drafts[q.key]?.trim()).length)
-
-/**
- * Persist one answer if its draft differs from what's recorded. A `dismissed` question is skipped:
- * it was set aside (its server answer cleared), and the `flushThen` sweep on continue/proceed must
- * NOT write a stale local draft back to it — that would silently re-answer a not-relevant question
- * and leak it into the converged digest.
- */
-async function persist(q: {
-  id?: string
-  key: string
-  answer?: string
-  status?: 'open' | 'dismissed'
-}) {
-  const id = q.id
-  if (!id || !blockId.value || q.status === 'dismissed') return
-  const next = (drafts[q.key] ?? '').trim()
-  if (!next || next === (q.answer ?? '').trim()) return
-  await initiatives.answerQuestion(blockId.value, id, next)
-}
-
 /** Mark a question not-relevant / reopen it. */
 async function setStatus(q: { id?: string }, status: 'open' | 'dismissed') {
   if (!q.id || !blockId.value) return
@@ -168,22 +160,17 @@ async function recommend(q: { id?: string }) {
   await initiatives.recommendAnswer(blockId.value, q.id)
 }
 
-/** Adopt a suggested answer into the draft, then persist it. */
-async function useRecommendation(q: { id?: string; key: string; recommendation?: string | null }) {
+/** Adopt a suggested answer into the draft, then record it. */
+function useRecommendation(q: (typeof questions.value)[number]) {
   if (!q.recommendation) return
   drafts[q.key] = q.recommendation
-  await persist(q)
-}
-
-/** Flush all dirty drafts, then run a window action (continue / proceed). */
-async function flushThen(action: (id: string) => Promise<unknown>) {
-  if (!blockId.value) return
-  for (const q of questions.value) await persist(q)
-  await action(blockId.value)
+  saveAnswer(q)
 }
 
-const onContinue = () => flushThen((id) => initiatives.continuePlanning(id))
-const onProceed = () => flushThen((id) => initiatives.proceedPlanning(id))
+const onContinue = () =>
+  flushThen((id) => initiatives.continuePlanning(id), 'initiative.planning.continueFailed')
+const onProceed = () =>
+  flushThen((id) => initiatives.proceedPlanning(id), 'initiative.planning.proceedFailed')
 
 /**
  * The escape hatch for a planning run that stalled. It belongs HERE, not only in the inspector's
@@ -301,13 +288,24 @@ async function onDiscard() {
                 :dismissed="q.status === 'dismissed'"
                 :recommendation="q.recommendation"
                 :recommending="!!q.id && initiatives.recommending.has(q.id)"
+                :disabled="!addressable(q)"
                 :answer-placeholder="t('initiative.planning.answerPlaceholder')"
-                @persist="persist(q)"
+                @persist="saveAnswer(q)"
                 @dismiss="setStatus(q, 'dismissed')"
                 @reopen="setStatus(q, 'open')"
                 @recommend="recommend(q)"
                 @use-recommendation="useRecommendation(q)"
               />
+              <!-- Every action here addresses a question by id, so an exchange without one has
+                   nowhere for an answer (or a dismissal) to go. Saying so beats taking text the
+                   flush could only drop. -->
+              <p
+                v-if="!addressable(q)"
+                class="mt-1 text-[11px] text-amber-300"
+                data-testid="initiative-planning-unanswerable"
+              >
+                {{ t('initiative.planning.unanswerable') }}
+              </p>
             </li>
           </ul>
         </template>

package/app/components/initiative/InitiativeTrackerWindow.vue

@@ -136,6 +136,20 @@ const { planApproval } = useInitiativePlanning(() => blockId.value ?? '')
  */
 const planDocument = computed(() => planReviewDocument(planApproval.value))
 
+/**
+ * Confirm before discarding an in-progress plan review (UX-79). While a plan gate is parked this
+ * window hands its whole body to `InitiativePlanReview`, which holds anchored per-block comments
+ * and the overall feedback — the reviewer's actual work, held only in the browser until Send back
+ * is pressed, on a surface Escape and a backdrop click both close. The review reports its own
+ * dirtiness upward (it lives two components down); this is the only place that can act on it.
+ *
+ * The tracker body has two drafts of its own, and both are typed values held here until their OWN
+ * Save: the follow-up promotion form's item title, and the policy form's two knobs (see
+ * `promoteState` / `policyState` below for why each is measured against what it was SEEDED with).
+ * The guard itself is registered at the bottom of this block, where all three are in scope.
+ */
+const planReviewDirty = ref(false)
+
 const policyRules = computed(() => initiative.value?.policy?.rules ?? [])
 function ruleAxes(rule: { minComplexity?: number; minRisk?: number; minImpact?: number }): string {
   const axes = [
@@ -161,6 +175,22 @@ function reportError(error: unknown) {
 // Follow-up promotion: an inline per-follow-up form (phase + optional title override).
 const promotingId = ref<string | null>(null)
 const promoteForm = reactive<{ phaseId: string; title: string }>({ phaseId: '', title: '' })
+/**
+ * What the promote form held the moment it opened.
+ *
+ * The unsaved guard below reports the form's DIVERGENCE from this rather than its contents, because
+ * both of this window's inline forms are seeded from what is already stored: an opened-but-untouched
+ * form is not unsaved work, and prompting over one would train the reader to dismiss the prompt.
+ */
+let promoteSeed = ''
+function promoteState(): string {
+  return JSON.stringify([promoteForm.phaseId, promoteForm.title])
+}
+/** The promote form's unsaved edit, or `''` when it is closed or untouched. */
+function promoteDraft(): string {
+  if (promotingId.value === null) return ''
+  return promoteState() === promoteSeed ? '' : promoteState()
+}
 
 function startPromote(followUp: InitiativeFollowUp) {
   const sourcePhase = (initiative.value?.items ?? []).find(
@@ -168,6 +198,7 @@ function startPromote(followUp: InitiativeFollowUp) {
   )?.phaseId
   promoteForm.phaseId = sourcePhase ?? phases.value[0]?.id ?? ''
   promoteForm.title = followUp.title
+  promoteSeed = promoteState()
   promotingId.value = followUp.id
 }
 
@@ -212,12 +243,23 @@ const policyForm = reactive<{ maxConcurrent: number; defaultPipelineId: string }
   maxConcurrent: 1,
   defaultPipelineId: '',
 })
+/** What the policy form held when it opened; see `promoteSeed` for why the guard compares to it. */
+let policySeed = ''
+function policyState(): string {
+  return JSON.stringify([policyForm.maxConcurrent, policyForm.defaultPipelineId])
+}
+/** The policy form's unsaved edit, or `''` when it is closed or untouched. */
+function policyDraft(): string {
+  if (!editingPolicy.value) return ''
+  return policyState() === policySeed ? '' : policyState()
+}
 
 function startEditPolicy() {
   const policy = initiative.value?.policy
   if (!policy) return
   policyForm.maxConcurrent = policy.maxConcurrent
   policyForm.defaultPipelineId = policy.defaultPipelineId
+  policySeed = policyState()
   editingPolicy.value = true
 }
 
@@ -235,6 +277,21 @@ async function savePolicy() {
     reportError(error)
   }
 }
+
+// Registered last on purpose: the snapshot reads the two inline forms above, and
+// `useUnsavedGuard` takes its baseline synchronously, so a `ref` declared further down would still
+// be in its temporal dead zone.
+const { requestClose } = useUnsavedGuard({
+  open,
+  close: () => close(),
+  snapshot: () => ({
+    // Only meaningful while the review is the thing on screen; with no parked gate the body below
+    // is what is rendered, and its own two forms are the drafts that count.
+    planReview: planApproval.value && planDocument.value ? planReviewDirty.value : false,
+    promote: promoteDraft(),
+    policy: policyDraft(),
+  }),
+})
 </script>
 
 <template>
@@ -246,7 +303,7 @@ async function savePolicy() {
     :subtitle="t('initiative.tracker.subtitle')"
     width="full"
     testid="initiative-tracker-window"
-    @close="close"
+    @close="requestClose"
   >
     <template #header-extras>
       <div v-if="progress" class="flex items-center gap-2" data-testid="initiative-progress">
@@ -277,6 +334,7 @@ async function savePolicy() {
       :instance-id="planApproval.instanceId"
       :can-execute="access.canExecuteRuns.value"
       :plan-document="planDocument"
+      @update:dirty="planReviewDirty = $event"
     >
       <template v-if="runMeta" #run-details>
         <StepRunMeta v-bind="runMeta" />