@cat-factory/app 0.120.0 → 0.121.1

package/app/components/layout/IntegrationsHub.vue

@@ -21,6 +21,7 @@ const tasks = useTasksStore()
 const tracker = useTrackerStore()
 const releaseHealth = useReleaseHealthStore()
 const packageRegistries = usePackageRegistriesStore()
+const publicApiKeys = usePublicApiKeysStore()
 const userSecrets = useUserSecretsStore()
 const apiKeys = useApiKeysStore()
 const workspace = useWorkspaceStore()
@@ -51,6 +52,7 @@ watch(
       query.value = ''
       void releaseHealth.ensureLoaded().catch(() => {})
       void packageRegistries.ensureLoaded().catch(() => {})
+      void publicApiKeys.ensureLoaded().catch(() => {})
       void userSecrets.load().catch(() => {})
       // Drives the OpenRouter row's "Key connected" badge.
       if (workspace.workspaceId) void apiKeys.load(workspace.workspaceId).catch(() => {})
@@ -269,26 +271,36 @@ const groups = computed<IntegrationGroup[]>(() => {
     })
   }
 
-  // --- Development (private package registries) -------------------------------
-  // Gated like observability: hidden until a probe confirms the module is wired
-  // (`available === true`), so an unconfigured backend doesn't show a dead row.
+  // --- Development (private package registries + API access tokens) -----------
+  // Each row is gated like observability: hidden until a probe confirms its module is
+  // wired (`available === true`), so an unconfigured backend doesn't show a dead row.
+  const development: IntegrationItem[] = []
   if (packageRegistries.available) {
     const hasEntries = packageRegistries.entries.length > 0
-    out.push({
-      title: t('layout.integrationsHub.groups.development'),
-      items: [
-        {
-          key: 'package-registries',
-          icon: 'i-lucide-package',
-          label: t('layout.integrationsHub.items.packageRegistries.label'),
-          description: t('layout.integrationsHub.items.packageRegistries.description'),
-          status: hasEntries ? t('layout.integrationsHub.status.connected') : undefined,
-          connected: hasEntries,
-          onClick: () => go(ui.openPackageRegistries),
-        },
-      ],
+    development.push({
+      key: 'package-registries',
+      icon: 'i-lucide-package',
+      label: t('layout.integrationsHub.items.packageRegistries.label'),
+      description: t('layout.integrationsHub.items.packageRegistries.description'),
+      status: hasEntries ? t('layout.integrationsHub.status.connected') : undefined,
+      connected: hasEntries,
+      onClick: () => go(ui.openPackageRegistries),
+    })
+  }
+  if (publicApiKeys.available) {
+    const hasKeys = publicApiKeys.keys.length > 0
+    development.push({
+      key: 'api-tokens',
+      icon: 'i-lucide-key-round',
+      label: t('layout.integrationsHub.items.apiTokens.label'),
+      description: t('layout.integrationsHub.items.apiTokens.description'),
+      status: hasKeys ? t('layout.integrationsHub.status.connected') : undefined,
+      connected: hasKeys,
+      onClick: () => go(ui.openApiTokens),
     })
   }
+  if (development.length)
+    out.push({ title: t('layout.integrationsHub.groups.development'), items: development })
 
   // NOTE: Infrastructure (agent-container execution + Tester environments + the local-mode
   // warm pool/checkout) is no longer listed here — it moved to its OWN top-level navbar menu

package/app/components/settings/ApiTokensPanel.vue

@@ -0,0 +1,205 @@
+<script setup lang="ts">
+// API access tokens — the workspace's inbound public-API keys external systems present to the
+// `/api/v1` surface (`Authorization: Bearer cf_live_…`). Keys are hashed one-way server-side,
+// so the raw secret is shown EXACTLY ONCE, on create; the list thereafter renders metadata
+// only (label + created / last-used). To rotate a token, revoke it and mint a new one.
+// Opened from the Integrations hub.
+import { computed, ref, watch } from 'vue'
+import type { PublicApiKey } from '~/types/publicApiKeys'
+import IntegrationBackTitle from '~/components/layout/IntegrationBackTitle.vue'
+import CopyButton from '~/components/common/CopyButton.vue'
+
+const { t, d } = useI18n()
+const ui = useUiStore()
+const store = usePublicApiKeysStore()
+const toast = useToast()
+const { confirmAction, toastDone } = useConfirmAction()
+
+const open = computed({
+  get: () => ui.apiTokensOpen,
+  set: (v: boolean) => (v ? ui.openApiTokens() : ui.closeApiTokens()),
+})
+const back = useIntegrationBack(open)
+
+const label = ref('')
+const busy = ref(false)
+// The full raw secret from the most recent create — surfaced once, then dismissed. Never
+// re-fetchable, so it lives only in this transient ref (not the store).
+const newSecret = ref<string | null>(null)
+
+function notifyError(title: string, e: unknown) {
+  toast.add({
+    title,
+    description: e instanceof Error ? e.message : String(e),
+    icon: 'i-lucide-triangle-alert',
+    color: 'error',
+  })
+}
+
+watch(
+  open,
+  async (isOpen) => {
+    if (!isOpen) {
+      // Never leave a revealed secret hanging around once the panel closes.
+      newSecret.value = null
+      return
+    }
+    try {
+      await store.ensureLoaded()
+    } catch (e) {
+      notifyError(t('settings.apiTokens.toast.loadFailed'), e)
+    }
+  },
+  { immediate: true },
+)
+
+async function createToken() {
+  const trimmed = label.value.trim()
+  if (!trimmed) return
+  busy.value = true
+  try {
+    const created = await store.create(trimmed)
+    newSecret.value = created.secret
+    label.value = ''
+    toast.add({
+      title: t('settings.apiTokens.toast.created'),
+      icon: 'i-lucide-check',
+      color: 'success',
+    })
+  } catch (e) {
+    notifyError(t('settings.apiTokens.toast.createFailed'), e)
+  } finally {
+    busy.value = false
+  }
+}
+
+function dismissSecret() {
+  newSecret.value = null
+}
+
+async function revokeToken(key: PublicApiKey) {
+  if (!(await confirmAction('revoke', key.label))) return
+  busy.value = true
+  try {
+    await store.revoke(key.id)
+    toastDone('revoke', key.label)
+  } catch (e) {
+    notifyError(t('settings.apiTokens.toast.revokeFailed'), e)
+  } finally {
+    busy.value = false
+  }
+}
+</script>
+
+<template>
+  <UModal v-model:open="open" :title="t('settings.apiTokens.title')" :ui="{ content: 'max-w-lg' }">
+    <template #title>
+      <IntegrationBackTitle :title="t('settings.apiTokens.title')" @back="back" />
+    </template>
+    <template #body>
+      <div class="space-y-4" data-testid="api-tokens-panel">
+        <p class="text-sm text-slate-400">
+          {{ t('settings.apiTokens.intro') }}
+        </p>
+
+        <!-- One-time secret reveal: shown once after create, dismissed by the user. The full
+             key is never recoverable, so it must be copied now. -->
+        <section
+          v-if="newSecret"
+          class="space-y-2 rounded-lg border border-primary-500/40 bg-primary-500/10 p-3"
+          data-testid="api-token-secret"
+        >
+          <div class="flex items-center gap-2 text-sm font-medium text-primary-200">
+            <UIcon name="i-lucide-key-round" class="h-4 w-4 shrink-0" />
+            <span>{{ t('settings.apiTokens.secret.heading') }}</span>
+          </div>
+          <p class="text-xs text-slate-300">{{ t('settings.apiTokens.secret.warning') }}</p>
+          <div
+            class="flex items-center gap-2 rounded-md border border-slate-700 bg-slate-950/60 px-3 py-2"
+          >
+            <code class="min-w-0 flex-1 truncate font-mono text-xs text-slate-100">{{
+              newSecret
+            }}</code>
+            <CopyButton :text="newSecret" :label="t('settings.apiTokens.secret.copy')" size="sm" />
+          </div>
+          <div class="flex justify-end">
+            <UButton
+              color="neutral"
+              variant="ghost"
+              size="xs"
+              data-testid="api-token-secret-dismiss"
+              @click="dismissSecret"
+            >
+              {{ t('settings.apiTokens.secret.done') }}
+            </UButton>
+          </div>
+        </section>
+
+        <section v-if="store.keys.length" class="space-y-2 rounded-lg border border-slate-700 p-3">
+          <h3 class="text-sm font-semibold">
+            {{ t('settings.apiTokens.list.heading') }}
+          </h3>
+          <div
+            v-for="key in store.keys"
+            :key="key.id"
+            class="flex items-center justify-between gap-2 rounded-md border border-slate-800 px-3 py-2"
+          >
+            <div class="min-w-0 space-y-0.5">
+              <div class="truncate text-sm font-medium">{{ key.label }}</div>
+              <div class="text-[11px] text-slate-500">
+                {{
+                  t('settings.apiTokens.list.created', {
+                    date: d(new Date(key.createdAt), 'short'),
+                  })
+                }}
+                <span aria-hidden="true"> · </span>
+                <template v-if="key.lastUsedAt">{{
+                  t('settings.apiTokens.list.lastUsed', {
+                    date: d(new Date(key.lastUsedAt), 'short'),
+                  })
+                }}</template>
+                <template v-else>{{ t('settings.apiTokens.list.neverUsed') }}</template>
+              </div>
+            </div>
+            <UButton
+              color="error"
+              variant="ghost"
+              icon="i-lucide-ban"
+              size="sm"
+              :loading="busy"
+              :data-testid="`api-token-revoke-${key.id}`"
+              :aria-label="t('settings.apiTokens.list.revoke')"
+              @click="revokeToken(key)"
+            />
+          </div>
+        </section>
+
+        <section class="space-y-3 rounded-lg border border-slate-700 p-3">
+          <h3 class="text-sm font-semibold">
+            {{ t('settings.apiTokens.add.heading') }}
+          </h3>
+          <UFormField
+            :label="t('settings.apiTokens.add.label')"
+            :help="t('settings.apiTokens.add.labelHelp')"
+          >
+            <UInput
+              v-model="label"
+              :placeholder="t('settings.apiTokens.add.labelPlaceholder')"
+              class="w-full"
+              data-testid="api-token-label"
+              @keyup.enter="createToken"
+            />
+          </UFormField>
+          <UButton
+            :loading="busy"
+            :disabled="!label.trim()"
+            data-testid="api-token-create"
+            @click="createToken"
+          >
+            {{ t('settings.apiTokens.add.create') }}
+          </UButton>
+        </section>
+      </div>
+    </template>
+  </UModal>
+</template>

package/app/composables/api/publicApiKeys.ts

@@ -0,0 +1,26 @@
+import {
+  createPublicApiKeyContract,
+  listPublicApiKeysContract,
+  revokePublicApiKeyContract,
+} from '@cat-factory/contracts'
+import type { CreatePublicApiKeyInput } from '~/types/publicApiKeys'
+import type { ApiContext } from './context'
+
+/**
+ * Inbound public-API keys ("API access tokens") a workspace mints for external systems to
+ * call the `/api/v1` surface. Management routes are session-authed under
+ * `/workspaces/:workspaceId`; the raw secret comes back only on create. See
+ * PublicApiKeyController.
+ */
+export function publicApiKeysApi({ send, ws }: ApiContext) {
+  return {
+    listPublicApiKeys: (workspaceId: string) =>
+      send(listPublicApiKeysContract, { pathPrefix: ws(workspaceId) }),
+
+    createPublicApiKey: (workspaceId: string, body: CreatePublicApiKeyInput) =>
+      send(createPublicApiKeyContract, { pathPrefix: ws(workspaceId), body }),
+
+    revokePublicApiKey: (workspaceId: string, id: string) =>
+      send(revokePublicApiKeyContract, { pathPrefix: ws(workspaceId), pathParams: { id } }),
+  }
+}

package/app/composables/useApi.ts

@@ -25,6 +25,7 @@ import { notificationsApi } from './api/notifications'
 import { packageRegistriesApi } from './api/packageRegistries'
 import { preflightsApi } from './api/preflights'
 import { presetsApi } from './api/presets'
+import { publicApiKeysApi } from './api/publicApiKeys'
 import { sharedStacksApi } from './api/sharedStacks'
 import { providerConnectionsApi } from './api/providerConnections'
 import { provisioningLogsApi } from './api/provisioningLogs'
@@ -121,6 +122,7 @@ export function useApi() {
     ...notificationsApi(ctx),
     ...presetsApi(ctx),
     ...preflightsApi(ctx),
+    ...publicApiKeysApi(ctx),
     ...sharedStacksApi(ctx),
     ...providerConnectionsApi(ctx),
     ...infraHandlersApi(ctx),

package/app/composables/useUpsertList.spec.ts

@@ -25,6 +25,19 @@ describe('useUpsertList', () => {
     expect(items.value.map((x) => x.id)).toEqual(['b', 'a'])
   })
 
+  it('replaces an existing item in place under prepend (no reorder)', () => {
+    // The github `pulls` list is prepend (newest-first); re-opening / optimistically
+    // merging an existing PR must replace it where it sits, not bump it to the front.
+    const { items, upsert } = useUpsertList<Item>({ key: (x) => x.id, prepend: true })
+    upsert({ id: 'a', v: 1 })
+    upsert({ id: 'b', v: 2 })
+    upsert({ id: 'a', v: 9 }) // existing key → replace in place
+    expect(items.value).toEqual([
+      { id: 'b', v: 2 },
+      { id: 'a', v: 9 },
+    ])
+  })
+
   it('removes by key and looks up by key', () => {
     const { items, upsert, remove, get } = useUpsertList<Item>({ key: (x) => x.id })
     upsert({ id: 'a', v: 1 })

package/app/pages/index.vue

@@ -96,6 +96,9 @@ const ObservabilityConnectionPanel = defineAsyncComponent(
 const PackageRegistriesPanel = defineAsyncComponent(
   () => import('~/components/settings/PackageRegistriesPanel.vue'),
 )
+const ApiTokensPanel = defineAsyncComponent(
+  () => import('~/components/settings/ApiTokensPanel.vue'),
+)
 const InfrastructureWindow = defineAsyncComponent(
   () => import('~/components/settings/InfrastructureWindow.vue'),
 )
@@ -402,6 +405,7 @@ watch(
       <AccountSettingsPanel v-if="ui.accountSettingsOpen" />
       <ObservabilityConnectionPanel v-if="ui.observabilityConnectionOpen" />
       <PackageRegistriesPanel v-if="ui.packageRegistriesOpen" />
+      <ApiTokensPanel v-if="ui.apiTokensOpen" />
       <InfrastructureWindow v-if="ui.infrastructureOpen" />
       <EnvironmentSetupWizard v-if="ui.environmentWizardOpen" />
       <ModelConfigurationPanel v-if="ui.modelConfigOpen" />

package/app/stores/accounts.ts

@@ -1,5 +1,6 @@
 import { defineStore } from 'pinia'
 import { computed, ref } from 'vue'
+import { useUpsertList } from '~/composables/useUpsertList'
 import type {
   Account,
   AccountInvitation,
@@ -23,7 +24,7 @@ export const useAccountsStore = defineStore(
   () => {
     const api = useApi()
 
-    const accounts = ref<Account[]>([])
+    const { items: accounts, upsert: upsertAccount } = useUpsertList<Account>({ key: (a) => a.id })
     /** Active account id (persisted so a reload keeps the same context). */
     const activeAccountId = ref<string | null>(null)
     const ready = ref(false)
@@ -46,7 +47,7 @@ export const useAccountsStore = defineStore(
     /** Create a shared org account and make it active. */
     async function createOrg(name: string) {
       const account = await api.createAccount({ name })
-      accounts.value.push(account)
+      upsertAccount(account)
       activeAccountId.value = account.id
       return account
     }
@@ -62,8 +63,7 @@ export const useAccountsStore = defineStore(
      */
     async function setDefaultCloudProvider(id: string, provider: CloudProvider) {
       const updated = await api.updateAccount(id, { defaultCloudProvider: provider })
-      const i = accounts.value.findIndex((a) => a.id === id)
-      if (i >= 0) accounts.value[i] = updated
+      upsertAccount(updated)
       return updated
     }
 
@@ -73,14 +73,15 @@ export const useAccountsStore = defineStore(
      */
     async function setSpendMonthlyLimit(id: string, limit: number | null) {
       const updated = await api.updateAccount(id, { spendMonthlyLimit: limit })
-      const i = accounts.value.findIndex((a) => a.id === id)
-      if (i >= 0) accounts.value[i] = updated
+      upsertAccount(updated)
       return updated
     }
 
     // ---- members + invitations -------------------------------------------
 
-    const members = ref<AccountMember[]>([])
+    const { items: members, upsert: upsertMember } = useUpsertList<AccountMember>({
+      key: (m) => m.userId,
+    })
     const invitations = ref<AccountInvitation[]>([])
 
     /** Load the active account's member roster + pending invitations. */
@@ -108,8 +109,7 @@ export const useAccountsStore = defineStore(
     /** Set a member's role set (admin-only); patches the loaded roster in place. */
     async function setMemberRoles(accountId: string, userId: string, roles: AccountRole[]) {
       const updated = await api.setMemberRoles(accountId, userId, roles)
-      const i = members.value.findIndex((m) => m.userId === userId)
-      if (i >= 0) members.value[i] = updated
+      upsertMember(updated)
       return updated
     }
 

package/app/stores/bootstrap.ts

@@ -6,6 +6,7 @@ import type {
   ReferenceArchitecture,
   UpdateReferenceArchitectureInput,
 } from '~/types/domain'
+import { useUpsertList } from '~/composables/useUpsertList'
 import { useWorkspaceStore } from '~/stores/workspace'
 import { useAgentRunsStore } from '~/stores/agentRuns'
 
@@ -27,7 +28,11 @@ export const useBootstrapStore = defineStore('bootstrap', () => {
 
   /** null = unknown (not probed yet), true/false = module reachable or not. */
   const available = ref<boolean | null>(null)
-  const architectures = ref<ReferenceArchitecture[]>([])
+  const {
+    items: architectures,
+    upsert: upsertArchitecture,
+    remove: dropArchitecture,
+  } = useUpsertList<ReferenceArchitecture>({ key: (a) => a.id, prepend: true })
   const loading = ref(false)
 
   const hasArchitectures = computed(() => architectures.value.length > 0)
@@ -50,22 +55,21 @@ export const useBootstrapStore = defineStore('bootstrap', () => {
   /** Register a new reference architecture. */
   async function createArchitecture(input: CreateReferenceArchitectureInput) {
     const created = await api.createReferenceArchitecture(workspace.requireId(), input)
-    architectures.value.unshift(created)
+    upsertArchitecture(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
+    upsertArchitecture(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)
+    dropArchitecture(id)
   }
 
   /**

package/app/stores/github.ts

@@ -14,9 +14,13 @@ import type {
   ResyncRequest,
 } from '~/types/domain'
 import { useSingleFlightProbe } from '~/composables/useSingleFlightProbe'
+import { useUpsertList } from '~/composables/useUpsertList'
 import { useWorkspaceStore } from '~/stores/workspace'
 import { useServicesStore } from '~/stores/services'
 
+/** Stable identity for a pull request in the `pulls` list: repo + PR number. */
+const pullKey = (repoGithubId: number, number: number) => `${repoGithubId}:${number}`
+
 /**
  * GitHub integration state: the workspace's App installation, the projected
  * repos/branches/pull-requests/issues the backend caches in D1, and the actions
@@ -42,7 +46,14 @@ export const useGitHubStore = defineStore('github', () => {
   const availableRepos = ref<GitHubAvailableRepo[]>([])
   const loadingAvailable = ref(false)
   const savingRepos = ref(false)
-  const pulls = ref<GitHubPullRequest[]>([])
+  const {
+    items: pulls,
+    upsert: upsertPull,
+    get: getPull,
+  } = useUpsertList<GitHubPullRequest>({
+    key: (p) => pullKey(p.repoGithubId, p.number),
+    prepend: true,
+  })
   const issues = ref<GitHubIssue[]>([])
   /** Branches loaded lazily per repo (by GitHub numeric id). */
   const branches = ref<Record<number, GitHubBranch[]>>({})
@@ -269,11 +280,7 @@ export const useGitHubStore = defineStore('github', () => {
 
   async function openPullRequest(repoGithubId: number, input: OpenPullRequestInput) {
     const pr = await api.openGitHubPullRequest(workspace.requireId(), repoGithubId, input)
-    const i = pulls.value.findIndex(
-      (p) => p.repoGithubId === pr.repoGithubId && p.number === pr.number,
-    )
-    if (i >= 0) pulls.value[i] = pr
-    else pulls.value.unshift(pr)
+    upsertPull(pr)
     return pr
   }
 
@@ -284,8 +291,8 @@ export const useGitHubStore = defineStore('github', () => {
   ) {
     await api.mergeGitHubPullRequest(workspace.requireId(), repoGithubId, number, input)
     // Optimistically reflect the merge until the next sync confirms it.
-    const i = pulls.value.findIndex((p) => p.repoGithubId === repoGithubId && p.number === number)
-    if (i >= 0) pulls.value[i] = { ...pulls.value[i]!, state: 'closed', merged: true }
+    const existing = getPull(pullKey(repoGithubId, number))
+    if (existing) upsertPull({ ...existing, state: 'closed', merged: true })
   }
 
   function comment(repoGithubId: number, number: number, body: string) {

package/app/stores/pipelines.ts

@@ -4,6 +4,7 @@ import type { AgentKind, Pipeline } from '~/types/domain'
 import type { ConsensusStepConfig, StepGating } from '~/types/consensus'
 import type { StepOptions, TesterQualityConfig } from '@cat-factory/contracts'
 import { companionForProducer, uid } from '~/utils/catalog'
+import { useUpsertList } from '~/composables/useUpsertList'
 import { useWorkspaceStore } from '~/stores/workspace'
 
 /** A sensible default config when a step is first flipped to consensus in the builder. */
@@ -31,7 +32,11 @@ function defaultConsensusConfig(): ConsensusStepConfig {
  */
 export const usePipelinesStore = defineStore('pipelines', () => {
   const api = useApi()
-  const pipelines = ref<Pipeline[]>([])
+  const {
+    items: pipelines,
+    upsert: upsertPipeline,
+    remove: dropPipeline,
+  } = useUpsertList<Pipeline>({ key: (p) => p.id })
   /**
    * Current built-in catalog versions (`seedPipelines()`), keyed by pipeline id, from the
    * workspace snapshot. A built-in whose stored `version` is below its catalog value here has
@@ -369,13 +374,12 @@ export const usePipelinesStore = defineStore('pipelines', () => {
     const payload = draftPayload()
     if (editingId.value) {
       const updated = await api.updatePipeline(wsId, editingId.value, payload)
-      const i = pipelines.value.findIndex((p) => p.id === updated.id)
-      if (i >= 0) pipelines.value[i] = updated
+      upsertPipeline(updated)
       clearDraft()
       return updated
     }
     const pipeline = await api.createPipeline(wsId, payload)
-    pipelines.value.push(pipeline)
+    upsertPipeline(pipeline)
     clearDraft()
     return pipeline
   }
@@ -383,14 +387,14 @@ export const usePipelinesStore = defineStore('pipelines', () => {
   /** Clone any pipeline (built-in or custom) into an editable copy, ready to edit. */
   async function clonePipeline(id: string): Promise<Pipeline> {
     const clone = await api.clonePipeline(useWorkspaceStore().requireId(), id)
-    pipelines.value.push(clone)
+    upsertPipeline(clone)
     loadForEdit(clone)
     return clone
   }
 
   async function removePipeline(id: string) {
     await api.removePipeline(useWorkspaceStore().requireId(), id)
-    pipelines.value = pipelines.value.filter((p) => p.id !== id)
+    dropPipeline(id)
     if (editingId.value === id) clearDraft()
   }
 
@@ -401,8 +405,7 @@ export const usePipelinesStore = defineStore('pipelines', () => {
    */
   async function reseed(id: string): Promise<Pipeline> {
     const updated = await api.reseedPipeline(useWorkspaceStore().requireId(), id)
-    const i = pipelines.value.findIndex((p) => p.id === updated.id)
-    if (i >= 0) pipelines.value[i] = updated
+    upsertPipeline(updated)
     if (editingId.value === id) clearDraft()
     return updated
   }
@@ -410,8 +413,7 @@ export const usePipelinesStore = defineStore('pipelines', () => {
   /** Set a pipeline's organizational metadata (labels / archive). Works on built-ins too. */
   async function organize(id: string, body: { labels?: string[]; archived?: boolean }) {
     const updated = await api.organizePipeline(useWorkspaceStore().requireId(), id, body)
-    const i = pipelines.value.findIndex((p) => p.id === updated.id)
-    if (i >= 0) pipelines.value[i] = updated
+    upsertPipeline(updated)
     return updated
   }