@cat-factory/app 0.17.2 → 0.18.1

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

@@ -117,7 +117,9 @@ const reviewStageLabel = computed(() =>
     ? 'Incorporating answers…'
     : reviewStage.value === 'reviewing'
       ? 'Re-reviewing…'
-      : null,
+      : reviewStage.value === 'recommending'
+        ? 'Recommending…'
+        : null,
 )
 const pendingApproval = computed(() => {
   const a = execution.openApprovals.find((a) => a.blockId === props.taskId)

package/app/components/clarity/ClarityReviewWindow.vue

@@ -105,6 +105,9 @@ const STATUS_COLOR = {
   answered: 'info',
   resolved: 'success',
   dismissed: 'neutral',
+  // Clarity review doesn't request Requirement-Writer recommendations, but the item-status
+  // type is shared with the requirements review, so the map must be exhaustive.
+  recommend_requested: 'primary',
 } as const satisfies Record<ReviewItemStatus, string>
 
 function notifyError(title: string, e: unknown) {

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

@@ -24,6 +24,30 @@ const services = useServicesStore()
 const composePath = computed(() => props.block.testComposePath ?? '')
 const noInfra = computed(() => props.block.noInfraDependencies === true)
 
+// The default test environment a task under this service is spawned with. `local`
+// stands the dependencies up via docker-compose (or "no infra"); `ephemeral` runs
+// against a provisioned environment. A task can override it per-task in its agent
+// settings. Absent ⇒ the built-in `ephemeral`.
+type TestEnvironment = 'local' | 'ephemeral'
+const TEST_ENVIRONMENTS: { value: TestEnvironment; label: string; hint: string }[] = [
+  {
+    value: 'ephemeral',
+    label: 'Ephemeral environment',
+    hint: 'tests run against a provisioned env',
+  },
+  { value: 'local', label: 'Local (docker-compose)', hint: 'the Tester stands deps up locally' },
+]
+const effectiveTestEnv = computed<TestEnvironment>(
+  () => props.block.defaultTestEnvironment ?? 'ephemeral',
+)
+function setDefaultTestEnv(value: TestEnvironment) {
+  board.updateBlock(props.block.id, { defaultTestEnvironment: value })
+}
+
+// The provisioning hints (cloud provider + instance size) are advisory inputs to the
+// ephemeral-environment provisioner, not commonly tuned — keep them collapsed by default.
+const showProvisioning = ref(false)
+
 // The repo + service subdirectory backing this frame, for the compose-file browser.
 // A monorepo service isn't on the `github_repos` blockId link (that stays null), so
 // fall back to the service catalog mapping, which carries the repo + directory.
@@ -93,6 +117,27 @@ const missingInfra = computed(() => !noInfra.value && composePath.value.trim() =
       Test infrastructure
     </div>
 
+    <div class="space-y-1">
+      <span class="text-[11px] text-slate-400">Default test environment</span>
+      <div class="flex flex-wrap gap-1">
+        <UButton
+          v-for="e in TEST_ENVIRONMENTS"
+          :key="e.value"
+          :color="effectiveTestEnv === e.value ? 'primary' : 'neutral'"
+          :variant="effectiveTestEnv === e.value ? 'soft' : 'ghost'"
+          size="xs"
+          :title="e.hint"
+          @click="setDefaultTestEnv(e.value)"
+        >
+          {{ e.label }}
+        </UButton>
+      </div>
+      <p class="text-[11px] leading-snug text-slate-500">
+        The default tasks under this service are spawned with — each task can override it in its
+        agent settings.
+      </p>
+    </div>
+
     <div class="space-y-1">
       <label class="text-[11px] text-slate-400">docker-compose path</label>
       <div class="flex items-center gap-1">
@@ -163,35 +208,59 @@ const missingInfra = computed(() => !noInfra.value && composePath.value.trim() =
       Tester won't start.
     </p>
 
-    <div class="space-y-1">
-      <span class="text-[11px] text-slate-400">Cloud provider</span>
-      <div class="flex flex-wrap gap-1">
-        <UButton
-          v-for="p in PROVIDERS"
-          :key="p.value"
-          :color="effectiveProvider === p.value ? 'primary' : 'neutral'"
-          :variant="effectiveProvider === p.value ? 'soft' : 'ghost'"
-          size="xs"
-          @click="setProvider(p.value)"
-        >
-          {{ p.label }}
-        </UButton>
-      </div>
-    </div>
+    <!-- Provisioning hints: advisory inputs to the ephemeral-environment provisioner.
+         Collapsed by default — most services never tune them. -->
+    <div class="border-t border-slate-800 pt-2">
+      <button
+        type="button"
+        class="flex w-full items-center gap-1.5 text-left text-[11px] font-semibold uppercase tracking-wide text-slate-500 hover:text-slate-300"
+        @click="showProvisioning = !showProvisioning"
+      >
+        <UIcon
+          :name="showProvisioning ? 'i-lucide-chevron-down' : 'i-lucide-chevron-right'"
+          class="h-3.5 w-3.5"
+        />
+        Ephemeral environment provisioning
+      </button>
 
-    <div class="space-y-1">
-      <span class="text-[11px] text-slate-400">Instance size</span>
-      <div class="flex flex-wrap gap-1">
-        <UButton
-          v-for="s in SIZES"
-          :key="s.value"
-          :color="(block.instanceSize ?? 'medium') === s.value ? 'primary' : 'neutral'"
-          :variant="(block.instanceSize ?? 'medium') === s.value ? 'soft' : 'ghost'"
-          size="xs"
-          @click="setSize(s.value)"
-        >
-          {{ s.label }}
-        </UButton>
+      <div v-if="showProvisioning" class="mt-2 space-y-3">
+        <p class="text-[11px] leading-snug text-slate-500">
+          A hint for provisioning this service's ephemeral test environment — which cloud provider
+          to deploy to and how large an instance to request. Ignored for local (docker-compose)
+          testing.
+        </p>
+
+        <div class="space-y-1">
+          <span class="text-[11px] text-slate-400">Cloud provider</span>
+          <div class="flex flex-wrap gap-1">
+            <UButton
+              v-for="p in PROVIDERS"
+              :key="p.value"
+              :color="effectiveProvider === p.value ? 'primary' : 'neutral'"
+              :variant="effectiveProvider === p.value ? 'soft' : 'ghost'"
+              size="xs"
+              @click="setProvider(p.value)"
+            >
+              {{ p.label }}
+            </UButton>
+          </div>
+        </div>
+
+        <div class="space-y-1">
+          <span class="text-[11px] text-slate-400">Instance size</span>
+          <div class="flex flex-wrap gap-1">
+            <UButton
+              v-for="s in SIZES"
+              :key="s.value"
+              :color="(block.instanceSize ?? 'medium') === s.value ? 'primary' : 'neutral'"
+              :variant="(block.instanceSize ?? 'medium') === s.value ? 'soft' : 'ghost'"
+              size="xs"
+              @click="setSize(s.value)"
+            >
+              {{ s.label }}
+            </UButton>
+          </div>
+        </div>
       </div>
     </div>
   </div>

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

@@ -29,6 +29,33 @@ const descriptors = computed(() => {
 
 const run = computed(() => execution.getByBlock(props.block.id))
 
+// The Tester's environment descriptor inherits its default from the service frame this
+// task lives under (set in the service inspector); a task only overrides it by clicking.
+// Walk up the parent chain (frame → module → task) to find that default.
+const serviceDefaultTestEnv = computed<'local' | 'ephemeral' | undefined>(() => {
+  let cur: Block | undefined = props.block
+  for (let i = 0; i < 8 && cur; i++) {
+    if (cur.level === 'frame') return cur.defaultTestEnvironment
+    if (!cur.parentId) break
+    cur = board.getBlock(cur.parentId)
+  }
+  return undefined
+})
+
+/** The effective default for a descriptor — the inherited service value for the Tester's
+ *  environment, otherwise the descriptor's own static default. */
+function effectiveDefault(d: { id: string; default: string }): string {
+  if (d.id === 'tester.environment' && serviceDefaultTestEnv.value) {
+    return serviceDefaultTestEnv.value
+  }
+  return d.default
+}
+
+/** Whether a descriptor's shown value is inherited (not explicitly pinned on this task). */
+function isInherited(d: { id: string }): boolean {
+  return d.id === 'tester.environment' && props.block.agentConfig?.[d.id] === undefined
+}
+
 /** A descriptor freezes once its contributing agent's step has left `pending`. */
 function isFrozen(agentKind: string): boolean {
   const steps = run.value?.steps
@@ -55,19 +82,24 @@ function setValue(id: string, value: string) {
     <div v-for="d in descriptors" :key="d.id" class="space-y-1">
       <div class="flex items-center justify-between">
         <span class="text-[11px] text-slate-400">{{ d.label }}</span>
-        <UIcon
-          v-if="isFrozen(d.agentKind)"
-          name="i-lucide-lock"
-          class="h-3 w-3 text-slate-500"
-          title="Frozen — the agent has started"
-        />
+        <div class="flex items-center gap-1.5">
+          <span v-if="isInherited(d)" class="text-[10px] text-slate-500"
+            >inherited from service</span
+          >
+          <UIcon
+            v-if="isFrozen(d.agentKind)"
+            name="i-lucide-lock"
+            class="h-3 w-3 text-slate-500"
+            title="Frozen — the agent has started"
+          />
+        </div>
       </div>
       <div class="flex flex-wrap gap-1">
         <UButton
           v-for="opt in d.options"
           :key="opt.value"
-          :color="valueOf(d.id, d.default) === opt.value ? 'primary' : 'neutral'"
-          :variant="valueOf(d.id, d.default) === opt.value ? 'soft' : 'ghost'"
+          :color="valueOf(d.id, effectiveDefault(d)) === opt.value ? 'primary' : 'neutral'"
+          :variant="valueOf(d.id, effectiveDefault(d)) === opt.value ? 'soft' : 'ghost'"
           size="xs"
           :disabled="isFrozen(d.agentKind)"
           @click="setValue(d.id, opt.value)"

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

@@ -22,7 +22,9 @@ const reviewStageLabel = computed(() =>
     ? 'Incorporating…'
     : reviewStage.value === 'reviewing'
       ? 'Re-reviewing…'
-      : null,
+      : reviewStage.value === 'recommending'
+        ? 'Recommending…'
+        : null,
 )
 
 const instance = computed(() => execution.getInstance(props.block.executionId))

package/app/components/pipeline/PipelineBuilder.vue

@@ -203,12 +203,17 @@ async function clone(p: Pipeline) {
 </script>
 
 <template>
-  <USlideover v-model:open="open" title="Pipeline builder" side="left">
+  <USlideover
+    v-model:open="open"
+    title="Pipeline builder"
+    side="left"
+    :ui="{ content: 'max-w-[90vw] sm:max-w-2xl lg:max-w-5xl xl:max-w-6xl' }"
+  >
     <template #body>
-      <div class="grid h-full grid-cols-2 gap-4">
+      <div class="grid h-full grid-cols-1 gap-4 lg:grid-cols-3">
         <!-- agent palette -->
-        <div class="overflow-y-auto pr-1">
-          <div class="mb-2 flex items-center justify-between gap-2">
+        <div class="flex min-h-0 flex-col overflow-hidden">
+          <div class="mb-2 flex shrink-0 items-center justify-between gap-2">
             <h3 class="text-xs font-semibold uppercase tracking-wide text-slate-400">
               Agent palette
             </h3>
@@ -222,11 +227,13 @@ async function clone(p: Pipeline) {
               Add agent
             </UButton>
           </div>
-          <AgentPalette @add="add" />
+          <div class="min-h-0 flex-1 overflow-y-auto pr-1">
+            <AgentPalette @add="add" />
+          </div>
         </div>
 
         <!-- draft chain -->
-        <div class="flex flex-col">
+        <div class="flex min-h-0 flex-col overflow-hidden">
           <div class="mb-2 flex items-center justify-between gap-2">
             <h3 class="text-xs font-semibold uppercase tracking-wide text-slate-400">Pipeline</h3>
             <UButton
@@ -286,7 +293,7 @@ async function clone(p: Pipeline) {
             Click agents on the left to assemble a linear pipeline.
           </div>
 
-          <ol v-else class="flex-1 space-y-2 overflow-y-auto">
+          <ol v-else class="min-h-0 flex-1 space-y-2 overflow-y-auto pr-1">
             <li
               v-for="(unit, vi) in pipelines.units"
               :key="unit.index"
@@ -576,160 +583,160 @@ async function clone(p: Pipeline) {
               </div>
             </li>
           </ol>
+        </div>
 
-          <!-- Saved pipelines: review the library + delete (the run affordance
-               moved to the task card / inspector when the palettes were removed). -->
-          <div v-if="pipelines.pipelines.length" class="mt-4 border-t border-slate-800 pt-3">
-            <div class="mb-2 flex items-center justify-between gap-2">
-              <h3 class="text-xs font-semibold uppercase tracking-wide text-slate-400">
-                Saved pipelines
-              </h3>
-              <UButton
-                v-if="archivedCount"
-                :icon="showArchived ? 'i-lucide-archive-restore' : 'i-lucide-archive'"
-                :color="showArchived ? 'primary' : 'neutral'"
-                variant="ghost"
-                size="xs"
-                @click="showArchived = !showArchived"
-              >
-                {{ showArchived ? 'Hide archived' : `Archived (${archivedCount})` }}
-              </UButton>
-            </div>
-
-            <!-- Label filter chips. -->
-            <div v-if="allLabels.length" class="mb-2 flex flex-wrap items-center gap-1">
-              <UBadge
-                :color="labelFilter === null ? 'primary' : 'neutral'"
-                variant="soft"
-                size="xs"
-                class="cursor-pointer"
-                @click="labelFilter = null"
-              >
-                All
-              </UBadge>
-              <UBadge
-                v-for="l in allLabels"
-                :key="l"
-                :color="labelFilter === l ? 'primary' : 'neutral'"
-                variant="soft"
-                size="xs"
-                class="cursor-pointer"
-                @click="labelFilter = labelFilter === l ? null : l"
-              >
-                {{ l }}
-              </UBadge>
-            </div>
-
-            <ul class="space-y-1.5">
-              <li
-                v-for="p in visiblePipelines"
-                :key="p.id"
-                class="group rounded-lg border border-slate-700 bg-slate-800/40"
-                :class="{ 'opacity-60': p.archived }"
-              >
-                <div class="flex items-center gap-2 px-2 py-1.5">
-                  <button
-                    type="button"
-                    class="flex min-w-0 flex-1 items-center gap-2 text-left"
-                    @click="toggleSaved(p.id)"
+        <!-- Saved pipelines: review the library + delete (the run affordance
+             moved to the task card / inspector when the palettes were removed). -->
+        <div v-if="pipelines.pipelines.length" class="flex min-h-0 flex-col overflow-hidden">
+          <div class="mb-2 flex shrink-0 items-center justify-between gap-2">
+            <h3 class="text-xs font-semibold uppercase tracking-wide text-slate-400">
+              Saved pipelines
+            </h3>
+            <UButton
+              v-if="archivedCount"
+              :icon="showArchived ? 'i-lucide-archive-restore' : 'i-lucide-archive'"
+              :color="showArchived ? 'primary' : 'neutral'"
+              variant="ghost"
+              size="xs"
+              @click="showArchived = !showArchived"
+            >
+              {{ showArchived ? 'Hide archived' : `Archived (${archivedCount})` }}
+            </UButton>
+          </div>
+
+          <!-- Label filter chips. -->
+          <div v-if="allLabels.length" class="mb-2 flex shrink-0 flex-wrap items-center gap-1">
+            <UBadge
+              :color="labelFilter === null ? 'primary' : 'neutral'"
+              variant="soft"
+              size="xs"
+              class="cursor-pointer"
+              @click="labelFilter = null"
+            >
+              All
+            </UBadge>
+            <UBadge
+              v-for="l in allLabels"
+              :key="l"
+              :color="labelFilter === l ? 'primary' : 'neutral'"
+              variant="soft"
+              size="xs"
+              class="cursor-pointer"
+              @click="labelFilter = labelFilter === l ? null : l"
+            >
+              {{ l }}
+            </UBadge>
+          </div>
+
+          <ul class="min-h-0 flex-1 space-y-1.5 overflow-y-auto pr-1">
+            <li
+              v-for="p in visiblePipelines"
+              :key="p.id"
+              class="group rounded-lg border border-slate-700 bg-slate-800/40"
+              :class="{ 'opacity-60': p.archived }"
+            >
+              <div class="flex items-center gap-2 px-2 py-1.5">
+                <button
+                  type="button"
+                  class="flex min-w-0 flex-1 items-center gap-2 text-left"
+                  @click="toggleSaved(p.id)"
+                >
+                  <UIcon
+                    :name="
+                      expandedSaved.has(p.id) ? 'i-lucide-chevron-down' : 'i-lucide-chevron-right'
+                    "
+                    class="h-3.5 w-3.5 shrink-0 text-slate-500"
+                  />
+                  <span class="min-w-0 flex-1 truncate text-xs text-slate-200">{{ p.name }}</span>
+                  <UBadge
+                    v-for="l in p.labels ?? []"
+                    :key="l"
+                    color="info"
+                    variant="soft"
+                    size="xs"
+                    class="shrink-0"
                   >
-                    <UIcon
-                      :name="
-                        expandedSaved.has(p.id) ? 'i-lucide-chevron-down' : 'i-lucide-chevron-right'
-                      "
-                      class="h-3.5 w-3.5 shrink-0 text-slate-500"
-                    />
-                    <span class="min-w-0 flex-1 truncate text-xs text-slate-200">{{ p.name }}</span>
-                    <UBadge
-                      v-for="l in p.labels ?? []"
-                      :key="l"
-                      color="info"
-                      variant="soft"
-                      size="xs"
-                      class="shrink-0"
-                    >
-                      {{ l }}
-                    </UBadge>
-                    <UBadge
-                      v-if="p.builtin"
-                      color="neutral"
-                      variant="soft"
-                      size="xs"
-                      class="shrink-0"
-                    >
-                      default
-                    </UBadge>
-                    <span class="shrink-0 text-[10px] text-slate-500">
-                      {{ p.agentKinds.length }} {{ p.agentKinds.length === 1 ? 'step' : 'steps' }}
-                    </span>
-                  </button>
-                  <div
-                    class="flex shrink-0 items-center opacity-0 transition group-hover:opacity-100"
+                    {{ l }}
+                  </UBadge>
+                  <UBadge
+                    v-if="p.builtin"
+                    color="neutral"
+                    variant="soft"
+                    size="xs"
+                    class="shrink-0"
                   >
-                    <!-- Archive/unarchive: organize the library without deleting. Works on
+                    default
+                  </UBadge>
+                  <span class="shrink-0 text-[10px] text-slate-500">
+                    {{ p.agentKinds.length }} {{ p.agentKinds.length === 1 ? 'step' : 'steps' }}
+                  </span>
+                </button>
+                <div
+                  class="flex shrink-0 items-center opacity-0 transition group-hover:opacity-100"
+                >
+                  <!-- Archive/unarchive: organize the library without deleting. Works on
                          built-ins too (view metadata, not structure). -->
-                    <UButton
-                      :icon="p.archived ? 'i-lucide-archive-restore' : 'i-lucide-archive'"
-                      color="neutral"
-                      variant="ghost"
-                      size="xs"
-                      :title="p.archived ? 'Unarchive' : 'Archive (hide from the default view)'"
-                      @click="toggleArchive(p)"
-                    />
-                    <!-- Clone is available on every pipeline — it's how a read-only
+                  <UButton
+                    :icon="p.archived ? 'i-lucide-archive-restore' : 'i-lucide-archive'"
+                    color="neutral"
+                    variant="ghost"
+                    size="xs"
+                    :title="p.archived ? 'Unarchive' : 'Archive (hide from the default view)'"
+                    @click="toggleArchive(p)"
+                  />
+                  <!-- Clone is available on every pipeline — it's how a read-only
                          built-in template becomes an editable copy. -->
-                    <UButton
-                      icon="i-lucide-copy"
-                      color="neutral"
-                      variant="ghost"
-                      size="xs"
-                      :title="p.builtin ? 'Clone this default into an editable copy' : 'Clone'"
-                      @click="clone(p)"
-                    />
-                    <!-- Built-in templates are read-only; only custom pipelines edit in place. -->
-                    <UButton
-                      v-if="!p.builtin"
-                      icon="i-lucide-pencil"
-                      color="neutral"
-                      variant="ghost"
-                      size="xs"
-                      title="Edit this pipeline"
-                      @click="edit(p)"
-                    />
-                    <!-- Built-in templates are read-only — they can be cloned but not
+                  <UButton
+                    icon="i-lucide-copy"
+                    color="neutral"
+                    variant="ghost"
+                    size="xs"
+                    :title="p.builtin ? 'Clone this default into an editable copy' : 'Clone'"
+                    @click="clone(p)"
+                  />
+                  <!-- Built-in templates are read-only; only custom pipelines edit in place. -->
+                  <UButton
+                    v-if="!p.builtin"
+                    icon="i-lucide-pencil"
+                    color="neutral"
+                    variant="ghost"
+                    size="xs"
+                    title="Edit this pipeline"
+                    @click="edit(p)"
+                  />
+                  <!-- Built-in templates are read-only — they can be cloned but not
                          deleted (the backend rejects it too); only custom ones delete. -->
-                    <UButton
-                      v-if="!p.builtin"
-                      icon="i-lucide-trash-2"
-                      color="neutral"
-                      variant="ghost"
-                      size="xs"
-                      @click="pipelines.removePipeline(p.id)"
-                    />
-                  </div>
+                  <UButton
+                    v-if="!p.builtin"
+                    icon="i-lucide-trash-2"
+                    color="neutral"
+                    variant="ghost"
+                    size="xs"
+                    @click="pipelines.removePipeline(p.id)"
+                  />
                 </div>
+              </div>
 
-                <!-- Full ordered step list, revealed on click. -->
-                <ol
-                  v-if="expandedSaved.has(p.id)"
-                  class="space-y-1 border-t border-slate-800 px-2 py-2 pl-7"
+              <!-- Full ordered step list, revealed on click. -->
+              <ol
+                v-if="expandedSaved.has(p.id)"
+                class="space-y-1 border-t border-slate-800 px-2 py-2 pl-7"
+              >
+                <li
+                  v-for="(k, i) in p.agentKinds"
+                  :key="i"
+                  class="flex items-center gap-2"
+                  :class="{ 'opacity-50 line-through': p.enabled?.[i] === false }"
+                  :title="p.enabled?.[i] === false ? 'Disabled — skipped at run' : undefined"
                 >
-                  <li
-                    v-for="(k, i) in p.agentKinds"
-                    :key="i"
-                    class="flex items-center gap-2"
-                    :class="{ 'opacity-50 line-through': p.enabled?.[i] === false }"
-                    :title="p.enabled?.[i] === false ? 'Disabled — skipped at run' : undefined"
-                  >
-                    <span class="w-4 shrink-0 text-center text-[10px] text-slate-500">{{
-                      i + 1
-                    }}</span>
-                    <AgentKindIcon :kind="k" show-label />
-                  </li>
-                </ol>
-              </li>
-            </ul>
-          </div>
+                  <span class="w-4 shrink-0 text-center text-[10px] text-slate-500">{{
+                    i + 1
+                  }}</span>
+                  <AgentKindIcon :kind="k" show-label />
+                </li>
+              </ol>
+            </li>
+          </ul>
         </div>
       </div>
     </template>

package/app/components/pipeline/PipelineProgress.vue

@@ -32,7 +32,9 @@ function reviewStageLabel(agentKind: string | undefined): string | null {
     ? 'Incorporating…'
     : stage === 'reviewing'
       ? 'Re-reviewing…'
-      : null
+      : stage === 'recommending'
+        ? 'Recommending…'
+        : null
 }
 
 // Clicking an agent opens its step-detail overlay — execution metadata (state,

package/app/components/requirements/RequirementsReviewWindow.vue

@@ -10,6 +10,7 @@
 import { parseOutputOutline } from '~/utils/agentOutput'
 import StepRestartControl from '~/components/panels/StepRestartControl.vue'
 import type {
+  RequirementRecommendation,
   RequirementReview,
   RequirementReviewItem,
   ReviewItemCategory,
@@ -23,6 +24,15 @@ const toast = useToast()
 
 // Draft replies, keyed by item id, so editing one item doesn't disturb others.
 const drafts = ref<Record<string, string>>({})
+// The server-side reply each draft was last seeded/synced to, so the seeding watch can refresh
+// a draft when the recorded reply changes server-side (e.g. accepting a recommendation sets the
+// finding's answer) WITHOUT clobbering a reply the human is actively editing.
+const seededReply = ref<Record<string, string>>({})
+// Findings the human marked for a Requirement-Writer recommendation, batched until they
+// click "Request recommendations" (so the Writer runs once over the whole batch).
+const markedForRecommend = ref<Set<string>>(new Set())
+// Re-request "do it differently" notes, keyed by recommendation id.
+const reRequestNotes = ref<Record<string, string>>({})
 // Freeform "do it differently" comment when redoing a merge the human was unhappy with.
 const redoComment = ref('')
 const showRedo = ref(false)
@@ -35,6 +45,9 @@ const showRedo = ref(false)
 const { open, blockId, instanceId, stepIndex, close } = useResultView('requirements-review', {
   onOpen: (id) => {
     drafts.value = {}
+    seededReply.value = {}
+    markedForRecommend.value = new Set()
+    reRequestNotes.value = {}
     redoComment.value = ''
     showRedo.value = false
     void requirements.load(id)
@@ -109,6 +122,7 @@ const STATUS_COLOR = {
   answered: 'info',
   resolved: 'success',
   dismissed: 'neutral',
+  recommend_requested: 'primary',
 } as const satisfies Record<ReviewItemStatus, string>
 
 function notifyError(title: string, e: unknown) {
@@ -120,18 +134,73 @@ function notifyError(title: string, e: unknown) {
   })
 }
 
-async function submitReply(item: RequirementReviewItem) {
-  if (!review.value) return
+// Answers auto-save: there is no explicit "save" button. The textarea is pre-seeded with
+// the recorded reply (see the watch below); editing and blurring persists it. Persist only
+// when the trimmed draft actually differs from what's already recorded, so blurring an
+// untouched field is a no-op.
+async function persistDraft(item: RequirementReviewItem) {
+  if (!review.value || frozen.value) return
   const text = (drafts.value[item.id] ?? '').trim()
-  if (!text) return
+  if (!text || text === (item.reply ?? '').trim()) return
   try {
     await requirements.reply(review.value, item.id, text)
-    drafts.value = { ...drafts.value, [item.id]: '' }
   } catch (e) {
     notifyError('Could not save the answer', e)
   }
 }
 
+// Persist every dirty draft before an action that consumes the answers, so a value the
+// user typed but never blurred out of isn't lost.
+async function flushDrafts() {
+  if (!review.value) return
+  for (const item of review.value.items) {
+    if (item.status === 'open' || item.status === 'answered') await persistDraft(item)
+  }
+}
+
+// Seed a draft for each finding from its recorded reply so the textarea shows the current
+// answer (editing in place). New findings from a re-review get seeded; and when the recorded
+// reply changes server-side (e.g. accepting a recommendation writes the finding's answer) a
+// draft the user hasn't diverged from is refreshed to match. Drafts the user is actively
+// editing are left untouched.
+watch(
+  review,
+  (r) => {
+    if (!r) return
+    const nextDrafts = { ...drafts.value }
+    const nextSeeded = { ...seededReply.value }
+    let changed = false
+    for (const item of r.items) {
+      const reply = item.reply ?? ''
+      if (!(item.id in nextDrafts)) {
+        nextDrafts[item.id] = reply
+        nextSeeded[item.id] = reply
+        changed = true
+        continue
+      }
+      const draft = nextDrafts[item.id] ?? ''
+      const seeded = nextSeeded[item.id] ?? ''
+      if (draft === seeded && draft !== reply) {
+        // The user hasn't diverged from the last seeded value but the server reply changed —
+        // refresh the textarea to the new answer (e.g. an accepted recommendation).
+        nextDrafts[item.id] = reply
+        nextSeeded[item.id] = reply
+        changed = true
+      } else if (draft === reply && seeded !== reply) {
+        // The draft already matches the server (e.g. the user's answer was just persisted) —
+        // record it so a later server-side change can be detected.
+        nextSeeded[item.id] = reply
+        changed = true
+      }
+    }
+    if (changed) {
+      drafts.value = nextDrafts
+      seededReply.value = nextSeeded
+    }
+  },
+  { immediate: true },
+)
+
 async function setStatus(item: RequirementReviewItem, itemStatus: ReviewItemStatus) {
   if (!review.value) return
   try {
@@ -141,9 +210,75 @@ async function setStatus(item: RequirementReviewItem, itemStatus: ReviewItemStat
   }
 }
 
+// --- Requirement Writer recommendations -----------------------------------
+const recommending = computed(() =>
+  blockId.value ? requirements.isRecommending(blockId.value) : false,
+)
+// Recommendations still awaiting a human decision (the ones to surface for review).
+const pendingRecommendations = computed<RequirementRecommendation[]>(() =>
+  (review.value?.recommendations ?? []).filter((r) => r.status === 'ready'),
+)
+function isMarkedForRecommend(item: RequirementReviewItem): boolean {
+  return markedForRecommend.value.has(item.id)
+}
+function toggleRecommend(item: RequirementReviewItem) {
+  const next = new Set(markedForRecommend.value)
+  if (next.has(item.id)) next.delete(item.id)
+  else next.add(item.id)
+  markedForRecommend.value = next
+}
+
+// Fire the Writer over the whole marked batch at once (grounded on the project's
+// best-practice standards, specs/tech-specs and web search).
+async function requestRecommendations() {
+  if (!blockId.value || markedForRecommend.value.size === 0) return
+  const ids = [...markedForRecommend.value]
+  try {
+    await requirements.requestRecommendations(blockId.value, ids)
+    markedForRecommend.value = new Set()
+    toast.add({
+      title: `Requesting ${ids.length} recommendation${ids.length === 1 ? '' : 's'}…`,
+      icon: 'i-lucide-sparkles',
+    })
+  } catch (e) {
+    notifyError('Could not request recommendations', e)
+  }
+}
+
+async function acceptRecommendation(rec: RequirementRecommendation) {
+  if (!review.value) return
+  try {
+    await requirements.acceptRecommendation(review.value, rec.id)
+  } catch (e) {
+    notifyError('Could not accept the recommendation', e)
+  }
+}
+
+async function rejectRecommendation(rec: RequirementRecommendation) {
+  if (!review.value) return
+  try {
+    await requirements.rejectRecommendation(review.value, rec.id)
+  } catch (e) {
+    notifyError('Could not reject the recommendation', e)
+  }
+}
+
+async function reRequestRecommendation(rec: RequirementRecommendation) {
+  if (!review.value) return
+  const note = (reRequestNotes.value[rec.id] ?? '').trim()
+  if (!note) return
+  try {
+    await requirements.reRequestRecommendation(review.value, rec.id, note)
+    reRequestNotes.value = { ...reRequestNotes.value, [rec.id]: '' }
+  } catch (e) {
+    notifyError('Could not re-request the recommendation', e)
+  }
+}
+
 async function incorporate(feedback?: string) {
   if (!review.value || !blockId.value) return
   try {
+    await flushDrafts()
     await requirements.incorporate(review.value, feedback)
   } catch (e) {
     notifyError('Could not incorporate the answers', e)
@@ -183,6 +318,7 @@ async function proceed() {
   if (!blockId.value) return
   acting.value = true
   try {
+    await flushDrafts()
     await requirements.proceed(blockId.value)
     toast.add({ title: 'Proceeding to the next phase', icon: 'i-lucide-arrow-right' })
   } catch (e) {
@@ -350,9 +486,10 @@ async function resolveExceeded(choice: 'extra-round' | 'proceed' | 'stop-reset')
                         {{ item.detail }}
                       </p>
 
-                      <!-- recorded answer -->
+                      <!-- recorded answer (only for non-editable findings — for editable
+                           ones the answer lives in the textarea below, seeded from the reply) -->
                       <div
-                        v-if="item.reply"
+                        v-if="item.reply && item.status !== 'open' && item.status !== 'answered'"
                         class="mt-2 rounded-md border-l-2 border-slate-700 bg-slate-950/40 px-3 py-1.5 text-sm text-slate-300"
                       >
                         <span class="text-[10px] uppercase tracking-wide text-slate-500">
@@ -361,7 +498,8 @@ async function resolveExceeded(choice: 'extra-round' | 'proceed' | 'stop-reset')
                         <p class="whitespace-pre-line">{{ item.reply }}</p>
                       </div>
 
-                      <!-- react: answer (relevant) or dismiss (irrelevant). Disabled once the
+                      <!-- react: answer (relevant) or dismiss (irrelevant). The answer
+                           auto-saves on blur — no explicit save button. Disabled once the
                            requirements are settled / awaiting a higher-level decision. -->
                       <template v-if="item.status === 'open' || item.status === 'answered'">
                         <UTextarea
@@ -370,20 +508,11 @@ async function resolveExceeded(choice: 'extra-round' | 'proceed' | 'stop-reset')
                           autoresize
                           size="sm"
                           class="mt-2 w-full"
-                          :placeholder="item.reply ? 'Refine your answer…' : 'Answer this finding…'"
+                          placeholder="Answer this finding…"
                           :disabled="frozen"
+                          @blur="persistDraft(item)"
                         />
                         <div class="mt-2 flex flex-wrap items-center gap-2">
-                          <UButton
-                            color="primary"
-                            variant="soft"
-                            size="xs"
-                            icon="i-lucide-corner-down-left"
-                            :disabled="!(drafts[item.id] ?? '').trim() || frozen"
-                            @click="submitReply(item)"
-                          >
-                            Save answer
-                          </UButton>
                           <UButton
                             color="neutral"
                             variant="ghost"
@@ -394,9 +523,32 @@ async function resolveExceeded(choice: 'extra-round' | 'proceed' | 'stop-reset')
                           >
                             Dismiss as irrelevant
                           </UButton>
+                          <UButton
+                            :color="isMarkedForRecommend(item) ? 'primary' : 'neutral'"
+                            :variant="isMarkedForRecommend(item) ? 'soft' : 'ghost'"
+                            size="xs"
+                            icon="i-lucide-wand-2"
+                            :disabled="frozen"
+                            @click="toggleRecommend(item)"
+                          >
+                            {{
+                              isMarkedForRecommend(item)
+                                ? 'Marked for recommendation'
+                                : 'Recommend something'
+                            }}
+                          </UButton>
                         </div>
                       </template>
 
+                      <!-- finding awaiting a recommendation batch -->
+                      <div
+                        v-else-if="item.status === 'recommend_requested'"
+                        class="mt-2 flex items-center gap-1.5 text-xs text-indigo-300"
+                      >
+                        <UIcon name="i-lucide-wand-2" class="h-3.5 w-3.5" />
+                        Recommendation requested — review the suggestion below.
+                      </div>
+
                       <!-- reopen a dismissed finding -->
                       <div v-else-if="item.status === 'dismissed'" class="mt-2">
                         <UButton
@@ -415,6 +567,87 @@ async function resolveExceeded(choice: 'extra-round' | 'proceed' | 'stop-reset')
                 </div>
               </div>
 
+              <!-- Requirement-Writer recommendations awaiting a human decision -->
+              <section
+                v-if="pendingRecommendations.length"
+                class="mt-6 border-t border-slate-800 pt-5"
+              >
+                <div class="mb-3 flex items-center gap-1.5 text-[11px] text-indigo-300">
+                  <UIcon name="i-lucide-wand-2" class="h-3.5 w-3.5" />
+                  <span class="font-semibold uppercase tracking-wide">Recommended answers</span>
+                </div>
+                <div class="flex flex-col gap-3">
+                  <div
+                    v-for="rec in pendingRecommendations"
+                    :key="rec.id"
+                    class="rounded-lg border border-indigo-900/50 bg-indigo-950/20 p-3"
+                  >
+                    <div class="flex flex-wrap items-center gap-1.5">
+                      <span class="text-sm font-medium text-white">{{
+                        rec.sourceFinding.title
+                      }}</span>
+                      <UBadge
+                        v-if="rec.groundedInFragment"
+                        size="xs"
+                        variant="subtle"
+                        color="success"
+                        icon="i-lucide-badge-check"
+                      >
+                        Current standard: {{ rec.groundedInFragment.title }}
+                      </UBadge>
+                    </div>
+                    <p class="mt-2 whitespace-pre-line text-sm text-slate-300">
+                      {{ rec.recommendedText }}
+                    </p>
+                    <div class="mt-2 flex flex-wrap items-center gap-2">
+                      <UButton
+                        color="primary"
+                        variant="soft"
+                        size="xs"
+                        icon="i-lucide-check"
+                        :disabled="frozen"
+                        @click="acceptRecommendation(rec)"
+                      >
+                        Accept
+                      </UButton>
+                      <UButton
+                        color="neutral"
+                        variant="ghost"
+                        size="xs"
+                        icon="i-lucide-x"
+                        :disabled="frozen"
+                        @click="rejectRecommendation(rec)"
+                      >
+                        Reject
+                      </UButton>
+                    </div>
+                    <!-- re-request with a note (an alternative to rejecting outright) -->
+                    <div class="mt-2 flex items-start gap-2">
+                      <UTextarea
+                        v-model="reRequestNotes[rec.id]"
+                        :rows="1"
+                        autoresize
+                        size="sm"
+                        class="flex-1"
+                        placeholder="Ask for a different recommendation…"
+                        :disabled="frozen || recommending"
+                      />
+                      <UButton
+                        color="neutral"
+                        variant="soft"
+                        size="xs"
+                        icon="i-lucide-rotate-cw"
+                        :loading="recommending"
+                        :disabled="!(reRequestNotes[rec.id] ?? '').trim() || frozen"
+                        @click="reRequestRecommendation(rec)"
+                      >
+                        Re-request
+                      </UButton>
+                    </div>
+                  </div>
+                </div>
+              </section>
+
               <!-- incorporated document: the standard-format requirements -->
               <section v-if="outline" class="mt-6 border-t border-slate-800 pt-5">
                 <div class="mb-3 flex items-center gap-1.5 text-[11px] text-emerald-400">
@@ -500,6 +733,20 @@ async function resolveExceeded(choice: 'extra-round' | 'proceed' | 'stop-reset')
                 >
                   Incorporate answers
                 </UButton>
+                <UButton
+                  v-if="markedForRecommend.size > 0"
+                  color="primary"
+                  variant="soft"
+                  size="sm"
+                  block
+                  icon="i-lucide-wand-2"
+                  :loading="recommending"
+                  @click="requestRecommendations"
+                >
+                  Request {{ markedForRecommend.size }} recommendation{{
+                    markedForRecommend.size === 1 ? '' : 's'
+                  }}
+                </UButton>
                 <p class="text-[11px] leading-relaxed text-slate-500">
                   <template v-if="canProceed">
                     Every finding is dismissed — proceed to the next phase without reworking.

package/app/composables/api/reviews.ts

@@ -82,6 +82,39 @@ export function reviewsApi({ http, ws }: ApiContext) {
         { method: 'POST', body: { choice } },
       ),
 
+    // Ask the Requirement Writer to recommend grounded answers for a batch of findings (by
+    // item id). Returns the review with `ready` recommendations for the human to act on.
+    requestRecommendations: (workspaceId: string, blockId: string, itemIds: string[]) =>
+      http<RequirementReview | null>(
+        `${ws(workspaceId)}/blocks/${encodeURIComponent(blockId)}/requirement-review/recommend`,
+        { method: 'POST', body: { itemIds } },
+      ),
+
+    // Accept a recommendation (becomes the finding's answer), reject it, or re-request it
+    // with a "do it differently" note.
+    acceptRecommendation: (workspaceId: string, reviewId: string, recId: string) =>
+      http<RequirementReview>(
+        `${ws(workspaceId)}/requirement-reviews/${encodeURIComponent(reviewId)}/recommendations/${encodeURIComponent(recId)}/accept`,
+        { method: 'POST' },
+      ),
+
+    rejectRecommendation: (workspaceId: string, reviewId: string, recId: string) =>
+      http<RequirementReview>(
+        `${ws(workspaceId)}/requirement-reviews/${encodeURIComponent(reviewId)}/recommendations/${encodeURIComponent(recId)}/reject`,
+        { method: 'POST' },
+      ),
+
+    reRequestRecommendation: (
+      workspaceId: string,
+      reviewId: string,
+      recId: string,
+      note: string,
+    ) =>
+      http<RequirementReview>(
+        `${ws(workspaceId)}/requirement-reviews/${encodeURIComponent(reviewId)}/recommendations/${encodeURIComponent(recId)}/re-request`,
+        { method: 'POST', body: { note } },
+      ),
+
     // ---- clarity review (bug-report triage reviewer agent) ---------------
     // The current review for a block (null when none has been run). A 503 means
     // the feature is unconfigured (the panel hides on any error here).

package/app/composables/useReviewStage.ts

@@ -2,7 +2,7 @@ import { useRequirementsStore } from '~/stores/requirements'
 import { useClarityStore } from '~/stores/clarity'
 
 /** The async stage an iterative reviewer gate is mid-cycle in, or null. */
-export type ReviewStage = 'incorporating' | 'reviewing' | null
+export type ReviewStage = 'incorporating' | 'reviewing' | 'recommending' | null
 
 // Both iterative reviewer gates (`requirements-review` over a feature brief and
 // `clarity-review` over a bug report) drive the same answer → incorporate → re-review

package/app/stores/requirements.ts

@@ -29,6 +29,8 @@ export const useRequirementsStore = defineStore('requirements', () => {
   const reviewing = ref<Set<string>>(new Set())
   /** Review ids currently incorporating their answers. */
   const incorporating = ref<Set<string>>(new Set())
+  /** Block ids whose Requirement Writer is currently producing recommendations. */
+  const recommending = ref<Set<string>>(new Set())
   /** Block ids whose current review is being fetched (the initial `load`). */
   const loadingByBlock = ref<Set<string>>(new Set())
   /**
@@ -48,7 +50,8 @@ export const useRequirementsStore = defineStore('requirements', () => {
    * needed — so the board suppresses the "Approval needed" gate and shows this working state
    * instead, with copy that names which of the two stages is running.
    */
-  function backgroundStage(blockId: string): 'incorporating' | 'reviewing' | null {
+  function backgroundStage(blockId: string): 'incorporating' | 'reviewing' | 'recommending' | null {
+    if (recommending.value.has(blockId)) return 'recommending'
     const status = reviews.value[blockId]?.status
     return status === 'incorporating' || status === 'reviewing' ? status : null
   }
@@ -172,6 +175,47 @@ export const useRequirementsStore = defineStore('requirements', () => {
     return updated
   }
 
+  function isRecommending(blockId: string): boolean {
+    return recommending.value.has(blockId)
+  }
+
+  /**
+   * Ask the Requirement Writer to recommend answers for a batch of findings (by item id).
+   * Runs the Writer inline (grounded on best-practice fragments → spec/tech-spec → web) and
+   * returns the review with `ready` recommendations to accept/reject. Shows a `recommending`
+   * background stage on the board while it runs.
+   */
+  async function requestRecommendations(blockId: string, itemIds: string[]) {
+    withFlag(recommending, blockId, true)
+    try {
+      const updated = await api.requestRecommendations(workspace.requireId(), blockId, itemIds)
+      if (updated) store(updated)
+      return updated
+    } finally {
+      withFlag(recommending, blockId, false)
+    }
+  }
+
+  /** Accept a recommendation (becomes the finding's answer, folded into the next incorporation). */
+  async function acceptRecommendation(review: RequirementReview, recId: string) {
+    store(await api.acceptRecommendation(workspace.requireId(), review.id, recId))
+  }
+
+  /** Reject a recommendation (the human then dismisses / answers manually / re-requests). */
+  async function rejectRecommendation(review: RequirementReview, recId: string) {
+    store(await api.rejectRecommendation(workspace.requireId(), review.id, recId))
+  }
+
+  /** Re-request a recommendation with a "do it differently" note. */
+  async function reRequestRecommendation(review: RequirementReview, recId: string, note: string) {
+    withFlag(recommending, review.blockId, true)
+    try {
+      store(await api.reRequestRecommendation(workspace.requireId(), review.id, recId, note))
+    } finally {
+      withFlag(recommending, review.blockId, false)
+    }
+  }
+
   /** Resolve a capped review: extra-round / proceed / stop-reset. */
   async function resolveExceeded(
     blockId: string,
@@ -190,6 +234,7 @@ export const useRequirementsStore = defineStore('requirements', () => {
     isReviewing,
     isLoading,
     isIncorporating,
+    isRecommending,
     openCount,
     answeredCount,
     allSettled,
@@ -202,6 +247,10 @@ export const useRequirementsStore = defineStore('requirements', () => {
     reReview,
     proceed,
     resolveExceeded,
+    requestRecommendations,
+    acceptRecommendation,
+    rejectRecommendation,
+    reRequestRecommendation,
     // Patch the cache from a live `requirements` stream event.
     upsert: store,
   }

package/app/types/domain.ts

@@ -143,6 +143,13 @@ export interface Block {
   testComposePath?: string
   /** service-only (frame): the service has no infra dependencies to stand up. */
   noInfraDependencies?: boolean
+  /**
+   * service-only (frame): the default test environment a task under this service is
+   * spawned with — `local` (docker-compose infra) or `ephemeral` (provisioned env).
+   * Tasks inherit it unless they override via their `tester.environment` config.
+   * absent = the built-in `ephemeral`.
+   */
+  defaultTestEnvironment?: 'local' | 'ephemeral'
   /** service-only (frame): cloud provider the service's jobs run on; absent = account default. */
   cloudProvider?: CloudProvider
   /** service-only (frame): abstract instance size for the service's jobs; absent = default. */

package/app/types/requirements.ts

@@ -10,7 +10,12 @@ export type ReviewItemCategory = 'gap' | 'clarification' | 'assumption' | 'risk'
 
 export type ReviewItemSeverity = 'low' | 'medium' | 'high'
 
-export type ReviewItemStatus = 'open' | 'answered' | 'resolved' | 'dismissed'
+export type ReviewItemStatus =
+  | 'open'
+  | 'answered'
+  | 'resolved'
+  | 'dismissed'
+  | 'recommend_requested'
 
 export interface RequirementReviewItem {
   id: string
@@ -45,6 +50,25 @@ export type RequirementReviewStatus =
 /** How a human resolves a review that hit its iteration cap. */
 export type ResolveRequirementsExceededChoice = 'extra-round' | 'proceed' | 'stop-reset'
 
+/** Lifecycle of a Requirement-Writer recommendation. */
+export type RecommendationStatus = 'ready' | 'accepted' | 'rejected'
+
+/**
+ * A Requirement-Writer suggestion for one finding. First-class on the review (survives the
+ * re-review item churn); the source finding is snapshotted by title/detail. `groundedInFragment`
+ * marks a suggestion taken straight from a best-practice fragment (the "current standard").
+ */
+export interface RequirementRecommendation {
+  id: string
+  sourceFinding: { title: string; detail: string }
+  recommendedText: string
+  status: RecommendationStatus
+  note: string | null
+  groundedInFragment: { id: string; title: string } | null
+  createdAt: number
+  updatedAt: number
+}
+
 export interface RequirementReview {
   id: string
   blockId: string
@@ -56,6 +80,8 @@ export interface RequirementReview {
   iteration: number
   /** The reviewer-pass budget (from the task's merge preset; an extra round bumps it). */
   maxIterations: number
+  /** Requirement-Writer suggestions awaiting (or settled by) human accept/reject. */
+  recommendations: RequirementRecommendation[]
   createdAt: number
   updatedAt: number
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cat-factory/app",
-  "version": "0.17.2",
+  "version": "0.18.1",
   "description": "Reusable Nuxt layer for the Agent Architecture Board SPA (components, stores, composables, pages). Consume it from a thin deployment app via `extends: ['@cat-factory/app']` and point it at your backend with NUXT_PUBLIC_API_BASE. See deploy/frontend for an example.",
   "repository": {
     "type": "git",