@cat-factory/app 0.71.2 → 0.72.0

package/app/components/panels/MergerResultView.vue

@@ -0,0 +1,267 @@
+<script setup lang="ts">
+// Dedicated result view for a completed `merger` step. The merger agent scores the PR
+// (complexity / risk / impact + a rationale) and the engine records its structured
+// decision on the step (`step.custom`, a `MergeDecision`): whether it auto-merged or
+// routed the PR to a human, and WHY. This renders that verdict — the three scores as
+// bars against their preset ceilings, the rationale, and a plain-language decision
+// banner — instead of the agent's raw JSON. Opened via the universal result-view host,
+// the same seam the requirements / tester windows use.
+import { computed } from 'vue'
+import type { MergeAxis, MergeDecision } from '@cat-factory/contracts'
+import StepRunMeta from '~/components/panels/StepRunMeta.vue'
+import StepRestartControl from '~/components/panels/StepRestartControl.vue'
+
+const board = useBoardStore()
+const execution = useExecutionStore()
+const agents = useAgentsStore()
+const { t, n } = useI18n()
+
+// Shared seam contract (open/blockId/close + Escape). No loader: the verdict is read
+// straight off the execution step.
+const { open, blockId, instanceId, stepIndex, close } = useResultView('merger')
+const block = computed(() => (blockId.value ? board.getBlock(blockId.value) : undefined))
+
+const instance = computed(() =>
+  instanceId.value === null ? null : (execution.getInstance(instanceId.value) ?? null),
+)
+const step = computed(() => {
+  if (instance.value === null || stepIndex.value === null) return null
+  return instance.value.steps[stepIndex.value] ?? null
+})
+const meta = computed(() => (step.value ? agents.get(step.value.agentKind) : undefined))
+
+const headerLabel = computed(() => meta.value?.label ?? t('panels.mergerResult.title'))
+const headerTitle = computed(() =>
+  block.value
+    ? t('panels.mergerResult.titleWithBlock', { title: block.value.title })
+    : headerLabel.value,
+)
+
+/** The engine's structured verdict; null for a step that predates the structured decision. */
+const decision = computed<MergeDecision | null>(() => {
+  const custom = step.value?.custom
+  return custom && typeof custom === 'object' && 'outcome' in custom
+    ? (custom as MergeDecision)
+    : null
+})
+
+const merged = computed(() => decision.value?.outcome === 'auto_merged')
+// Only redden bars when a threshold breach is the ACTUAL reason for review. For
+// `auto_merge_disabled` / `no_rationale` / `no_assessment` a score above its ceiling is
+// incidental, so it must not imply the axis is what caused the review.
+const exceeded = computed(() =>
+  decision.value?.reason === 'exceeded_thresholds'
+    ? new Set<MergeAxis>(decision.value.exceededAxes)
+    : new Set<MergeAxis>(),
+)
+
+// Exhaustive enum → i18n-key maps keyed off the contract unions, so adding a new
+// `MergeDecision` reason/outcome (or a merge axis) fails typecheck here until its key is
+// added — the drift guard the dynamic `t(\`...\${x}\`)` lookups can't provide on their own.
+const REASON_KEYS: Record<MergeDecision['reason'], string> = {
+  within_thresholds: 'panels.mergerResult.reason.within_thresholds',
+  exceeded_thresholds: 'panels.mergerResult.reason.exceeded_thresholds',
+  auto_merge_disabled: 'panels.mergerResult.reason.auto_merge_disabled',
+  no_rationale: 'panels.mergerResult.reason.no_rationale',
+  no_assessment: 'panels.mergerResult.reason.no_assessment',
+  merge_failed: 'panels.mergerResult.reason.merge_failed',
+}
+const OUTCOME_KEYS: Record<MergeDecision['outcome'], string> = {
+  auto_merged: 'panels.mergerResult.outcome.auto_merged',
+  awaiting_review: 'panels.mergerResult.outcome.awaiting_review',
+}
+const AXIS_KEYS: Record<MergeAxis, string> = {
+  complexity: 'panels.mergerResult.axis.complexity',
+  risk: 'panels.mergerResult.axis.risk',
+  impact: 'panels.mergerResult.axis.impact',
+}
+
+const outcomeText = computed(() => (decision.value ? t(OUTCOME_KEYS[decision.value.outcome]) : ''))
+
+/** The three axes with their score + preset ceiling, for the bar rows. */
+const axes = computed(() => {
+  const d = decision.value
+  if (!d?.assessment) return []
+  return [
+    {
+      key: 'complexity' as const,
+      label: t(AXIS_KEYS.complexity),
+      score: d.assessment.complexity,
+      ceiling: d.thresholds.maxComplexity,
+    },
+    {
+      key: 'risk' as const,
+      label: t(AXIS_KEYS.risk),
+      score: d.assessment.risk,
+      ceiling: d.thresholds.maxRisk,
+    },
+    {
+      key: 'impact' as const,
+      label: t(AXIS_KEYS.impact),
+      score: d.assessment.impact,
+      ceiling: d.thresholds.maxImpact,
+    },
+  ]
+})
+
+/** The plain-language "why" line, interpolating the preset + any exceeded axes. */
+const reasonText = computed(() => {
+  const d = decision.value
+  if (!d) return ''
+  const axisLabels = d.exceededAxes.map((a) => t(AXIS_KEYS[a])).join(', ')
+  return t(REASON_KEYS[d.reason], {
+    preset: d.thresholds.presetName,
+    axes: axisLabels,
+  })
+})
+</script>
+
+<template>
+  <Teleport to="body">
+    <div
+      v-if="open"
+      class="fixed inset-0 z-50 flex max-h-[100dvh] items-stretch justify-center bg-slate-950/70 backdrop-blur-sm"
+      @click.self="close"
+    >
+      <div
+        class="m-4 flex w-full max-w-3xl flex-col overflow-hidden rounded-2xl border border-slate-800 bg-slate-900 shadow-2xl"
+      >
+        <!-- Header -->
+        <header class="flex items-center gap-3 border-b border-slate-800 px-5 py-3">
+          <span
+            class="flex h-8 w-8 items-center justify-center rounded-lg bg-lime-500/15 text-lime-300"
+          >
+            <UIcon :name="meta?.icon ?? 'i-lucide-git-pull-request'" class="h-4 w-4" />
+          </span>
+          <div class="min-w-0 flex-1">
+            <h2 class="truncate text-sm font-semibold text-slate-100">{{ headerTitle }}</h2>
+            <p class="truncate text-[11px] text-slate-400">
+              {{ t('panels.mergerResult.description') }}
+            </p>
+          </div>
+          <StepRestartControl
+            :instance-id="instanceId"
+            :step-index="stepIndex"
+            @restarted="close"
+          />
+          <button
+            class="rounded-md p-1.5 text-slate-400 hover:bg-slate-800 hover:text-slate-200"
+            @click="close"
+          >
+            <UIcon name="i-lucide-x" class="h-4 w-4" />
+          </button>
+        </header>
+
+        <div class="flex min-h-0 flex-1">
+          <div class="min-w-0 flex-1 overflow-y-auto px-5 py-4">
+            <template v-if="decision">
+              <!-- Decision banner: auto-merged (success) vs awaiting human review (warning). -->
+              <div
+                class="mb-4 flex items-start gap-3 rounded-lg border p-3"
+                :class="
+                  merged
+                    ? 'border-emerald-800/70 bg-emerald-500/10'
+                    : 'border-amber-800/70 bg-amber-500/10'
+                "
+                data-testid="merger-decision"
+                :data-outcome="decision.outcome"
+              >
+                <UIcon
+                  :name="merged ? 'i-lucide-git-merge' : 'i-lucide-user-round-check'"
+                  class="mt-0.5 h-5 w-5 shrink-0"
+                  :class="merged ? 'text-emerald-300' : 'text-amber-300'"
+                />
+                <div class="min-w-0">
+                  <p
+                    class="text-sm font-semibold"
+                    :class="merged ? 'text-emerald-200' : 'text-amber-200'"
+                  >
+                    {{ outcomeText }}
+                  </p>
+                  <p class="mt-0.5 text-[13px] leading-relaxed text-slate-300">{{ reasonText }}</p>
+                </div>
+              </div>
+
+              <!-- Scores vs the resolved preset's ceilings. -->
+              <template v-if="axes.length">
+                <h3 class="mb-2 text-[11px] font-semibold uppercase tracking-wide text-slate-500">
+                  {{ t('panels.mergerResult.scores') }}
+                </h3>
+                <div class="space-y-2 rounded-lg border border-slate-800 bg-slate-950/40 p-3">
+                  <div v-for="axis in axes" :key="axis.key" class="flex items-center gap-2">
+                    <span class="w-20 shrink-0 text-xs text-slate-400">{{ axis.label }}</span>
+                    <div class="h-1.5 flex-1 overflow-hidden rounded-full bg-slate-800">
+                      <div
+                        class="h-full rounded-full"
+                        :class="exceeded.has(axis.key) ? 'bg-rose-500' : 'bg-emerald-500'"
+                        :style="{ width: `${Math.round(axis.score * 100)}%` }"
+                      />
+                    </div>
+                    <span
+                      class="w-11 shrink-0 text-end text-xs tabular-nums"
+                      :class="exceeded.has(axis.key) ? 'text-rose-300' : 'text-slate-300'"
+                    >
+                      {{ n(axis.score, { key: 'percent' }) }}
+                    </span>
+                    <span class="w-24 shrink-0 text-end text-[10px] tabular-nums text-slate-500">
+                      {{
+                        t('panels.mergerResult.ceiling', {
+                          value: n(axis.ceiling, { key: 'percent' }),
+                        })
+                      }}
+                    </span>
+                  </div>
+                </div>
+              </template>
+
+              <!-- The agent's prose justification. -->
+              <template v-if="decision.assessment?.rationale">
+                <h3
+                  class="mb-2 mt-4 text-[11px] font-semibold uppercase tracking-wide text-slate-500"
+                >
+                  {{ t('panels.mergerResult.rationale') }}
+                </h3>
+                <p class="whitespace-pre-wrap text-[13px] leading-relaxed text-slate-300">
+                  {{ decision.assessment.rationale }}
+                </p>
+              </template>
+              <p v-else class="text-[13px] italic leading-relaxed text-slate-500">
+                {{ t('panels.mergerResult.noAssessment') }}
+              </p>
+            </template>
+
+            <!-- Pre-structured runs kept only the raw prose output. -->
+            <p
+              v-else-if="step?.output"
+              class="whitespace-pre-wrap text-[13px] leading-relaxed text-slate-300"
+            >
+              {{ step.output }}
+            </p>
+            <div
+              v-else
+              class="flex h-full flex-col items-center justify-center gap-2 text-center text-slate-400"
+            >
+              <UIcon name="i-lucide-git-pull-request" class="h-8 w-8 opacity-40" />
+              <p class="text-sm">{{ t('panels.mergerResult.noResult') }}</p>
+            </div>
+          </div>
+
+          <!-- Sidebar: shared run metadata. -->
+          <aside
+            class="hidden w-60 shrink-0 flex-col gap-4 border-s border-slate-800 bg-slate-900/50 px-4 py-4 lg:flex"
+          >
+            <StepRunMeta
+              v-if="step"
+              :step="step"
+              :instance-id="instanceId ?? undefined"
+              :step-number="stepIndex === null ? undefined : stepIndex + 1"
+              :total-steps="instance?.steps.length"
+              :run-failed="instance?.status === 'failed'"
+              :failure-at="instance?.failure?.occurredAt"
+            />
+          </aside>
+        </div>
+      </div>
+    </div>
+  </Teleport>
+</template>

package/app/components/panels/StepResultViewHost.vue

@@ -22,6 +22,7 @@ import ConsensusSessionWindow from '~/components/consensus/ConsensusSessionWindo
 import GenericStructuredResultView from '~/components/panels/GenericStructuredResultView.vue'
 import ServiceSpecWindow from '~/components/spec/ServiceSpecWindow.vue'
 import FollowUpWindow from '~/components/followUp/FollowUpWindow.vue'
+import MergerResultView from '~/components/panels/MergerResultView.vue'
 
 const ui = useUiStore()
 
@@ -48,6 +49,9 @@ const STEP_RESULT_VIEWS: Record<string, Component> = {
   // The future-looking Follow-up companion: the Coder's surfaced loose ends / questions.
   // Opened directly via `ui.openFollowUps` (the blinking chip + the `followup_pending` card).
   'follow-ups': FollowUpWindow,
+  // The merger's verdict: the PR's complexity/risk/impact scores + the engine's auto-merge
+  // or awaiting-review decision (and why), instead of the agent's raw JSON.
+  merger: MergerResultView,
 }
 
 const active = computed<Component | null>(() => {

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

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { computed } from 'vue'
+import { computed, onMounted, onUnmounted, watch } from 'vue'
 import type {
   Block,
   FrontendBackendBinding,
@@ -7,6 +7,7 @@ import type {
   FrontendEnvInjection,
   FrontendPackageManager,
   FrontendServeMode,
+  PreviewStatus,
 } from '~/types/domain'
 
 // Frontend-frame (`type: 'frontend'`) configuration: how to build, serve, and mock this
@@ -19,6 +20,7 @@ const props = defineProps<{ block: Block }>()
 
 const board = useBoardStore()
 const auth = useAuthStore()
+const preview = usePreviewStore()
 const { t } = useI18n()
 
 // A browsable preview needs a long-lived host serve, so it is a local/node runtime capability
@@ -94,6 +96,39 @@ function addBinding() {
 function removeBinding(index: number) {
   save({ backendBindings: bindings.value.filter((_, i) => i !== index) })
 }
+
+// ---- Browsable preview (live runtime state, distinct from the persisted toggle) ----------
+// The live preview is a separate resource fetched from the preview endpoints; the store keys it
+// by frame id and self-polls while it is `starting`. Only relevant on a preview-capable runtime
+// with the toggle on.
+const previewActive = computed(() => previewSupported.value && config.value.previewEnabled === true)
+const previewState = computed(() => preview.byFrame[props.block.id])
+const previewStatus = computed<PreviewStatus>(() => previewState.value?.status ?? 'stopped')
+const previewBusy = computed(() => preview.busy[props.block.id] === true)
+// A start/stop request error (e.g. an unsupported runtime 503s) — shown inline; distinct from a
+// `failed` preview (a build that came up then broke), which carries `previewState.error`.
+const previewRequestError = computed(() => preview.requestError[props.block.id])
+
+// Exhaustive status → catalog key (tier-2 guard for the runtime-built lookup): adding a
+// PreviewStatus value without a label trips the typecheck on this map.
+const PREVIEW_STATUS_KEYS: Record<PreviewStatus, string> = {
+  starting: 'inspector.frontendConfig.preview.status.starting',
+  ready: 'inspector.frontendConfig.preview.status.ready',
+  failed: 'inspector.frontendConfig.preview.status.failed',
+  stopped: 'inspector.frontendConfig.preview.status.stopped',
+}
+const previewStatusLabel = computed(() => t(PREVIEW_STATUS_KEYS[previewStatus.value]))
+
+// Load the current state when the preview surface becomes relevant (mount + toggling it on, or
+// selecting a different frontend frame), so the inspector reflects an already-running preview.
+function refreshPreview() {
+  if (previewActive.value) void preview.refresh(props.block.id)
+}
+onMounted(refreshPreview)
+watch(() => [previewActive.value, props.block.id], refreshPreview)
+// Stop the store's self-poll for this frame when the inspector closes, so a `starting` preview
+// doesn't keep polling in the background after the panel is gone.
+onUnmounted(() => preview.stopPolling(props.block.id))
 </script>
 
 <template>
@@ -359,6 +394,81 @@ function removeBinding(index: number) {
             : t('inspector.frontendConfig.previewUnsupported')
         }}
       </p>
+
+      <!-- Live preview control: start / open (clickable URL) / stop, reflecting the runtime state. -->
+      <div v-if="previewActive" class="mt-2 space-y-1.5" data-testid="preview-panel">
+        <div class="flex items-center gap-2">
+          <span
+            class="text-[11px] font-medium"
+            :class="{
+              'text-emerald-400': previewStatus === 'ready',
+              'text-amber-400': previewStatus === 'starting',
+              'text-rose-400': previewStatus === 'failed',
+              'text-slate-400': previewStatus === 'stopped',
+            }"
+            data-testid="preview-status"
+          >
+            {{ previewStatusLabel }}
+          </span>
+
+          <UButton
+            v-if="previewStatus === 'ready' && previewState?.url"
+            :to="previewState.url"
+            target="_blank"
+            rel="noopener"
+            size="xs"
+            variant="soft"
+            color="primary"
+            trailing-icon="i-lucide-external-link"
+            data-testid="preview-url"
+          >
+            {{ t('inspector.frontendConfig.preview.open') }}
+          </UButton>
+        </div>
+
+        <div class="flex flex-wrap gap-1">
+          <UButton
+            v-if="previewStatus === 'stopped' || previewStatus === 'failed'"
+            size="xs"
+            variant="soft"
+            color="primary"
+            icon="i-lucide-play"
+            :loading="previewBusy"
+            data-testid="preview-start"
+            @click="preview.start(props.block.id)"
+          >
+            {{ t('inspector.frontendConfig.preview.start') }}
+          </UButton>
+          <UButton
+            v-if="previewStatus === 'ready' || previewStatus === 'starting'"
+            size="xs"
+            variant="ghost"
+            color="neutral"
+            icon="i-lucide-square"
+            :loading="previewBusy"
+            data-testid="preview-stop"
+            @click="preview.stop(props.block.id)"
+          >
+            {{ t('inspector.frontendConfig.preview.stop') }}
+          </UButton>
+        </div>
+
+        <p
+          v-if="previewStatus === 'failed' && previewState?.error"
+          class="text-[11px] leading-snug text-rose-400"
+          data-testid="preview-error"
+        >
+          {{ previewState.error }}
+        </p>
+
+        <p
+          v-if="previewRequestError"
+          class="text-[11px] leading-snug text-rose-400"
+          data-testid="preview-request-error"
+        >
+          {{ previewRequestError }}
+        </p>
+      </div>
     </div>
   </div>
 </template>

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

@@ -99,7 +99,12 @@ function labelForStep(s: {
   // container is still cold-booting → "Spinning up"; up with a known phase → the phase
   // label ("Agent running" / "Preparing workspace"), so a finished cold-boot no longer
   // collapses into a blank "Working". A failed run's mid-flight step isn't booting.
-  if (!runFailed.value) {
+  //
+  // Only while the step is STILL RUNNING, though: the run's one shared container is kept
+  // alive until the pipeline's final step, so a step that has already finished (e.g. the
+  // merger, which resolves + advances to a trailing gate) would otherwise keep reading the
+  // stale "Agent running" phase even though its state is `done`. A done step reads "Done".
+  if (!runFailed.value && s.state !== 'done') {
     if (s.container?.status === 'starting') return t('inspector.execution.spinningUp')
     if (s.container?.status === 'up') {
       const label = containerPhaseLabel(s.container.phase, { t, te })

package/app/composables/api/preview.ts

@@ -0,0 +1,20 @@
+import {
+  getPreviewContract,
+  startPreviewContract,
+  stopPreviewContract,
+} from '@cat-factory/contracts'
+import type { ApiContext } from './context'
+
+/** Browsable frontend preview: start / poll / stop a served preview for a `frontend` frame. */
+export function previewApi({ send, ws }: ApiContext) {
+  return {
+    getPreview: (workspaceId: string, frameId: string) =>
+      send(getPreviewContract, { pathPrefix: ws(workspaceId), pathParams: { frameId } }),
+
+    startPreview: (workspaceId: string, frameId: string) =>
+      send(startPreviewContract, { pathPrefix: ws(workspaceId), pathParams: { frameId } }),
+
+    stopPreview: (workspaceId: string, frameId: string) =>
+      send(stopPreviewContract, { pathPrefix: ws(workspaceId), pathParams: { frameId } }),
+  }
+}

package/app/composables/useApi.ts

@@ -22,6 +22,7 @@ import { presetsApi } from './api/presets'
 import { providerConnectionsApi } from './api/providerConnections'
 import { provisioningLogsApi } from './api/provisioningLogs'
 import { recurringApi } from './api/recurring'
+import { previewApi } from './api/preview'
 import { releaseHealthApi } from './api/releaseHealth'
 import { sandboxApi } from './api/sandbox'
 import { reviewsApi } from './api/reviews'
@@ -111,6 +112,7 @@ export function useApi() {
     ...infraHandlersApi(ctx),
     ...provisioningLogsApi(ctx),
     ...releaseHealthApi(ctx),
+    ...previewApi(ctx),
     ...recurringApi(ctx),
     ...sandboxApi(ctx),
     ...githubApi(ctx),

package/app/stores/preview.ts

@@ -0,0 +1,94 @@
+import { defineStore } from 'pinia'
+import { ref } from 'vue'
+import type { PreviewState } from '~/types/domain'
+import { useWorkspaceStore } from '~/stores/workspace'
+
+/**
+ * The browsable-frontend-preview runtime state, keyed by `frontend` frame id. Distinct from
+ * the frame's persisted `frontendConfig.previewEnabled` flag: this is the LIVE resource (a
+ * container building/serving the app on a host URL) fetched from the three preview endpoints.
+ * The three calls all return the same {@link PreviewState}, so each action just stores the
+ * result. While a preview is `starting` the store self-polls until it settles (ready/failed),
+ * so the inspector reflects the URL the moment it comes up — no manual refresh.
+ */
+export const usePreviewStore = defineStore('preview', () => {
+  const api = useApi()
+
+  /** frameId → its latest preview state. */
+  const byFrame = ref<Record<string, PreviewState>>({})
+  /** frameId → a start/stop request is in flight (drives the button loading state). */
+  const busy = ref<Record<string, boolean>>({})
+  /** frameId → the last start/stop request error (e.g. the runtime 503s), else undefined. */
+  const requestError = ref<Record<string, string | undefined>>({})
+
+  // Active poll timers while a preview is `starting`, so a settled/left preview stops polling.
+  const timers = new Map<string, ReturnType<typeof setTimeout>>()
+  const POLL_INTERVAL_MS = 2_500
+
+  function stopPolling(frameId: string) {
+    const timer = timers.get(frameId)
+    if (timer) {
+      clearTimeout(timer)
+      timers.delete(frameId)
+    }
+  }
+
+  function apply(frameId: string, state: PreviewState) {
+    byFrame.value[frameId] = state
+    if (state.status === 'starting') {
+      stopPolling(frameId)
+      timers.set(
+        frameId,
+        setTimeout(() => void refresh(frameId), POLL_INTERVAL_MS),
+      )
+    } else {
+      stopPolling(frameId)
+    }
+  }
+
+  /** Fetch the current preview state for a frame (used on mount + as the poll tick). */
+  async function refresh(frameId: string): Promise<void> {
+    const ws = useWorkspaceStore()
+    try {
+      apply(frameId, await api.getPreview(ws.requireId(), frameId))
+    } catch {
+      // A transient error leaves the last known state; stop polling so we don't spin.
+      stopPolling(frameId)
+    }
+  }
+
+  /**
+   * Start (or restart) the preview for a frame. A request failure (e.g. the runtime replies 503)
+   * is captured in {@link requestError} rather than escaping as an unhandled rejection from the
+   * click handler.
+   */
+  async function start(frameId: string): Promise<void> {
+    const ws = useWorkspaceStore()
+    busy.value[frameId] = true
+    requestError.value[frameId] = undefined
+    try {
+      apply(frameId, await api.startPreview(ws.requireId(), frameId))
+    } catch (err) {
+      requestError.value[frameId] = err instanceof Error ? err.message : String(err)
+    } finally {
+      busy.value[frameId] = false
+    }
+  }
+
+  /** Stop the preview for a frame. Failures are captured in {@link requestError}, not thrown. */
+  async function stop(frameId: string): Promise<void> {
+    const ws = useWorkspaceStore()
+    busy.value[frameId] = true
+    requestError.value[frameId] = undefined
+    try {
+      stopPolling(frameId)
+      apply(frameId, await api.stopPreview(ws.requireId(), frameId))
+    } catch (err) {
+      requestError.value[frameId] = err instanceof Error ? err.message : String(err)
+    } finally {
+      busy.value[frameId] = false
+    }
+  }
+
+  return { byFrame, busy, requestError, refresh, start, stop, stopPolling }
+})

package/app/types/domain.ts

@@ -63,6 +63,8 @@ export type {
   KaizenVerifiedCombo,
   KaizenOverview,
   WorkspaceEvent,
+  PreviewState,
+  PreviewStatus,
 } from '@cat-factory/contracts'
 
 import type { AgentCategory, AgentKind } from '@cat-factory/contracts'

package/app/utils/catalog.ts

@@ -405,6 +405,9 @@ export const SYSTEM_AGENT_META: Record<string, AgentArchetype> = {
     icon: 'i-lucide-git-pull-request',
     color: '#a3e635',
     description: 'Scores the PR and auto-merges within the task thresholds, or asks for review.',
+    // The merger's verdict is structured (scores + the engine's auto-merge / review
+    // decision), so it opens a dedicated result view instead of the raw-JSON prose panel.
+    resultView: 'merger',
   },
   'human-review': {
     kind: 'human-review',

package/i18n/locales/en.json

@@ -485,6 +485,17 @@
         "mock": "Mock (WireMock)",
         "remove": "Remove binding",
         "empty": "No backend bindings. Add one to point an env var at a service or a mock."
+      },
+      "preview": {
+        "open": "Open preview",
+        "start": "Start preview",
+        "stop": "Stop",
+        "status": {
+          "starting": "Starting…",
+          "ready": "Running",
+          "failed": "Failed",
+          "stopped": "Not running"
+        }
       }
     },
     "releaseHealth": {
@@ -721,6 +732,33 @@
       "noResult": "No result yet.",
       "noResultHint": "The structured output appears once this agent finishes. While it runs, the step shows live progress on the board."
     },
+    "mergerResult": {
+      "title": "Merge decision",
+      "titleWithBlock": "Merge decision: {title}",
+      "description": "How the PR scored and what the engine decided.",
+      "outcome": {
+        "auto_merged": "Auto-merged",
+        "awaiting_review": "Awaiting human review"
+      },
+      "reason": {
+        "within_thresholds": "Every score is within the {preset} thresholds, so the PR was merged automatically.",
+        "exceeded_thresholds": "{axes} exceeded the {preset} thresholds, so the PR is waiting for a human to merge.",
+        "auto_merge_disabled": "The {preset} preset sends every PR to a human, so this one is waiting for review.",
+        "no_rationale": "The merger scored the PR but gave no rationale, so the verdict could not be trusted to auto-merge; the PR is waiting for a human to merge.",
+        "no_assessment": "The merger did not return a parseable assessment, so the PR is waiting for a human to merge.",
+        "merge_failed": "The scores were within the {preset} thresholds, but the automatic merge could not complete (for example branch protection or a conflict), so the PR is waiting for a human to merge."
+      },
+      "scores": "Scores",
+      "axis": {
+        "complexity": "Complexity",
+        "risk": "Risk",
+        "impact": "Impact"
+      },
+      "ceiling": "ceiling {value}",
+      "rationale": "Rationale",
+      "noAssessment": "The merger did not return a scored assessment.",
+      "noResult": "No merge decision recorded yet."
+    },
     "testReport": {
       "title": "Test report",
       "greenlit": "Greenlit",

package/i18n/locales/es.json

@@ -445,6 +445,17 @@
         "mock": "Simulación (WireMock)",
         "remove": "Eliminar vinculación",
         "empty": "No hay vinculaciones de backend. Añade una para apuntar una variable de entorno a un servicio o a una simulación."
+      },
+      "preview": {
+        "open": "Abrir vista previa",
+        "start": "Iniciar vista previa",
+        "stop": "Detener",
+        "status": {
+          "starting": "Iniciando…",
+          "ready": "En ejecución",
+          "failed": "Error",
+          "stopped": "No iniciada"
+        }
       }
     },
     "releaseHealth": {
@@ -681,6 +692,33 @@
       "noResult": "Aún no hay resultado.",
       "noResultHint": "La salida estructurada aparece cuando este agente termina. Mientras se ejecuta, el paso muestra el progreso en vivo en el tablero."
     },
+    "mergerResult": {
+      "title": "Decisión de fusión",
+      "titleWithBlock": "Decisión de fusión: {title}",
+      "description": "Cómo se puntuó el PR y qué decidió el motor.",
+      "outcome": {
+        "auto_merged": "Fusionado automáticamente",
+        "awaiting_review": "Esperando revisión humana"
+      },
+      "reason": {
+        "within_thresholds": "Todas las puntuaciones están dentro de los umbrales de {preset}, por lo que el PR se fusionó automáticamente.",
+        "exceeded_thresholds": "{axes} superó los umbrales de {preset}, por lo que el PR espera a que una persona lo fusione.",
+        "auto_merge_disabled": "El preajuste {preset} envía todos los PR a una persona, así que este espera revisión.",
+        "no_rationale": "El fusionador puntuó el PR pero no dio ninguna justificación, así que no se pudo confiar en el veredicto para fusionar automáticamente; el PR espera a que una persona lo fusione.",
+        "no_assessment": "El fusionador no devolvió una evaluación analizable, por lo que el PR espera a que una persona lo fusione.",
+        "merge_failed": "Las puntuaciones estaban dentro de los umbrales de {preset}, pero la fusión automática no pudo completarse (por ejemplo, protección de rama o un conflicto), por lo que el PR espera a que una persona lo fusione."
+      },
+      "scores": "Puntuaciones",
+      "axis": {
+        "complexity": "Complejidad",
+        "risk": "Riesgo",
+        "impact": "Impacto"
+      },
+      "ceiling": "límite {value}",
+      "rationale": "Justificación",
+      "noAssessment": "El fusionador no devolvió una evaluación puntuada.",
+      "noResult": "Aún no se ha registrado ninguna decisión de fusión."
+    },
     "testReport": {
       "title": "Informe de pruebas",
       "greenlit": "Aprobado",

package/i18n/locales/fr.json

@@ -445,6 +445,17 @@
         "mock": "Simulation (WireMock)",
         "remove": "Supprimer la liaison",
         "empty": "Aucune liaison de backend. Ajoutez-en une pour pointer une variable d'environnement vers un service ou une simulation."
+      },
+      "preview": {
+        "open": "Ouvrir l'aperçu",
+        "start": "Démarrer l'aperçu",
+        "stop": "Arrêter",
+        "status": {
+          "starting": "Démarrage…",
+          "ready": "En cours",
+          "failed": "Échec",
+          "stopped": "Non démarré"
+        }
       }
     },
     "releaseHealth": {
@@ -681,6 +692,33 @@
       "noResult": "Pas encore de résultat.",
       "noResultHint": "La sortie structurée apparaît une fois que cet agent a terminé. Pendant son exécution, l'étape affiche sa progression en direct sur le tableau."
     },
+    "mergerResult": {
+      "title": "Décision de fusion",
+      "titleWithBlock": "Décision de fusion : {title}",
+      "description": "Comment la PR a été évaluée et ce que le moteur a décidé.",
+      "outcome": {
+        "auto_merged": "Fusionnée automatiquement",
+        "awaiting_review": "En attente de revue humaine"
+      },
+      "reason": {
+        "within_thresholds": "Tous les scores sont dans les seuils de {preset}, la PR a donc été fusionnée automatiquement.",
+        "exceeded_thresholds": "{axes} a dépassé les seuils de {preset}, la PR attend donc une fusion par une personne.",
+        "auto_merge_disabled": "Le préréglage {preset} envoie chaque PR à une personne ; celle-ci attend donc une revue.",
+        "no_rationale": "Le fusionneur a évalué la PR mais n'a donné aucune justification, le verdict n'a donc pas pu être approuvé pour une fusion automatique ; la PR attend une fusion par une personne.",
+        "no_assessment": "Le fusionneur n'a pas renvoyé d'évaluation exploitable, la PR attend donc une fusion par une personne.",
+        "merge_failed": "Les scores étaient dans les seuils de {preset}, mais la fusion automatique n'a pas pu aboutir (par exemple protection de branche ou conflit), la PR attend donc une fusion par une personne."
+      },
+      "scores": "Scores",
+      "axis": {
+        "complexity": "Complexité",
+        "risk": "Risque",
+        "impact": "Impact"
+      },
+      "ceiling": "plafond {value}",
+      "rationale": "Justification",
+      "noAssessment": "Le fusionneur n'a pas renvoyé d'évaluation chiffrée.",
+      "noResult": "Aucune décision de fusion enregistrée pour le moment."
+    },
     "testReport": {
       "title": "Rapport de test",
       "greenlit": "Validé",

package/i18n/locales/he.json

@@ -445,6 +445,17 @@
         "mock": "הדמיה (WireMock)",
         "remove": "הסר קישור",
         "empty": "אין קישורי backend. הוסף אחד כדי להפנות משתנה סביבה לשירות או להדמיה."
+      },
+      "preview": {
+        "open": "פתח תצוגה מקדימה",
+        "start": "הפעל תצוגה מקדימה",
+        "stop": "עצור",
+        "status": {
+          "starting": "מתחיל…",
+          "ready": "פועל",
+          "failed": "נכשל",
+          "stopped": "לא פועל"
+        }
       }
     },
     "releaseHealth": {
@@ -681,6 +692,33 @@
       "noResult": "אין עדיין תוצאה.",
       "noResultHint": "הפלט המובנה מופיע ברגע שהסוכן מסיים. בזמן הריצה השלב מציג התקדמות חיה על הלוח."
     },
+    "mergerResult": {
+      "title": "החלטת מיזוג",
+      "titleWithBlock": "החלטת מיזוג: {title}",
+      "description": "כיצד ה-PR דורג ומה המנוע החליט.",
+      "outcome": {
+        "auto_merged": "מוזג אוטומטית",
+        "awaiting_review": "ממתין לבדיקת אדם"
+      },
+      "reason": {
+        "within_thresholds": "כל הציונים בתוך ספי {preset}, ולכן ה-PR מוזג אוטומטית.",
+        "exceeded_thresholds": "{axes} חרג מספי {preset}, ולכן ה-PR ממתין למיזוג ידני.",
+        "auto_merge_disabled": "הקדם-הגדרה {preset} שולחת כל PR לאדם, ולכן זה ממתין לבדיקה.",
+        "no_rationale": "הממזג נתן ציון ל-PR אך לא סיפק נימוק, ולכן לא ניתן היה לסמוך על ההכרעה למיזוג אוטומטי; ה-PR ממתין למיזוג ידני.",
+        "no_assessment": "הממזג לא החזיר הערכה שניתן לפענח, ולכן ה-PR ממתין למיזוג ידני.",
+        "merge_failed": "הציונים היו בתוך ספי {preset}, אך המיזוג האוטומטי לא הושלם (למשל הגנת ענף או התנגשות), ולכן ה-PR ממתין למיזוג ידני."
+      },
+      "scores": "ציונים",
+      "axis": {
+        "complexity": "מורכבות",
+        "risk": "סיכון",
+        "impact": "השפעה"
+      },
+      "ceiling": "תקרה {value}",
+      "rationale": "נימוק",
+      "noAssessment": "הממזג לא החזיר הערכה מדורגת.",
+      "noResult": "עדיין לא נרשמה החלטת מיזוג."
+    },
     "testReport": {
       "title": "דוח בדיקות",
       "greenlit": "אושר",

package/i18n/locales/ja.json

@@ -445,6 +445,17 @@
         "mock": "モック（WireMock）",
         "remove": "バインディングを削除",
         "empty": "バックエンドバインディングがありません。追加して、環境変数をサービスまたはモックに向けてください。"
+      },
+      "preview": {
+        "open": "プレビューを開く",
+        "start": "プレビューを開始",
+        "stop": "停止",
+        "status": {
+          "starting": "開始中…",
+          "ready": "実行中",
+          "failed": "失敗",
+          "stopped": "停止中"
+        }
       }
     },
     "releaseHealth": {
@@ -681,6 +692,33 @@
       "noResult": "まだ結果はありません。",
       "noResultHint": "構造化出力はこのエージェントの完了後に表示されます。実行中はステップがボード上にライブ進捗を表示します。"
     },
+    "mergerResult": {
+      "title": "マージの判定",
+      "titleWithBlock": "マージの判定: {title}",
+      "description": "PR のスコアとエンジンの判断内容。",
+      "outcome": {
+        "auto_merged": "自動マージ済み",
+        "awaiting_review": "人によるレビュー待ち"
+      },
+      "reason": {
+        "within_thresholds": "すべてのスコアが {preset} のしきい値内のため、PR は自動的にマージされました。",
+        "exceeded_thresholds": "{axes} が {preset} のしきい値を超えたため、PR は人によるマージを待っています。",
+        "auto_merge_disabled": "{preset} プリセットはすべての PR を人に回すため、この PR はレビュー待ちです。",
+        "no_rationale": "マージ担当は PR を採点しましたが根拠を示さなかったため、自動マージするには判定を信頼できませんでした。PR は人によるマージを待っています。",
+        "no_assessment": "マージ担当が解析可能な評価を返さなかったため、PR は人によるマージを待っています。",
+        "merge_failed": "スコアは {preset} のしきい値内でしたが、自動マージを完了できなかった（例: ブランチ保護や競合）ため、PR は人によるマージを待っています。"
+      },
+      "scores": "スコア",
+      "axis": {
+        "complexity": "複雑さ",
+        "risk": "リスク",
+        "impact": "影響"
+      },
+      "ceiling": "上限 {value}",
+      "rationale": "根拠",
+      "noAssessment": "マージ担当はスコア付き評価を返しませんでした。",
+      "noResult": "マージの判定はまだ記録されていません。"
+    },
     "testReport": {
       "title": "テストレポート",
       "greenlit": "承認済み",

package/i18n/locales/pl.json

@@ -445,6 +445,17 @@
         "mock": "Mock (WireMock)",
         "remove": "Usuń powiązanie",
         "empty": "Brak powiązań backendu. Dodaj jedno, aby skierować zmienną środowiskową do usługi lub mocka."
+      },
+      "preview": {
+        "open": "Otwórz podgląd",
+        "start": "Uruchom podgląd",
+        "stop": "Zatrzymaj",
+        "status": {
+          "starting": "Uruchamianie…",
+          "ready": "Działa",
+          "failed": "Błąd",
+          "stopped": "Nie uruchomiono"
+        }
       }
     },
     "releaseHealth": {
@@ -681,6 +692,33 @@
       "noResult": "Brak wyniku.",
       "noResultHint": "Ustrukturyzowany wynik pojawia się po zakończeniu pracy tego agenta. W trakcie działania krok pokazuje postęp na żywo na tablicy."
     },
+    "mergerResult": {
+      "title": "Decyzja o scaleniu",
+      "titleWithBlock": "Decyzja o scaleniu: {title}",
+      "description": "Jak oceniono PR i co zdecydował silnik.",
+      "outcome": {
+        "auto_merged": "Scalono automatycznie",
+        "awaiting_review": "Oczekuje na przegląd przez człowieka"
+      },
+      "reason": {
+        "within_thresholds": "Wszystkie oceny mieszczą się w progach {preset}, więc PR został scalony automatycznie.",
+        "exceeded_thresholds": "{axes} przekroczył progi {preset}, więc PR czeka na scalenie przez człowieka.",
+        "auto_merge_disabled": "Ustawienie {preset} kieruje każdy PR do człowieka, więc ten czeka na przegląd.",
+        "no_rationale": "Scalający ocenił PR, ale nie podał uzasadnienia, więc werdyktowi nie można było zaufać na tyle, by scalić automatycznie; PR czeka na scalenie przez człowieka.",
+        "no_assessment": "Scalający nie zwrócił możliwej do przetworzenia oceny, więc PR czeka na scalenie przez człowieka.",
+        "merge_failed": "Oceny mieściły się w progach {preset}, ale automatyczne scalenie nie mogło się powieść (np. ochrona gałęzi lub konflikt), więc PR czeka na scalenie przez człowieka."
+      },
+      "scores": "Oceny",
+      "axis": {
+        "complexity": "Złożoność",
+        "risk": "Ryzyko",
+        "impact": "Wpływ"
+      },
+      "ceiling": "limit {value}",
+      "rationale": "Uzasadnienie",
+      "noAssessment": "Scalający nie zwrócił oceny punktowej.",
+      "noResult": "Nie zarejestrowano jeszcze decyzji o scaleniu."
+    },
     "testReport": {
       "title": "Raport z testów",
       "greenlit": "Zatwierdzone",

package/i18n/locales/tr.json

@@ -445,6 +445,17 @@
         "mock": "Taklit (WireMock)",
         "remove": "Bağlamayı kaldır",
         "empty": "Backend bağlaması yok. Bir ortam değişkenini bir hizmete veya taklide yönlendirmek için bir tane ekleyin."
+      },
+      "preview": {
+        "open": "Önizlemeyi aç",
+        "start": "Önizlemeyi başlat",
+        "stop": "Durdur",
+        "status": {
+          "starting": "Başlatılıyor…",
+          "ready": "Çalışıyor",
+          "failed": "Başarısız",
+          "stopped": "Başlatılmadı"
+        }
       }
     },
     "releaseHealth": {
@@ -681,6 +692,33 @@
       "noResult": "Henüz sonuç yok.",
       "noResultHint": "Yapılandırılmış çıktı bu ajan tamamlandığında görünür. Çalışırken adım, panoda canlı ilerlemeyi gösterir."
     },
+    "mergerResult": {
+      "title": "Birleştirme kararı",
+      "titleWithBlock": "Birleştirme kararı: {title}",
+      "description": "PR'nin nasıl puanlandığı ve motorun ne karar verdiği.",
+      "outcome": {
+        "auto_merged": "Otomatik birleştirildi",
+        "awaiting_review": "İnsan incelemesi bekleniyor"
+      },
+      "reason": {
+        "within_thresholds": "Tüm puanlar {preset} eşiklerinin içinde olduğundan PR otomatik olarak birleştirildi.",
+        "exceeded_thresholds": "{axes} {preset} eşiklerini aştığından PR bir kişinin birleştirmesini bekliyor.",
+        "auto_merge_disabled": "{preset} ön ayarı her PR'yi bir kişiye yönlendirir, bu yüzden bu PR inceleme bekliyor.",
+        "no_rationale": "Birleştirici PR'yi puanladı ancak bir gerekçe vermedi, bu yüzden karara otomatik birleştirme için güvenilemedi; PR bir kişinin birleştirmesini bekliyor.",
+        "no_assessment": "Birleştirici ayrıştırılabilir bir değerlendirme döndürmedi, bu yüzden PR bir kişinin birleştirmesini bekliyor.",
+        "merge_failed": "Puanlar {preset} eşiklerinin içindeydi ancak otomatik birleştirme tamamlanamadı (örneğin dal koruması veya bir çakışma), bu yüzden PR bir kişinin birleştirmesini bekliyor."
+      },
+      "scores": "Puanlar",
+      "axis": {
+        "complexity": "Karmaşıklık",
+        "risk": "Risk",
+        "impact": "Etki"
+      },
+      "ceiling": "üst sınır {value}",
+      "rationale": "Gerekçe",
+      "noAssessment": "Birleştirici puanlı bir değerlendirme döndürmedi.",
+      "noResult": "Henüz bir birleştirme kararı kaydedilmedi."
+    },
     "testReport": {
       "title": "Test raporu",
       "greenlit": "Onaylandı",

package/i18n/locales/uk.json

@@ -445,6 +445,17 @@
         "mock": "Мок (WireMock)",
         "remove": "Видалити прив'язку",
         "empty": "Немає прив'язок backend. Додайте одну, щоб спрямувати змінну середовища на сервіс або мок."
+      },
+      "preview": {
+        "open": "Відкрити попередній перегляд",
+        "start": "Запустити попередній перегляд",
+        "stop": "Зупинити",
+        "status": {
+          "starting": "Запуск…",
+          "ready": "Працює",
+          "failed": "Помилка",
+          "stopped": "Не запущено"
+        }
       }
     },
     "releaseHealth": {
@@ -681,6 +692,33 @@
       "noResult": "Результату ще немає.",
       "noResultHint": "Структурований вивід з'являється, щойно агент завершить роботу. Поки він працює, крок показує живий прогрес на дошці."
     },
+    "mergerResult": {
+      "title": "Рішення про злиття",
+      "titleWithBlock": "Рішення про злиття: {title}",
+      "description": "Як оцінено PR і що вирішив рушій.",
+      "outcome": {
+        "auto_merged": "Автоматично злито",
+        "awaiting_review": "Очікує на перевірку людиною"
+      },
+      "reason": {
+        "within_thresholds": "Усі оцінки в межах порогів {preset}, тому PR злито автоматично.",
+        "exceeded_thresholds": "{axes} перевищив пороги {preset}, тому PR очікує на злиття людиною.",
+        "auto_merge_disabled": "Пресет {preset} надсилає кожен PR людині, тож цей очікує на перевірку.",
+        "no_rationale": "Модуль злиття оцінив PR, але не надав обґрунтування, тому вердикту не можна було довіряти для автоматичного злиття; PR очікує на злиття людиною.",
+        "no_assessment": "Модуль злиття не повернув придатну для обробки оцінку, тому PR очікує на злиття людиною.",
+        "merge_failed": "Оцінки були в межах порогів {preset}, але автоматичне злиття не вдалося завершити (наприклад, захист гілки або конфлікт), тому PR очікує на злиття людиною."
+      },
+      "scores": "Оцінки",
+      "axis": {
+        "complexity": "Складність",
+        "risk": "Ризик",
+        "impact": "Вплив"
+      },
+      "ceiling": "межа {value}",
+      "rationale": "Обґрунтування",
+      "noAssessment": "Модуль злиття не повернув оцінену експертизу.",
+      "noResult": "Рішення про злиття ще не зафіксовано."
+    },
     "testReport": {
       "title": "Звіт про тестування",
       "greenlit": "Схвалено",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cat-factory/app",
-  "version": "0.71.2",
+  "version": "0.72.0",
   "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",
@@ -34,7 +34,7 @@
     "valibot": "^1.4.2",
     "vue": "^3.5.39",
     "wretch": "^3.0.9",
-    "@cat-factory/contracts": "0.78.0"
+    "@cat-factory/contracts": "0.79.0"
   },
   "devDependencies": {
     "@toad-contracts/testing": "0.3.2",