@cat-factory/app 0.18.1 → 0.19.0

package/app/components/layout/IntegrationsHub.vue

@@ -14,6 +14,7 @@ const documents = useDocumentsStore()
 const tasks = useTasksStore()
 const tracker = useTrackerStore()
 const releaseHealth = useReleaseHealthStore()
+const userSecrets = useUserSecretsStore()
 
 // The selected filing tracker, as a badge label ("GitHub Issues" / "Jira").
 const trackerLabel = computed(() => {
@@ -27,7 +28,10 @@ const trackerLabel = computed(() => {
 watch(
   () => ui.integrationsOpen,
   (isOpen) => {
-    if (isOpen) void releaseHealth.ensureLoaded().catch(() => {})
+    if (isOpen) {
+      void releaseHealth.ensureLoaded().catch(() => {})
+      void userSecrets.load().catch(() => {})
+    }
   },
 )
 
@@ -75,6 +79,20 @@ const groups = computed<IntegrationGroup[]>(() => {
       onClick: () => go(ui.openGitHub),
     })
   }
+  // Per-user GitHub PAT — works on every runtime (used for runs you initiate). Always
+  // offered; the badge reflects whether the signed-in user has stored one.
+  {
+    const pat = userSecrets.statusFor('github_pat')
+    code.push({
+      key: 'github-pat',
+      icon: 'i-lucide-key-round',
+      label: 'My GitHub token',
+      description: 'A personal access token used for runs you start (pushes, PRs, CI, merge).',
+      status: pat ? 'Connected' : undefined,
+      connected: !!pat,
+      onClick: () => go(ui.openUserSecrets),
+    })
+  }
   if (code.length) out.push({ title: 'Source control', items: code })
 
   // --- Communication ---------------------------------------------------------

package/app/components/settings/UserSecretsSection.vue

@@ -0,0 +1,214 @@
+<script setup lang="ts">
+// Per-user settings: "My GitHub token" (and future per-user repository/provider secrets).
+// A generic, descriptor-driven connect form: the backend declares each kind's fields
+// (one secret + optional metadata) and whether a connection test is available; this
+// renders them without hard-coding any kind. Stored PER USER (runs you initiate use YOUR
+// access); the secret is write-only server-side and never shown again.
+import { computed, ref, watch } from 'vue'
+import type { ProviderConfigField, UserSecretKind } from '~/types/userSecrets'
+
+const ui = useUiStore()
+const store = useUserSecretsStore()
+const toast = useToast()
+
+const open = computed({
+  get: () => ui.userSecretsOpen,
+  set: (v: boolean) => (v ? ui.openUserSecrets() : ui.closeUserSecrets()),
+})
+
+// The kind being edited (only `github_pat` today; descriptors drive the rest generically).
+const kind = ref<UserSecretKind>('github_pat')
+const descriptor = computed(() => store.descriptorFor(kind.value))
+const status = computed(() => store.statusFor(kind.value))
+
+// Per-field draft values, keyed by field key. The secret field maps to the wire `secret`;
+// all other fields map into `metadata`.
+const values = ref<Record<string, string>>({})
+const labelDraft = ref('')
+const testResult = ref<{ ok: boolean; message?: string } | null>(null)
+const testing = ref(false)
+const busy = ref(false)
+
+function resetDraft() {
+  values.value = {}
+  labelDraft.value = ''
+  testResult.value = null
+  // Prefill non-secret metadata from the stored status (secret stays blank — write-only).
+  const meta = status.value?.metadata
+  if (meta) for (const [k, v] of Object.entries(meta)) values.value[k] = v
+}
+
+watch(open, (isOpen) => {
+  if (isOpen) void store.load().then(resetDraft)
+})
+watch(kind, resetDraft)
+
+const secretField = computed<ProviderConfigField | undefined>(() =>
+  descriptor.value?.configFields.find((f) => f.secret),
+)
+const metadataFields = computed<ProviderConfigField[]>(() =>
+  (descriptor.value?.configFields ?? []).filter((f) => !f.secret),
+)
+
+/** Build the wire payload: the secret field → `secret`, the rest → `metadata`. */
+function buildPayload(): { secret: string; metadata?: Record<string, string> } | null {
+  const sf = secretField.value
+  if (!sf) return null
+  const secret = (values.value[sf.key] ?? '').trim()
+  if (!secret) return null
+  const metadata: Record<string, string> = {}
+  for (const f of metadataFields.value) {
+    const v = (values.value[f.key] ?? '').trim()
+    if (v) metadata[f.key] = v
+  }
+  return { secret, ...(Object.keys(metadata).length ? { metadata } : {}) }
+}
+
+function notifyError(title: string, e: unknown) {
+  toast.add({
+    title,
+    description: e instanceof Error ? e.message : String(e),
+    icon: 'i-lucide-triangle-alert',
+    color: 'error',
+  })
+}
+
+async function test() {
+  const payload = buildPayload()
+  if (!payload) return
+  testing.value = true
+  testResult.value = null
+  try {
+    testResult.value = await store.test(kind.value, payload)
+  } catch (e) {
+    testResult.value = { ok: false, message: e instanceof Error ? e.message : String(e) }
+  } finally {
+    testing.value = false
+  }
+}
+
+async function save() {
+  const payload = buildPayload()
+  if (!payload) return
+  busy.value = true
+  try {
+    await store.store(kind.value, { ...payload, label: labelDraft.value.trim() || undefined })
+    values.value[secretField.value!.key] = ''
+    testResult.value = null
+    toast.add({
+      title: `${descriptor.value?.label ?? 'Secret'} saved`,
+      icon: 'i-lucide-check',
+      color: 'success',
+    })
+  } catch (e) {
+    notifyError('Could not save secret', e)
+  } finally {
+    busy.value = false
+  }
+}
+
+async function remove() {
+  busy.value = true
+  try {
+    await store.remove(kind.value)
+    resetDraft()
+    toast.add({ title: 'Secret removed', icon: 'i-lucide-check' })
+  } catch (e) {
+    notifyError('Could not remove secret', e)
+  } finally {
+    busy.value = false
+  }
+}
+</script>
+
+<template>
+  <UModal v-model:open="open" title="My GitHub token" :ui="{ content: 'max-w-xl' }">
+    <template #body>
+      <div class="space-y-4">
+        <p class="text-xs text-slate-400">
+          Store a personal access token used for the runs <strong>you</strong> start — pushes, pull
+          requests, the CI gate and merges are attributed to your GitHub access. Stored
+          <span class="text-slate-300">just for you</span>; the token is write-only and never shown
+          again.
+        </p>
+
+        <div
+          v-if="status"
+          class="flex items-center justify-between rounded-md border border-slate-700 bg-slate-900/50 px-3 py-2 text-sm"
+        >
+          <div>
+            <span class="font-medium text-slate-200">{{ status.label }}</span>
+            <div class="text-[11px] text-emerald-400">Connected · token stored</div>
+          </div>
+          <UButton
+            icon="i-lucide-trash-2"
+            color="error"
+            variant="ghost"
+            size="xs"
+            :disabled="busy"
+            @click="remove()"
+          />
+        </div>
+
+        <div
+          v-if="descriptor"
+          class="rounded-lg border border-dashed border-slate-700 p-3 space-y-3"
+        >
+          <p class="text-[11px] font-semibold uppercase tracking-wide text-slate-400">
+            {{ status ? 'Replace token' : 'Add a token' }}
+          </p>
+
+          <UFormField label="Label (optional)">
+            <UInput v-model="labelDraft" :placeholder="descriptor.label" />
+          </UFormField>
+
+          <UFormField
+            v-for="field in descriptor.configFields"
+            :key="field.key"
+            :label="field.label + (field.required ? '' : ' (optional)')"
+            :help="field.help"
+          >
+            <UInput
+              v-model="values[field.key]"
+              :type="field.secret ? 'password' : 'text'"
+              class="font-mono"
+              :placeholder="field.placeholder"
+            />
+          </UFormField>
+
+          <div v-if="descriptor.supportsTest" class="flex items-center gap-2">
+            <UButton
+              color="neutral"
+              variant="soft"
+              size="sm"
+              icon="i-lucide-plug-zap"
+              :loading="testing"
+              :disabled="!buildPayload()"
+              @click="test()"
+            >
+              Test connection
+            </UButton>
+            <span v-if="testResult && testResult.ok" class="text-xs text-emerald-400">
+              {{ testResult.message ?? 'Token valid' }}
+            </span>
+            <span v-else-if="testResult" class="text-xs text-rose-400">
+              {{ testResult.message ?? 'Token rejected' }}
+            </span>
+          </div>
+
+          <div class="flex justify-end">
+            <UButton
+              color="primary"
+              size="sm"
+              :loading="busy"
+              :disabled="!buildPayload()"
+              @click="save()"
+            >
+              {{ status ? 'Save' : 'Add token' }}
+            </UButton>
+          </div>
+        </div>
+      </div>
+    </template>
+  </UModal>
+</template>

package/app/composables/api/userSecrets.ts

@@ -0,0 +1,31 @@
+import type {
+  ConnectionTestResult,
+  StoreUserSecretInput,
+  TestUserSecretInput,
+  UserSecretDescriptor,
+  UserSecretKind,
+  UserSecretStatus,
+} from '~/types/userSecrets'
+import type { ApiContext } from './context'
+
+// Per-USER generic secrets (a GitHub PAT today). User-scoped (no workspace); the secret
+// is write-only server-side and never returned — only status metadata + a `hasSecret`
+// flag. `descriptors` drive the generic connect form; `test` probes before save.
+export function userSecretsApi({ http }: ApiContext) {
+  return {
+    listUserSecrets: () =>
+      http<{ secrets: UserSecretStatus[]; descriptors: UserSecretDescriptor[] }>('/user-secrets'),
+
+    storeUserSecret: (kind: UserSecretKind, body: StoreUserSecretInput) =>
+      http<UserSecretStatus>(`/user-secrets/${encodeURIComponent(kind)}`, { method: 'POST', body }),
+
+    deleteUserSecret: (kind: UserSecretKind) =>
+      http(`/user-secrets/${encodeURIComponent(kind)}`, { method: 'DELETE' }),
+
+    testUserSecret: (kind: UserSecretKind, body: TestUserSecretInput) =>
+      http<ConnectionTestResult>(`/user-secrets/${encodeURIComponent(kind)}/test`, {
+        method: 'POST',
+        body,
+      }),
+  }
+}

package/app/composables/useApi.ts

@@ -17,6 +17,7 @@ import { reviewsApi } from './api/reviews'
 import { slackApi } from './api/slack'
 import { specApi } from './api/spec'
 import { tasksApi } from './api/tasks'
+import { userSecretsApi } from './api/userSecrets'
 import { workspacesApi } from './api/workspaces'
 
 /**
@@ -87,5 +88,6 @@ export function useApi() {
     ...githubApi(ctx),
     ...slackApi(ctx),
     ...bootstrapApi(ctx),
+    ...userSecretsApi(ctx),
   }
 }

package/app/pages/index.vue

@@ -31,6 +31,7 @@ import WorkspaceSettingsPanel from '~/components/settings/WorkspaceSettingsPanel
 import ObservabilityConnectionPanel from '~/components/settings/ObservabilityConnectionPanel.vue'
 import ModelConfigurationPanel from '~/components/settings/ModelConfigurationPanel.vue'
 import LocalModelEndpointsPanel from '~/components/settings/LocalModelEndpointsPanel.vue'
+import UserSecretsSection from '~/components/settings/UserSecretsSection.vue'
 import OpenRouterCatalogPanel from '~/components/settings/OpenRouterCatalogPanel.vue'
 import VendorCredentialsModal from '~/components/providers/VendorCredentialsModal.vue'
 import PersonalCredentialModal from '~/components/providers/PersonalCredentialModal.vue'
@@ -183,6 +184,7 @@ watch(
       <ObservabilityConnectionPanel />
       <ModelConfigurationPanel />
       <LocalModelEndpointsPanel />
+      <UserSecretsSection />
       <OpenRouterCatalogPanel />
       <VendorCredentialsModal />
       <PersonalCredentialModal />

package/app/stores/ui.ts

@@ -102,6 +102,7 @@ export const useUiStore = defineStore('ui', () => {
   const vendorCredentialsOpen = ref(false)
   // Per-user settings panel: the signed-in user's own-machine local model runners.
   const localModelsOpen = ref(false)
+  const userSecretsOpen = ref(false)
   // Per-workspace settings panel: the OpenRouter dynamic catalog (browse/enable gateway models).
   const openRouterOpen = ref(false)
 
@@ -358,6 +359,12 @@ export const useUiStore = defineStore('ui', () => {
   function closeLocalModels() {
     localModelsOpen.value = false
   }
+  function openUserSecrets() {
+    userSecretsOpen.value = true
+  }
+  function closeUserSecrets() {
+    userSecretsOpen.value = false
+  }
   function openOpenRouter() {
     openRouterOpen.value = true
   }
@@ -451,6 +458,7 @@ export const useUiStore = defineStore('ui', () => {
     modelConfigOpen,
     vendorCredentialsOpen,
     localModelsOpen,
+    userSecretsOpen,
     openRouterOpen,
     aiProviderSetupOpen,
     aiPresetMismatchOpen,
@@ -512,6 +520,8 @@ export const useUiStore = defineStore('ui', () => {
     closeVendorCredentials,
     openLocalModels,
     closeLocalModels,
+    openUserSecrets,
+    closeUserSecrets,
     openOpenRouter,
     closeOpenRouter,
     openAiProviderSetup,

package/app/stores/userSecrets.ts

@@ -0,0 +1,64 @@
+import { defineStore } from 'pinia'
+import { ref } from 'vue'
+import type {
+  ConnectionTestResult,
+  StoreUserSecretInput,
+  TestUserSecretInput,
+  UserSecretDescriptor,
+  UserSecretKind,
+  UserSecretStatus,
+} from '~/types/userSecrets'
+
+// The signed-in user's generic secrets (a GitHub PAT today). Stored PER USER (a run you
+// initiate uses YOUR GitHub access), write-only server-side — this store carries only the
+// status metadata + a `hasSecret` flag, plus the kind descriptors that drive the generic
+// connect form. Loaded INDEPENDENTLY of the workspace snapshot, like local runners.
+export const useUserSecretsStore = defineStore('userSecrets', () => {
+  const api = useApi()
+  const secrets = ref<UserSecretStatus[]>([])
+  const descriptors = ref<UserSecretDescriptor[]>([])
+  const loading = ref(false)
+
+  async function load() {
+    loading.value = true
+    try {
+      const { secrets: list, descriptors: descs } = await api.listUserSecrets()
+      secrets.value = list
+      descriptors.value = descs
+    } catch {
+      // Auth disabled / not signed in / feature off → nothing to surface.
+      secrets.value = []
+      descriptors.value = []
+    } finally {
+      loading.value = false
+    }
+  }
+
+  function statusFor(kind: UserSecretKind): UserSecretStatus | undefined {
+    return secrets.value.find((s) => s.kind === kind)
+  }
+
+  function descriptorFor(kind: UserSecretKind): UserSecretDescriptor | undefined {
+    return descriptors.value.find((d) => d.kind === kind)
+  }
+
+  async function store(kind: UserSecretKind, input: StoreUserSecretInput) {
+    const status = await api.storeUserSecret(kind, input)
+    secrets.value = [...secrets.value.filter((s) => s.kind !== kind), status]
+    return status
+  }
+
+  async function remove(kind: UserSecretKind) {
+    await api.deleteUserSecret(kind)
+    secrets.value = secrets.value.filter((s) => s.kind !== kind)
+  }
+
+  async function test(
+    kind: UserSecretKind,
+    input: TestUserSecretInput,
+  ): Promise<ConnectionTestResult> {
+    return await api.testUserSecret(kind, input)
+  }
+
+  return { secrets, descriptors, loading, load, statusFor, descriptorFor, store, remove, test }
+})

package/app/types/userSecrets.ts

@@ -0,0 +1,49 @@
+// Frontend mirrors of the per-user secret + provider-config wire contracts
+// (`@cat-factory/contracts` user-secret.ts + provider-config.ts).
+
+export type UserSecretKind = 'github_pat'
+
+/** One config value a kind needs, rendered as a single form field. */
+export interface ProviderConfigField {
+  key: string
+  label: string
+  help?: string
+  placeholder?: string
+  secret?: boolean
+  required?: boolean
+  type?: 'text' | 'password' | 'select'
+  options?: { value: string; label: string }[]
+}
+
+/** Read-only status of one stored per-user secret — never the secret value. */
+export interface UserSecretStatus {
+  kind: UserSecretKind
+  label: string
+  hasSecret: boolean
+  metadata?: Record<string, string>
+  connectedAt: number
+}
+
+/** A kind's self-description for the generic connect form. */
+export interface UserSecretDescriptor {
+  kind: UserSecretKind
+  label: string
+  configFields: ProviderConfigField[]
+  supportsTest: boolean
+}
+
+export interface StoreUserSecretInput {
+  label?: string
+  secret: string
+  metadata?: Record<string, string>
+}
+
+export interface TestUserSecretInput {
+  secret: string
+  metadata?: Record<string, string>
+}
+
+export interface ConnectionTestResult {
+  ok: boolean
+  message?: string
+}

package/package.json

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