@cat-factory/app 0.237.0 → 0.238.0

package/app/composables/useContainerTargets.spec.ts

@@ -0,0 +1,112 @@
+import { describe, expect, it } from 'vitest'
+import { nextTick, ref } from 'vue'
+import type { Block } from '~/types/domain'
+import { useBoardStore } from '~/stores/board'
+import { useContainerTargets } from '~/composables/useContainerTargets'
+
+/**
+ * Where the frame-header authoring surfaces create. Two properties matter and only one of them is
+ * about the happy path: the frame a surface was opened from narrows the choice to that service
+ * WITHOUT removing its modules as targets, and the answer follows a live board, because the frame
+ * can be deleted (by another member, over the socket) while the surface sits open.
+ */
+const block = (over: Partial<Block> & Pick<Block, 'id' | 'level' | 'title'>): Block =>
+  ({ parentId: null, ...over }) as Block
+
+/** A board with two services, one of which has modules, plus a task (never a container). */
+function seedBoard(): void {
+  useBoardStore().blocks = [
+    block({ id: 'f_auth', level: 'frame', title: 'Auth' }),
+    block({ id: 'm_login', level: 'module', title: 'Login', parentId: 'f_auth' }),
+    block({ id: 'm_tokens', level: 'module', title: 'Tokens', parentId: 'f_auth' }),
+    block({ id: 'f_billing', level: 'frame', title: 'Billing' }),
+    block({ id: 't_1', level: 'task', title: 'A task', parentId: 'f_billing' }),
+  ]
+}
+
+describe('useContainerTargets', () => {
+  it('scopes to the opening frame and its modules, keeping the module as a target', () => {
+    seedBoard()
+    const { items, containerId, stated, pinned, reset } = useContainerTargets(() => 'f_auth')
+    reset()
+    // The button that opened this names the service, so the modules need no parent prefix.
+    expect(items.value).toEqual([
+      { label: 'Auth', value: 'f_auth' },
+      { label: 'Login', value: 'm_login' },
+      { label: 'Tokens', value: 'm_tokens' },
+    ])
+    expect(pinned.value?.id).toBe('f_auth')
+    // A frame with modules did NOT answer frame-or-which-module, so the picker still asks,
+    // preselected to the frame itself.
+    expect(stated.value).toBe(false)
+    expect(containerId.value).toBe('f_auth')
+  })
+
+  it('states the target rather than asking when the opening frame has no modules', () => {
+    seedBoard()
+    const { items, containerId, stated, reset } = useContainerTargets(() => 'f_billing')
+    reset()
+    expect(items.value).toEqual([{ label: 'Billing', value: 'f_billing' }])
+    expect(stated.value).toBe(true)
+    expect(containerId.value).toBe('f_billing')
+  })
+
+  it('offers every container on the board, parent-labelled, when opened standalone', () => {
+    seedBoard()
+    const { items, stated, reset } = useContainerTargets(() => null)
+    reset()
+    expect(items.value).toEqual([
+      { label: 'Auth', value: 'f_auth' },
+      { label: 'Auth › Login', value: 'm_login' },
+      { label: 'Auth › Tokens', value: 'm_tokens' },
+      { label: 'Billing', value: 'f_billing' },
+    ])
+    expect(stated.value).toBe(false)
+  })
+
+  // The finding this composable exists for: an id is not evidence the block is still there, so the
+  // surface widens back to the whole board AND re-derives its selection. Leaving the selection
+  // behind is the silent half: the picker renders unselected while the search under it stays scoped
+  // to the deleted frame and the create lands on an id the board no longer has.
+  it('widens and re-selects when the opening frame is deleted underneath it', async () => {
+    seedBoard()
+    const openedFrom = ref<string | null>('f_auth')
+    const { items, containerId, stated, pinned } = useContainerTargets(() => openedFrom.value)
+    containerId.value = 'm_login'
+
+    const board = useBoardStore()
+    board.blocks = board.blocks.filter((b) => !['f_auth', 'm_login', 'm_tokens'].includes(b.id))
+    await nextTick()
+
+    expect(pinned.value).toBeUndefined()
+    expect(stated.value).toBe(false)
+    expect(items.value).toEqual([{ label: 'Billing', value: 'f_billing' }])
+    expect(containerId.value).toBe('f_billing')
+  })
+
+  it('keeps a still-legal selection when a sibling module is added', async () => {
+    seedBoard()
+    const { containerId } = useContainerTargets(() => 'f_auth')
+    containerId.value = 'm_login'
+
+    const board = useBoardStore()
+    board.blocks = [
+      ...board.blocks,
+      block({ id: 'm_sessions', level: 'module', title: 'Sessions', parentId: 'f_auth' }),
+    ]
+    await nextTick()
+
+    expect(containerId.value).toBe('m_login')
+  })
+
+  // A block id that resolves to something no task can live in is the same fact as an id that
+  // resolves to nothing: the surface has no frame behind it and must not pin to one.
+  it('ignores an opening id that is not a legal container', () => {
+    seedBoard()
+    const { pinned, items, reset, containerId } = useContainerTargets(() => 't_1')
+    reset()
+    expect(pinned.value).toBeUndefined()
+    expect(items.value).toHaveLength(4)
+    expect(containerId.value).toBe('f_auth')
+  })
+})

package/app/composables/useContainerTargets.ts

@@ -0,0 +1,62 @@
+import { computed, ref, watch, type Ref } from 'vue'
+import type { Block } from '~/types/domain'
+import { useBoardStore } from '~/stores/board'
+import {
+  containerTargets,
+  isTaskContainer,
+  reconcileContainer,
+  type ContainerTarget,
+} from '~/utils/containerTargets'
+
+/**
+ * Where a board-authoring surface creates, tracking a live board.
+ *
+ * `openedFrom` is the frame id the surface was opened WITH, and is resolved through the board on
+ * every read rather than trusted: an id alone cannot say whether the block still exists or was ever
+ * a legal container. When it resolves and the frame holds no modules there is exactly one answer,
+ * so `stated` is true and the caller renders a line naming it instead of a picker asking a question
+ * the header button already answered. A frame WITH modules did not answer it, so the picker stays,
+ * scoped to that frame.
+ *
+ * Shared by `<TaskImportModal>` and `<BugHuntModal>`, which are opened from the same two frame
+ * header buttons with the same payload: as two copies they disagreed about whether the frame was
+ * the answer or the question.
+ */
+export function useContainerTargets(openedFrom: () => string | null | undefined): {
+  /** The frame or module the surface was opened from, while the board still holds it. */
+  pinned: Ref<Block | undefined>
+  items: Ref<ContainerTarget[]>
+  containerId: Ref<string | undefined>
+  /** One legal target, so the surface states where the work lands rather than asking. */
+  stated: Ref<boolean>
+  /** Re-seed the selection; the caller invokes this when the surface opens. */
+  reset: () => void
+} {
+  const board = useBoardStore()
+
+  const pinned = computed<Block | undefined>(() => {
+    const id = openedFrom()
+    const block = id ? board.getBlock(id) : undefined
+    return isTaskContainer(block) ? block : undefined
+  })
+
+  const items = computed(() => containerTargets(board.blocks, pinned.value))
+
+  const containerId = ref<string | undefined>(undefined)
+
+  function reset() {
+    containerId.value = reconcileContainer(items.value, pinned.value?.id)
+  }
+
+  // The board is live, so what is on offer moves under the open surface: a deleted frame, a new
+  // module. Watching the TARGETS rather than seeding once is what keeps the selection legal, and
+  // it is the reason the pinned frame is re-resolved on every read instead of captured on open.
+  watch(items, (next) => {
+    const resolved = reconcileContainer(next, containerId.value)
+    if (resolved !== containerId.value) containerId.value = resolved
+  })
+
+  const stated = computed(() => !!pinned.value && items.value.length === 1)
+
+  return { pinned, items, containerId, stated, reset }
+}

package/app/stores/ui/navigation.ts

@@ -3,10 +3,14 @@ import type { LodLevel } from '~/types/domain'
 import { zoomToLod } from '~/composables/useSemanticZoom'
 
 /**
- * The board-navigation slice of the UI store: selection / focus, canvas zoom + the derived
- * level-of-detail, and the (retained) expanded-frame set. Hot paths (zoom/pan/select) live here,
- * isolated from the modal + result-view state, per refactoring candidate #4. Composed into
- * {@link useUiStore}; the returned refs/actions keep their names, so consumers are unchanged.
+ * The board-navigation slice of the UI store: selection / focus, and canvas zoom plus the derived
+ * level-of-detail. Hot paths (zoom/pan/select) live here, isolated from the modal + result-view
+ * state, per refactoring candidate #4. Composed into {@link useUiStore}; the returned refs/actions
+ * keep their names, so consumers are unchanged.
+ *
+ * There is deliberately no per-frame expanded/collapsed state: a service is always expanded to its
+ * task canvas, at every zoom level, so the board layout is fixed. The set that used to hold it
+ * outlived the last branch that read it and went with them.
  */
 export function createUiNavigation() {
   const selectedBlockId = ref<string | null>(null)
@@ -17,29 +21,6 @@ export function createUiNavigation() {
 
   const lod = computed<LodLevel>(() => zoomToLod(zoom.value))
 
-  /** Frames the user has manually expanded to reveal their tasks. */
-  const expandedFrames = ref<Set<string>>(new Set())
-
-  function toggleFrame(id: string) {
-    const next = new Set(expandedFrames.value)
-    if (next.has(id)) next.delete(id)
-    else next.add(id)
-    expandedFrames.value = next
-  }
-
-  function expandFrame(id: string) {
-    if (expandedFrames.value.has(id)) return
-    expandedFrames.value = new Set(expandedFrames.value).add(id)
-  }
-
-  /** Services are always expanded to their task canvas, at every zoom level, so the
-   * board layout is fixed: panning never changes it and zooming has no expand/collapse
-   * transition to snap on. (`expandedFrames`/`toggleFrame` are retained for callers but
-   * no longer gate rendering.) */
-  function isFrameExpanded(_id: string) {
-    return true
-  }
-
   function select(id: string | null) {
     selectedBlockId.value = id
   }
@@ -53,10 +34,6 @@ export function createUiNavigation() {
     focusBlockId,
     zoom,
     lod,
-    expandedFrames,
-    toggleFrame,
-    expandFrame,
-    isFrameExpanded,
     select,
     focus,
   }

package/app/types/toolServers.ts

@@ -6,6 +6,8 @@
 // member added on one side only renders as a blank chip rather than failing to compile.
 
 export type {
+  StepToolServers,
+  ToolServerUnavailableReason,
   ToolServerAllowedToolsCheck,
   ToolServerCredential,
   ToolServerNotProbeableReason,

package/app/utils/containerTargets.ts

@@ -0,0 +1,71 @@
+/**
+ * Where a board-authoring surface creates: the containers a new task may land in, and how that
+ * answer follows a live board.
+ *
+ * Pure so the reconcile below can be pinned by a unit test. `<TaskImportModal>` and
+ * `<BugHuntModal>` ask the same two-part question (a source to read, a container to land in) and
+ * are opened from the same frame-header buttons, so both read this through
+ * {@link useContainerTargets} rather than each carrying its own copy.
+ */
+import type { Block } from '~/types/domain'
+
+/** A container offered as a select item. */
+export interface ContainerTarget {
+  label: string
+  value: string
+}
+
+/** Only a service frame or one of its modules can hold a task. */
+export function isTaskContainer(block: Block | undefined): block is Block {
+  return !!block && (block.level === 'frame' || block.level === 'module')
+}
+
+/**
+ * The containers on offer, given the frame the surface was opened from (if any).
+ *
+ * Opened from a service frame the answer is SCOPED to that frame: the frame itself plus its
+ * modules, each labelled by its own title because the frame is already named on the surface. The
+ * frame settles WHICH SERVICE the work belongs to, which is the part a header button can answer;
+ * it does not settle frame-or-which-module, so a frame that has modules still owes the user a
+ * choice. Opened standalone there is no frame behind it, so every container on the board is a
+ * candidate and a module carries its parent's title to keep the choice unambiguous.
+ *
+ * `pinned` is resolved through the board by the caller rather than trusted as an id, so a frame
+ * deleted while the surface sat open widens back to the whole board instead of scoping to
+ * something nothing can be created in.
+ */
+export function containerTargets(
+  blocks: readonly Block[],
+  pinned: Block | undefined,
+): ContainerTarget[] {
+  if (pinned) {
+    // Modules cannot nest, so a pinned module is already the only answer.
+    if (pinned.level === 'module') return [{ label: pinned.title, value: pinned.id }]
+    const modules = blocks.filter((b) => b.level === 'module' && b.parentId === pinned.id)
+    return [pinned, ...modules].map((b) => ({ label: b.title, value: b.id }))
+  }
+  const byId = new Map(blocks.map((b) => [b.id, b]))
+  return blocks.filter(isTaskContainer).map((b) => ({
+    label:
+      b.level === 'module' ? `${byId.get(b.parentId ?? '')?.title ?? '?'} › ${b.title}` : b.title,
+    value: b.id,
+  }))
+}
+
+/**
+ * The container a surface should hold as the board changes underneath it: the current selection
+ * while it is still on offer, else the first one that is.
+ *
+ * Needed because "where does this land" is answered once, when the surface opens, and the board is
+ * live: the frame it was opened from can be deleted, or a module added to it, while it sits there.
+ * A selection left pointing at a deleted block is the worst of the three states, because nothing
+ * looks wrong: the picker renders with nothing selected while the issue search under it is still
+ * scoped to the block that is gone, and the create lands on an id the board no longer has.
+ */
+export function reconcileContainer(
+  targets: readonly ContainerTarget[],
+  selected: string | undefined,
+): string | undefined {
+  if (selected && targets.some((t) => t.value === selected)) return selected
+  return targets[0]?.value
+}

package/app/utils/sourcePicker.spec.ts

@@ -0,0 +1,258 @@
+import { describe, it, expect, vi } from 'vitest'
+import {
+  buildConnectionSourceChoices,
+  buildSourceChoices,
+  connectableSources,
+  menuIsPickable,
+  reconcileSource,
+  sourceMenuItems,
+} from './sourcePicker'
+import type { TaskSourceState } from '~/types/domain'
+
+/**
+ * The pure source-selection behind `<ContextIssuePicker>`, `<BugHuntModal>` and
+ * `<ContextDocumentPicker>`. Pins what the always-visible selector promises: the source in use is
+ * named even when it is the only one, a source the workspace hasn't got yet is offered as something
+ * to ADD (worded for its actual state), a menu with nothing to decide is not dressed as a control,
+ * and the selection stays valid as the offered set changes underneath it.
+ */
+const state = (source: string, { available = true, enabled = true } = {}): TaskSourceState =>
+  ({
+    source,
+    label: source.toUpperCase(),
+    icon: `i-lucide-${source}`,
+    available,
+    enabled,
+    credentialFields: [],
+    refLabel: '',
+    refPlaceholder: '',
+  }) as unknown as TaskSourceState
+
+describe('buildSourceChoices', () => {
+  it('lists a single offered tracker, marked active (the selector is never hidden)', () => {
+    const groups = buildSourceChoices([state('github')], 'github')
+    expect(groups).toEqual([
+      [
+        {
+          action: 'select',
+          source: 'github',
+          label: 'GITHUB',
+          icon: 'i-lucide-github',
+          active: true,
+        },
+      ],
+    ])
+  })
+
+  it('marks only the selected tracker active', () => {
+    const [offered] = buildSourceChoices([state('github'), state('jira')], 'jira')
+    expect(offered!.map((c) => [c.source, 'active' in c && c.active])).toEqual([
+      ['github', false],
+      ['jira', true],
+    ])
+  })
+
+  it('offers an unavailable tracker as `connect` and an available-but-off one as `enable`', () => {
+    const [, addable] = buildSourceChoices(
+      [state('github'), state('jira', { available: false }), state('linear', { enabled: false })],
+      'github',
+    )
+    expect(addable).toEqual([
+      { action: 'connect', source: 'jira', label: 'JIRA', icon: 'i-lucide-jira' },
+      { action: 'enable', source: 'linear', label: 'LINEAR', icon: 'i-lucide-linear' },
+    ])
+  })
+
+  // What a surface's "nothing connected yet" state renders its add buttons from: it flattens
+  // the groups, so every choice there has to be addable. A `select` leaking through would
+  // offer to connect a tracker the workspace already has.
+  it('yields only addable choices when the workspace offers no tracker', () => {
+    const choices = buildSourceChoices(
+      [state('jira', { available: false }), state('linear', { enabled: false })],
+      undefined,
+    ).flat()
+    expect(choices.map((c) => c.action)).toEqual(['connect', 'enable'])
+  })
+
+  it('drops empty groups so the menu renders no stray separator', () => {
+    expect(buildSourceChoices([state('github')], 'github')).toHaveLength(1)
+    expect(buildSourceChoices([state('jira', { available: false })], undefined)).toHaveLength(1)
+    expect(buildSourceChoices([], undefined)).toEqual([])
+  })
+})
+
+describe('connectableSources', () => {
+  const sources = [
+    { source: 'github', label: 'GitHub', icon: 'i-lucide-github' },
+    { source: 'confluence', label: 'Confluence', icon: 'i-lucide-file-text' },
+  ]
+  const isConnected = (source: string) => source === 'github'
+
+  it('offers only the sources the workspace has not connected', () => {
+    const rows = connectableSources(sources, { isConnected, canConnect: true, available: true })
+    expect(rows.map((s) => s.source)).toEqual(['confluence'])
+  })
+
+  // Connecting stores a workspace credential and stays admin-tier while attaching moved to the
+  // member tier, so a member's add tier is withheld rather than rendered into a 403.
+  it('withholds every source from a user who may not connect one', () => {
+    expect(
+      connectableSources(sources, { isConnected, canConnect: false, available: true }),
+    ).toEqual([])
+  })
+
+  // The term the three former copies of this rule disagreed about. An integration the deployment
+  // has not configured has nothing to connect TO, so it is not the same fact as "already connected"
+  // and must not rest on the store happening to clear its source list.
+  it('withholds every source when the integration is unavailable to the deployment', () => {
+    expect(
+      connectableSources(sources, { isConnected: () => false, canConnect: true, available: false }),
+    ).toEqual([])
+  })
+})
+
+describe('buildConnectionSourceChoices', () => {
+  const sources = [
+    { source: 'github', label: 'GitHub', icon: 'i-lucide-github' },
+    { source: 'confluence', label: 'Confluence', icon: 'i-lucide-file-text' },
+  ]
+  const isConnected = (source: string) => source === 'github'
+  const opts = { isConnected, canConnect: true, available: true, selected: 'github' }
+
+  it('offers the connected source and the rest as something to add', () => {
+    expect(buildConnectionSourceChoices(sources, opts)).toEqual([
+      [
+        {
+          action: 'select',
+          source: 'github',
+          label: 'GitHub',
+          icon: 'i-lucide-github',
+          active: true,
+        },
+      ],
+      [
+        {
+          action: 'connect',
+          source: 'confluence',
+          label: 'Confluence',
+          icon: 'i-lucide-file-text',
+        },
+      ],
+    ])
+  })
+
+  // No per-workspace toggle exists for these sources, so `enable` ("connected but switched off
+  // here") is a state they cannot be in. It is unrepresentable in the return TYPE, which is what
+  // stops a document surface wording an add entry as "Connect X" for a source already connected;
+  // this asserts the runtime half of that.
+  it('never words a document source as `enable`', () => {
+    const choices = buildConnectionSourceChoices(sources, {
+      ...opts,
+      isConnected: () => false,
+      selected: undefined,
+    })
+    expect(
+      choices
+        .flat()
+        .map((c) => c.action)
+        .every((action) => action === 'connect'),
+    ).toBe(true)
+  })
+
+  it('yields the connected tier alone for a member, with no add group', () => {
+    const choices = buildConnectionSourceChoices(sources, { ...opts, canConnect: false })
+    expect(choices).toHaveLength(1)
+    expect(choices[0]!.map((c) => c.source)).toEqual(['github'])
+  })
+})
+
+describe('menuIsPickable', () => {
+  // The papercut this exists for, and the one a member hits: a chevron opening a menu whose single
+  // entry re-selects what is already selected promises a choice that isn't there.
+  it('reports nothing to decide for a lone entry', () => {
+    expect(menuIsPickable([[{}]])).toBe(false)
+    expect(menuIsPickable([])).toBe(false)
+  })
+
+  it('counts across groups, so one source plus one to add IS a choice', () => {
+    expect(menuIsPickable([[{}], [{}]])).toBe(true)
+    expect(menuIsPickable([[{}, {}]])).toBe(true)
+  })
+})
+
+describe('sourceMenuItems', () => {
+  const onSelect = vi.fn()
+  const onAdd = vi.fn()
+
+  it('marks the selected source as CHECKED, not merely glyphed', () => {
+    const [offered] = sourceMenuItems(
+      buildSourceChoices([state('github'), state('jira')], 'jira'),
+      {
+        onSelect,
+        onAdd,
+        addLabel: { connect: (l) => `connect ${l}`, enable: (l) => `enable ${l}` },
+      },
+    )
+    expect(offered!.map((i) => [i.label, i.type, i.checked])).toEqual([
+      ['GITHUB', 'checkbox', false],
+      ['JIRA', 'checkbox', true],
+    ])
+  })
+
+  it('words each add entry for its own action and marks it with the plug icon', () => {
+    const [, addable] = sourceMenuItems(
+      buildSourceChoices(
+        [state('github'), state('jira', { available: false }), state('linear', { enabled: false })],
+        'github',
+      ),
+      {
+        onSelect,
+        onAdd,
+        addLabel: { connect: (l) => `connect ${l}`, enable: (l) => `enable ${l}` },
+      },
+    )
+    expect(addable!.map((i) => [i.label, i.icon])).toEqual([
+      ['connect JIRA', 'i-lucide-plug'],
+      ['enable LINEAR', 'i-lucide-plug'],
+    ])
+  })
+
+  // A connection-only menu owes ONE wording, and the type says so: passing `enable` here would not
+  // compile. That is the guard, and this pins the behaviour it guards.
+  it('takes only the `connect` wording for a connection-only menu', () => {
+    const items = sourceMenuItems(
+      buildConnectionSourceChoices(
+        [{ source: 'confluence', label: 'Confluence', icon: 'i-lucide-file-text' }],
+        { isConnected: () => false, canConnect: true, available: true, selected: undefined },
+      ),
+      { onSelect, onAdd, addLabel: { connect: (l) => `Connect ${l}` } },
+    )
+    expect(items.flat().map((i) => i.label)).toEqual(['Connect Confluence'])
+  })
+})
+
+describe('reconcileSource', () => {
+  it('selects the tracker the user just went off to connect, once it is offered', () => {
+    expect(reconcileSource(['github', 'jira'], 'github', 'jira')).toBe('jira')
+  })
+
+  it('keeps the current selection while the connect is still pending', () => {
+    expect(reconcileSource(['github'], 'github', 'jira')).toBe('github')
+  })
+
+  it('keeps a still-offered selection', () => {
+    expect(reconcileSource(['github', 'jira'], 'jira', null)).toBe('jira')
+  })
+
+  it('falls back to the first offered tracker when the selection stopped being offered', () => {
+    expect(reconcileSource(['github'], 'jira', null)).toBe('github')
+  })
+
+  it('selects the first offered tracker when nothing is selected yet', () => {
+    expect(reconcileSource(['github'], undefined, null)).toBe('github')
+  })
+
+  it('resolves to nothing when the workspace offers no tracker at all', () => {
+    expect(reconcileSource([], 'jira', 'jira')).toBeUndefined()
+  })
+})