@cat-factory/app 0.151.1 → 0.152.1

package/app/components/panels/ResultWindowShell.vue

@@ -17,9 +17,14 @@
 // The pick-one SELECTION of which window is active stays exactly the slice-2
 // `resolveComponentRegistry` in `StepResultViewHost.vue` — this shell only owns the
 // per-window chrome + behaviour, so windows convert one at a time behind it.
-import { computed } from 'vue'
+//
+// It also owns the one trailing section every step-backed window shows: the agent's effort
+// self-assessment (see the footer block below), so a window never renders it itself.
+import { computed, ref } from 'vue'
 import { useModalBehavior } from '@modular-vue/core'
 import StepRestartControl from '~/components/panels/StepRestartControl.vue'
+import StepEffortReport from '~/components/panels/StepEffortReport.vue'
+import { effortBand, effortHint } from '~/utils/effort'
 
 /** A pipeline step reference — passed by step-result windows to surface the shared
  *  "restart from here" control. `StepRestartControl` self-hides for an off-path open
@@ -72,6 +77,32 @@ const { dialogRef } = useModalBehavior({
   onClose: requestClose,
 })
 
+// The active step's effort self-assessment (how hard the work was, what reduced its
+// effectiveness, the obstacles it hit), rendered as a collapsible footer under EVERY window.
+// Resolved from the result-view seam itself rather than a per-window prop: the host mounts
+// exactly one window — the active `ui.resultView` — so a window can't opt out, forget to pass
+// it, or drift in where it puts it. An off-path open (a block-keyed window with no step) and a
+// step whose agent wrote no report both resolve to null, and the footer disappears.
+const ui = useUiStore()
+const execution = useExecutionStore()
+const effortReport = computed(() => {
+  const view = ui.resultView
+  if (!view || view.instanceId === null || view.stepIndex === null) return null
+  return execution.getInstance(view.instanceId)?.steps[view.stepIndex]?.effortReport ?? null
+})
+// Collapsed by default — the windows own the vertical space, and the row already carries the
+// difficulty plus the gist of what held the agent back.
+const effortOpen = ref(false)
+const hint = computed(() => (effortReport.value ? effortHint(effortReport.value) : null))
+const CHIP_CLASS = {
+  easy: 'bg-emerald-500/15 text-emerald-300',
+  moderate: 'bg-amber-500/15 text-amber-300',
+  hard: 'bg-rose-500/15 text-rose-300',
+} as const
+const chipClass = computed(() =>
+  effortReport.value ? CHIP_CLASS[effortBand(effortReport.value.difficulty)] : '',
+)
+
 const WIDTH: Record<'3xl' | '4xl' | '5xl', string> = {
   '3xl': 'max-w-3xl',
   '4xl': 'max-w-4xl',
@@ -135,6 +166,44 @@ const panelClass = computed(() => [
         </header>
         <!-- The window body. -->
         <slot />
+
+        <!-- Shared trailing section: the container agent's effort self-assessment, under the
+             window's own detail. Collapsed to a one-line row (difficulty + what held it back)
+             so it can't crowd a window out; expands in place. -->
+        <section
+          v-if="effortReport"
+          class="shrink-0 border-t border-slate-800 bg-slate-900/60"
+          data-testid="result-window-effort"
+        >
+          <button
+            type="button"
+            class="flex w-full items-center gap-2 px-5 py-2 text-start hover:bg-slate-800/40"
+            :aria-expanded="effortOpen"
+            data-testid="result-window-effort-toggle"
+            @click="effortOpen = !effortOpen"
+          >
+            <UIcon name="i-lucide-gauge" class="h-3.5 w-3.5 shrink-0 text-slate-400" />
+            <span class="text-[11px] font-semibold uppercase tracking-wide text-slate-400">
+              {{ t('panels.stepDetail.effort.heading') }}
+            </span>
+            <span
+              class="shrink-0 rounded px-1.5 py-0.5 text-[11px] font-medium tabular-nums"
+              :class="chipClass"
+            >
+              {{ t('panels.stepDetail.effort.outOfTen', { value: effortReport.difficulty }) }}
+            </span>
+            <span v-if="hint" class="min-w-0 flex-1 truncate text-[12px] text-slate-400">
+              {{ hint }}
+            </span>
+            <UIcon
+              :name="effortOpen ? 'i-lucide-chevron-down' : 'i-lucide-chevron-up'"
+              class="ms-auto h-3.5 w-3.5 shrink-0 text-slate-500"
+            />
+          </button>
+          <div v-if="effortOpen" class="max-h-56 overflow-y-auto px-5 pb-3">
+            <StepEffortReport :report="effortReport" variant="flat" />
+          </div>
+        </section>
       </div>
     </div>
   </Teleport>

package/app/components/panels/StepEffortReport.vue

@@ -3,9 +3,18 @@
 // (1..10), what reduced its effectiveness, and the key obstacles it hit. Populated by the harness
 // from the agent's sentinel file and recorded on the step (`step.effortReport`). Rendered only when
 // present, so a run on an older harness image (or an agent that wrote none) shows nothing.
+//
+// Two callers, one renderer: the generic step-detail panel drops it in as a `card` (its own
+// heading + border, sitting among the other detail sections), and `ResultWindowShell`'s
+// collapsible footer embeds it `flat` — the disclosure row is already the heading there, so a
+// second one plus a nested border would just be chrome inside chrome.
 import type { AgentEffortReport } from '~/types/execution'
+import { effortBand } from '~/utils/effort'
 
-const props = defineProps<{ report: AgentEffortReport }>()
+const props = withDefaults(
+  defineProps<{ report: AgentEffortReport; variant?: 'card' | 'flat' }>(),
+  { variant: 'card' },
+)
 const { t } = useI18n()
 
 // Clamp for the bar width; the schema already bounds 1..10 but be defensive against a stray value.
@@ -13,21 +22,19 @@ const difficultyPct = computed(() =>
   Math.min(100, Math.max(0, (props.report.difficulty / 10) * 100)),
 )
 // Colour the difficulty by band: easy (emerald) → moderate (amber) → hard (rose).
-const difficultyClass = computed(() =>
-  props.report.difficulty >= 8
-    ? 'bg-rose-400'
-    : props.report.difficulty >= 5
-      ? 'bg-amber-400'
-      : 'bg-emerald-400',
-)
+const BAR_CLASS = { easy: 'bg-emerald-400', moderate: 'bg-amber-400', hard: 'bg-rose-400' } as const
+const difficultyClass = computed(() => BAR_CLASS[effortBand(props.report.difficulty)])
 </script>
 
 <template>
   <section
     data-testid="step-effort-report"
-    class="scroll-mt-4 rounded-xl border border-slate-800 bg-slate-900/50 p-4"
+    :class="
+      variant === 'card' ? 'scroll-mt-4 rounded-xl border border-slate-800 bg-slate-900/50 p-4' : ''
+    "
   >
     <div
+      v-if="variant === 'card'"
       class="mb-2 flex items-center gap-1.5 text-[11px] font-semibold uppercase tracking-wide text-slate-400"
     >
       <UIcon name="i-lucide-gauge" class="h-3.5 w-3.5" />

package/app/stores/environmentWizard/context.ts

@@ -0,0 +1,68 @@
+import type { ComputedRef, Ref } from 'vue'
+import type {
+  MergedRecipeDraft,
+  PreflightResult,
+  ProvisioningRecommendation,
+  StackRecipe,
+} from '@cat-factory/contracts'
+import type { useBoardStore } from '~/stores/board'
+import type { useExecutionStore } from '~/stores/execution'
+import type { useGitHubStore } from '~/stores/github'
+import type { useInfraConfigStore } from '~/stores/infraConfig'
+import type { usePipelinesStore } from '~/stores/pipelines'
+import type { usePreflightsStore } from '~/stores/preflights'
+
+/**
+ * Shared reactive state + resolved store handles the environment-wizard action factories
+ * ({@link import('./flow').createFlowActions}, {@link import('./recipe').createRecipeActions},
+ * {@link import('./save').createSaveActions}) close over. Assembled once in the store setup and
+ * threaded into each factory so the split actions stay behaviourally identical to the former
+ * single-closure store — a size-only extraction following the `board` store idiom.
+ */
+export interface WizardContext {
+  board: ReturnType<typeof useBoardStore>
+  github: ReturnType<typeof useGitHubStore>
+  infra: ReturnType<typeof useInfraConfigStore>
+  execution: ReturnType<typeof useExecutionStore>
+  preflights: ReturnType<typeof usePreflightsStore>
+  // ---- state ----
+  frameId: Ref<string | null>
+  detecting: Ref<boolean>
+  detectError: Ref<boolean>
+  recommendation: Ref<ProvisioningRecommendation | null>
+  analysisRequested: Ref<boolean>
+  analysisError: Ref<boolean>
+  recipe: Ref<StackRecipe>
+  composeService: Ref<string>
+  preflightRunning: Ref<boolean>
+  preflightResults: Ref<PreflightResult[] | null>
+  preflightError: Ref<string | null>
+  handlerLabel: Ref<string>
+  exposedPort: Ref<number>
+  saving: Ref<boolean>
+  saveError: Ref<string | null>
+  saved: Ref<boolean>
+  trialing: Ref<boolean>
+  trialError: Ref<string | null>
+  trialStarted: Ref<boolean>
+  // ---- derived the actions read ----
+  repoContext: ComputedRef<{ githubId: number; directory?: string | null } | undefined>
+  analysisPipeline: ComputedRef<ReturnType<ReturnType<typeof usePipelinesStore>['getPipeline']>>
+  merged: ComputedRef<MergedRecipeDraft | null>
+}
+
+/** Drop empty arrays / undefined so the persisted recipe stays minimal and schema-valid
+ *  (`composeFiles` etc. are `minLength(1)`, so an empty array would 422). */
+export function pruneRecipe(recipe: StackRecipe): StackRecipe {
+  const out: Record<string, unknown> = {}
+  for (const [key, value] of Object.entries(recipe)) {
+    if (value === undefined || value === null) continue
+    if (Array.isArray(value) && value.length === 0) continue
+    out[key] = value
+  }
+  return out as StackRecipe
+}
+
+export function cloneRecipe(recipe: StackRecipe): StackRecipe {
+  return JSON.parse(JSON.stringify(recipe)) as StackRecipe
+}

package/app/stores/environmentWizard/flow.ts

@@ -0,0 +1,143 @@
+import type { WizardContext } from './context'
+import { cloneRecipe } from './context'
+
+/**
+ * The wizard's per-frame lifecycle + recommendation actions: reset/target a frame, (re)seed the
+ * working recipe from the merged recommendation, run checkout-free detection, fire the analyst
+ * pipeline, and fold a ready analyst draft in. Closes over the shared {@link WizardContext};
+ * behaviour is identical to the former in-closure functions (a size-only extraction). The internal
+ * `resetFlowState` / `seedFromMerged` helpers are not exposed (they were never part of the public
+ * store shape).
+ */
+export function createFlowActions(ctx: WizardContext) {
+  const {
+    github,
+    infra,
+    execution,
+    frameId,
+    detecting,
+    detectError,
+    recommendation,
+    analysisRequested,
+    analysisError,
+    recipe,
+    composeService,
+    preflightRunning,
+    preflightResults,
+    preflightError,
+    handlerLabel,
+    exposedPort,
+    saving,
+    saveError,
+    saved,
+    trialing,
+    trialError,
+    trialStarted,
+    repoContext,
+    analysisPipeline,
+    merged,
+  } = ctx
+
+  /**
+   * Clear all per-frame flow state (detection, working recipe, preflight, save, trial). Shared by
+   * `beginForFrame` so re-targeting the wizard at a different frame can't leave a prior frame's
+   * `saved`/`composeService`/`exposedPort`/results behind (which would make an unsaved frame render
+   * the green "saved" confirmation + offer a trial provision).
+   */
+  function resetFlowState() {
+    detecting.value = false
+    detectError.value = false
+    recommendation.value = null
+    analysisRequested.value = false
+    analysisError.value = false
+    recipe.value = {}
+    composeService.value = ''
+    preflightRunning.value = false
+    preflightResults.value = null
+    preflightError.value = null
+    handlerLabel.value = 'Docker Compose'
+    exposedPort.value = 80
+    saving.value = false
+    saveError.value = null
+    saved.value = false
+    trialing.value = false
+    trialError.value = null
+    trialStarted.value = false
+  }
+
+  /** Re-seed the working recipe from the current merge (detector-only, or +analyst after apply). */
+  function seedFromMerged() {
+    if (merged.value) recipe.value = cloneRecipe(merged.value.recipe)
+    // Default the exposed service to the detector's recommended compose service, when known.
+    const recommended = recommendation.value?.composeServiceCandidates?.find((c) => c.recommended)
+    if (recommended && !composeService.value) composeService.value = recommended.service
+  }
+
+  /** Run checkout-free detection for the frame's repo (non-binding; seeds the working recipe). */
+  async function detect() {
+    const target = repoContext.value
+    if (!target) {
+      detectError.value = true
+      return
+    }
+    const repo = github.repoFor(target.githubId)
+    if (!repo) {
+      detectError.value = true
+      return
+    }
+    detecting.value = true
+    detectError.value = false
+    try {
+      const rec = await infra.detectProvisioning({
+        owner: repo.owner,
+        repo: repo.name,
+        ...(target.directory ? { directory: target.directory } : {}),
+        prefer: 'docker-compose',
+      })
+      recommendation.value = rec
+      // Seed the exposed port + build flag from the detected provisioning where present.
+      seedFromMerged()
+    } catch {
+      detectError.value = true
+    } finally {
+      detecting.value = false
+    }
+  }
+
+  /**
+   * Seed the data layer for a frame the journey's review step is entering. The journey owns
+   * navigation, so this is idempotent by frame: it (re)seeds + detects only when the target frame
+   * actually changes, so back-navigating to the review step (or a resume) does NOT clobber the
+   * operator's in-progress recipe edits. Selecting a different frame resets the flow for it.
+   */
+  function beginForFrame(id: string | null) {
+    if (frameId.value === id) return
+    frameId.value = id
+    resetFlowState()
+    if (id) void detect()
+  }
+
+  /** Fire the analyst-only pipeline against the frame (mirrors how bootstrap runs pl_blueprint). */
+  async function startAnalysis() {
+    const id = frameId.value
+    const pipeline = analysisPipeline.value
+    if (!id || !pipeline) {
+      analysisError.value = true
+      return
+    }
+    analysisError.value = false
+    try {
+      await execution.start(id, pipeline)
+      analysisRequested.value = true
+    } catch {
+      analysisError.value = true
+    }
+  }
+
+  /** Fold the (now-ready) analyst draft into the working recipe (re-seed from the merge). */
+  function applyAnalystDraft() {
+    seedFromMerged()
+  }
+
+  return { beginForFrame, detect, startAnalysis, applyAnalystDraft }
+}

package/app/stores/environmentWizard/recipe.ts

@@ -0,0 +1,63 @@
+import * as v from 'valibot'
+import { type ProvisioningSeedDumpCandidate, stackRecipeSchema } from '@cat-factory/contracts'
+import type { WizardContext } from './context'
+
+/**
+ * The working-recipe editing actions (compose-file / profile toggles, seed-step insertion, raw-JSON
+ * replace). Closes over the shared {@link WizardContext}; behaviour is identical to the former
+ * in-closure functions (a size-only extraction).
+ */
+export function createRecipeActions(ctx: WizardContext) {
+  const { recipe, composeService } = ctx
+
+  /** Toggle an OS-override / extra compose file into the working recipe's ordered `composeFiles`. */
+  function toggleComposeFile(path: string) {
+    const files = recipe.value.composeFiles ? [...recipe.value.composeFiles] : []
+    const idx = files.indexOf(path)
+    if (idx >= 0) files.splice(idx, 1)
+    else files.push(path)
+    recipe.value = { ...recipe.value, composeFiles: files }
+  }
+
+  /** Toggle a `COMPOSE_PROFILES` label into the working recipe. */
+  function toggleProfile(profile: string) {
+    const profiles = recipe.value.composeProfiles ? [...recipe.value.composeProfiles] : []
+    const idx = profiles.indexOf(profile)
+    if (idx >= 0) profiles.splice(idx, 1)
+    else profiles.push(profile)
+    recipe.value = { ...recipe.value, composeProfiles: profiles }
+  }
+
+  /**
+   * Convert a confirmed seed-dump candidate into a `compose-exec` step that pipes the dump via
+   * stdin. The service + command are a best-effort default (the exposed/db service + a `cat`
+   * placeholder) the operator refines in the recipe editor — detection can't know the DB client.
+   */
+  function addSeedStep(candidate: ProvisioningSeedDumpCandidate) {
+    const setupSteps = recipe.value.setupSteps ? [...recipe.value.setupSteps] : []
+    setupSteps.push({
+      kind: 'compose-exec',
+      name: `Import seed ${candidate.name}`,
+      service: composeService.value || 'db',
+      command: ['sh', '-c', 'cat'],
+      stdinFile: candidate.path,
+    })
+    recipe.value = { ...recipe.value, setupSteps }
+  }
+
+  /** Replace the working recipe from a raw-JSON edit; returns an error message or null on success. */
+  function setRecipeFromJson(text: string): string | null {
+    let parsedJson: unknown
+    try {
+      parsedJson = JSON.parse(text)
+    } catch (err) {
+      return err instanceof Error ? err.message : 'Invalid JSON'
+    }
+    const result = v.safeParse(stackRecipeSchema, parsedJson)
+    if (!result.success) return result.issues.map((i) => i.message).join('; ')
+    recipe.value = result.output
+    return null
+  }
+
+  return { toggleComposeFile, toggleProfile, addSeedStep, setRecipeFromJson }
+}

package/app/stores/environmentWizard/save.ts

@@ -0,0 +1,132 @@
+import { apiErrorEnvelope } from '~/composables/api/errors'
+import { useWorkspaceStore } from '~/stores/workspace'
+import type { WizardContext } from './context'
+import { pruneRecipe } from './context'
+
+/**
+ * The preflight / persist / trial-provision actions — the tail of the wizard. Closes over the
+ * shared {@link WizardContext}; behaviour is identical to the former in-closure functions (a
+ * size-only extraction).
+ */
+export function createSaveActions(ctx: WizardContext) {
+  const {
+    board,
+    infra,
+    preflights,
+    frameId,
+    recommendation,
+    recipe,
+    composeService,
+    preflightRunning,
+    preflightResults,
+    preflightError,
+    handlerLabel,
+    exposedPort,
+    saving,
+    saveError,
+    saved,
+    trialing,
+    trialError,
+    trialStarted,
+  } = ctx
+
+  /** Run the working recipe's declared preflight checks (host-bound; degrades on a non-local facade). */
+  async function runPreflight() {
+    preflightRunning.value = true
+    preflightError.value = null
+    try {
+      preflightResults.value = await preflights.run(recipe.value.prerequisites ?? [])
+    } catch (err) {
+      // A 503 is handled inside `preflights.run` (degraded note); anything else is a real failure
+      // that must be shown rather than swallowed into an unhandled rejection.
+      preflightError.value =
+        apiErrorEnvelope(err)?.message ?? (err instanceof Error ? err.message : String(err))
+    } finally {
+      preflightRunning.value = false
+    }
+  }
+
+  /**
+   * Persist the confirmed config: register the workspace's `docker-compose` handler (so the Deployer
+   * can provision it) AND write the recipe onto the service frame's provisioning. The handler carries
+   * only the daemon "how" (the exposed service + port); the recipe is the per-service "what/where".
+   */
+  async function save() {
+    const id = frameId.value
+    const service = composeService.value.trim()
+    if (!id || !service) {
+      saveError.value = 'A frame and an exposed compose service are required.'
+      return
+    }
+    // `exposedPort` is a `v-model.number` field, which yields '' (not a number) when cleared. Guard
+    // here so an empty/out-of-range port can't reach the handler manifest.
+    const port = Number(exposedPort.value)
+    if (!Number.isInteger(port) || port < 1 || port > 65535) {
+      saveError.value = 'Enter a valid exposed port (1-65535).'
+      return
+    }
+    saving.value = true
+    saveError.value = null
+    const pruned = pruneRecipe(recipe.value)
+    const build = recommendation.value?.provisioning.composeBuild === true
+    const allowHostCommands = (pruned.setupSteps ?? []).some((s) => s.kind === 'host-command')
+    try {
+      await infra.registerHandler({
+        provisionType: 'docker-compose',
+        config: {
+          engine: 'local-docker',
+          manifest: {
+            providerId: 'compose',
+            label: handlerLabel.value.trim() || 'Docker Compose',
+            baseUrl: 'http://localhost',
+            auth: { type: 'none' },
+            provision: { method: 'POST', pathTemplate: '' },
+            response: {},
+            providerConfig: {
+              service,
+              port,
+              ...(build ? { build: true } : {}),
+              ...(allowHostCommands ? { allowHostCommands: true } : {}),
+            },
+          },
+        },
+        secrets: {},
+      })
+      await board.updateBlock(id, {
+        provisioning: {
+          type: 'docker-compose',
+          ...(pruned.composeFiles?.[0] ? { composePath: pruned.composeFiles[0] } : {}),
+          ...(build ? { composeBuild: true } : {}),
+          recipe: pruned,
+        },
+      })
+      saved.value = true
+    } catch (err) {
+      saveError.value =
+        apiErrorEnvelope(err)?.message ?? (err instanceof Error ? err.message : String(err))
+    } finally {
+      saving.value = false
+    }
+  }
+
+  /** Optional trial: provision the just-saved config for the frame (local-only; live logs shown). */
+  async function trialProvision() {
+    const id = frameId.value
+    if (!id || !saved.value) return
+    trialing.value = true
+    trialError.value = null
+    try {
+      const api = useApi()
+      const ws = useWorkspaceStore()
+      await api.provisionEnvironment(ws.requireId(), { blockId: id })
+      trialStarted.value = true
+    } catch (err) {
+      trialError.value =
+        apiErrorEnvelope(err)?.message ?? (err instanceof Error ? err.message : String(err))
+    } finally {
+      trialing.value = false
+    }
+  }
+
+  return { runPreflight, save, trialProvision }
+}