@cat-factory/app 0.154.0 → 0.155.0

package/app/components/panels/ResultWindowShell.vue

@@ -20,10 +20,11 @@
 //
 // 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 { computed, ref, watch } from 'vue'
 import { useModalBehavior } from '@modular-vue/core'
 import StepRestartControl from '~/components/panels/StepRestartControl.vue'
 import StepEffortReport from '~/components/panels/StepEffortReport.vue'
+import StepValidationReport from '~/components/panels/StepValidationReport.vue'
 import { effortBand, effortHint } from '~/utils/effort'
 
 /** A pipeline step reference — passed by step-result windows to surface the shared
@@ -85,11 +86,26 @@ const { dialogRef } = useModalBehavior({
 // step whose agent wrote no report both resolve to null, and the footer disappears.
 const ui = useUiStore()
 const execution = useExecutionStore()
-const effortReport = computed(() => {
+const activeStep = 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
+  return execution.getInstance(view.instanceId)?.steps[view.stepIndex] ?? null
 })
+const effortReport = computed(() => activeStep.value?.effortReport ?? null)
+// The step's PRE-PR VALIDATION report — the second universal trailing section, resolved the same
+// way and for the same reason: every window whose step ran a coding job can show whether the
+// checkout actually passed the service's checks before the PR opened (and, on a red run, exactly
+// what failed). Absent for a service that configured no checks, and the footer disappears.
+const validationReport = computed(() => activeStep.value?.validation ?? null)
+const validationOpen = ref(false)
+// A failing report is the interesting one, so it opens expanded; a green one stays a one-line row.
+watch(
+  validationReport,
+  (report) => {
+    if (report && !report.passed) validationOpen.value = true
+  },
+  { immediate: true },
+)
 // 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)
@@ -204,6 +220,61 @@ const panelClass = computed(() => [
             <StepEffortReport :report="effortReport" variant="flat" />
           </div>
         </section>
+
+        <!-- Shared trailing section: the pre-PR validation report (the service's check commands
+             run against the checkout BEFORE the PR opened). Collapsed when green, expanded when
+             red — a failed checkout is the one an operator opened the window to read. -->
+        <section
+          v-if="validationReport"
+          class="shrink-0 border-t border-slate-800 bg-slate-900/60"
+          data-testid="result-window-validation"
+        >
+          <button
+            type="button"
+            class="flex w-full items-center gap-2 px-5 py-2 text-start hover:bg-slate-800/40"
+            :aria-expanded="validationOpen"
+            data-testid="result-window-validation-toggle"
+            @click="validationOpen = !validationOpen"
+          >
+            <UIcon
+              :name="validationReport.passed ? 'i-lucide-shield-check' : 'i-lucide-shield-alert'"
+              class="h-3.5 w-3.5 shrink-0"
+              :class="validationReport.passed ? 'text-emerald-400' : 'text-rose-400'"
+            />
+            <span class="text-[11px] font-semibold uppercase tracking-wide text-slate-400">
+              {{ t('panels.stepDetail.validation.heading') }}
+            </span>
+            <span
+              class="shrink-0 rounded px-1.5 py-0.5 text-[11px] font-medium tabular-nums"
+              :class="
+                validationReport.passed
+                  ? 'bg-emerald-500/15 text-emerald-300'
+                  : 'bg-rose-500/15 text-rose-300'
+              "
+            >
+              {{
+                validationReport.passed
+                  ? t('panels.stepDetail.validation.passed')
+                  : t('panels.stepDetail.validation.failed')
+              }}
+            </span>
+            <span class="min-w-0 flex-1 truncate text-[12px] text-slate-400">
+              {{
+                t('panels.stepDetail.validation.attempts', {
+                  attempts: validationReport.attempts,
+                  maxAttempts: validationReport.maxAttempts,
+                })
+              }}
+            </span>
+            <UIcon
+              :name="validationOpen ? '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="validationOpen" class="max-h-72 overflow-y-auto px-5 pb-3">
+            <StepValidationReport :report="validationReport" />
+          </div>
+        </section>
       </div>
     </div>
   </Teleport>

package/app/components/panels/StepValidationReport.vue

@@ -0,0 +1,66 @@
+<script setup lang="ts">
+import { computed } from 'vue'
+import type { ValidationReport } from '~/types/validationChecks'
+
+// The PRE-PR VALIDATION report for a step: which of the service's configured check commands
+// passed against the checkout before the PR was allowed to open, their exit codes, and a
+// bounded, secret-scrubbed tail of each command's output. Produced by the executor-harness
+// running the commands — never a model self-report — so this is the run's captured PROOF on a
+// green run and its EVIDENCE on a failed one. See docs/initiatives/pre-pr-validation.md.
+const props = defineProps<{ report: ValidationReport }>()
+const { t } = useI18n()
+
+const failed = computed(() => props.report.outcomes.filter((o) => !o.passed))
+</script>
+
+<template>
+  <div class="space-y-2" data-testid="step-validation-report">
+    <p class="text-[11px] text-slate-400">
+      {{
+        report.passed
+          ? t('panels.stepDetail.validation.passedSummary', {
+              total: report.outcomes.length,
+              attempts: report.attempts,
+            })
+          : t('panels.stepDetail.validation.failedSummary', {
+              failed: failed.length,
+              total: report.outcomes.length,
+              attempts: report.attempts,
+              maxAttempts: report.maxAttempts,
+            })
+      }}
+    </p>
+
+    <div
+      v-for="outcome in report.outcomes"
+      :key="outcome.label"
+      class="rounded-md border border-slate-800 bg-slate-950/40 p-2"
+      data-testid="validation-outcome"
+    >
+      <div class="flex items-center gap-2">
+        <UIcon
+          :name="outcome.passed ? 'i-lucide-check' : 'i-lucide-x'"
+          class="h-3.5 w-3.5 shrink-0"
+          :class="outcome.passed ? 'text-emerald-400' : 'text-rose-400'"
+        />
+        <span class="text-[12px] font-medium text-slate-200">{{ outcome.label }}</span>
+        <span class="truncate font-mono text-[11px] text-slate-500">{{ outcome.command }}</span>
+        <span
+          v-if="!outcome.passed"
+          class="ms-auto shrink-0 rounded bg-rose-500/15 px-1.5 py-0.5 text-[11px] tabular-nums text-rose-300"
+        >
+          {{
+            outcome.timedOut
+              ? t('panels.stepDetail.validation.timedOut')
+              : t('panels.stepDetail.validation.exitCode', { code: outcome.exitCode })
+          }}
+        </span>
+      </div>
+      <pre
+        v-if="outcome.outputTail"
+        class="mt-1.5 max-h-48 overflow-auto whitespace-pre-wrap break-words rounded bg-slate-950 p-2 font-mono text-[11px] text-slate-400"
+        data-testid="validation-output"
+        >{{ outcome.outputTail }}</pre>
+    </div>
+  </div>
+</template>

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

@@ -255,7 +255,15 @@ async function generateOrFixManifest() {
 // it failed at. The returned run is tracked live (by frame id) via the workspace stream store.
 const envTest = useEnvironmentTestStore()
 const envTestStarting = ref(false)
-const envTestError = ref<string | null>(null)
+// The self-test's start/stop error. Structured (not a bare string) so the not-provisionable case
+// can render its remedy prose PLUS a one-click jump to the environment-handler config; every other
+// case is plain text.
+interface EnvTestError {
+  text: string
+  /** Show the "Configure infrastructure" deep-link — only the not-provisionable handler case. */
+  configurable?: boolean
+}
+const envTestError = ref<EnvTestError | null>(null)
 // The newest self-test run for this frame — re-attaches after a reconnect (the run is carried in
 // the snapshot while running), so the live stage keeps showing without a locally-held id.
 const envTestRun = computed(() => envTest.runForBlock(props.block.id))
@@ -291,14 +299,30 @@ const ENV_TEST_CONFLICT_KEYS: Record<Extract<ConflictReason, `env_test_${string}
   env_test_no_vcs: 'errors.conflict.title.env_test_no_vcs',
 }
 
-function envTestErrorText(e: unknown): string {
-  const reason = parseConflict(e)?.reason
+function buildEnvTestError(e: unknown): EnvTestError {
+  const parsed = parseConflict(e)
+  const reason = parsed?.reason
+  // No workspace handler resolves for the service's provision type. Word the SPECIFIC case —
+  // nothing configured vs. an ambiguous match (carried on `details.handlerIssue`, distinct from the
+  // `env_test_not_provisionable` code) — and offer the one-click jump to the Infrastructure →
+  // Test-environments handler config.
+  if (reason === 'env_test_not_provisionable') {
+    const ambiguous = parsed?.details.handlerIssue === 'type-mismatch'
+    return {
+      text: t(
+        ambiguous
+          ? 'errors.conflict.description.env_test_not_provisionable_type_mismatch'
+          : 'errors.conflict.description.env_test_not_provisionable_no_handler',
+      ),
+      configurable: true,
+    }
+  }
   const key =
     reason && reason in ENV_TEST_CONFLICT_KEYS
       ? ENV_TEST_CONFLICT_KEYS[reason as keyof typeof ENV_TEST_CONFLICT_KEYS]
       : undefined
-  if (key && te(key)) return t(key)
-  return apiErrorEnvelope(e)?.message ?? (e instanceof Error ? e.message : String(e))
+  if (key && te(key)) return { text: t(key) }
+  return { text: apiErrorEnvelope(e)?.message ?? (e instanceof Error ? e.message : String(e)) }
 }
 
 async function startEnvTest() {
@@ -308,7 +332,7 @@ async function startEnvTest() {
   try {
     await envTest.start(props.block.id)
   } catch (e) {
-    envTestError.value = envTestErrorText(e)
+    envTestError.value = buildEnvTestError(e)
   } finally {
     envTestStarting.value = false
   }
@@ -320,7 +344,7 @@ async function stopEnvTest() {
   try {
     await envTest.stop(run.id)
   } catch (e) {
-    envTestError.value = envTestErrorText(e)
+    envTestError.value = buildEnvTestError(e)
   }
 }
 
@@ -1072,9 +1096,23 @@ function setSize(value: InstanceSize) {
         </template>
       </p>
 
-      <p v-if="envTestError" class="text-[11px] text-rose-400" data-testid="env-test-error">
-        {{ envTestError }}
-      </p>
+      <div v-if="envTestError" class="text-[11px] text-rose-400" data-testid="env-test-error">
+        <p>{{ envTestError.text }}</p>
+        <!-- Only the not-provisionable handler case is one-click fixable: jump to Infrastructure →
+             Test environments, where the workspace's per-type environment handler is registered. -->
+        <UButton
+          v-if="envTestError.configurable"
+          class="mt-1.5"
+          icon="i-lucide-settings"
+          size="xs"
+          color="neutral"
+          variant="soft"
+          data-testid="env-test-configure-handler"
+          @click="ui.openProviderConnection('environment')"
+        >
+          {{ t('errors.conflict.action.configureInfrastructure') }}
+        </UButton>
+      </div>
     </div>
   </InspectorSection>
 </template>

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

@@ -0,0 +1,208 @@
+<script setup lang="ts">
+import { computed, ref, watch } from 'vue'
+import type { Block } from '~/types/domain'
+import InspectorSection from '~/components/panels/inspector/InspectorSection.vue'
+import {
+  VALIDATION_DEFAULT_MAX_ATTEMPTS,
+  VALIDATION_MAX_ATTEMPTS_CEILING,
+  VALIDATION_MAX_CHECKS,
+  type ValidationCheck,
+} from '~/types/validationChecks'
+
+// Per-service (frame) PRE-PR VALIDATION CHECKS: the shell commands the executor-harness runs
+// against the checkout after the coder settles and BEFORE the PR opens. A failing command's
+// output is handed back to the agent, which retries under the attempt budget; only a green
+// checkout opens a PR, and an exhausted budget fails the step with the captured output.
+// Keyed by THIS block's id (service frames only — a task resolves its checks up the frame chain).
+const props = defineProps<{ block: Block }>()
+
+const store = useValidationChecksStore()
+const toast = useToast()
+const { t } = useI18n()
+const { confirmAction, toastDone } = useConfirmAction()
+
+const busy = ref(false)
+const rows = ref<ValidationCheck[]>([])
+const maxAttempts = ref(VALIDATION_DEFAULT_MAX_ATTEMPTS)
+
+const saved = computed(() => store.forBlock(props.block.id))
+const configured = computed(() => saved.value.checks.length > 0)
+const canAdd = computed(() => rows.value.length < VALIDATION_MAX_CHECKS)
+/** A row is only submittable once it has a command; the label falls back to the command. */
+const submittable = computed(() =>
+  rows.value
+    .map((r) => ({ label: r.label.trim() || r.command.trim(), command: r.command.trim() }))
+    .filter((r) => r.command.length > 0),
+)
+
+onMounted(() => {
+  store.ensureLoaded().catch(() => {})
+})
+watch(
+  saved,
+  (config) => {
+    rows.value = config.checks.map((c) => ({ ...c }))
+    maxAttempts.value = config.maxAttempts
+  },
+  { immediate: true },
+)
+
+function addRow() {
+  if (canAdd.value) rows.value.push({ label: '', command: '' })
+}
+
+function removeRow(index: number) {
+  rows.value.splice(index, 1)
+}
+
+function notifyError(title: string, e: unknown) {
+  toast.add({
+    title,
+    description: e instanceof Error ? e.message : String(e),
+    icon: 'i-lucide-triangle-alert',
+    color: 'error',
+  })
+}
+
+async function save() {
+  busy.value = true
+  try {
+    await store.save(props.block.id, submittable.value, maxAttempts.value)
+    toast.add({
+      title: t('inspector.validationChecks.savedToast'),
+      icon: 'i-lucide-check',
+      color: 'success',
+    })
+  } catch (e) {
+    notifyError(t('inspector.validationChecks.saveFailed'), e)
+  } finally {
+    busy.value = false
+  }
+}
+
+async function clear() {
+  const noun = t('inspector.validationChecks.configNoun')
+  if (!(await confirmAction('clear', noun))) return
+  busy.value = true
+  try {
+    await store.remove(props.block.id)
+    rows.value = []
+    toastDone('clear', noun)
+  } catch (e) {
+    notifyError(t('inspector.validationChecks.clearFailed'), e)
+  } finally {
+    busy.value = false
+  }
+}
+</script>
+
+<template>
+  <InspectorSection
+    v-if="store.available !== false"
+    :title="t('inspector.validationChecks.title')"
+    :hint="t('inspector.validationChecks.sectionHint')"
+    data-testid="service-validation-config"
+  >
+    <template #actions>
+      <UButton
+        v-if="configured"
+        color="error"
+        variant="ghost"
+        size="xs"
+        icon="i-lucide-trash-2"
+        :loading="busy"
+        data-testid="validation-clear"
+        @click="clear"
+      >
+        {{ t('inspector.validationChecks.clear') }}
+      </UButton>
+    </template>
+
+    <div class="space-y-2">
+      <p class="text-[11px] text-slate-500">
+        {{ t('inspector.validationChecks.hint') }}
+      </p>
+
+      <div
+        v-for="(row, index) in rows"
+        :key="index"
+        class="flex items-end gap-2"
+        data-testid="validation-check-row"
+      >
+        <UFormField :label="t('inspector.validationChecks.label')" class="w-1/3">
+          <UInput
+            v-model="row.label"
+            :placeholder="t('inspector.validationChecks.labelPlaceholder')"
+            size="sm"
+            class="w-full"
+            data-testid="validation-check-label"
+          />
+        </UFormField>
+        <UFormField :label="t('inspector.validationChecks.command')" class="flex-1">
+          <UInput
+            v-model="row.command"
+            placeholder="pnpm lint"
+            size="sm"
+            class="w-full"
+            data-testid="validation-check-command"
+          />
+        </UFormField>
+        <UButton
+          color="neutral"
+          variant="ghost"
+          size="xs"
+          icon="i-lucide-x"
+          :aria-label="t('inspector.validationChecks.removeCheck')"
+          data-testid="validation-check-remove"
+          @click="removeRow(index)"
+        />
+      </div>
+
+      <p v-if="rows.length === 0" class="text-[11px] text-slate-500" data-testid="validation-empty">
+        {{ t('inspector.validationChecks.empty') }}
+      </p>
+
+      <div class="flex items-end justify-between gap-2">
+        <UFormField
+          :label="t('inspector.validationChecks.maxAttempts')"
+          :hint="t('inspector.validationChecks.maxAttemptsHint')"
+          class="w-40"
+        >
+          <UInput
+            v-model.number="maxAttempts"
+            type="number"
+            :min="1"
+            :max="VALIDATION_MAX_ATTEMPTS_CEILING"
+            size="sm"
+            class="w-full"
+            data-testid="validation-max-attempts"
+          />
+        </UFormField>
+        <div class="flex gap-2">
+          <UButton
+            color="neutral"
+            variant="soft"
+            size="xs"
+            icon="i-lucide-plus"
+            :disabled="!canAdd"
+            data-testid="validation-add-check"
+            @click="addRow"
+          >
+            {{ t('inspector.validationChecks.addCheck') }}
+          </UButton>
+          <UButton
+            color="primary"
+            variant="soft"
+            size="xs"
+            icon="i-lucide-save"
+            :loading="busy"
+            data-testid="validation-save"
+            @click="save"
+          >
+            {{ t('inspector.validationChecks.save') }}
+          </UButton>
+        </div>
+      </div>
+    </div>
+  </InspectorSection>
+</template>

package/app/components/settings/ApiTokensPanel.vue

@@ -11,10 +11,12 @@ import CopyButton from '~/components/common/CopyButton.vue'
 
 const { t, d } = useI18n()
 
-// The permission ladder a minted key can carry (read ⊂ write ⊂ admin), mirroring the backend
-// contract. A `read` key can only observe; `write` adds create/start/manage; `admin` adds the
-// destructive/merge-adjacent operations (e.g. deleting a task).
-const SCOPES: PublicApiScope[] = ['read', 'write', 'admin']
+// The permission ladder a minted key can carry (read ⊂ write ⊂ decide ⊂ admin), mirroring the
+// backend contract. A `read` key can only observe; `write` adds create/start/manage; `decide` adds
+// answering a run's PARKED human decisions (and, because of that, starting a headless run on a
+// pipeline that can park at all); `admin` adds the destructive/merge-adjacent operations (e.g.
+// deleting a task).
+const SCOPES: PublicApiScope[] = ['read', 'write', 'decide', 'admin']
 
 /** Localized label for a scope — an exhaustive switch, so a new scope is a compile error here. */
 function scopeLabel(scope: PublicApiScope): string {
@@ -23,6 +25,8 @@ function scopeLabel(scope: PublicApiScope): string {
       return t('settings.apiTokens.scopes.read')
     case 'write':
       return t('settings.apiTokens.scopes.write')
+    case 'decide':
+      return t('settings.apiTokens.scopes.decide')
     case 'admin':
       return t('settings.apiTokens.scopes.admin')
   }

package/app/composables/api/validationChecks.ts

@@ -0,0 +1,39 @@
+import {
+  deleteServiceValidationConfigContract,
+  getServiceValidationConfigContract,
+  listServiceValidationConfigsContract,
+  setServiceValidationConfigContract,
+} from '@cat-factory/contracts'
+import type { UpsertServiceValidationConfigInput } from '~/types/validationChecks'
+import type { ApiContext } from './context'
+
+/** Pre-PR validation checks: the per-service-frame commands the harness runs before opening a PR. */
+export function validationChecksApi({ send, ws }: ApiContext) {
+  return {
+    listServiceValidationConfigs: (workspaceId: string) =>
+      send(listServiceValidationConfigsContract, { pathPrefix: ws(workspaceId) }),
+
+    getServiceValidationConfig: (workspaceId: string, blockId: string) =>
+      send(getServiceValidationConfigContract, {
+        pathPrefix: ws(workspaceId),
+        pathParams: { blockId },
+      }),
+
+    setServiceValidationConfig: (
+      workspaceId: string,
+      blockId: string,
+      body: UpsertServiceValidationConfigInput,
+    ) =>
+      send(setServiceValidationConfigContract, {
+        pathPrefix: ws(workspaceId),
+        pathParams: { blockId },
+        body,
+      }),
+
+    deleteServiceValidationConfig: (workspaceId: string, blockId: string) =>
+      send(deleteServiceValidationConfigContract, {
+        pathPrefix: ws(workspaceId),
+        pathParams: { blockId },
+      }),
+  }
+}

package/app/composables/useApi.ts

@@ -35,6 +35,7 @@ import { recurringApi } from './api/recurring'
 import { previewApi } from './api/preview'
 import { environmentsApi } from './api/environments'
 import { releaseHealthApi } from './api/releaseHealth'
+import { validationChecksApi } from './api/validationChecks'
 import { sandboxApi } from './api/sandbox'
 import { reviewsApi } from './api/reviews'
 import { slackApi } from './api/slack'
@@ -135,6 +136,7 @@ export function useApi() {
     ...docInterviewApi(ctx),
     ...provisioningLogsApi(ctx),
     ...releaseHealthApi(ctx),
+    ...validationChecksApi(ctx),
     ...testSecretsApi(ctx),
     ...packageRegistriesApi(ctx),
     ...previewApi(ctx),

package/app/modular/panels/inspector.logic.spec.ts

@@ -41,6 +41,7 @@ describe('inspector panel group', () => {
       'service-test-secrets',
       'service-fragments',
       'service-release-health',
+      'service-validation-checks',
     ])
   })
 
@@ -59,6 +60,7 @@ describe('inspector panel group', () => {
       'service-test-secrets',
       'service-fragments',
       'service-release-health',
+      'service-validation-checks',
     ])
   })
 
@@ -70,6 +72,7 @@ describe('inspector panel group', () => {
       'service-test-secrets',
       'service-fragments',
       'service-release-health',
+      'service-validation-checks',
     ])
   })
 

package/app/modular/panels/inspector.logic.ts

@@ -53,6 +53,7 @@ export const INSPECTOR_PANEL_IDS = [
   'service-test-secrets',
   'service-fragments',
   'service-release-health',
+  'service-validation-checks',
   // epic / initiative body
   'epic-children',
   'initiative-inspector',
@@ -118,6 +119,10 @@ export const INSPECTOR_PANEL_SPECS: readonly InspectorPanelSpec[] = [
   { id: 'service-test-secrets', order: 150, when: isDeployableFrame },
   { id: 'service-fragments', order: 160, when: isFrame },
   { id: 'service-release-health', order: 170, when: isDeployableFrame },
+  // Pre-PR validation checks: the commands the harness runs before opening this service's PRs.
+  // Deployable frames only — a doc repo ships no build to install/lint/test, exactly like the
+  // test-infra and release-health panels above it.
+  { id: 'service-validation-checks', order: 180, when: isDeployableFrame },
   { id: 'epic-children', order: 200, when: (b) => b.level === 'epic' },
   { id: 'initiative-inspector', order: 210, when: (b) => b.level === 'initiative' },
 ]

package/app/modular/panels/inspector.ts

@@ -28,6 +28,7 @@ import ServiceTestConfig from '~/components/panels/inspector/ServiceTestConfig.v
 import ServiceTestSecrets from '~/components/panels/inspector/ServiceTestSecrets.vue'
 import ServiceFragments from '~/components/panels/inspector/ServiceFragments.vue'
 import ServiceReleaseHealthConfig from '~/components/panels/inspector/ServiceReleaseHealthConfig.vue'
+import ServiceValidationConfig from '~/components/panels/inspector/ServiceValidationConfig.vue'
 import EpicChildren from '~/components/panels/inspector/EpicChildren.vue'
 import InitiativeInspector from '~/components/panels/inspector/InitiativeInspector.vue'
 
@@ -80,6 +81,7 @@ const COMPONENTS: Record<InspectorPanelId, Component> = {
   'service-test-secrets': ServiceTestSecrets,
   'service-fragments': ServiceFragments,
   'service-release-health': ServiceReleaseHealthConfig,
+  'service-validation-checks': ServiceValidationConfig,
   'epic-children': EpicChildren,
   'initiative-inspector': InitiativeInspector,
 }