@cat-factory/app 0.182.1 → 0.184.0

package/app/components/sandbox/SandboxPanel.vue

@@ -10,6 +10,7 @@ import type {
   SandboxExperimentStatus,
   SandboxFixtureKind,
   SandboxGrade,
+  SandboxPromptOrigin,
   SandboxPromptVersion,
   SandboxRun,
 } from '~/types/sandbox'
@@ -35,6 +36,47 @@ const FIXTURE_KIND_LABEL = computed<Record<SandboxFixtureKind, string>>(() => ({
   'repo-feature': t('sandbox.fixtureKind.repo-feature'),
   'repo-bug': t('sandbox.fixtureKind.repo-bug'),
 }))
+/**
+ * Badge colour per prompt origin. An exhaustive Record over the closed union rather than a
+ * ternary, so adding an origin fails the typecheck here instead of silently rendering as
+ * "candidate" — the drift guard the i18n conventions ask for on enum-keyed lookups.
+ */
+const PROMPT_ORIGIN_COLOR: Record<SandboxPromptOrigin, 'neutral' | 'primary' | 'warning'> = {
+  baseline: 'neutral',
+  candidate: 'primary',
+  workspace: 'warning',
+}
+
+/** Which version is mid-promotion, so only its button spins. */
+const promoting = ref<string | null>(null)
+
+/**
+ * Promotion is offered on anything that is not already what the workspace runs: a graded
+ * candidate (the point of the tool) and an older workspace revision (rolling back). Not on the
+ * live row, where it is a no-op the backend would swallow anyway — and not on a shipped baseline,
+ * since "run what the product ships" is the revert in the prompt editor, not a promotion that
+ * would pin today's wording as a stored override.
+ */
+function canPromote(version: SandboxPromptVersion): boolean {
+  return version.origin !== 'baseline' && version.live !== true
+}
+
+async function promote(version: SandboxPromptVersion) {
+  promoting.value = version.id
+  try {
+    await store.promotePrompt(version)
+    toast.add({
+      title: t('sandbox.prompts.promoted', { agent: version.agentKind }),
+      color: 'success',
+      icon: 'i-lucide-rocket',
+    })
+  } catch {
+    toast.add({ title: t('sandbox.prompts.promoteFailed'), color: 'error' })
+  } finally {
+    promoting.value = null
+  }
+}
+
 const FIXTURE_ORIGIN_LABEL = computed<Record<'builtin' | 'custom', string>>(() => ({
   builtin: t('sandbox.fixtureOrigin.builtin'),
   custom: t('sandbox.fixtureOrigin.custom'),
@@ -508,17 +550,20 @@ async function archive(prompt: SandboxPromptVersion) {
               <div class="min-w-0">
                 <div class="flex items-center gap-2">
                   <span class="truncate text-slate-200">{{ p.name }}</span>
-                  <UBadge
-                    :color="p.origin === 'baseline' ? 'neutral' : 'primary'"
-                    variant="soft"
-                    size="xs"
-                  >
+                  <UBadge :color="PROMPT_ORIGIN_COLOR[p.origin]" variant="soft" size="xs">
                     {{
                       p.origin === 'baseline'
                         ? t('sandbox.baseline')
                         : t('sandbox.versionLabel', { version: p.version })
                     }}
                   </UBadge>
+                  <UBadge v-if="p.origin === 'workspace'" color="warning" variant="soft" size="xs">
+                    {{
+                      p.live
+                        ? t('sandbox.prompts.liveInWorkspace')
+                        : t('sandbox.prompts.fromWorkspace')
+                    }}
+                  </UBadge>
                 </div>
                 <span class="text-[11px] text-slate-500">{{ p.agentKind }}</span>
               </div>
@@ -535,6 +580,19 @@ async function archive(prompt: SandboxPromptVersion) {
                   "
                   @click="edit(p)"
                 />
+                <!-- Deploy: make this version the workspace's live prompt for its agent kind.
+                     Offered on a graded candidate and on an older workspace revision (rolling
+                     back), but not on the one already live, where it would be a no-op. -->
+                <UButton
+                  v-if="canPromote(p)"
+                  icon="i-lucide-rocket"
+                  color="primary"
+                  variant="ghost"
+                  size="xs"
+                  :loading="promoting === p.id"
+                  :title="t('sandbox.prompts.promoteTitle')"
+                  @click="promote(p)"
+                />
                 <UButton
                   v-if="p.origin === 'candidate'"
                   icon="i-lucide-archive"

package/app/components/settings/InfrastructureWindow.logic.spec.ts

@@ -0,0 +1,100 @@
+import { describe, expect, it } from 'vitest'
+import {
+  infrastructureTabs,
+  openInfrastructureTab,
+  repinInfrastructureTab,
+} from './InfrastructureWindow.logic'
+
+const NONE = { agents: false, environments: false, packageRegistries: false }
+
+describe('infrastructureTabs', () => {
+  it('shows nothing when no probe reports a backend', () => {
+    expect(infrastructureTabs(NONE)).toEqual([])
+  })
+
+  it('rides the environment probe for shared stacks', () => {
+    // A shared stack is infra a Tester environment ATTACHES to, so it cannot stand on its own:
+    // without an environment backend there is nothing to attach it to.
+    expect(infrastructureTabs({ ...NONE, environments: true })).toEqual([
+      'environment',
+      'shared-stacks',
+    ])
+  })
+
+  it('gates the registries tab on its own module probe', () => {
+    // The backend 503s the module with no encryption key. That is independent of any execution
+    // or test-env backend, so the tab can be the ONLY one a deployment shows.
+    expect(infrastructureTabs({ ...NONE, packageRegistries: true })).toEqual(['package-registries'])
+    expect(infrastructureTabs({ ...NONE, agents: true })).toEqual(['runner-pool'])
+  })
+
+  it('orders tabs by the question they answer, not by which probe resolved', () => {
+    expect(
+      infrastructureTabs({ agents: true, environments: true, packageRegistries: true }),
+    ).toEqual(['runner-pool', 'environment', 'shared-stacks', 'package-registries'])
+  })
+})
+
+describe('openInfrastructureTab', () => {
+  it('honours an available deep-linked tab over the first one', () => {
+    expect(openInfrastructureTab(['runner-pool', 'package-registries'], 'package-registries')).toBe(
+      'package-registries',
+    )
+  })
+
+  it('falls back to the first available tab when the request is off', () => {
+    expect(openInfrastructureTab(['runner-pool'], 'package-registries')).toBe('runner-pool')
+  })
+
+  it('keeps naming the requested tab when nothing is available yet', () => {
+    // Every probe is still in flight on the first open. Holding the request (rather than
+    // inventing a selection) is what lets the re-pin land on it the moment its probe resolves.
+    expect(openInfrastructureTab([], 'package-registries')).toBe('package-registries')
+  })
+})
+
+describe('repinInfrastructureTab', () => {
+  it('leaves the user where they are when their tab is still available', () => {
+    // The list GROWS as probes resolve; someone reading a tab must not be yanked off it.
+    expect(
+      repinInfrastructureTab(
+        ['runner-pool', 'environment', 'package-registries'],
+        'environment',
+        'runner-pool',
+        true,
+      ),
+    ).toBe('environment')
+  })
+
+  it('lands on the deep-linked tab once its probe resolves', () => {
+    // The registries probe is the slow one: the window opened on `runner-pool` because
+    // `package-registries` was not there yet, and this is the moment it arrives.
+    expect(
+      repinInfrastructureTab(
+        ['runner-pool', 'package-registries'],
+        'shared-stacks',
+        'package-registries',
+        true,
+      ),
+    ).toBe('package-registries')
+  })
+
+  it('does not steal the selection while the probes are still settling', () => {
+    // A transient list holding only the fastest probe's tab. Falling back to it here would pin
+    // the user to whichever probe won the race and then REJECT the deep link for being a peer
+    // of the current tab.
+    expect(
+      repinInfrastructureTab(['runner-pool'], 'package-registries', 'package-registries', false),
+    ).toBe('package-registries')
+  })
+
+  it('falls back to the first tab once loading settled and the request is unavailable', () => {
+    expect(
+      repinInfrastructureTab(['runner-pool'], 'package-registries', 'package-registries', true),
+    ).toBe('runner-pool')
+  })
+
+  it('holds the current tab when settling left nothing available at all', () => {
+    expect(repinInfrastructureTab([], 'environment', 'environment', true)).toBe('environment')
+  })
+})

package/app/components/settings/InfrastructureWindow.logic.ts

@@ -0,0 +1,78 @@
+import type { InfrastructureTab } from '~/types/providerConnections'
+
+// Pure tab arithmetic behind `InfrastructureWindow.vue`: which tabs exist for this deployment,
+// and which one to show. Extracted so it is unit-tested directly rather than through the DOM —
+// the window's tabs come from THREE probes that resolve independently (the infrastructure
+// capability, the provider-connection store, the package-registries module), so the interesting
+// behaviour is what happens while the list is still growing, which a rendered-component test
+// reproduces only by accident.
+//
+// Labels stay in the component: a label resolved here would have to travel as a message KEY and
+// be fed to `t()` as a variable, which is exactly what defeats the typed-message-key check. The
+// component maps a tab onto a literal `t()` call through an exhaustive Record instead.
+
+/** Which of the window's tabs this deployment can show, as their probes currently read. */
+export interface InfrastructureTabAvailability {
+  /** An execution backend is reported (runner pool / container runtime / local). */
+  agents: boolean
+  /** A test-environment backend is reported. Also gates the shared-stacks tab. */
+  environments: boolean
+  /** The package-registries module answered its probe affirmatively (it 503s unconfigured). */
+  packageRegistries: boolean
+}
+
+/**
+ * The window's tabs, in display order. Order is the reading order of the questions they answer:
+ * where agent containers run, where test environments run, what those environments attach to,
+ * and what a checkout may install from.
+ *
+ * Shared stacks ride the test-environment probe because a stack is infra an environment attaches
+ * to — there is nothing to attach without an environment backend.
+ */
+export function infrastructureTabs(available: InfrastructureTabAvailability): InfrastructureTab[] {
+  const tabs: InfrastructureTab[] = []
+  if (available.agents) tabs.push('runner-pool')
+  if (available.environments) tabs.push('environment', 'shared-stacks')
+  if (available.packageRegistries) tabs.push('package-registries')
+  return tabs
+}
+
+/**
+ * The tab to show when the window OPENS. The deep-linked request wins whenever it is available;
+ * otherwise fall back to the first tab that is.
+ *
+ * Whatever tab was showing last time is deliberately NOT consulted: the caller has just asked
+ * for `requested`, and honouring a leftover selection over it would silently ignore the deep
+ * link. Falling back to `requested` when nothing is available at all keeps the ref naming the
+ * thing that was asked for, so the re-pin below can land on it once its probe resolves.
+ */
+export function openInfrastructureTab(
+  tabs: readonly InfrastructureTab[],
+  requested: InfrastructureTab,
+): InfrastructureTab {
+  if (tabs.includes(requested)) return requested
+  return tabs[0] ?? requested
+}
+
+/**
+ * The tab to show after the tab list CHANGES (a probe resolved). Unlike the open-time choice
+ * this one protects the user's current position: a tab list that grows under someone reading a
+ * tab must not yank them elsewhere.
+ *
+ * `settled` is what stops the transient single-tab list from stealing the selection. The probes
+ * resolve independently, so the list legitimately passes through states missing tabs that are
+ * about to appear; falling back to the first tab before the probes have settled would pin the
+ * user to whichever one happened to resolve first, and the deep-linked tab would then be
+ * REJECTED for being the current one's peer rather than shown.
+ */
+export function repinInfrastructureTab(
+  tabs: readonly InfrastructureTab[],
+  current: InfrastructureTab,
+  requested: InfrastructureTab,
+  settled: boolean,
+): InfrastructureTab {
+  if (tabs.includes(current)) return current
+  if (tabs.includes(requested)) return requested
+  if (settled && tabs.length) return tabs[0]!
+  return current
+}

package/app/components/settings/InfrastructureWindow.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 // The single tabbed "Infrastructure" window — now a TOP-LEVEL navbar destination (no longer
-// reached through the Integrations hub). Two topical tabs:
+// reached through the Integrations hub). Its topical tabs:
 //   - "Agent containers" — where repo-operating agent containers run. Shows the execution
 //     backend selector, the runner-pool connection (ProviderConnectionTab), and — in local
 //     mode — the warm-container-pool + checkout-reuse settings (the local agent-container
@@ -10,24 +10,33 @@
 //     Compose setup (formerly a standalone "Environment setup" sidebar entry — it writes a
 //     service's Compose recipe plus the workspace's Compose handler, so it belongs beside the
 //     settings it edits rather than at the same level as them).
+//   - "Shared stacks" — long-lived Compose infra a Tester environment attaches to, so it rides
+//     the same probe as the environments tab (nothing to attach to without one).
+//   - "Package registries" — the private npm registries a checkout installs from (formerly an
+//     Integrations-hub row). What a container can resolve its dependencies from is part of the
+//     execution environment, not an optional external system a workspace links in.
 // Local-specific affordances render inline, gated on `auth.localMode?.enabled`. A tab whose
 // backend integration is disabled (503) simply doesn't render.
 import { computed, ref, watch } from 'vue'
-import type { ProviderConnectionKind } from '~/types/providerConnections'
+import type { InfrastructureTab } from '~/types/providerConnections'
+import {
+  infrastructureTabs,
+  openInfrastructureTab,
+  repinInfrastructureTab,
+} from '~/components/settings/InfrastructureWindow.logic'
 import InfrastructureBackendPicker from '~/components/settings/InfrastructureBackendPicker.vue'
 import InfraHandlersConfigurator from '~/components/settings/InfraHandlersConfigurator.vue'
 import DefaultProvisionTypeSection from '~/components/settings/DefaultProvisionTypeSection.vue'
 import LocalContainerPoolSettings from '~/components/settings/LocalContainerPoolSettings.vue'
 import SharedStacksPanel from '~/components/settings/SharedStacksPanel.vue'
 import ComposeEnvironmentSetupSection from '~/components/settings/ComposeEnvironmentSetupSection.vue'
-
-// The shared-stacks tab uses its own slot key beyond the provider-connection kinds.
-type InfraTabValue = ProviderConnectionKind | 'shared-stacks'
+import PackageRegistriesPanel from '~/components/settings/PackageRegistriesPanel.vue'
 
 const { t } = useI18n()
 const ui = useUiStore()
 const store = useProviderConnectionsStore()
 const auth = useAuthStore()
+const packageRegistries = usePackageRegistriesStore()
 
 const open = computed({
   get: () => ui.infrastructureOpen,
@@ -45,35 +54,41 @@ const isLocal = computed(() => auth.localMode?.enabled === true)
 const agentsAvailable = computed(() => (auth.infrastructure?.execution.available.length ?? 0) > 0)
 const envsAvailable = computed(() => (auth.infrastructure?.testEnv.available.length ?? 0) > 0)
 
-const tabs = computed(() => {
-  const out: { value: InfraTabValue; label: string; icon: string; slot: string }[] = []
-  if (agentsAvailable.value)
-    out.push({
-      value: 'runner-pool',
-      label: t('settings.providerConnection.tabs.agentContainers'),
-      icon: 'i-lucide-server-cog',
-      slot: 'runner-pool',
-    })
-  if (envsAvailable.value)
-    out.push({
-      value: 'environment',
-      label: t('settings.providerConnection.tabs.testEnvironments'),
-      icon: 'i-lucide-cloud',
-      slot: 'environment',
-    })
-  // Shared stacks are long-lived compose infra a Tester environment attaches to, so they live
-  // alongside the test-environment config (shown wherever an environment backend is available).
-  if (envsAvailable.value)
-    out.push({
-      value: 'shared-stacks',
-      label: t('settings.sharedStacks.tab'),
-      icon: 'i-lucide-layers',
-      slot: 'shared-stacks',
-    })
-  return out
-})
+// Tab presentation, keyed by the closed `InfrastructureTab` union so a new tab fails to compile
+// until it is given a label and an icon. The labels are literal `t()` calls for the same reason
+// they are not resolved in the logic module: a key assembled at runtime is invisible to the
+// typed-message-key check.
+const TAB_LABELS = computed<Record<InfrastructureTab, string>>(() => ({
+  'runner-pool': t('settings.providerConnection.tabs.agentContainers'),
+  environment: t('settings.providerConnection.tabs.testEnvironments'),
+  'shared-stacks': t('settings.sharedStacks.tab'),
+  'package-registries': t('settings.packageRegistries.tab'),
+}))
+const TAB_ICONS: Record<InfrastructureTab, string> = {
+  'runner-pool': 'i-lucide-server-cog',
+  environment: 'i-lucide-cloud',
+  'shared-stacks': 'i-lucide-layers',
+  'package-registries': 'i-lucide-package',
+}
 
-const activeTab = ref<InfraTabValue>(ui.infrastructureTab)
+// `slot` mirrors `value` — the template names one `<template #…>` per tab value.
+const tabs = computed(() =>
+  infrastructureTabs({
+    agents: agentsAvailable.value,
+    environments: envsAvailable.value,
+    // The module's own probe (the backend 503s with no encryption key), same gate as the
+    // Integrations-hub row this replaced — an unconfigured backend shows no dead tab.
+    packageRegistries: packageRegistries.available === true,
+  }).map((value) => ({
+    value,
+    label: TAB_LABELS.value[value],
+    icon: TAB_ICONS[value],
+    slot: value,
+  })),
+)
+const tabValues = computed(() => tabs.value.map((x) => x.value))
+
+const activeTab = ref<InfrastructureTab>(ui.infrastructureTab)
 
 // Honour the deep-linked tab each time the window opens, falling back to the first available
 // tab if the requested one is off.
@@ -82,24 +97,25 @@ watch(
   (isOpen) => {
     if (!isOpen) return
     void store.ensureLoaded().catch(() => {})
-    const requested = ui.infrastructureTab
-    const available = tabs.value.map((x) => x.value)
-    activeTab.value = available.includes(requested) ? requested : (available[0] ?? requested)
+    // The registries tab gates on this probe, so it has to resolve for the tab to appear at
+    // all — the panel's own load is a no-op once this settled (`ensureLoaded` coalesces).
+    // Swallowed here on purpose: the PANEL reports a load failure, and it can only do that
+    // once the tab it lives in exists, so a probe failure has to leave the window itself alone.
+    void packageRegistries.ensureLoaded().catch(() => {})
+    activeTab.value = openInfrastructureTab(tabValues.value, ui.infrastructureTab)
   },
   { immediate: true },
 )
 // When availability resolves after open, re-pin onto a valid tab — but keep honouring the
-// deep-linked request. The two availability probes resolve independently, so `tabs` can pass
-// through a transient single-tab list; only fall back to the first tab once loading settled.
+// deep-linked request. The three availability probes resolve independently, so `tabs` can pass
+// through a transient short list; only fall back to the first tab once loading settled.
 watch([tabs, () => store.loaded], () => {
-  const list = tabs.value
-  if (list.some((x) => x.value === activeTab.value)) return
-  const requested = ui.infrastructureTab
-  if (list.some((x) => x.value === requested)) {
-    activeTab.value = requested
-  } else if (store.loaded && list.length) {
-    activeTab.value = list[0]!.value
-  }
+  activeTab.value = repinInfrastructureTab(
+    tabValues.value,
+    activeTab.value,
+    ui.infrastructureTab,
+    store.loaded,
+  )
 })
 </script>
 
@@ -157,6 +173,9 @@ watch([tabs, () => store.loaded], () => {
           <template #shared-stacks>
             <SharedStacksPanel />
           </template>
+          <template #package-registries>
+            <PackageRegistriesPanel />
+          </template>
         </UTabs>
 
         <p v-else class="px-1 py-6 text-center text-sm text-slate-500">