@cat-factory/app 0.26.5 → 0.26.7

package/app/components/board/AgentFailureCard.vue

@@ -12,7 +12,6 @@ const props = withDefaults(
 )
 
 const agentRuns = useAgentRunsStore()
-const toast = useToast()
 
 const compact = computed(() => props.variant === 'compact')
 const failure = computed(() => props.run.failure)
@@ -26,13 +25,9 @@ async function retry() {
   if (retrying.value) return
   retrying.value = true
   try {
+    // The store surfaces any failure as an actionable toast (incl. the no-provider 409),
+    // so we only need to clear the in-flight guard here.
     await agentRuns.retry(props.run.runId)
-  } catch (e) {
-    toast.add({
-      title: 'Retry failed',
-      description: e instanceof Error ? e.message : String(e),
-      color: 'error',
-    })
   } finally {
     retrying.value = false
   }

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

@@ -77,21 +77,11 @@ async function run() {
     return
   }
   starting.value = true
-  try {
-    // false ⇒ the user cancelled the personal-password prompt; revert quietly (the run
-    // never started). On success the button unmounts once the stream pushes in_progress.
-    const started = await execution.start(props.taskId, pipeline)
-    if (!started) starting.value = false
-  } catch (e) {
-    // Real confirmation came back as a failure — revert the optimistic state.
-    starting.value = false
-    toast.add({
-      title: 'Failed to start',
-      description: e instanceof Error ? e.message : String(e),
-      color: 'error',
-      icon: 'i-lucide-alert-triangle',
-    })
-  }
+  // false ⇒ the run never started (the user cancelled the personal-password prompt, or
+  // the start was refused — the store surfaces the actionable toast itself). Revert the
+  // optimistic state; on success the button unmounts once the stream pushes in_progress.
+  const started = await execution.start(props.taskId, pipeline)
+  if (!started) starting.value = false
 }
 
 function review() {

package/app/components/settings/ProviderConnectionPanel.vue

@@ -114,7 +114,9 @@ function buildManifestPayload(): {
   const template = descriptor.value?.manifestTemplate
   if (!template) return null
   const base = descriptor.value?.savedManifest ?? template
-  const manifest: Record<string, unknown> = structuredClone(base)
+  // `base` is a Vue reactive proxy, which structuredClone refuses (DataCloneError). The
+  // manifest is plain JSON config, so a JSON round-trip both unwraps the proxy and deep-clones.
+  const manifest: Record<string, unknown> = JSON.parse(JSON.stringify(base))
   const providerConfig: Record<string, unknown> = {
     ...(manifest.providerConfig as Record<string, unknown> | undefined),
   }

package/app/composables/usePipelineErrorToast.ts

@@ -0,0 +1,100 @@
+/**
+ * Turn a failed run-control API call (start / restart / retry / merge) into an actionable
+ * toast. The backend tags every 409 conflict with a distinct, machine-readable
+ * `error.details.reason` (kernel `ConflictReason`), so we can word each case precisely
+ * instead of dumping the raw message — and, for `providers_unconfigured`, surface the
+ * SAME guidance + "Configure AI" jump as the no-AI-provider startup banner.
+ */
+
+/** The parsed shape of a backend conflict (`{ error: { code: 'conflict', details } }`). */
+interface ConflictDetails {
+  reason?: string
+  models?: string[]
+  [key: string]: unknown
+}
+
+/** Pull a 409 conflict's `{ reason, message, details }` out of a thrown fetch error, else null. */
+export function parseConflict(
+  error: unknown,
+): { reason?: string; message: string; details: ConflictDetails } | null {
+  const body = (
+    error as { data?: { error?: { code?: string; message?: string; details?: ConflictDetails } } }
+  )?.data?.error
+  if (body?.code !== 'conflict') return null
+  const details = body.details ?? {}
+  return {
+    reason: typeof details.reason === 'string' ? details.reason : undefined,
+    message: body.message ?? 'This action conflicts with the current state.',
+    details,
+  }
+}
+
+/** Per-reason toast titles for conflicts that don't get bespoke handling below. */
+const CONFLICT_TITLES: Record<string, string> = {
+  dependencies_unmet: 'Blocked by dependencies',
+  task_limit_reached: 'Concurrency limit reached',
+  tester_infra_unsupported: 'Test infrastructure not configured',
+  run_not_retryable: 'Run can’t be retried',
+  no_pr_to_merge: 'No PR to merge',
+  github_not_connected: 'GitHub not connected',
+  bootstrap_not_retryable: 'Bootstrap can’t be retried',
+  bootstrap_reference_missing: 'Reference architecture is gone',
+}
+
+export function usePipelineErrorToast() {
+  const toast = useToast()
+  const ui = useUiStore()
+
+  /**
+   * Present `error` as a toast. `fallbackTitle` is used for non-conflict failures and any
+   * conflict reason without a dedicated title.
+   */
+  function present(error: unknown, fallbackTitle = 'Action failed'): void {
+    const conflict = parseConflict(error)
+
+    // The headline case: a pipeline step's model has no usable provider. Name the
+    // offending model(s), explain no provider is available, and offer the one-click jump
+    // to the AI setup — the same remedy the startup "No AI model configured" banner gives.
+    if (conflict?.reason === 'providers_unconfigured') {
+      const models = Array.isArray(conflict.details.models) ? conflict.details.models : []
+      const list = models.join(', ')
+      toast.add({
+        title: 'No AI provider for this model',
+        description: list
+          ? `No provider is configured for ${list}. Add a provider key, connect a subscription, ` +
+            'or enable Cloudflare AI to run it.'
+          : conflict.message,
+        color: 'error',
+        icon: 'i-lucide-cpu',
+        actions: [
+          {
+            label: 'Configure AI',
+            icon: 'i-lucide-settings',
+            onClick: () => ui.openAiProviderSetup(),
+          },
+        ],
+      })
+      return
+    }
+
+    if (conflict) {
+      toast.add({
+        title: CONFLICT_TITLES[conflict.reason ?? ''] ?? fallbackTitle,
+        description: conflict.message,
+        color: 'warning',
+        icon: 'i-lucide-triangle-alert',
+      })
+      return
+    }
+
+    // Not a conflict (a 4xx/5xx or a network fault) — surface its message plainly.
+    toast.add({
+      title: fallbackTitle,
+      description: error instanceof Error ? error.message : String(error),
+      color: 'error',
+      icon: 'i-lucide-triangle-alert',
+    })
+  }
+
+  return { present }
+}

package/app/stores/agentRuns.ts

@@ -37,6 +37,10 @@ export interface AgentRunSummary {
 export const useAgentRunsStore = defineStore('agentRuns', () => {
   const api = useApi()
   const execution = useExecutionStore()
+  // Same actionable-toast handling as the execution store: a retry refused with a tagged
+  // 409 (e.g. the run is no longer in a retryable state, or the model has no provider) is
+  // surfaced here so every retry surface (board card, inspector, task panel) is identical.
+  const runErrors = usePipelineErrorToast()
 
   /** Bootstrap runs for this workspace, newest-first. */
   const bootstrapJobs = ref<BootstrapJob[]>([])
@@ -99,10 +103,14 @@ export const useAgentRunsStore = defineStore('agentRuns', () => {
     const personal = usePersonalSubscriptionsStore()
     // A failed run on a Claude-pinned block needs the retrying user's personal password;
     // supplied from cache and prompted (then retried) on a 428, exactly like start.
-    await personal.withCredential(async (password) => {
-      await api.retryAgentRun(ws.requireId(), runId, password)
-      await ws.refresh()
-    })
+    try {
+      await personal.withCredential(async (password) => {
+        await api.retryAgentRun(ws.requireId(), runId, password)
+        await ws.refresh()
+      })
+    } catch (e) {
+      runErrors.present(e, 'Retry failed')
+    }
   }
 
   /**

package/app/stores/execution.ts

@@ -18,6 +18,11 @@ import { useWorkspaceStore } from '~/stores/workspace'
  */
 export const useExecutionStore = defineStore('execution', () => {
   const api = useApi()
+  // Centralised actionable toasts for run-control failures: a 409 with no configured
+  // provider opens the AI setup; the other tagged conflicts get worded titles. Living
+  // in the store means every caller (board card, drag-drop, menus, restart controls)
+  // gets identical handling, including the fire-and-forget ones that never caught.
+  const runErrors = usePipelineErrorToast()
   const instances = ref<ExecutionInstance[]>([])
 
   /** Replace the cached executions with a server snapshot. */
@@ -109,12 +114,18 @@ export const useExecutionStore = defineStore('execution', () => {
   async function start(blockId: string, pipeline: Pipeline): Promise<boolean> {
     const ws = useWorkspaceStore()
     const personal = usePersonalSubscriptionsStore()
-    // Returns false when the user cancels the personal-password prompt (the run never
-    // started), so an optimistic caller can revert its "Starting…" state.
-    return personal.withCredential(async (password) => {
-      await api.startExecution(ws.requireId(), blockId, { pipelineId: pipeline.id }, password)
-      await ws.refresh()
-    })
+    // Returns false when the user cancels the personal-password prompt OR the start was
+    // refused (a 409 conflict, surfaced as an actionable toast here), so an optimistic
+    // caller can revert its "Starting…" state without its own error handling.
+    try {
+      return await personal.withCredential(async (password) => {
+        await api.startExecution(ws.requireId(), blockId, { pipelineId: pipeline.id }, password)
+        await ws.refresh()
+      })
+    } catch (e) {
+      runErrors.present(e, 'Failed to start')
+      return false
+    }
   }
 
   // Interacting with a running individual-usage run (resolve/approve/request-changes) rides
@@ -207,8 +218,12 @@ export const useExecutionStore = defineStore('execution', () => {
   /** Merge an open PR (a task in `pr_ready`) — the server completes the task. */
   async function mergePr(blockId: string) {
     const ws = useWorkspaceStore()
-    await api.mergeBlock(ws.requireId(), blockId)
-    await ws.refresh()
+    try {
+      await api.mergeBlock(ws.requireId(), blockId)
+      await ws.refresh()
+    } catch (e) {
+      runErrors.present(e, 'Failed to merge')
+    }
   }
 
   /**
@@ -222,10 +237,15 @@ export const useExecutionStore = defineStore('execution', () => {
   async function restartFromStep(instanceId: string, stepIndex: number): Promise<boolean> {
     const ws = useWorkspaceStore()
     const personal = usePersonalSubscriptionsStore()
-    return personal.withCredential(async (password) => {
-      await api.restartFromStep(ws.requireId(), instanceId, stepIndex, password)
-      await ws.refresh()
-    })
+    try {
+      return await personal.withCredential(async (password) => {
+        await api.restartFromStep(ws.requireId(), instanceId, stepIndex, password)
+        await ws.refresh()
+      })
+    } catch (e) {
+      runErrors.present(e, 'Failed to restart')
+      return false
+    }
   }
 
   /** Cancel the execution running against a block and reset it to planned. */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cat-factory/app",
-  "version": "0.26.5",
+  "version": "0.26.7",
   "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",