@cat-factory/app 0.147.6 → 0.147.7

package/app/stores/board/context.ts

@@ -0,0 +1,46 @@
+import type { Ref } from 'vue'
+import type { Block } from '~/types/domain'
+
+/** A detached subtree captured before an optimistic delete, restored on failure. */
+export interface RemovalSnapshot {
+  /** The removed block + all its descendants, in their original order. */
+  removed: Block[]
+  /**
+   * Survivors whose `dependsOn`/`epicId`/`initiativeId` lost an edge to a removed block
+   * (originals to restore on rollback).
+   */
+  edges: { id: string; dependsOn: string[]; epicId: string | null; initiativeId: string | null }[]
+}
+
+/** A still-pending optimistic delete: its snapshot, the deferred-commit timer, and its workspace. */
+export interface PendingRemoval {
+  snap: RemovalSnapshot
+  timer: ReturnType<typeof setTimeout>
+  wsId: string
+}
+
+/**
+ * How long a deleted block stays undoable. The backend delete is DEFERRED for this
+ * window (a real "undo", not a client illusion) — the block is hidden immediately but
+ * only actually deleted once the window elapses, so undo just cancels the pending call.
+ */
+export const UNDO_WINDOW_MS = 6000
+
+/**
+ * Shared state + injected dependencies the board-store write factories close over. Created once in
+ * the `board` store setup and threaded into {@link createBoardMutations} / {@link createBoardRemoval}
+ * so the split operations stay behaviourally identical to the original single-closure store — the
+ * factories are cohesive extractions purely to keep each function within the size budget, not new
+ * seams. `api`/`toast`/`tr` are the store's own resolved handles (a store runs outside a component
+ * `setup`, so `tr` bridges to the Nuxt app's global i18n instance).
+ */
+export interface BoardWriteContext {
+  blocks: Ref<Block[]>
+  getBlock: (id: string) => Block | undefined
+  upsert: (block: Block) => void
+  pendingRemovals: Map<string, PendingRemoval>
+  pendingDoomed: Set<string>
+  api: ReturnType<typeof useApi>
+  toast: ReturnType<typeof useToast>
+  tr: (key: string, params?: Record<string, unknown>) => string
+}

package/app/stores/board/mutations.ts

@@ -0,0 +1,362 @@
+import type { UpdateBlockInput } from '@cat-factory/contracts'
+import type {
+  BlockType,
+  CreateTaskType,
+  FrameRepoType,
+  TaskTypeFields,
+  Block,
+} from '~/types/domain'
+import { useServicesStore } from '~/stores/services'
+import { useWorkspaceStore } from '~/stores/workspace'
+import type { BoardWriteContext } from './context'
+import { UNDO_WINDOW_MS } from './context'
+
+/**
+ * The board's create / move / update / dependency write operations, extracted from the store
+ * setup. Each closes over the shared {@link BoardWriteContext} (the authoritative block returned
+ * by the API is applied via `upsert`) so behaviour is identical to the original in-closure
+ * functions — the split is purely to keep every function within the size budget.
+ */
+export function createBoardMutations(ctx: BoardWriteContext) {
+  const { getBlock, upsert, api, toast, tr } = ctx
+
+  async function addBlock(type: BlockType, position: { x: number; y: number }): Promise<Block> {
+    const block = await api.addFrame(useWorkspaceStore().requireId(), { type, position })
+    upsert(block)
+    return block
+  }
+
+  /**
+   * Import an existing GitHub repo (the App is installed + it's projected) as a
+   * service frame, with no bootstrap run. The backend links the repo to the new
+   * frame and returns it `ready`; we upsert it onto the board. When the repo already
+   * backs an org service, the backend MOUNTS that shared service here instead of
+   * minting a rival — so refresh the snapshot to pull in the shared frame's subtree
+   * + its mount layout (a fresh import has no subtree, but the reconcile is harmless).
+   */
+  async function addServiceFromRepo(
+    repoGithubId: number,
+    opts?: {
+      directory?: string
+      isMonorepo?: boolean
+      type?: FrameRepoType
+      position?: { x: number; y: number }
+    },
+  ): Promise<Block> {
+    const block = await api.addServiceFromRepo(useWorkspaceStore().requireId(), {
+      repoGithubId,
+      ...(opts?.directory ? { directory: opts.directory } : {}),
+      ...(opts?.isMonorepo !== undefined ? { isMonorepo: opts.isMonorepo } : {}),
+      ...(opts?.type ? { type: opts.type } : {}),
+      ...(opts?.position ? { position: opts.position } : {}),
+    })
+    upsert(block)
+    await useWorkspaceStore().refresh()
+    return block
+  }
+
+  /**
+   * Add a task inside a container (a service or a module). The user supplies the
+   * title (and optional description) — the task is created in `planned` state and
+   * is not launched until the user explicitly starts a pipeline on it.
+   */
+  async function addTask(
+    containerId: string,
+    title: string,
+    description?: string,
+    options?: {
+      taskType?: CreateTaskType
+      taskTypeFields?: TaskTypeFields
+      riskPolicyId?: string
+      modelPresetId?: string
+      pipelineId?: string
+      agentConfig?: Record<string, string>
+      fragmentIds?: string[]
+      technical?: boolean
+    },
+  ): Promise<Block | undefined> {
+    if (!getBlock(containerId)) return
+    const block = await api.addTask(useWorkspaceStore().requireId(), containerId, {
+      title,
+      description,
+      ...(options?.taskType ? { taskType: options.taskType } : {}),
+      ...(options?.taskTypeFields ? { taskTypeFields: options.taskTypeFields } : {}),
+      ...(options?.riskPolicyId ? { riskPolicyId: options.riskPolicyId } : {}),
+      ...(options?.modelPresetId ? { modelPresetId: options.modelPresetId } : {}),
+      ...(options?.pipelineId ? { pipelineId: options.pipelineId } : {}),
+      ...(options?.agentConfig ? { agentConfig: options.agentConfig } : {}),
+      // Forward the selection when the caller provides one (the create form always does, even
+      // when empty — an explicit clear the backend must honour rather than re-seed); omit only
+      // when a caller doesn't manage fragments at all (then the backend seeds from the service).
+      ...(options?.fragmentIds !== undefined ? { fragmentIds: options.fragmentIds } : {}),
+      ...(options?.technical ? { technical: true } : {}),
+    })
+    upsert(block)
+    return block
+  }
+
+  /**
+   * Add an epic grouping node. Epics are non-structural: they group tasks via the tasks'
+   * `epicId`, so this just drops a new `epic`-level block on the board.
+   */
+  async function addEpic(
+    title: string,
+    position: { x: number; y: number },
+    options?: { description?: string; parentId?: string },
+  ): Promise<Block> {
+    const block = await api.addEpic(useWorkspaceStore().requireId(), {
+      title,
+      position,
+      ...(options?.description ? { description: options.description } : {}),
+      ...(options?.parentId ? { parentId: options.parentId } : {}),
+    })
+    upsert(block)
+    return block
+  }
+
+  /** Assign a task to an epic, or detach it (epicId: null). */
+  async function assignToEpic(taskId: string, epicId: string | null) {
+    const t = getBlock(taskId)
+    if (!t) return
+    const prev = t.epicId ?? null
+    t.epicId = epicId // optimistic
+    try {
+      upsert(await api.assignToEpic(useWorkspaceStore().requireId(), taskId, { epicId }))
+    } catch (e) {
+      t.epicId = prev
+      toast.add({
+        title: tr('board.toast.epicFailed'),
+        description: e instanceof Error ? e.message : String(e),
+        icon: 'i-lucide-triangle-alert',
+        color: 'error',
+      })
+    }
+  }
+
+  /** Add a module (sub-frame) inside a service. */
+  async function addModule(
+    serviceId: string,
+    name: string,
+    position?: { x: number; y: number },
+  ): Promise<Block | undefined> {
+    if (!getBlock(serviceId)) return
+    const block = await api.addModule(useWorkspaceStore().requireId(), serviceId, {
+      name,
+      position,
+    })
+    upsert(block)
+    return block
+  }
+
+  /**
+   * Move a block into a new container at a new local position. Drag-reparent commits
+   * silently on a small overshoot, so a successful move (into a *different* container,
+   * not an undo of one) offers a one-click undo back to its previous home.
+   */
+  async function reparentBlock(
+    id: string,
+    newParentId: string,
+    position: { x: number; y: number },
+    opts: { undoable?: boolean } = { undoable: true },
+  ) {
+    const b = getBlock(id)
+    const parent = getBlock(newParentId)
+    if (!b || !parent || b.id === newParentId) return
+    // tasks may live in services or modules; modules only in services
+    if (b.level === 'task' && parent.level !== 'frame' && parent.level !== 'module') return
+    if (b.level === 'module' && parent.level !== 'frame') return
+    // Optimistic: drop the block into the new container immediately so it doesn't
+    // briefly snap back to its old home while the request is in flight. Snapshot
+    // the old home so a rejected reparent restores it rather than leaving the
+    // block in the wrong container (a structural lie that survives until re-hydrate).
+    const prevParentId = b.parentId
+    const prevPosition = b.position
+    const name = b.title
+    b.parentId = newParentId
+    b.position = position
+    try {
+      upsert(
+        await api.reparentBlock(useWorkspaceStore().requireId(), id, {
+          parentId: newParentId,
+          position,
+        }),
+      )
+      // Offer an undo back to the previous container (a drag overshoot is easy). The undo
+      // move is itself non-undoable so the toast doesn't ping-pong.
+      if (opts.undoable && prevParentId) {
+        toast.add({
+          title: tr('board.toast.moved', { name }),
+          icon: 'i-lucide-move',
+          color: 'neutral',
+          duration: UNDO_WINDOW_MS,
+          actions: [
+            {
+              label: tr('common.undo'),
+              icon: 'i-lucide-undo-2',
+              onClick: () =>
+                void reparentBlock(id, prevParentId, prevPosition, { undoable: false }),
+            },
+          ],
+        })
+      }
+    } catch (e) {
+      b.parentId = prevParentId
+      b.position = prevPosition
+      toast.add({
+        title: tr('board.toast.moveFailed'),
+        description: e instanceof Error ? e.message : String(e),
+        icon: 'i-lucide-triangle-alert',
+        color: 'error',
+      })
+    }
+  }
+
+  /**
+   * Archive a service (hide it + its subtree, restorable with no expiry) — the non-destructive
+   * alternative to deleting a service that still has unfinished tasks. The acting tab isn't
+   * echoed its own coarse board event, so re-hydrate explicitly to drop the frame from the board
+   * and surface it under the archived list.
+   */
+  async function archiveService(id: string) {
+    await api.archiveBlock(useWorkspaceStore().requireId(), id)
+    await useWorkspaceStore().refresh()
+  }
+
+  /** Restore an archived service back onto the board. Re-hydrates to pull its subtree back in. */
+  async function restoreService(id: string) {
+    await api.restoreBlock(useWorkspaceStore().requireId(), id)
+    await useWorkspaceStore().refresh()
+  }
+
+  /**
+   * Local-only optimistic position update during an active drag — no persistence.
+   * A drag fires this on every pointer move so the block tracks the cursor without
+   * a per-move API round-trip; the final position is committed once via
+   * {@link moveBlock} (or {@link reparentBlock}) on release. Persisting every move
+   * raced: out-of-order responses to the burst of in-flight writes could land a
+   * stale position last, snapping the block back after the user let go.
+   */
+  function previewMove(id: string, position: { x: number; y: number }) {
+    const b = getBlock(id)
+    if (b) b.position = position
+  }
+
+  async function moveBlock(id: string, position: { x: number; y: number }) {
+    const b = getBlock(id)
+    if (!b) return
+    const prevPosition = b.position
+    b.position = position // optimistic: keep the drag feeling instant
+    try {
+      // A mounted service frame's position is a PER-WORKSPACE layout override on the mount, not
+      // on the (shared) block — so route a frame drag there. Other moves write the block.
+      const services = useServicesStore()
+      const mount = services.serviceByFrameBlock[id]
+        ? services.byServiceId[services.serviceByFrameBlock[id]!.id]
+        : undefined
+      if (mount) {
+        await services.updateLayout(mount.serviceId, position)
+        return
+      }
+      upsert(await api.moveBlock(useWorkspaceStore().requireId(), id, { position }))
+    } catch (e) {
+      // Restore the pre-drag position — a rejected move must not leave the block at a
+      // spot the server never stored (a lie that survives until the next re-hydrate).
+      b.position = prevPosition
+      toast.add({
+        title: tr('board.toast.moveFailed'),
+        description: e instanceof Error ? e.message : String(e),
+        icon: 'i-lucide-triangle-alert',
+        color: 'error',
+      })
+    }
+  }
+
+  /** Patch the user-editable fields of a block (title, features, threshold…). */
+  async function updateBlock(id: string, patch: UpdateBlockInput) {
+    const b = getBlock(id)
+    if (!b) return
+    // Snapshot ONLY the fields this patch touches so a rejected write restores them exactly
+    // (a patch may set several at once) rather than leaving a stale optimistic value stuck on
+    // screen with no feedback — the same rollback contract the other mutations here follow.
+    const prev: Record<string, unknown> = {}
+    const patchRecord = patch as Record<string, unknown>
+    const record = b as unknown as Record<string, unknown>
+    for (const key of Object.keys(patch)) prev[key] = record[key]
+    Object.assign(b, patch) // optimistic
+    try {
+      upsert(await api.updateBlock(useWorkspaceStore().requireId(), id, patch))
+    } catch (e) {
+      // Re-resolve the block: a live event may have replaced its object reference (`upsert`
+      // swaps in a fresh one) while the write was in flight, so `b` can be stale. Only revert
+      // fields that still hold OUR optimistic value, so a newer server value that landed
+      // mid-flight isn't clobbered by the rollback.
+      const cur = getBlock(id) as unknown as Record<string, unknown> | undefined
+      if (cur) {
+        for (const key of Object.keys(patch)) {
+          if (cur[key] === patchRecord[key]) cur[key] = prev[key]
+        }
+      }
+      toast.add({
+        title: tr('board.toast.updateFailed'),
+        description: e instanceof Error ? e.message : String(e),
+        icon: 'i-lucide-triangle-alert',
+        color: 'error',
+      })
+    }
+  }
+
+  /**
+   * Toggle a dependency edge target -> source (target dependsOn source). The backend
+   * rejects an edge that would close a cycle (422) — surface that as a toast rather than
+   * letting it throw unhandled out of a board gesture.
+   */
+  async function toggleDependency(targetId: string, sourceId: string) {
+    if (targetId === sourceId || !getBlock(targetId)) return
+    try {
+      upsert(await api.toggleDependency(useWorkspaceStore().requireId(), targetId, { sourceId }))
+    } catch (e) {
+      toast.add({
+        title: tr('board.toast.linkFailed'),
+        description: e instanceof Error ? e.message : String(e),
+        icon: 'i-lucide-triangle-alert',
+        color: 'error',
+      })
+    }
+  }
+
+  /** Remove a dependency edge target -> source if it exists. */
+  async function removeDependency(targetId: string, sourceId: string) {
+    const t = getBlock(targetId)
+    if (!t || !t.dependsOn.includes(sourceId)) return
+    // the backend exposes a single toggle; the edge exists, so toggling removes it
+    try {
+      upsert(await api.toggleDependency(useWorkspaceStore().requireId(), targetId, { sourceId }))
+    } catch (e) {
+      // Mirror `toggleDependency`: a failure must surface (and leave the edge visible) rather
+      // than rejecting unhandled with no feedback.
+      toast.add({
+        title: tr('board.toast.unlinkFailed'),
+        description: e instanceof Error ? e.message : String(e),
+        icon: 'i-lucide-triangle-alert',
+        color: 'error',
+      })
+    }
+  }
+
+  return {
+    addBlock,
+    addServiceFromRepo,
+    addTask,
+    addModule,
+    addEpic,
+    assignToEpic,
+    reparentBlock,
+    archiveService,
+    restoreService,
+    previewMove,
+    moveBlock,
+    updateBlock,
+    toggleDependency,
+    removeDependency,
+  }
+}

package/app/stores/board/removal.ts

@@ -0,0 +1,172 @@
+import { useServicesStore } from '~/stores/services'
+import { useWorkspaceStore } from '~/stores/workspace'
+import type { BoardWriteContext, RemovalSnapshot } from './context'
+import { UNDO_WINDOW_MS } from './context'
+
+/**
+ * The optimistic delete / deferred-commit / undo lifecycle for board blocks, extracted from the
+ * `board` store setup. Operates on the shared {@link BoardWriteContext} state so behaviour is
+ * identical to the original in-closure functions. `detach`/`reattach`/`removeBlock` are exposed on
+ * the store (other stores delete a block through their own endpoint then `detach` here); `undoRemove`
+ * stays internal — it is only wired into the delete toast's undo action.
+ */
+export function createBoardRemoval(ctx: BoardWriteContext) {
+  const { blocks, getBlock, pendingRemovals, pendingDoomed, api, toast, tr } = ctx
+
+  /**
+   * Optimistically drop a block and its descendants from the cache, returning a
+   * snapshot so the removal can be undone if the backend call fails. The server
+   * cascades to descendants, so we mirror that here. Exposed for other stores
+   * (e.g. recurring pipelines) that delete a block through their own endpoint.
+   */
+  function detach(id: string): RemovalSnapshot | null {
+    if (!getBlock(id)) return null
+    const doomed = new Set<string>([id])
+    let grew = true
+    while (grew) {
+      grew = false
+      for (const b of blocks.value) {
+        if (b.parentId && doomed.has(b.parentId) && !doomed.has(b.id)) {
+          doomed.add(b.id)
+          grew = true
+        }
+      }
+    }
+    const removed = blocks.value.filter((b) => doomed.has(b.id))
+    // Survivors that pointed at a doomed block (dependency edge, epic membership, or initiative
+    // membership) lose that link — snapshot the originals so a failed delete restores them
+    // faithfully. Mirrors the backend `pruneDanglingEdges` detach.
+    const edges = blocks.value
+      .filter(
+        (b) =>
+          !doomed.has(b.id) &&
+          (b.dependsOn.some((d) => doomed.has(d)) ||
+            (b.epicId != null && doomed.has(b.epicId)) ||
+            (b.initiativeId != null && doomed.has(b.initiativeId))),
+      )
+      .map((b) => ({
+        id: b.id,
+        dependsOn: [...b.dependsOn],
+        epicId: b.epicId ?? null,
+        initiativeId: b.initiativeId ?? null,
+      }))
+    blocks.value = blocks.value.filter((b) => !doomed.has(b.id))
+    for (const b of blocks.value) {
+      if (b.dependsOn.some((d) => doomed.has(d))) {
+        b.dependsOn = b.dependsOn.filter((d) => !doomed.has(d))
+      }
+      // A member of a deleted epic loses its membership (the task itself survives).
+      if (b.epicId != null && doomed.has(b.epicId)) b.epicId = null
+      // Likewise a task spawned by a deleted initiative loses its (non-structural) membership.
+      if (b.initiativeId != null && doomed.has(b.initiativeId)) b.initiativeId = null
+    }
+    return { removed, edges }
+  }
+
+  /** Re-insert a detached subtree and restore its broken edges (delete rollback). */
+  function reattach(snap: RemovalSnapshot) {
+    for (const b of snap.removed) if (!getBlock(b.id)) blocks.value.push(b)
+    const restored = new Set(snap.removed.map((b) => b.id))
+    for (const e of snap.edges) {
+      const b = getBlock(e.id)
+      if (!b) continue
+      // Re-establish only the links that pointed at a now-restored block, merged with
+      // whatever the survivor gained meanwhile — so a delayed undo (the delete is deferred by
+      // a window during which a live event may add edges) doesn't clobber a newer dependency /
+      // epic / initiative link with the stale detach-time snapshot.
+      const readd = e.dependsOn.filter((d) => restored.has(d) && !b.dependsOn.includes(d))
+      if (readd.length) b.dependsOn = [...b.dependsOn, ...readd]
+      if (b.epicId == null && e.epicId != null && restored.has(e.epicId)) b.epicId = e.epicId
+      if (b.initiativeId == null && e.initiativeId != null && restored.has(e.initiativeId)) {
+        b.initiativeId = e.initiativeId
+      }
+    }
+  }
+
+  /** Cancel a still-pending delete and restore the hidden subtree. */
+  function undoRemove(id: string) {
+    const pending = pendingRemovals.get(id)
+    if (!pending) return
+    clearTimeout(pending.timer)
+    pendingRemovals.delete(id)
+    for (const b of pending.snap.removed) pendingDoomed.delete(b.id)
+    // Don't resurrect the subtree into a different workspace if the user navigated away
+    // mid-window; the delete was already cancelled, which is the safe outcome there.
+    if (useWorkspaceStore().workspaceId !== pending.wsId) return
+    reattach(pending.snap)
+  }
+
+  /**
+   * Delete a block. The subtree is hidden IMMEDIATELY (optimistic) so the board feels
+   * instant, and the real backend delete is DEFERRED by {@link UNDO_WINDOW_MS} so the
+   * accompanying "Deleted — Undo" toast can cancel it in place (a genuine undo, since
+   * nothing was destroyed server-side yet). The subtree stays filtered out of any
+   * hydrate/upsert in the meantime (see `applyPendingRemovals`). If the deferred
+   * call ultimately fails we put the subtree back and surface an error toast.
+   */
+  function removeBlock(
+    id: string,
+    opts: { onCommit?: (wsId: string) => void | Promise<void> } = {},
+  ) {
+    const block = getBlock(id)
+    const snap = detach(id)
+    if (!block || !snap) return
+    // Capture the workspace now: the deferred delete must target the workspace the block
+    // was deleted from even if the user has since switched.
+    const wsId = useWorkspaceStore().requireId()
+    for (const b of snap.removed) pendingDoomed.add(b.id)
+
+    const finalize = async () => {
+      const pending = pendingRemovals.get(id)
+      if (!pending) return
+      pendingRemovals.delete(id)
+      try {
+        // Any irreversible side effect the delete implies (e.g. cancelling the block's run)
+        // is deferred to here so it fires only once the delete truly commits — undo within
+        // the window then leaves the run untouched instead of restoring an already-cancelled one.
+        await opts.onCommit?.(pending.wsId)
+        await api.removeBlock(pending.wsId, id)
+        // A service frame's delete also reclaims its account-owned service server-side, but this
+        // tab is not echoed its own coarse `board` event, so nothing re-hydrates the service
+        // catalog here — drop the deleted service locally so the add-service picker stops flagging
+        // its repo as "already on board" (a no-op for a task/module). Only after the commit, so a
+        // still-linked repo is never briefly presented as addable.
+        if (useWorkspaceStore().workspaceId === pending.wsId)
+          useServicesStore().dropByFrameBlock(id)
+        // Stop filtering the subtree only after the server has actually dropped it, so a
+        // snapshot that raced the in-flight delete can't briefly resurrect it.
+        for (const b of pending.snap.removed) pendingDoomed.delete(b.id)
+      } catch (e) {
+        for (const b of pending.snap.removed) pendingDoomed.delete(b.id)
+        // Only restore into the board the block was deleted from; a mid-window workspace
+        // switch must not inject the old subtree onto the workspace now on screen (it
+        // re-hydrates from the server there on the next refresh anyway).
+        if (useWorkspaceStore().workspaceId === pending.wsId) reattach(pending.snap)
+        toast.add({
+          title: tr('board.toast.deleteFailed'),
+          description: e instanceof Error ? e.message : String(e),
+          icon: 'i-lucide-triangle-alert',
+          color: 'error',
+        })
+      }
+    }
+    const timer = setTimeout(() => void finalize(), UNDO_WINDOW_MS)
+    pendingRemovals.set(id, { snap, timer, wsId })
+
+    toast.add({
+      title: tr('board.toast.deleted', { name: block.title }),
+      icon: 'i-lucide-trash-2',
+      color: 'neutral',
+      duration: UNDO_WINDOW_MS,
+      actions: [
+        {
+          label: tr('common.undo'),
+          icon: 'i-lucide-undo-2',
+          onClick: () => undoRemove(id),
+        },
+      ],
+    })
+  }
+
+  return { detach, reattach, removeBlock }
+}

package/app/stores/board.ts

@@ -1,34 +1,20 @@
 import { defineStore } from 'pinia'
 import { ref } from 'vue'
-import type { UpdateBlockInput } from '@cat-factory/contracts'
-import type {
-  Block,
-  BlockType,
-  CreateTaskType,
-  FrameRepoType,
-  TaskTypeFields,
-} from '~/types/domain'
-import { useServicesStore } from '~/stores/services'
-import { useWorkspaceStore } from '~/stores/workspace'
+import type { Block } from '~/types/domain'
 import { useBlockQueries } from '~/composables/useBlockQueries'
+import type { PendingRemoval } from '~/stores/board/context'
+import { createBoardMutations } from '~/stores/board/mutations'
+import { createBoardRemoval } from '~/stores/board/removal'
 
 /**
  * The board: architecture blocks and the dependency edges between them. Blocks
  * are owned by the backend — this store is a hydrated cache. Read getters are
  * pure client logic (see {@link useBlockQueries}); every mutation calls the API
- * and applies the authoritative block the server returns.
+ * and applies the authoritative block the server returns. The write operations
+ * live in cohesive factories ({@link createBoardMutations} / {@link createBoardRemoval},
+ * under `stores/board/`) that close over the shared state assembled here — a size-only
+ * split, not a new seam.
  */
-/** A detached subtree captured before an optimistic delete, restored on failure. */
-interface RemovalSnapshot {
-  /** The removed block + all its descendants, in their original order. */
-  removed: Block[]
-  /**
-   * Survivors whose `dependsOn`/`epicId`/`initiativeId` lost an edge to a removed block
-   * (originals to restore on rollback).
-   */
-  edges: { id: string; dependsOn: string[]; epicId: string | null; initiativeId: string | null }[]
-}
-
 export const useBoardStore = defineStore('board', () => {
   const api = useApi()
   const toast = useToast()
@@ -61,22 +47,13 @@ export const useBoardStore = defineStore('board', () => {
   const queries = useBlockQueries(blocks)
   const { getBlock } = queries
 
-  /**
-   * How long a deleted block stays undoable. The backend delete is DEFERRED for this
-   * window (a real "undo", not a client illusion) — the block is hidden immediately but
-   * only actually deleted once the window elapses, so undo just cancels the pending call.
-   */
-  const UNDO_WINDOW_MS = 6000
   /**
    * Blocks hidden by an optimistic delete whose backend call hasn't fired yet, keyed by
    * the deleted root's id. Their subtree stays filtered out of every incoming server
    * snapshot (`hydrate`) and single-block live event (`upsert`) for the undo window, so a
    * coarse refresh or a stray event can't resurrect a block the user just deleted.
    */
-  const pendingRemovals = new Map<
-    string,
-    { snap: RemovalSnapshot; timer: ReturnType<typeof setTimeout>; wsId: string }
-  >()
+  const pendingRemovals = new Map<string, PendingRemoval>()
   // Flat set of every id in a pending removal (root + descendants), for O(1) checks in the
   // hot upsert path. Kept in lockstep with `pendingRemovals`.
   const pendingDoomed = new Set<string>()
@@ -148,23 +125,6 @@ export const useBoardStore = defineStore('board', () => {
     archived.value = [...next]
   }
 
-  /**
-   * Archive a service (hide it + its subtree, restorable with no expiry) — the non-destructive
-   * alternative to deleting a service that still has unfinished tasks. The acting tab isn't
-   * echoed its own coarse board event, so re-hydrate explicitly to drop the frame from the board
-   * and surface it under the archived list.
-   */
-  async function archiveService(id: string) {
-    await api.archiveBlock(useWorkspaceStore().requireId(), id)
-    await useWorkspaceStore().refresh()
-  }
-
-  /** Restore an archived service back onto the board. Re-hydrates to pull its subtree back in. */
-  async function restoreService(id: string) {
-    await api.restoreBlock(useWorkspaceStore().requireId(), id)
-    await useWorkspaceStore().refresh()
-  }
-
   /** Insert or replace a block returned by the backend. */
   function upsert(block: Block) {
     // A live event for a block awaiting its deferred delete must not resurrect it.
@@ -176,466 +136,12 @@ export const useBoardStore = defineStore('board', () => {
     else blocks.value.push(block)
   }
 
-  async function addBlock(type: BlockType, position: { x: number; y: number }): Promise<Block> {
-    const block = await api.addFrame(useWorkspaceStore().requireId(), { type, position })
-    upsert(block)
-    return block
-  }
-
-  /**
-   * Import an existing GitHub repo (the App is installed + it's projected) as a
-   * service frame, with no bootstrap run. The backend links the repo to the new
-   * frame and returns it `ready`; we upsert it onto the board. When the repo already
-   * backs an org service, the backend MOUNTS that shared service here instead of
-   * minting a rival — so refresh the snapshot to pull in the shared frame's subtree
-   * + its mount layout (a fresh import has no subtree, but the reconcile is harmless).
-   */
-  async function addServiceFromRepo(
-    repoGithubId: number,
-    opts?: {
-      directory?: string
-      isMonorepo?: boolean
-      type?: FrameRepoType
-      position?: { x: number; y: number }
-    },
-  ): Promise<Block> {
-    const block = await api.addServiceFromRepo(useWorkspaceStore().requireId(), {
-      repoGithubId,
-      ...(opts?.directory ? { directory: opts.directory } : {}),
-      ...(opts?.isMonorepo !== undefined ? { isMonorepo: opts.isMonorepo } : {}),
-      ...(opts?.type ? { type: opts.type } : {}),
-      ...(opts?.position ? { position: opts.position } : {}),
-    })
-    upsert(block)
-    await useWorkspaceStore().refresh()
-    return block
-  }
-
-  /**
-   * Add a task inside a container (a service or a module). The user supplies the
-   * title (and optional description) — the task is created in `planned` state and
-   * is not launched until the user explicitly starts a pipeline on it.
-   */
-  async function addTask(
-    containerId: string,
-    title: string,
-    description?: string,
-    options?: {
-      taskType?: CreateTaskType
-      taskTypeFields?: TaskTypeFields
-      riskPolicyId?: string
-      modelPresetId?: string
-      pipelineId?: string
-      agentConfig?: Record<string, string>
-      fragmentIds?: string[]
-      technical?: boolean
-    },
-  ): Promise<Block | undefined> {
-    if (!getBlock(containerId)) return
-    const block = await api.addTask(useWorkspaceStore().requireId(), containerId, {
-      title,
-      description,
-      ...(options?.taskType ? { taskType: options.taskType } : {}),
-      ...(options?.taskTypeFields ? { taskTypeFields: options.taskTypeFields } : {}),
-      ...(options?.riskPolicyId ? { riskPolicyId: options.riskPolicyId } : {}),
-      ...(options?.modelPresetId ? { modelPresetId: options.modelPresetId } : {}),
-      ...(options?.pipelineId ? { pipelineId: options.pipelineId } : {}),
-      ...(options?.agentConfig ? { agentConfig: options.agentConfig } : {}),
-      // Forward the selection when the caller provides one (the create form always does, even
-      // when empty — an explicit clear the backend must honour rather than re-seed); omit only
-      // when a caller doesn't manage fragments at all (then the backend seeds from the service).
-      ...(options?.fragmentIds !== undefined ? { fragmentIds: options.fragmentIds } : {}),
-      ...(options?.technical ? { technical: true } : {}),
-    })
-    upsert(block)
-    return block
-  }
-
-  /**
-   * Add an epic grouping node. Epics are non-structural: they group tasks via the tasks'
-   * `epicId`, so this just drops a new `epic`-level block on the board.
-   */
-  async function addEpic(
-    title: string,
-    position: { x: number; y: number },
-    options?: { description?: string; parentId?: string },
-  ): Promise<Block> {
-    const block = await api.addEpic(useWorkspaceStore().requireId(), {
-      title,
-      position,
-      ...(options?.description ? { description: options.description } : {}),
-      ...(options?.parentId ? { parentId: options.parentId } : {}),
-    })
-    upsert(block)
-    return block
-  }
-
-  /** Assign a task to an epic, or detach it (epicId: null). */
-  async function assignToEpic(taskId: string, epicId: string | null) {
-    const t = getBlock(taskId)
-    if (!t) return
-    const prev = t.epicId ?? null
-    t.epicId = epicId // optimistic
-    try {
-      upsert(await api.assignToEpic(useWorkspaceStore().requireId(), taskId, { epicId }))
-    } catch (e) {
-      t.epicId = prev
-      toast.add({
-        title: tr('board.toast.epicFailed'),
-        description: e instanceof Error ? e.message : String(e),
-        icon: 'i-lucide-triangle-alert',
-        color: 'error',
-      })
-    }
-  }
-
-  /** Add a module (sub-frame) inside a service. */
-  async function addModule(
-    serviceId: string,
-    name: string,
-    position?: { x: number; y: number },
-  ): Promise<Block | undefined> {
-    if (!getBlock(serviceId)) return
-    const block = await api.addModule(useWorkspaceStore().requireId(), serviceId, {
-      name,
-      position,
-    })
-    upsert(block)
-    return block
-  }
-
-  /**
-   * Move a block into a new container at a new local position. Drag-reparent commits
-   * silently on a small overshoot, so a successful move (into a *different* container,
-   * not an undo of one) offers a one-click undo back to its previous home.
-   */
-  async function reparentBlock(
-    id: string,
-    newParentId: string,
-    position: { x: number; y: number },
-    opts: { undoable?: boolean } = { undoable: true },
-  ) {
-    const b = getBlock(id)
-    const parent = getBlock(newParentId)
-    if (!b || !parent || b.id === newParentId) return
-    // tasks may live in services or modules; modules only in services
-    if (b.level === 'task' && parent.level !== 'frame' && parent.level !== 'module') return
-    if (b.level === 'module' && parent.level !== 'frame') return
-    // Optimistic: drop the block into the new container immediately so it doesn't
-    // briefly snap back to its old home while the request is in flight. Snapshot
-    // the old home so a rejected reparent restores it rather than leaving the
-    // block in the wrong container (a structural lie that survives until re-hydrate).
-    const prevParentId = b.parentId
-    const prevPosition = b.position
-    const name = b.title
-    b.parentId = newParentId
-    b.position = position
-    try {
-      upsert(
-        await api.reparentBlock(useWorkspaceStore().requireId(), id, {
-          parentId: newParentId,
-          position,
-        }),
-      )
-      // Offer an undo back to the previous container (a drag overshoot is easy). The undo
-      // move is itself non-undoable so the toast doesn't ping-pong.
-      if (opts.undoable && prevParentId) {
-        toast.add({
-          title: tr('board.toast.moved', { name }),
-          icon: 'i-lucide-move',
-          color: 'neutral',
-          duration: UNDO_WINDOW_MS,
-          actions: [
-            {
-              label: tr('common.undo'),
-              icon: 'i-lucide-undo-2',
-              onClick: () =>
-                void reparentBlock(id, prevParentId, prevPosition, { undoable: false }),
-            },
-          ],
-        })
-      }
-    } catch (e) {
-      b.parentId = prevParentId
-      b.position = prevPosition
-      toast.add({
-        title: tr('board.toast.moveFailed'),
-        description: e instanceof Error ? e.message : String(e),
-        icon: 'i-lucide-triangle-alert',
-        color: 'error',
-      })
-    }
-  }
-
-  /**
-   * Optimistically drop a block and its descendants from the cache, returning a
-   * snapshot so the removal can be undone if the backend call fails. The server
-   * cascades to descendants, so we mirror that here. Exposed for other stores
-   * (e.g. recurring pipelines) that delete a block through their own endpoint.
-   */
-  function detach(id: string): RemovalSnapshot | null {
-    if (!getBlock(id)) return null
-    const doomed = new Set<string>([id])
-    let grew = true
-    while (grew) {
-      grew = false
-      for (const b of blocks.value) {
-        if (b.parentId && doomed.has(b.parentId) && !doomed.has(b.id)) {
-          doomed.add(b.id)
-          grew = true
-        }
-      }
-    }
-    const removed = blocks.value.filter((b) => doomed.has(b.id))
-    // Survivors that pointed at a doomed block (dependency edge, epic membership, or initiative
-    // membership) lose that link — snapshot the originals so a failed delete restores them
-    // faithfully. Mirrors the backend `pruneDanglingEdges` detach.
-    const edges = blocks.value
-      .filter(
-        (b) =>
-          !doomed.has(b.id) &&
-          (b.dependsOn.some((d) => doomed.has(d)) ||
-            (b.epicId != null && doomed.has(b.epicId)) ||
-            (b.initiativeId != null && doomed.has(b.initiativeId))),
-      )
-      .map((b) => ({
-        id: b.id,
-        dependsOn: [...b.dependsOn],
-        epicId: b.epicId ?? null,
-        initiativeId: b.initiativeId ?? null,
-      }))
-    blocks.value = blocks.value.filter((b) => !doomed.has(b.id))
-    for (const b of blocks.value) {
-      if (b.dependsOn.some((d) => doomed.has(d))) {
-        b.dependsOn = b.dependsOn.filter((d) => !doomed.has(d))
-      }
-      // A member of a deleted epic loses its membership (the task itself survives).
-      if (b.epicId != null && doomed.has(b.epicId)) b.epicId = null
-      // Likewise a task spawned by a deleted initiative loses its (non-structural) membership.
-      if (b.initiativeId != null && doomed.has(b.initiativeId)) b.initiativeId = null
-    }
-    return { removed, edges }
-  }
-
-  /** Re-insert a detached subtree and restore its broken edges (delete rollback). */
-  function reattach(snap: RemovalSnapshot) {
-    for (const b of snap.removed) if (!getBlock(b.id)) blocks.value.push(b)
-    const restored = new Set(snap.removed.map((b) => b.id))
-    for (const e of snap.edges) {
-      const b = getBlock(e.id)
-      if (!b) continue
-      // Re-establish only the links that pointed at a now-restored block, merged with
-      // whatever the survivor gained meanwhile — so a delayed undo (the delete is deferred by
-      // a window during which a live event may add edges) doesn't clobber a newer dependency /
-      // epic / initiative link with the stale detach-time snapshot.
-      const readd = e.dependsOn.filter((d) => restored.has(d) && !b.dependsOn.includes(d))
-      if (readd.length) b.dependsOn = [...b.dependsOn, ...readd]
-      if (b.epicId == null && e.epicId != null && restored.has(e.epicId)) b.epicId = e.epicId
-      if (b.initiativeId == null && e.initiativeId != null && restored.has(e.initiativeId)) {
-        b.initiativeId = e.initiativeId
-      }
-    }
-  }
-
-  /**
-   * Delete a block. The subtree is hidden IMMEDIATELY (optimistic) so the board feels
-   * instant, and the real backend delete is DEFERRED by {@link UNDO_WINDOW_MS} so the
-   * accompanying "Deleted — Undo" toast can cancel it in place (a genuine undo, since
-   * nothing was destroyed server-side yet). The subtree stays filtered out of any
-   * hydrate/upsert in the meantime (see {@link applyPendingRemovals}). If the deferred
-   * call ultimately fails we put the subtree back and surface an error toast.
-   */
-  function removeBlock(
-    id: string,
-    opts: { onCommit?: (wsId: string) => void | Promise<void> } = {},
-  ) {
-    const block = getBlock(id)
-    const snap = detach(id)
-    if (!block || !snap) return
-    // Capture the workspace now: the deferred delete must target the workspace the block
-    // was deleted from even if the user has since switched.
-    const wsId = useWorkspaceStore().requireId()
-    for (const b of snap.removed) pendingDoomed.add(b.id)
-
-    const finalize = async () => {
-      const pending = pendingRemovals.get(id)
-      if (!pending) return
-      pendingRemovals.delete(id)
-      try {
-        // Any irreversible side effect the delete implies (e.g. cancelling the block's run)
-        // is deferred to here so it fires only once the delete truly commits — undo within
-        // the window then leaves the run untouched instead of restoring an already-cancelled one.
-        await opts.onCommit?.(pending.wsId)
-        await api.removeBlock(pending.wsId, id)
-        // A service frame's delete also reclaims its account-owned service server-side, but this
-        // tab is not echoed its own coarse `board` event, so nothing re-hydrates the service
-        // catalog here — drop the deleted service locally so the add-service picker stops flagging
-        // its repo as "already on board" (a no-op for a task/module). Only after the commit, so a
-        // still-linked repo is never briefly presented as addable.
-        if (useWorkspaceStore().workspaceId === pending.wsId)
-          useServicesStore().dropByFrameBlock(id)
-        // Stop filtering the subtree only after the server has actually dropped it, so a
-        // snapshot that raced the in-flight delete can't briefly resurrect it.
-        for (const b of pending.snap.removed) pendingDoomed.delete(b.id)
-      } catch (e) {
-        for (const b of pending.snap.removed) pendingDoomed.delete(b.id)
-        // Only restore into the board the block was deleted from; a mid-window workspace
-        // switch must not inject the old subtree onto the workspace now on screen (it
-        // re-hydrates from the server there on the next refresh anyway).
-        if (useWorkspaceStore().workspaceId === pending.wsId) reattach(pending.snap)
-        toast.add({
-          title: tr('board.toast.deleteFailed'),
-          description: e instanceof Error ? e.message : String(e),
-          icon: 'i-lucide-triangle-alert',
-          color: 'error',
-        })
-      }
-    }
-    const timer = setTimeout(() => void finalize(), UNDO_WINDOW_MS)
-    pendingRemovals.set(id, { snap, timer, wsId })
-
-    toast.add({
-      title: tr('board.toast.deleted', { name: block.title }),
-      icon: 'i-lucide-trash-2',
-      color: 'neutral',
-      duration: UNDO_WINDOW_MS,
-      actions: [
-        {
-          label: tr('common.undo'),
-          icon: 'i-lucide-undo-2',
-          onClick: () => undoRemove(id),
-        },
-      ],
-    })
-  }
-
-  /** Cancel a still-pending delete and restore the hidden subtree. */
-  function undoRemove(id: string) {
-    const pending = pendingRemovals.get(id)
-    if (!pending) return
-    clearTimeout(pending.timer)
-    pendingRemovals.delete(id)
-    for (const b of pending.snap.removed) pendingDoomed.delete(b.id)
-    // Don't resurrect the subtree into a different workspace if the user navigated away
-    // mid-window; the delete was already cancelled, which is the safe outcome there.
-    if (useWorkspaceStore().workspaceId !== pending.wsId) return
-    reattach(pending.snap)
-  }
-
-  /**
-   * Local-only optimistic position update during an active drag — no persistence.
-   * A drag fires this on every pointer move so the block tracks the cursor without
-   * a per-move API round-trip; the final position is committed once via
-   * {@link moveBlock} (or {@link reparentBlock}) on release. Persisting every move
-   * raced: out-of-order responses to the burst of in-flight writes could land a
-   * stale position last, snapping the block back after the user let go.
-   */
-  function previewMove(id: string, position: { x: number; y: number }) {
-    const b = getBlock(id)
-    if (b) b.position = position
-  }
-
-  async function moveBlock(id: string, position: { x: number; y: number }) {
-    const b = getBlock(id)
-    if (!b) return
-    const prevPosition = b.position
-    b.position = position // optimistic: keep the drag feeling instant
-    try {
-      // A mounted service frame's position is a PER-WORKSPACE layout override on the mount, not
-      // on the (shared) block — so route a frame drag there. Other moves write the block.
-      const services = useServicesStore()
-      const mount = services.serviceByFrameBlock[id]
-        ? services.byServiceId[services.serviceByFrameBlock[id]!.id]
-        : undefined
-      if (mount) {
-        await services.updateLayout(mount.serviceId, position)
-        return
-      }
-      upsert(await api.moveBlock(useWorkspaceStore().requireId(), id, { position }))
-    } catch (e) {
-      // Restore the pre-drag position — a rejected move must not leave the block at a
-      // spot the server never stored (a lie that survives until the next re-hydrate).
-      b.position = prevPosition
-      toast.add({
-        title: tr('board.toast.moveFailed'),
-        description: e instanceof Error ? e.message : String(e),
-        icon: 'i-lucide-triangle-alert',
-        color: 'error',
-      })
-    }
-  }
-
-  /** Patch the user-editable fields of a block (title, features, threshold…). */
-  async function updateBlock(id: string, patch: UpdateBlockInput) {
-    const b = getBlock(id)
-    if (!b) return
-    // Snapshot ONLY the fields this patch touches so a rejected write restores them exactly
-    // (a patch may set several at once) rather than leaving a stale optimistic value stuck on
-    // screen with no feedback — the same rollback contract the other mutations here follow.
-    const prev: Record<string, unknown> = {}
-    const patchRecord = patch as Record<string, unknown>
-    const record = b as unknown as Record<string, unknown>
-    for (const key of Object.keys(patch)) prev[key] = record[key]
-    Object.assign(b, patch) // optimistic
-    try {
-      upsert(await api.updateBlock(useWorkspaceStore().requireId(), id, patch))
-    } catch (e) {
-      // Re-resolve the block: a live event may have replaced its object reference (`upsert`
-      // swaps in a fresh one) while the write was in flight, so `b` can be stale. Only revert
-      // fields that still hold OUR optimistic value, so a newer server value that landed
-      // mid-flight isn't clobbered by the rollback.
-      const cur = getBlock(id) as unknown as Record<string, unknown> | undefined
-      if (cur) {
-        for (const key of Object.keys(patch)) {
-          if (cur[key] === patchRecord[key]) cur[key] = prev[key]
-        }
-      }
-      toast.add({
-        title: tr('board.toast.updateFailed'),
-        description: e instanceof Error ? e.message : String(e),
-        icon: 'i-lucide-triangle-alert',
-        color: 'error',
-      })
-    }
-  }
-
-  /**
-   * Toggle a dependency edge target -> source (target dependsOn source). The backend
-   * rejects an edge that would close a cycle (422) — surface that as a toast rather than
-   * letting it throw unhandled out of a board gesture.
-   */
-  async function toggleDependency(targetId: string, sourceId: string) {
-    if (targetId === sourceId || !getBlock(targetId)) return
-    try {
-      upsert(await api.toggleDependency(useWorkspaceStore().requireId(), targetId, { sourceId }))
-    } catch (e) {
-      toast.add({
-        title: tr('board.toast.linkFailed'),
-        description: e instanceof Error ? e.message : String(e),
-        icon: 'i-lucide-triangle-alert',
-        color: 'error',
-      })
-    }
-  }
-
-  /** Remove a dependency edge target -> source if it exists. */
-  async function removeDependency(targetId: string, sourceId: string) {
-    const t = getBlock(targetId)
-    if (!t || !t.dependsOn.includes(sourceId)) return
-    // the backend exposes a single toggle; the edge exists, so toggling removes it
-    try {
-      upsert(await api.toggleDependency(useWorkspaceStore().requireId(), targetId, { sourceId }))
-    } catch (e) {
-      // Mirror `toggleDependency`: a failure must surface (and leave the edge visible) rather
-      // than rejecting unhandled with no feedback.
-      toast.add({
-        title: tr('board.toast.unlinkFailed'),
-        description: e instanceof Error ? e.message : String(e),
-        icon: 'i-lucide-triangle-alert',
-        color: 'error',
-      })
-    }
-  }
+  // The write operations, split into cohesive factories sharing the state above (a size-only
+  // extraction — behaviour is identical to the former in-closure functions). `undoRemove` stays
+  // internal to the removal factory (only its delete toast wires it), so it is NOT re-exported.
+  const context = { blocks, getBlock, upsert, pendingRemovals, pendingDoomed, api, toast, tr }
+  const mutations = createBoardMutations(context)
+  const { detach, reattach, removeBlock } = createBoardRemoval(context)
 
   return {
     blocks,
@@ -645,22 +151,9 @@ export const useBoardStore = defineStore('board', () => {
     hydrateArchived,
     upsert,
     ...queries,
-    addBlock,
-    addServiceFromRepo,
-    addTask,
-    addModule,
-    addEpic,
-    assignToEpic,
-    reparentBlock,
+    ...mutations,
     detach,
     reattach,
     removeBlock,
-    archiveService,
-    restoreService,
-    previewMove,
-    moveBlock,
-    updateBlock,
-    toggleDependency,
-    removeDependency,
   }
 })

package/package.json

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