@cat-factory/app 0.219.0 → 0.220.0

package/app/components/board/AddTaskModal.vue

@@ -35,6 +35,7 @@ import type { ReviewTargetReason } from '@cat-factory/contracts'
 import { sanitizeDescriptorFields, validateDescriptorFields } from '@cat-factory/contracts'
 import { defaultDescriptorValues } from '~/utils/descriptorFields'
 import { pipelineAllowedForManualStart } from '~/utils/pipeline'
+import { buildTaskTypePickerRows } from '~/utils/taskTypePicker'
 
 const ui = useUiStore()
 // Interface tier. In BASIC mode this form asks for the task itself (type, title,
@@ -183,15 +184,15 @@ const customFieldProblems = computed(() => {
   if (!custom || customFormPanel.value) return []
   return validateDescriptorFields(custom.fields ?? [], customFieldValues.value)
 })
-// The type picker: the built-in choices (i18n labels) + the custom types (their wire presentation).
-const typeChoices = computed<{ value: TaskTypeChoice; label: string; icon: string }[]>(() => [
-  ...TASK_TYPES.value,
-  ...customTaskTypes.value.map((tt) => ({
-    value: tt.taskType as TaskTypeChoice,
-    label: tt.presentation.label,
-    icon: tt.presentation.icon,
-  })),
-])
+// The type picker, laid out as rows (see `buildTaskTypePickerRows`): the built-in choices (i18n
+// labels) first, then the deployment's registered types under their declared `presentation.category`
+// captions, so a catalog of reusable operations reads as sections instead of one wall of buttons.
+// Only the leftovers row's heading is CHROME, so it is the one caption the layer supplies.
+const typeRows = computed(() =>
+  buildTaskTypePickerRows(TASK_TYPES.value, customTaskTypes.value, {
+    other: t('board.addTask.typeOther'),
+  }),
+)
 
 // Parse the PR-reference input into the contract fields: a bare positive integer (optionally
 // `#`-prefixed) becomes `prNumber` (a PR on the service's linked repo); anything else is taken
@@ -768,24 +769,59 @@ function openReviewFrictionDialog(conflict: NonNullable<ReturnType<typeof parseC
         </p>
 
         <UFormField :label="t('board.addTask.typeLabel')">
-          <div class="flex flex-wrap gap-1">
-            <UButton
-              v-for="ty in typeChoices"
-              :key="ty.value"
-              :color="taskType === ty.value ? 'primary' : 'neutral'"
-              :variant="taskType === ty.value ? 'soft' : 'ghost'"
-              :icon="ty.icon"
-              size="xs"
-              :data-testid="`task-type-${ty.value}`"
-              @click="
-                () => {
-                  taskType = ty.value
-                }
-              "
+          <!-- One row per picker group: the built-ins uncaptioned, then a caption per registered
+               category, then the leftovers. Category captions are deployment-authored English
+               rendered verbatim (as are the custom labels and their hover descriptions); only the
+               leftovers heading is chrome, so only it is i18n. The row gap must stay WIDER than a
+               caption's `mb-1`, or a heading sits equidistant between the group above it and its
+               own buttons and the grouping stops reading. -->
+          <div class="space-y-3">
+            <div
+              v-for="row in typeRows"
+              :key="row.id"
+              data-testid="task-type-row"
+              :data-task-type-row="row.id"
             >
-              {{ ty.label }}
-            </UButton>
+              <p
+                v-if="row.caption"
+                class="mb-1 px-1 text-[11px] font-semibold uppercase tracking-wide text-slate-500"
+                data-testid="task-type-category"
+              >
+                {{ row.caption }}
+              </p>
+              <div class="flex flex-wrap gap-1">
+                <UButton
+                  v-for="ty in row.choices"
+                  :key="ty.value"
+                  :color="taskType === ty.value ? 'primary' : 'neutral'"
+                  :variant="taskType === ty.value ? 'soft' : 'ghost'"
+                  :icon="ty.icon"
+                  size="xs"
+                  :title="ty.description"
+                  :data-testid="`task-type-${ty.value}`"
+                  @click="
+                    () => {
+                      taskType = ty.value
+                    }
+                  "
+                >
+                  {{ ty.label }}
+                </UButton>
+              </div>
+            </div>
           </div>
+
+          <!-- What the selected operation is for, in the deployment's own words, in the field's OWN
+               help slot (the `:help` seam every other field here uses) rather than a paragraph
+               beside it fighting the modal's spacing. The hover title above helps you choose; this
+               states the choice you made, which is the half a touch device can reach. Built-in
+               types carry no description (their labels are localized and their meaning is fixed),
+               so only a custom type is described here. -->
+          <template v-if="selectedCustomType?.presentation.description" #help>
+            <span data-testid="task-type-description">
+              {{ selectedCustomType.presentation.description }}
+            </span>
+          </template>
         </UFormField>
 
         <!-- Recurring tasks are configured as a schedule on the service frame. -->

package/app/docs/consumer-extensions.md

@@ -56,18 +56,18 @@ export default defineNuxtPlugin(() => {
 
 ## The landed seams
 
-| Seam                                | Slot key                  | Entry shape                                                                                      | Host                                                                      |
-| ----------------------------------- | ------------------------- | ------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------- |
-| Run-detail windows                  | `resultViews`             | `{ id: '<ns>:<name>', component }`                                                               | `StepResultViewHost` via `dispatchStepView`                               |
-| Agent kinds (palette data)          | `agentKinds`              | `{ kind, container, presentation: { label, icon, color, description, category?, resultView? } }` | agents store merge → `agentKindMeta`                                      |
-| Custom task types                   | `taskTypes`               | `{ taskType: '<ns>:<name>', presentation, fields?, defaultPipelineId?, formPanel? }`             | `AddTaskModal` picker/fields + `TaskCard` badge (via `taskTypeMeta`)      |
-| Sidebar / command-palette / toolbar | `nav`                     | `{ id, labelKey, icon, surfaces, gate?, advanced?, run, sidebar?, command?, toolbar? }`          | the three shells via `useNavContributions`                                |
-| Inspector body panels               | `inspectorPanels`         | `{ id, component, when(block), order }` (`PanelEntry<Block>`)                                    | `<PanelsOutlet>` in `InspectorPanel`                                      |
-| Top-level overlays                  | `appOverlays`             | `{ id: '<ns>:<name>', component }`                                                               | `<AppOverlayHost>` via `useAppOverlays().open(id)`                        |
-| External tools                      | `externalTools`           | `{ id, title, icon, url, description?, requiredMetadata?, gate?, advanced?, order? }`            | the "External tools" sidebar section + palette, via `useNavContributions` |
-| Custom workspace metadata fields    | `workspaceMetadataFields` | `{ key, label, description?, placeholder?, type?, options?, order? }`                            | the Metadata tab of Workspace settings                                    |
-| Multi-step wizards                  | (journeys)                | `registerJourney` + step modules                                                                 | `<JourneyHost>` / `<JourneyOutlet>`                                       |
-| Locale strings                      | (i18n)                    | `i18n/locales/*.json` in the deployment                                                          | `@nuxtjs/i18n` layer deep-merge                                           |
+| Seam                                | Slot key                  | Entry shape                                                                                               | Host                                                                      |
+| ----------------------------------- | ------------------------- | --------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------- |
+| Run-detail windows                  | `resultViews`             | `{ id: '<ns>:<name>', component }`                                                                        | `StepResultViewHost` via `dispatchStepView`                               |
+| Agent kinds (palette data)          | `agentKinds`              | `{ kind, container, presentation: { label, icon, color, description, category?, resultView? } }`          | agents store merge → `agentKindMeta`                                      |
+| Custom task types                   | `taskTypes`               | `{ taskType: '<ns>:<name>', presentation, fields?, defaultPipelineId?, defaultFragmentIds?, formPanel? }` | `AddTaskModal` picker/fields + `TaskCard` badge (via `taskTypeMeta`)      |
+| Sidebar / command-palette / toolbar | `nav`                     | `{ id, labelKey, icon, surfaces, gate?, advanced?, run, sidebar?, command?, toolbar? }`                   | the three shells via `useNavContributions`                                |
+| Inspector body panels               | `inspectorPanels`         | `{ id, component, when(block), order }` (`PanelEntry<Block>`)                                             | `<PanelsOutlet>` in `InspectorPanel`                                      |
+| Top-level overlays                  | `appOverlays`             | `{ id: '<ns>:<name>', component }`                                                                        | `<AppOverlayHost>` via `useAppOverlays().open(id)`                        |
+| External tools                      | `externalTools`           | `{ id, title, icon, url, description?, requiredMetadata?, gate?, advanced?, order? }`                     | the "External tools" sidebar section + palette, via `useNavContributions` |
+| Custom workspace metadata fields    | `workspaceMetadataFields` | `{ key, label, description?, placeholder?, type?, options?, order? }`                                     | the Metadata tab of Workspace settings                                    |
+| Multi-step wizards                  | (journeys)                | `registerJourney` + step modules                                                                          | `<JourneyHost>` / `<JourneyOutlet>`                                       |
+| Locale strings                      | (i18n)                    | `i18n/locales/*.json` in the deployment                                                                   | `@nuxtjs/i18n` layer deep-merge                                           |
 
 A `nav` entry may also declare `advanced: true`, which hides it in **basic** interface mode
 (the shipped default) exactly as it does for the first-party destinations: see
@@ -173,20 +173,48 @@ Values are readable anywhere in the SPA via `useWorkspaceSettingsStore().setting
 
 Model a proprietary work item (an "incident", "pentest", "compliance-audit") as a first-class
 task type, the create-task twin of an agent kind. Contribute `{ taskType: '<ns>:<name>',
-presentation: { label, icon, color, description }, fields?, defaultPipelineId?, formPanel? }` to
-the `taskTypes` slot (see `acme:incident` in the example module). The SPA merges it into the
-create-task picker and the card-badge catalog:
+presentation: { label, icon, color, description, category? }, fields?, defaultPipelineId?,
+defaultFragmentIds?, formPanel? }` to the `taskTypes` slot (see `acme:incident` in the example
+module). The SPA merges it into the create-task picker and the card-badge catalog:
 
 - **`presentation`** drives the create-task picker entry and the `TaskCard` type badge (resolved
   through the pure `taskTypeMeta` read-model: the `agentKindMeta` twin). An UNREGISTERED
   namespaced type (a stale row after your extension is removed) degrades to the `feature`
-  presentation, so a leftover string never breaks a card.
-- **`fields`** are descriptor-driven create-form inputs (`text` / `textarea` / `number` /
-  `select`); their values land in the task's sparse `taskTypeFields.custom` bag (no migration).
+  presentation, so a leftover string never breaks a card. `description` is rendered verbatim as
+  the picker button's tooltip and, once the type is selected, as the type field's help text;
+  `category` groups the picker (below).
+- **`fields`** are descriptor-driven create-form inputs over the shared descriptor-form vocabulary
+  (`text` / `textarea` / `number` / `select` / `checkbox` / `checkbox-group` / `path`, with
+  defaults and `showWhen` visibility; `password` is excluded by construction because a task field
+  value reaches prompts and telemetry). Their values land in the task's sparse
+  `taskTypeFields.custom` bag (no migration). A BACKEND-registered descriptor is enforced
+  server-side on create as well (required answers, option lists, lengths); a code-shipped one is
+  known only to the SPA, so the create form is its only check (see the Validation note below).
 - **`formPanel`** optionally names a bespoke create-form section component you contribute to the
   `taskTypeFormPanels` slot (paired by that id, like `resultViews`); shown INSTEAD of `fields`. An
   unpaired id degrades to the descriptor fields.
 - **`defaultPipelineId`** pre-selects the type's pipeline in the picker.
+- **`defaultFragmentIds`** seed the type's standing context (best-practice fragment ids) onto every
+  new task of it, beside whatever it inherits from its service.
+
+**The picker is grouped, not flat** (`utils/taskTypePicker.ts`): the built-in types come first in
+one uncaptioned row, then one captioned row per declared `presentation.category` in registration
+order, then any uncategorized types under a translated "Other" heading. Declare a category once you
+ship more than a couple of types, or they pile up behind the everyday `feature` / `bug` choices.
+Categories differing only in case or spacing are ONE row, captioned as you first wrote it, so a
+stray `API delivery` / `API Delivery` pair does not split a category in half.
+
+Your own strings (labels, category captions, descriptions) are rendered verbatim and never enter a
+locale catalog; only the platform's own chrome around them is i18n, which is why the "Other" heading
+is the one caption you do not supply. Each row carries `data-testid="task-type-row"` plus
+`data-task-type-row="<id>"`, and each choice `data-testid="task-type-<taskType>"`, so your own e2e
+suite can address a row and the caption inside it.
+
+Together, `fields` + `defaultFragmentIds` + `defaultPipelineId` are what turns a task type from a
+badge into a **reusable operation**: a canned unit of work an org runs repeatedly with per-case
+input, whose collected values reach every agent's prompt. See
+[`docs/initiatives/reusable-operations.md`](../../../../docs/initiatives/reusable-operations.md)
+and the `org:introduce-api` worked example in `backend/internal/example-custom-agent`.
 
 The **same type can be delivered from the backend** instead of code-shipped: register it on the
 deployment's app-owned `TaskTypeRegistry` and it arrives in the workspace snapshot's

package/app/utils/taskTypePicker.spec.ts

@@ -0,0 +1,161 @@
+import { describe, it, expect } from 'vitest'
+import type { CustomTaskType } from '~/types/domain'
+import { buildTaskTypePickerRows, type TaskTypePickerChoice } from './taskTypePicker'
+
+const BUILT_INS: TaskTypePickerChoice[] = [
+  { value: 'feature', label: 'Feature', icon: 'i-lucide-sparkles' },
+  { value: 'bug', label: 'Bug', icon: 'i-lucide-bug' },
+]
+
+/** The localized chrome the caller passes in; the util never authors a display string itself. */
+const CAPTIONS = { other: 'Other' }
+
+const custom = (
+  taskType: string,
+  category?: string,
+  description = `What ${taskType} does`,
+): CustomTaskType =>
+  ({
+    taskType,
+    presentation: {
+      label: taskType.split(':')[1] ?? taskType,
+      icon: 'i-lucide-plug',
+      color: '#0ea5e9',
+      description,
+      ...(category === undefined ? {} : { category }),
+    },
+  }) as CustomTaskType
+
+describe('buildTaskTypePickerRows', () => {
+  it('puts the built-in types first, in one uncaptioned row', () => {
+    const rows = buildTaskTypePickerRows(
+      BUILT_INS,
+      [custom('org:introduce-api', 'API delivery')],
+      CAPTIONS,
+    )
+
+    expect(rows[0]).toEqual({ id: 'built-in', caption: null, choices: BUILT_INS })
+    expect(rows[1]?.caption).toBe('API delivery')
+  })
+
+  it('groups custom types sharing a category under one caption, in first-appearance order', () => {
+    const rows = buildTaskTypePickerRows(
+      BUILT_INS,
+      [
+        custom('org:introduce-api', 'API delivery'),
+        custom('org:onboard-tenant', 'Tenancy'),
+        custom('org:retire-endpoint', 'API delivery'),
+      ],
+      CAPTIONS,
+    )
+
+    // Registration order is the only order the deployment expressed, so it is the caption order,
+    // NOT alphabetical (which would put 'API delivery' first by accident here).
+    expect(rows.slice(1).map((r) => r.caption)).toEqual(['API delivery', 'Tenancy'])
+    expect(rows[1]?.choices.map((c) => c.value)).toEqual([
+      'org:introduce-api',
+      'org:retire-endpoint',
+    ])
+    expect(rows[2]?.choices.map((c) => c.value)).toEqual(['org:onboard-tenant'])
+  })
+
+  it('carries the verbatim wire presentation onto each custom choice', () => {
+    const rows = buildTaskTypePickerRows(
+      BUILT_INS,
+      [custom('org:introduce-api', 'API delivery', 'Expose functionality over the standard API.')],
+      CAPTIONS,
+    )
+
+    expect(rows[1]?.choices[0]).toEqual({
+      value: 'org:introduce-api',
+      label: 'introduce-api',
+      icon: 'i-lucide-plug',
+      description: 'Expose functionality over the standard API.',
+    })
+  })
+
+  it('folds captions differing only in case or spacing into one row, keeping the first spelling', () => {
+    const rows = buildTaskTypePickerRows(
+      BUILT_INS,
+      [custom('org:introduce-api', 'API delivery'), custom('org:retire-endpoint', 'api  DELIVERY')],
+      CAPTIONS,
+    )
+
+    // One row, captioned as the deployment first wrote it: a second heading differing only in case
+    // would read as a second category its author never declared.
+    expect(rows).toHaveLength(2)
+    expect(rows[1]?.caption).toBe('API delivery')
+    expect(rows[1]?.id).toBe('category:api delivery')
+    expect(rows[1]?.choices.map((c) => c.value)).toEqual([
+      'org:introduce-api',
+      'org:retire-endpoint',
+    ])
+  })
+
+  it('keeps captions that differ beyond case and spacing apart, non-ASCII included', () => {
+    const rows = buildTaskTypePickerRows(
+      [],
+      [custom('org:ambito', 'Ámbito'), custom('org:embito', 'Émbito')],
+      CAPTIONS,
+    )
+
+    expect(rows.map((r) => r.caption)).toEqual(['Ámbito', 'Émbito'])
+  })
+
+  it('captions the trailing uncategorized row with the caller chrome string', () => {
+    const rows = buildTaskTypePickerRows(
+      BUILT_INS,
+      [
+        custom('acme:incident'),
+        custom('org:introduce-api', 'API delivery'),
+        custom('acme:pentest'),
+      ],
+      CAPTIONS,
+    )
+
+    expect(rows.map((r) => r.caption)).toEqual([null, 'API delivery', 'Other'])
+    expect(rows[2]).toEqual({
+      id: 'other',
+      caption: 'Other',
+      choices: [
+        expect.objectContaining({ value: 'acme:incident' }),
+        expect.objectContaining({ value: 'acme:pentest' }),
+      ],
+    })
+  })
+
+  it('leaves the uncategorized row uncaptioned when it is the only row', () => {
+    // Nothing precedes it, so a heading would name a distinction the picker does not show.
+    const rows = buildTaskTypePickerRows([], [custom('acme:incident')], CAPTIONS)
+
+    expect(rows).toEqual([
+      {
+        id: 'other',
+        caption: null,
+        choices: [expect.objectContaining({ value: 'acme:incident' })],
+      },
+    ])
+  })
+
+  it('treats a blank category as no category rather than an empty caption', () => {
+    // A CODE-shipped consumer type skips the wire schema's `v.trim()`, so this is reachable.
+    const rows = buildTaskTypePickerRows(BUILT_INS, [custom('acme:incident', '   ')], CAPTIONS)
+
+    expect(rows.map((r) => r.id)).toEqual(['built-in', 'other'])
+  })
+
+  it('emits no rows for empty inputs, and no custom rows when nothing is registered', () => {
+    expect(buildTaskTypePickerRows([], [], CAPTIONS)).toEqual([])
+    expect(buildTaskTypePickerRows(BUILT_INS, [], CAPTIONS).map((r) => r.id)).toEqual(['built-in'])
+  })
+
+  it('keeps a row per category even when only custom types are offered', () => {
+    const rows = buildTaskTypePickerRows(
+      [],
+      [custom('org:introduce-api', 'API delivery')],
+      CAPTIONS,
+    )
+
+    expect(rows.map((r) => r.caption)).toEqual(['API delivery'])
+  })
+})

package/app/utils/taskTypePicker.ts

@@ -0,0 +1,127 @@
+import type { CustomTaskType } from '~/types/domain'
+
+/**
+ * The create-task type picker's layout rule (reusable-operations initiative, slice 3).
+ *
+ * The picker was one flat button row, which is right for the handful of built-in types and wrong
+ * the moment a deployment registers a catalog of REUSABLE OPERATIONS: an org with twenty of them
+ * ("Introduce API", "Retire endpoint", "Add tenant", …) turns the row into an undifferentiated
+ * wall in which the everyday `feature` / `bug` choices are no longer findable. Each custom type
+ * may declare a `presentation.category`, and this is where that axis becomes rows.
+ *
+ * Extracted rather than inlined in `AddTaskModal.vue` for the same reason as
+ * `buildFragmentCategoryGroups`: the ORDER is the behaviour worth pinning, and a rule inside an
+ * SFC is only reachable by mounting one.
+ */
+
+/** One selectable type in the picker. */
+export interface TaskTypePickerChoice<T extends string = string> {
+  /** The task type id submitted on create. */
+  value: T
+  /** Button label: an i18n string for a built-in, the verbatim wire presentation for a custom type. */
+  label: string
+  /** Icon id (`i-lucide-*`). */
+  icon: string
+  /**
+   * The deployment-authored one-liner from a CUSTOM type's presentation, rendered verbatim (never
+   * i18n). Absent for a built-in type, whose meaning is fixed and whose label is already localized.
+   */
+  description?: string
+}
+
+/** One row of the picker: the choices under an optional caption. */
+export interface TaskTypePickerRow<T extends string = string> {
+  /**
+   * Stable `v-for` key, also published as the row's `data-task-type-row` attribute so a caption
+   * (whose `data-testid` repeats per row, exactly as `pipeline-step`'s does) is addressable through
+   * its row instead of by position. Never rendered as text: `built-in`, `other`, or
+   * `category:<folded caption>`.
+   */
+  id: string
+  /**
+   * The row's heading, or `null` for an UNCAPTIONED row. Deployment-authored and rendered verbatim
+   * for a category row; the caller's localized chrome string for the leftovers row.
+   */
+  caption: string | null
+  choices: TaskTypePickerChoice<T>[]
+}
+
+/** The localized CHROME captions the picker needs; every other caption is deployment-authored. */
+export interface TaskTypePickerCaptions {
+  /** Heading for the trailing row of custom types that declared no category. */
+  other: string
+}
+
+/**
+ * Lay the picker out as rows: the BUILT-IN types first in one uncaptioned row (the everyday
+ * delivery loop stays where it has always been), then one captioned row per declared category in
+ * first-appearance order (the deployment's own registration order, which is the only order it
+ * expressed), then any uncategorized custom types in a trailing row captioned `captions.other`.
+ *
+ * Deliberately no collapsing, no overflow menu and no alphabetical re-sort: an operation catalog
+ * that needs those has outgrown what a create-task dialog should be asking, and each would hide a
+ * choice behind a second interaction.
+ */
+export function buildTaskTypePickerRows<T extends string>(
+  builtIns: readonly TaskTypePickerChoice<T>[],
+  customTypes: readonly CustomTaskType[],
+  captions: TaskTypePickerCaptions,
+): TaskTypePickerRow<T>[] {
+  const rows: TaskTypePickerRow<T>[] = []
+  if (builtIns.length > 0) rows.push({ id: 'built-in', caption: null, choices: [...builtIns] })
+
+  const byCategory = new Map<string, { caption: string; choices: TaskTypePickerChoice<T>[] }>()
+  const uncategorized: TaskTypePickerChoice<T>[] = []
+  for (const type of customTypes) {
+    const choice = toChoice<T>(type)
+    // A category is `v.trim()`-ed on the wire, but a CODE-shipped consumer type is trusted and
+    // unvalidated (see `docs/consumer-extensions.md`), so a whitespace-only caption is possible
+    // and must read as "no category" rather than render an empty heading.
+    const caption = type.presentation.category?.trim()
+    if (!caption) {
+      uncategorized.push(choice)
+      continue
+    }
+    const key = categoryKey(caption)
+    const bucket = byCategory.get(key)
+    if (bucket) bucket.choices.push(choice)
+    else byCategory.set(key, { caption, choices: [choice] })
+  }
+
+  for (const [key, { caption, choices }] of byCategory)
+    rows.push({ id: `category:${key}`, caption, choices })
+  // The leftovers are captioned only when something PRECEDES them: as the picker's only row they
+  // are the whole catalog, and a heading would then name a distinction the user cannot see.
+  if (uncategorized.length > 0)
+    rows.push({
+      id: 'other',
+      caption: rows.length > 0 ? captions.other : null,
+      choices: uncategorized,
+    })
+  return rows
+}
+
+/**
+ * The bucket a caption falls in: its own text folded on CASE and on whitespace runs, so two
+ * spellings of one category ("API delivery" / "api  delivery") are ONE row rather than
+ * near-duplicate headings sitting beside each other. The row still renders the FIRST-SEEN
+ * spelling verbatim, because the caption is the deployment's own words.
+ *
+ * Deliberately NOT slugified: a caption is arbitrary Unicode (a deployment writes it in its own
+ * language), so stripping it to an id-safe `[a-z0-9-]` key would fold genuinely distinct captions
+ * onto each other ("Ámbito" and "Émbito" both reduce to `mbito`). That is also why the row id
+ * carries the folded caption as-is and is addressed as an attribute VALUE rather than a testid.
+ */
+function categoryKey(caption: string): string {
+  return caption.toLowerCase().replace(/\s+/g, ' ')
+}
+
+/**
+ * A registered custom type as a picker choice. The id assertion carries the widened `taskType`
+ * contract (`<built-in> | <ns>:<name>`): a namespaced registered id IS a legal create-task value,
+ * which is what let `AddTaskModal` offer these choices in the first place.
+ */
+function toChoice<T extends string>(type: CustomTaskType): TaskTypePickerChoice<T> {
+  const { label, icon, description } = type.presentation
+  return { value: type.taskType as T, label, icon, ...(description ? { description } : {}) }
+}

package/i18n/locales/de.json

@@ -406,7 +406,7 @@
         },
         "questionsOnPark": {
           "label": "Offene Fragen bei einem pausierten Headless-Lauf posten",
-          "help": "Wenn ein über die API gestarteter Lauf zur Klärung der Anforderungen pausiert, poste seine offenen Fragen — jeweils mit der ID, die eine Antwort nennt — am verknüpften Issue. In der App gestartete Aufgaben sind nicht betroffen."
+          "help": "Wenn ein außerhalb der App gestarteter Lauf zur Klärung der Anforderungen pausiert (über die API oder aus einem Tracker-Ticket gestartet), poste seine offenen Fragen am verknüpften Issue, jeweils mit der ID, die eine Antwort nennt. In der App gestartete Aufgaben sind nicht betroffen."
         }
       },
       "probeFailure": {
@@ -2600,6 +2600,7 @@
       "title": "Eine Aufgabe hinzufügen",
       "newTaskIn": "Neue Aufgabe in {container}",
       "typeLabel": "Typ",
+      "typeOther": "Sonstige",
       "types": {
         "feature": "Feature",
         "bug": "Bug",

package/i18n/locales/en.json

@@ -216,6 +216,10 @@
       "title": "Add a task",
       "newTaskIn": "New task in {container}",
       "typeLabel": "Type",
+      "typeOther": "Other",
+      "@typeOther": {
+        "description": "Heading over the trailing group in the task-type picker: the deployment's own registered task types that declared no category of their own. A NOUN-like group heading ('the other ones'), not the adjective describing a single type."
+      },
       "types": {
         "feature": "Feature",
         "bug": "Bug",
@@ -2868,7 +2872,7 @@
         },
         "questionsOnPark": {
           "label": "Post open questions on a parked headless run",
-          "help": "When a run started through the API pauses to clarify requirements, post its open questions — each with the id an answer names — on the linked issue. Tasks started in the app are unaffected."
+          "help": "When a run started outside the app pauses to clarify requirements (through the API, or dispatched from a tracker ticket), post its open questions on the linked issue, each with the id an answer names. Tasks started in the app are unaffected."
         }
       },
       "probeFailure": {

package/i18n/locales/es.json

@@ -189,6 +189,7 @@
       "title": "Añadir una tarea",
       "newTaskIn": "Nueva tarea en {container}",
       "typeLabel": "Tipo",
+      "typeOther": "Otros",
       "types": {
         "feature": "Funcionalidad",
         "bug": "Error",
@@ -2632,7 +2633,7 @@
         },
         "questionsOnPark": {
           "label": "Publicar preguntas abiertas cuando un ejecución headless se detiene",
-          "help": "Cuando una ejecución iniciada por la API se detiene para aclarar requisitos, publica sus preguntas abiertas — cada una con el id que debe nombrar la respuesta — en la incidencia vinculada. Las tareas iniciadas en la aplicación no se ven afectadas."
+          "help": "Cuando una ejecución iniciada fuera de la aplicación se detiene para aclarar requisitos (por la API o despachada desde una incidencia del rastreador), publica sus preguntas abiertas en la incidencia vinculada, cada una con el id que debe nombrar la respuesta. Las tareas iniciadas en la aplicación no se ven afectadas."
         }
       },
       "probeFailure": {

package/i18n/locales/fr.json

@@ -189,6 +189,7 @@
       "title": "Ajouter une tâche",
       "newTaskIn": "Nouvelle tâche dans {container}",
       "typeLabel": "Type",
+      "typeOther": "Autres",
       "types": {
         "feature": "Fonctionnalité",
         "bug": "Bug",
@@ -2632,7 +2633,7 @@
         },
         "questionsOnPark": {
           "label": "Publier les questions ouvertes d'une exécution headless en pause",
-          "help": "Quand une exécution lancée via l'API se met en pause pour clarifier les exigences, publie ses questions ouvertes — chacune avec l'identifiant qu'une réponse doit nommer — sur le ticket lié. Les tâches lancées dans l'application ne sont pas concernées."
+          "help": "Quand une exécution lancée hors de l'application se met en pause pour clarifier les exigences (via l'API ou depuis un ticket du traqueur), publie ses questions ouvertes sur le ticket lié, chacune avec l'identifiant qu'une réponse doit nommer. Les tâches lancées dans l'application ne sont pas concernées."
         }
       },
       "probeFailure": {

package/i18n/locales/he.json

@@ -189,6 +189,7 @@
       "title": "הוסף משימה",
       "newTaskIn": "משימה חדשה ב-{container}",
       "typeLabel": "סוג",
+      "typeOther": "אחרים",
       "types": {
         "feature": "תכונה",
         "bug": "באג",
@@ -2773,7 +2774,7 @@
         },
         "questionsOnPark": {
           "label": "פרסם שאלות פתוחות בהרצה חסרת-ממשק שהושהתה",
-          "help": "כאשר הרצה שהופעלה דרך ה-API עוצרת כדי להבהיר דרישות, פרסם את השאלות הפתוחות שלה — כל אחת עם המזהה שתשובה צריכה לציין — על הכרטיס המקושר. משימות שהופעלו באפליקציה אינן מושפעות."
+          "help": "כאשר הרצה שהופעלה מחוץ לאפליקציה עוצרת כדי להבהיר דרישות (דרך ה-API או מכרטיס במערכת המעקב), פרסם את השאלות הפתוחות שלה על הכרטיס המקושר, כל אחת עם המזהה שתשובה צריכה לציין. משימות שהופעלו באפליקציה אינן מושפעות."
         }
       },
       "probeFailure": {

package/i18n/locales/it.json

@@ -406,7 +406,7 @@
         },
         "questionsOnPark": {
           "label": "Pubblica le domande aperte di un'esecuzione headless in pausa",
-          "help": "Quando un'esecuzione avviata tramite API si mette in pausa per chiarire i requisiti, pubblica le sue domande aperte — ciascuna con l'id che una risposta deve indicare — sull'issue collegato. Le attivita avviate nell'app non sono interessate."
+          "help": "Quando un'esecuzione avviata fuori dall'app si mette in pausa per chiarire i requisiti (tramite API o da un ticket del tracker), pubblica le sue domande aperte sull'issue collegato, ciascuna con l'id che una risposta deve indicare. Le attività avviate nell'app non sono interessate."
         }
       },
       "probeFailure": {
@@ -2600,6 +2600,7 @@
       "title": "Aggiungi un'attività",
       "newTaskIn": "Nuova attività in {container}",
       "typeLabel": "Tipo",
+      "typeOther": "Altri",
       "types": {
         "feature": "Feature",
         "bug": "Bug",

package/i18n/locales/ja.json

@@ -189,6 +189,7 @@
       "title": "タスクを追加",
       "newTaskIn": "{container} 内の新しいタスク",
       "typeLabel": "種類",
+      "typeOther": "その他",
       "types": {
         "feature": "機能",
         "bug": "バグ",
@@ -2773,7 +2774,7 @@
         },
         "questionsOnPark": {
           "label": "ヘッドレス実行が一時停止したら未解決の質問を投稿",
-          "help": "API 経由で開始した実行が要件確認のため一時停止したとき、その未解決の質問を — 回答が指定する ID を添えて — リンクされた課題に投稿します。アプリで開始したタスクには影響しません。"
+          "help": "アプリの外部で開始した実行が要件確認のため一時停止したとき (API 経由、またはトラッカーのチケットからの起動)、その未解決の質問を、回答が指定する ID を添えてリンクされた課題に投稿します。アプリで開始したタスクには影響しません。"
         }
       },
       "probeFailure": {

package/i18n/locales/pl.json

@@ -189,6 +189,7 @@
       "title": "Dodaj zadanie",
       "newTaskIn": "Nowe zadanie w {container}",
       "typeLabel": "Typ",
+      "typeOther": "Inne",
       "types": {
         "feature": "Funkcja",
         "bug": "Błąd",
@@ -2632,7 +2633,7 @@
         },
         "questionsOnPark": {
           "label": "Publikuj otwarte pytania wstrzymanego uruchomienia headless",
-          "help": "Gdy uruchomienie rozpoczęte przez API wstrzymuje się, aby doprecyzować wymagania, opublikuj jego otwarte pytania — każde z identyfikatorem, który ma wskazać odpowiedź — w powiązanym zgłoszeniu. Zadania rozpoczęte w aplikacji pozostają bez zmian."
+          "help": "Gdy uruchomienie rozpoczęte poza aplikacją wstrzymuje się, aby doprecyzować wymagania (przez API lub wysłane ze zgłoszenia w trackerze), opublikuj jego otwarte pytania w powiązanym zgłoszeniu, każde z identyfikatorem, który ma wskazać odpowiedź. Zadania rozpoczęte w aplikacji pozostają bez zmian."
         }
       },
       "probeFailure": {

package/i18n/locales/tr.json

@@ -189,6 +189,7 @@
       "title": "Görev ekle",
       "newTaskIn": "{container} içinde yeni görev",
       "typeLabel": "Tür",
+      "typeOther": "Diğer",
       "types": {
         "feature": "Özellik",
         "bug": "Hata",
@@ -2773,7 +2774,7 @@
         },
         "questionsOnPark": {
           "label": "Duraklatılan başsız çalıştırmanın açık sorularını gönder",
-          "help": "API üzerinden başlatılan bir çalıştırma gereksinimleri netleştirmek için duraklattığında, açık sorularını — her biri bir yanıtın belirteceği kimlikle — bağlı soruna gönderir. Uygulamada başlatılan görevler etkilenmez."
+          "help": "Uygulama dışında başlatılan bir çalıştırma gereksinimleri netleştirmek için duraklattığında (API üzerinden ya da bir izleyici kaydından gönderilerek), açık sorularını, her biri bir yanıtın belirteceği kimlikle, bağlı soruna gönderir. Uygulamada başlatılan görevler etkilenmez."
         }
       },
       "probeFailure": {

package/i18n/locales/uk.json

@@ -189,6 +189,7 @@
       "title": "Додати завдання",
       "newTaskIn": "Нове завдання в {container}",
       "typeLabel": "Тип",
+      "typeOther": "Інші",
       "types": {
         "feature": "Функція",
         "bug": "Помилка",
@@ -2632,7 +2633,7 @@
         },
         "questionsOnPark": {
           "label": "Публікувати відкриті запитання призупиненого headless-запуску",
-          "help": "Коли запуск, розпочатий через API, призупиняється для уточнення вимог, опублікуй його відкриті запитання — кожне з ідентифікатором, який має назвати відповідь — у пов'язаному тикеті. Завдання, розпочаті в застосунку, лишаються без змін."
+          "help": "Коли запуск, розпочатий поза застосунком, призупиняється для уточнення вимог (через API або надісланий з тикета трекера), опублікуй його відкриті запитання у пов'язаному тикеті, кожне з ідентифікатором, який має назвати відповідь. Завдання, розпочаті в застосунку, лишаються без змін."
         }
       },
       "probeFailure": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cat-factory/app",
-  "version": "0.219.0",
+  "version": "0.220.0",
   "description": "Reusable Nuxt layer for the Agent Architecture Board SPA (components, stores, composables, pages). Consume it from a thin deployment app via `extends: ['@cat-factory/app']` and point it at your backend with NUXT_PUBLIC_API_BASE. See deploy/frontend for an example.",
   "repository": {
     "type": "git",
@@ -40,7 +40,7 @@
     "valibot": "^1.4.2",
     "vue": "3.5.40",
     "wretch": "^3.0.9",
-    "@cat-factory/contracts": "0.232.0"
+    "@cat-factory/contracts": "0.234.0"
   },
   "devDependencies": {
     "@toad-contracts/testing": "0.3.2",