@cat-factory/app 0.6.0

package/app/stores/board.spec.ts

@@ -0,0 +1,205 @@
+import { describe, it, expect, beforeEach } from 'vitest'
+import type { Block, BlockStatus } from '~/types/domain'
+import { useBoardStore } from '~/stores/board'
+
+/** Minimal Block factory — only the fields the read getters care about. */
+function block(id: string, over: Partial<Block> = {}): Block {
+  return {
+    id,
+    title: id,
+    type: 'service',
+    description: '',
+    position: { x: 0, y: 0 },
+    status: 'planned',
+    progress: 0,
+    dependsOn: [],
+    executionId: null,
+    level: 'frame',
+    parentId: null,
+    ...over,
+  }
+}
+
+const frame = (id: string, over: Partial<Block> = {}) => block(id, { level: 'frame', ...over })
+const moduleBlock = (id: string, parentId: string, over: Partial<Block> = {}) =>
+  block(id, { level: 'module', parentId, ...over })
+const task = (id: string, parentId: string, over: Partial<Block> = {}) =>
+  block(id, { level: 'task', parentId, ...over })
+
+describe('board store read getters', () => {
+  let store: ReturnType<typeof useBoardStore>
+  beforeEach(() => {
+    store = useBoardStore()
+  })
+
+  it('byId / getBlock index blocks by id', () => {
+    store.hydrate([frame('f1'), task('t1', 'f1')])
+    expect(store.getBlock('f1')?.id).toBe('f1')
+    expect(store.getBlock('t1')?.level).toBe('task')
+    expect(store.getBlock('missing')).toBeUndefined()
+  })
+
+  it('frames returns only top-level blocks (level absent defaults to frame)', () => {
+    const legacy = block('legacy')
+    // @ts-expect-error simulate legacy/persisted data without a level
+    delete legacy.level
+    store.hydrate([frame('f1'), moduleBlock('m1', 'f1'), task('t1', 'f1'), legacy])
+    expect(store.frames.map((b) => b.id).sort()).toEqual(['f1', 'legacy'])
+  })
+
+  it('allTasks returns every task across the board', () => {
+    store.hydrate([frame('f1'), task('t1', 'f1'), moduleBlock('m1', 'f1'), task('t2', 'm1')])
+    expect(store.allTasks.map((b) => b.id).sort()).toEqual(['t1', 't2'])
+  })
+
+  it('childrenOf / tasksOf / modulesOf filter by parent and level', () => {
+    store.hydrate([frame('f1'), moduleBlock('m1', 'f1'), task('t1', 'f1'), task('t2', 'm1')])
+    expect(
+      store
+        .childrenOf('f1')
+        .map((b) => b.id)
+        .sort(),
+    ).toEqual(['m1', 't1'])
+    expect(store.tasksOf('f1').map((b) => b.id)).toEqual(['t1'])
+    expect(store.modulesOf('f1').map((b) => b.id)).toEqual(['m1'])
+    expect(store.tasksOf('m1').map((b) => b.id)).toEqual(['t2'])
+  })
+
+  it('allTasksUnder includes direct tasks and tasks nested in modules', () => {
+    store.hydrate([
+      frame('f1'),
+      task('t1', 'f1'),
+      moduleBlock('m1', 'f1'),
+      task('t2', 'm1'),
+      task('t3', 'm1'),
+    ])
+    expect(
+      store
+        .allTasksUnder('f1')
+        .map((b) => b.id)
+        .sort(),
+    ).toEqual(['t1', 't2', 't3'])
+    expect(
+      store
+        .allTasksUnder('m1')
+        .map((b) => b.id)
+        .sort(),
+    ).toEqual(['t2', 't3'])
+  })
+
+  it('serviceOf walks up to the owning top-level frame', () => {
+    store.hydrate([frame('f1'), moduleBlock('m1', 'f1'), task('t1', 'm1'), task('t2', 'f1')])
+    expect(store.serviceOf(store.getBlock('t1')!)?.id).toBe('f1')
+    expect(store.serviceOf(store.getBlock('t2')!)?.id).toBe('f1')
+    expect(store.serviceOf(store.getBlock('m1')!)?.id).toBe('f1')
+    expect(store.serviceOf(store.getBlock('f1')!)?.id).toBe('f1')
+  })
+
+  describe('dependencies', () => {
+    const status = (s: BlockStatus) => ({ status: s })
+    beforeEach(() => {
+      store.hydrate([
+        frame('f1'),
+        task('done', 'f1', status('done')),
+        task('open', 'f1', status('in_progress')),
+        task('t', 'f1', { dependsOn: ['done', 'open', 'ghost'] }),
+      ])
+    })
+
+    it('unmetDeps lists existing dependencies that are not done', () => {
+      expect(store.unmetDeps('t').map((b) => b.id)).toEqual(['open'])
+    })
+
+    it('isRunnable is true only when no dependency is outstanding', () => {
+      expect(store.isRunnable('t')).toBe(false)
+      expect(store.isRunnable('done')).toBe(true)
+    })
+  })
+
+  describe('frameStatus', () => {
+    const seed = (...statuses: BlockStatus[]) =>
+      store.hydrate([frame('f1'), ...statuses.map((s, i) => task(`t${i}`, 'f1', { status: s }))])
+
+    it('is planned when there are no tasks', () => {
+      store.hydrate([frame('f1')])
+      expect(store.frameStatus('f1')).toBe('planned')
+    })
+
+    it('is blocked when any task is blocked (highest priority)', () => {
+      seed('done', 'in_progress', 'blocked')
+      expect(store.frameStatus('f1')).toBe('blocked')
+    })
+
+    it('is in_progress when a task is running or has an open PR', () => {
+      seed('done', 'pr_ready')
+      expect(store.frameStatus('f1')).toBe('in_progress')
+      seed('ready', 'in_progress')
+      expect(store.frameStatus('f1')).toBe('in_progress')
+    })
+
+    it('is ready when there are tasks but none active', () => {
+      seed('done', 'ready')
+      expect(store.frameStatus('f1')).toBe('ready')
+    })
+  })
+
+  describe('frameProgress', () => {
+    it("falls back to the frame's own progress when it has no tasks", () => {
+      store.hydrate([frame('f1', { progress: 0.42 })])
+      expect(store.frameProgress('f1')).toBe(0.42)
+    })
+
+    it('averages task progress, counting done as 1', () => {
+      store.hydrate([
+        frame('f1'),
+        task('t1', 'f1', { status: 'done', progress: 0 }),
+        task('t2', 'f1', { status: 'in_progress', progress: 0.5 }),
+      ])
+      expect(store.frameProgress('f1')).toBeCloseTo(0.75)
+    })
+  })
+
+  describe('containerSize', () => {
+    it('returns base dimensions for an empty service', () => {
+      store.hydrate([frame('f1')])
+      expect(store.containerSize('f1')).toEqual({ w: 360, h: 220 })
+    })
+
+    it('grows to fit a task and adds the module header height for modules', () => {
+      store.hydrate([
+        frame('f1'),
+        moduleBlock('m1', 'f1', { position: { x: 0, y: 0 } }),
+        task('t1', 'm1', { position: { x: 300, y: 200 } }),
+      ])
+      // module inner width/height fit the task, plus the 30px module header.
+      const size = store.containerSize('m1')
+      expect(size.w).toBe(300 + 180 + 12)
+      expect(size.h).toBe(200 + 160 + 12 + 30)
+    })
+
+    it('expands a service to enclose its nested modules', () => {
+      store.hydrate([frame('f1'), moduleBlock('m1', 'f1', { position: { x: 400, y: 300 } })])
+      const mod = store.containerSize('m1')
+      const svc = store.containerSize('f1')
+      expect(svc.w).toBe(400 + mod.w + 12)
+      expect(svc.h).toBe(300 + mod.h + 12)
+    })
+  })
+
+  it('previewMove updates a block position locally without persisting', () => {
+    store.hydrate([frame('f1'), task('t1', 'f1', { position: { x: 0, y: 0 } })])
+    store.previewMove('t1', { x: 120, y: 40 })
+    expect(store.getBlock('t1')?.position).toEqual({ x: 120, y: 40 })
+    // a no-op for unknown ids (no throw)
+    expect(() => store.previewMove('missing', { x: 1, y: 1 })).not.toThrow()
+  })
+
+  it('hydrate replaces and upsert inserts/updates cached blocks', () => {
+    store.hydrate([frame('f1')])
+    store.upsert(task('t1', 'f1', { title: 'first' }))
+    expect(store.getBlock('t1')?.title).toBe('first')
+    store.upsert(task('t1', 'f1', { title: 'second' }))
+    expect(store.getBlock('t1')?.title).toBe('second')
+    expect(store.allTasks).toHaveLength(1)
+  })
+})

package/app/stores/board.ts

@@ -0,0 +1,286 @@
+import { defineStore } from 'pinia'
+import { ref } from 'vue'
+import type { Block, BlockType, CreateTaskType, TaskTypeFields } from '~/types/domain'
+import { useServicesStore } from '~/stores/services'
+import { useWorkspaceStore } from '~/stores/workspace'
+import { useBlockQueries } from '~/composables/useBlockQueries'
+
+/**
+ * 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.
+ */
+/** 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` lost an edge to a removed block (originals to restore). */
+  edges: { id: string; dependsOn: string[] }[]
+}
+
+export const useBoardStore = defineStore('board', () => {
+  const api = useApi()
+  const toast = useToast()
+  const blocks = ref<Block[]>([])
+
+  // Pure derivations (hierarchy, status/progress, sizing) live in the composable.
+  const queries = useBlockQueries(blocks)
+  const { getBlock } = queries
+
+  /** Replace the cached blocks with a server snapshot. */
+  function hydrate(next: Block[]) {
+    blocks.value = next
+  }
+
+  /** Insert or replace a block returned by the backend. */
+  function upsert(block: Block) {
+    const i = blocks.value.findIndex((b) => b.id === block.id)
+    if (i >= 0) blocks.value[i] = block
+    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.
+   */
+  async function addServiceFromRepo(
+    repoGithubId: number,
+    opts?: { directory?: string; isMonorepo?: boolean },
+  ): Promise<Block> {
+    const block = await api.addServiceFromRepo(useWorkspaceStore().requireId(), {
+      repoGithubId,
+      ...(opts?.directory ? { directory: opts.directory } : {}),
+      ...(opts?.isMonorepo !== undefined ? { isMonorepo: opts.isMonorepo } : {}),
+    })
+    upsert(block)
+    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
+      mergePresetId?: string
+      pipelineId?: string
+      agentConfig?: Record<string, string>
+    },
+  ): 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?.mergePresetId ? { mergePresetId: options.mergePresetId } : {}),
+      ...(options?.pipelineId ? { pipelineId: options.pipelineId } : {}),
+      ...(options?.agentConfig ? { agentConfig: options.agentConfig } : {}),
+    })
+    upsert(block)
+    return block
+  }
+
+  /** 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. */
+  async function reparentBlock(
+    id: string,
+    newParentId: string,
+    position: { x: number; y: number },
+  ) {
+    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
+    b.parentId = newParentId
+    b.position = position
+    try {
+      upsert(
+        await api.reparentBlock(useWorkspaceStore().requireId(), id, {
+          parentId: newParentId,
+          position,
+        }),
+      )
+    } catch (e) {
+      b.parentId = prevParentId
+      b.position = prevPosition
+      toast.add({
+        title: 'Could not move',
+        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 lose that edge — snapshot the originals.
+    const edges = blocks.value
+      .filter((b) => !doomed.has(b.id) && b.dependsOn.some((d) => doomed.has(d)))
+      .map((b) => ({ id: b.id, dependsOn: [...b.dependsOn] }))
+    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))
+      }
+    }
+    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)
+    for (const e of snap.edges) {
+      const b = getBlock(e.id)
+      if (b) b.dependsOn = e.dependsOn
+    }
+  }
+
+  /**
+   * Delete a block. The subtree is hidden IMMEDIATELY (optimistic) so the board
+   * feels instant; if the backend rejects the delete we put it back and surface a
+   * toast rather than silently leaving a ghost.
+   */
+  async function removeBlock(id: string) {
+    const snap = detach(id)
+    if (!snap) return
+    try {
+      await api.removeBlock(useWorkspaceStore().requireId(), id)
+    } catch (e) {
+      reattach(snap)
+      toast.add({
+        title: 'Could not delete',
+        description: e instanceof Error ? e.message : String(e),
+        icon: 'i-lucide-triangle-alert',
+        color: 'error',
+      })
+    }
+  }
+
+  /**
+   * 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
+    b.position = position // optimistic: keep the drag feeling instant
+    // 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 }))
+  }
+
+  /** Patch the user-editable fields of a block (title, features, threshold…). */
+  async function updateBlock(id: string, patch: Partial<Block>) {
+    const b = getBlock(id)
+    if (!b) return
+    Object.assign(b, patch) // optimistic
+    upsert(await api.updateBlock(useWorkspaceStore().requireId(), id, patch))
+  }
+
+  /** Toggle a dependency edge target -> source (target dependsOn source). */
+  async function toggleDependency(targetId: string, sourceId: string) {
+    if (targetId === sourceId || !getBlock(targetId)) return
+    upsert(await api.toggleDependency(useWorkspaceStore().requireId(), targetId, { sourceId }))
+  }
+
+  /** 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
+    upsert(await api.toggleDependency(useWorkspaceStore().requireId(), targetId, { sourceId }))
+  }
+
+  return {
+    blocks,
+    hydrate,
+    upsert,
+    ...queries,
+    addBlock,
+    addServiceFromRepo,
+    addTask,
+    addModule,
+    reparentBlock,
+    detach,
+    reattach,
+    removeBlock,
+    previewMove,
+    moveBlock,
+    updateBlock,
+    toggleDependency,
+    removeDependency,
+  }
+})

package/app/stores/bootstrap.ts

@@ -0,0 +1,97 @@
+import { defineStore } from 'pinia'
+import { computed, ref } from 'vue'
+import type {
+  BootstrapRepoInput,
+  CreateReferenceArchitectureInput,
+  ReferenceArchitecture,
+  UpdateReferenceArchitectureInput,
+} from '~/types/domain'
+import { useWorkspaceStore } from '~/stores/workspace'
+import { useAgentRunsStore } from '~/stores/agentRuns'
+
+/**
+ * Repo-bootstrap state: the workspace's managed reference architectures, plus the
+ * actions that CRUD the bases and launch a "bootstrap repo" run. Per-workspace,
+ * like the board itself; nothing is persisted client-side. `available` mirrors
+ * whether the bootstrap module is reachable (CRUD always is); a run may still come
+ * back 503 when the GitHub + container machinery is not configured, which the
+ * caller surfaces as an error.
+ *
+ * The runs themselves (status, progress, failure + retry) now live in the unified
+ * {@link useAgentRunsStore}, shared with task executions — this store only owns the
+ * managed bases and the launch action.
+ */
+export const useBootstrapStore = defineStore('bootstrap', () => {
+  const api = useApi()
+  const workspace = useWorkspaceStore()
+
+  /** null = unknown (not probed yet), true/false = module reachable or not. */
+  const available = ref<boolean | null>(null)
+  const architectures = ref<ReferenceArchitecture[]>([])
+  const loading = ref(false)
+
+  const hasArchitectures = computed(() => architectures.value.length > 0)
+
+  /** Load reference architectures; resolves `available`. */
+  async function load() {
+    if (!workspace.workspaceId) return
+    loading.value = true
+    try {
+      architectures.value = await api.listReferenceArchitectures(workspace.requireId())
+      available.value = true
+    } catch {
+      // 503 (module disabled) or any error → hide the UI entry points.
+      available.value = false
+    } finally {
+      loading.value = false
+    }
+  }
+
+  /** Register a new reference architecture. */
+  async function createArchitecture(input: CreateReferenceArchitectureInput) {
+    const created = await api.createReferenceArchitecture(workspace.requireId(), input)
+    architectures.value.unshift(created)
+    return created
+  }
+
+  /** Patch a reference architecture. */
+  async function updateArchitecture(id: string, input: UpdateReferenceArchitectureInput) {
+    const updated = await api.updateReferenceArchitecture(workspace.requireId(), id, input)
+    const i = architectures.value.findIndex((a) => a.id === id)
+    if (i >= 0) architectures.value[i] = updated
+    return updated
+  }
+
+  /** Remove a reference architecture. */
+  async function deleteArchitecture(id: string) {
+    await api.deleteReferenceArchitecture(workspace.requireId(), id)
+    architectures.value = architectures.value.filter((a) => a.id !== id)
+  }
+
+  /**
+   * Kick off a "bootstrap repo" run. Returns immediately with the `running` job —
+   * the container keeps working in the background; the provisional service frame
+   * already shows on the board and live progress arrives over the event stream.
+   * The run is recorded in {@link useAgentRunsStore} so its card appears at once.
+   */
+  async function bootstrap(input: BootstrapRepoInput) {
+    const job = await api.bootstrapRepo(workspace.requireId(), input)
+    useAgentRunsStore().upsertBootstrap(job)
+    // The new run materialised a provisional frame server-side; pull it onto the
+    // board now so the card appears even before the first event arrives.
+    await workspace.refresh()
+    return job
+  }
+
+  return {
+    available,
+    architectures,
+    loading,
+    hasArchitectures,
+    load,
+    createArchitecture,
+    updateArchitecture,
+    deleteArchitecture,
+    bootstrap,
+  }
+})