@cat-factory/app 0.171.0 → 0.173.0

package/app/components/fragments/GitHubDocUrlImport.vue

@@ -0,0 +1,83 @@
+<script setup lang="ts">
+// Paste a GitHub/GitLab file or directory URL to start a document-fragment link without
+// the repo typeahead: the URL is parsed client-side (owner/repo + path + file-vs-dir) and
+// the repo resolved through the SHARED available-repos list by its exact slug — the
+// backend point-reads an exact `owner/name`, so this never depends on the provider's
+// name search (where a pasted URL matches nothing). Emits the resolved repo + location;
+// the manager stages a file or opens the tree browser at the directory for bulk picking.
+import { parseRepoWebUrl } from '@cat-factory/contracts'
+import type { GitHubAvailableRepo } from '~/types/domain'
+
+const emit = defineEmits<{
+  resolved: [{ repo: GitHubAvailableRepo; path: string; kind: 'file' | 'dir' }]
+}>()
+
+const { t } = useI18n()
+const github = useGitHubStore()
+
+const url = ref('')
+const resolving = ref(false)
+const error = ref<string | null>(null)
+
+async function importUrl() {
+  const input = url.value.trim()
+  if (!input || resolving.value) return
+  const parsed = parseRepoWebUrl(input)
+  if (!parsed) {
+    error.value = t('fragments.documents.urlImport.invalid')
+    return
+  }
+  resolving.value = true
+  error.value = null
+  const slug = `${parsed.owner}/${parsed.repo}`
+  try {
+    // Load into the SHARED picker list (not the side-effect-free search) so the repo
+    // select alongside this field can render the resolved selection's label.
+    await github.loadAvailableRepos(slug)
+    const repo = github.availableRepos.find(
+      (r) =>
+        r.owner.toLowerCase() === parsed.owner.toLowerCase() &&
+        r.name.toLowerCase() === parsed.repo.toLowerCase(),
+    )
+    if (!repo) {
+      error.value = t('fragments.documents.urlImport.notFound', { slug })
+      return
+    }
+    emit('resolved', { repo, path: parsed.path, kind: parsed.kind })
+    url.value = ''
+  } catch (e) {
+    error.value = e instanceof Error ? e.message : String(e)
+  } finally {
+    resolving.value = false
+  }
+}
+</script>
+
+<template>
+  <div class="flex flex-col gap-1">
+    <div class="flex gap-2">
+      <UInput
+        v-model="url"
+        icon="i-lucide-link-2"
+        :placeholder="t('fragments.documents.urlImport.placeholder')"
+        class="flex-1"
+        data-testid="fragment-url-import-input"
+        @keyup.enter="importUrl"
+      />
+      <UButton
+        size="sm"
+        variant="outline"
+        icon="i-lucide-folder-search"
+        :loading="resolving"
+        :disabled="!url.trim()"
+        data-testid="fragment-url-import-button"
+        @click="importUrl"
+      >
+        {{ t('fragments.documents.urlImport.action') }}
+      </UButton>
+    </div>
+    <p v-if="error" class="text-xs text-red-400" data-testid="fragment-url-import-error">
+      {{ error }}
+    </p>
+  </div>
+</template>

package/app/components/github/RepoTreeBrowser.vue

@@ -62,6 +62,22 @@ const isEmpty = computed(() =>
   props.mode === 'dir' ? dirEntries.value.length === 0 : treeEntries.value.length === 0,
 )
 
+// file + multiple: the bulk-pick header. "Select all" checks every file of the CURRENT
+// listing that isn't already picked or added elsewhere; unchecking clears only this
+// listing's picks (never the cart entries staged from other folders).
+const selectableFiles = computed(() =>
+  props.mode === 'file' && props.multiple ? fileEntries.value.filter((e) => !isAdded(e.path)) : [],
+)
+const allSelected = computed(
+  () => selectableFiles.value.length > 0 && selectableFiles.value.every((e) => isPicked(e.path)),
+)
+function toggleAllFiles() {
+  const check = !allSelected.value
+  for (const entry of selectableFiles.value) {
+    if (isPicked(entry.path) !== check) emit('toggle', entry.path)
+  }
+}
+
 const breadcrumbs = computed(() => {
   const segments = currentPath.value ? currentPath.value.split('/') : []
   let acc = ''
@@ -175,21 +191,60 @@ watch(
           </UButton>
         </li>
         <template v-if="mode === 'file'">
+          <!-- multiple: a bulk header so a whole directory of documents is one click -->
           <li
-            v-for="entry in fileEntries"
-            :key="entry.path"
-            class="flex items-center justify-between gap-2 px-3 py-1.5"
+            v-if="selectableFiles.length > 1"
+            class="flex items-center gap-2 bg-slate-900/60 px-3 py-1.5"
           >
+            <UCheckbox
+              :model-value="allSelected"
+              :aria-label="
+                t(
+                  'github.repoTree.selectAllFiles',
+                  { count: selectableFiles.length },
+                  selectableFiles.length,
+                )
+              "
+              data-testid="repo-tree-select-all"
+              @update:model-value="toggleAllFiles"
+            />
             <button
               type="button"
-              class="flex items-center gap-2 truncate text-sm hover:text-primary-400"
-              :class="isPicked(entry.path) ? 'text-primary-400' : 'text-slate-300'"
-              :disabled="isAdded(entry.path)"
-              @click="pick(entry.path)"
+              class="text-xs text-slate-400 hover:text-primary-400"
+              @click="toggleAllFiles"
             >
-              <UIcon name="i-lucide-file" class="h-4 w-4 shrink-0 text-slate-400" />
-              <span class="truncate">{{ entry.name }}</span>
+              {{
+                t(
+                  'github.repoTree.selectAllFiles',
+                  { count: selectableFiles.length },
+                  selectableFiles.length,
+                )
+              }}
             </button>
+          </li>
+          <li
+            v-for="entry in fileEntries"
+            :key="entry.path"
+            class="flex items-center justify-between gap-2 px-3 py-1.5"
+          >
+            <div class="flex min-w-0 items-center gap-2">
+              <UCheckbox
+                v-if="multiple && !isAdded(entry.path)"
+                :model-value="isPicked(entry.path)"
+                :aria-label="entry.name"
+                @update:model-value="pick(entry.path)"
+              />
+              <button
+                type="button"
+                class="flex items-center gap-2 truncate text-sm hover:text-primary-400"
+                :class="isPicked(entry.path) ? 'text-primary-400' : 'text-slate-300'"
+                :disabled="isAdded(entry.path)"
+                @click="pick(entry.path)"
+              >
+                <UIcon name="i-lucide-file" class="h-4 w-4 shrink-0 text-slate-400" />
+                <span class="truncate">{{ entry.name }}</span>
+              </button>
+            </div>
             <span
               v-if="isAdded(entry.path)"
               class="flex shrink-0 items-center gap-1 text-xs text-slate-500"
@@ -198,7 +253,7 @@ watch(
               {{ t('github.repoTree.added') }}
             </span>
             <UIcon
-              v-else-if="isPicked(entry.path)"
+              v-else-if="!multiple && isPicked(entry.path)"
               name="i-lucide-check"
               class="h-4 w-4 shrink-0 text-primary-400"
             />

package/app/components/initiative/InitiativePlanningWindow.vue

@@ -1,19 +1,31 @@
 <script setup lang="ts">
 // The interactive-planning Q&A window (slice 2) — the dedicated view of the initiative
 // INTERVIEWER gate. While the planning run is parked, the interviewer's clarifying questions
-// (pending `qa` entries with an empty answer) are shown here; the human answers them, then
-// either CONTINUES (the interviewer re-runs and may ask follow-ups) or PROCEEDS (skip
-// remaining questions — the interviewer converges and the run advances to the analyst/planner).
+// (pending `qa` entries with an empty answer) are shown here; the human answers them, then either
+// SUBMITS them (the `continue` action: the interviewer re-runs and may ask follow-ups) or plans
+// now (the `proceed` action: skip the remaining questions — the interviewer converges and the run
+// advances to the analyst/planner). The labels say submit/plan-now rather than continue/proceed
+// because the latter pair both read as "go forward" and were indistinguishable in use.
 // Opened via the universal result-view host: from the inspector / card
 // (`ui.openInitiativePlanning`) or as the interviewer step's result view. Live `initiative`
 // stream events patch the store, so an open window follows the interview as it progresses.
+//
+// CONTINUE/PROCEED ARE ASYNC. They only record the intent on the parked step and wake the durable
+// driver; the interviewer LLM then runs for as long as it takes, and the response carries the
+// PRE-resume entity. So the window must not key its body on the entity alone — that renders
+// identically before and after the click, which reads as the button having done nothing. The
+// phase below folds the planning RUN's status in, so the wait is visible and a failed pass says
+// so instead of leaving the human staring at questions they already submitted.
 import { computed, reactive, watch } from 'vue'
 import ClarificationItem from '~/components/common/ClarificationItem.vue'
+import InterviewGateNotice from '~/components/common/InterviewGateNotice.vue'
 import { INITIATIVE_STATUS_LABEL_KEYS } from '~/utils/initiative'
+import { interviewGatePhase } from '~/utils/interviewGate'
 import ResultWindowShell from '~/components/panels/ResultWindowShell.vue'
 
 const board = useBoardStore()
 const initiatives = useInitiativesStore()
+const execution = useExecutionStore()
 const { t } = useI18n()
 
 const { open, blockId, close } = useResultView('initiative-planning', {
@@ -22,6 +34,7 @@ const { open, blockId, close } = useResultView('initiative-planning', {
 
 const block = computed(() => (blockId.value ? board.getBlock(blockId.value) : undefined))
 const initiative = computed(() => (blockId.value ? initiatives.forBlock(blockId.value) : null))
+const run = computed(() => (blockId.value ? execution.getByBlock(blockId.value) : undefined))
 
 /** Every interview exchange, with a stable key for the list + draft map. */
 const questions = computed(() =>
@@ -31,8 +44,6 @@ const questions = computed(() =>
 const pending = computed(() =>
   questions.value.filter((q) => q.status !== 'dismissed' && !(q.answer ?? '').trim()),
 )
-/** The interview converged (or never started with a model): nothing left to answer. */
-const converged = computed(() => initiative.value?.interview?.status === 'done')
 
 // Per-question answer drafts, seeded from the entity and refreshed as new rounds arrive
 // without clobbering an answer the human is mid-edit on.
@@ -48,11 +59,26 @@ watch(
 )
 
 const resuming = computed(() => initiatives.resuming)
+
 /**
- * Continue is meaningful once every pending question has a drafted answer. A dismissed question
- * doesn't count (it was set aside), so an all-dismissed round is trivially "answered".
+ * The live phase (see `interviewGatePhase`). `resuming` folds in the request itself so the
+ * body swaps to the waiting state on the click rather than a beat later when the run's `running`
+ * event lands — and if the request fails, `resuming` clears and the phase falls back to whatever
+ * the run actually says, so the questions come back rather than the window sticking on a spinner.
  */
-const allAnswered = computed(() => pending.value.every((q) => drafts[q.key]?.trim()))
+const phase = computed(() =>
+  resuming.value
+    ? 'working'
+    : interviewGatePhase(initiative.value?.interview?.status, run.value?.status),
+)
+
+/**
+ * Questions still missing a drafted answer. Continue is only meaningful once this is empty — but a
+ * disabled button with no stated reason is itself a "nothing happened", so the count is rendered.
+ * A dismissed question doesn't count (it was set aside), so an all-dismissed round is trivially
+ * answered.
+ */
+const unanswered = computed(() => pending.value.filter((q) => !drafts[q.key]?.trim()).length)
 
 /**
  * Persist one answer if its draft differs from what's recorded. A `dismissed` question is skipped:
@@ -135,9 +161,38 @@ const onProceed = () => flushThen((id) => initiatives.proceedPlanning(id))
           {{ t('initiative.planning.intro') }}
         </p>
 
+        <!-- A pass is running: the human is waiting on the planner. Without this the window is
+             byte-identical to the parked state and the submit reads as a no-op. -->
+        <InterviewGateNotice
+          v-if="phase === 'working'"
+          variant="working"
+          :title="t('initiative.planning.working')"
+          :hint="t('initiative.planning.workingHint')"
+          testid="initiative-planning-working"
+        />
+
+        <!-- The planning run stopped before the interview settled — a dead end otherwise. -->
+        <InterviewGateNotice
+          v-else-if="phase === 'failed'"
+          variant="failed"
+          :title="t('initiative.planning.failed')"
+          :hint="t('initiative.planning.failedHint')"
+          testid="initiative-planning-failed"
+        />
+
+        <!-- Planning was never started, so there is nothing to answer YET (distinct from
+             converged, which means the planner already has what it needs). -->
+        <div
+          v-else-if="phase === 'idle' && questions.length === 0"
+          class="rounded-lg border border-slate-800 bg-slate-950/40 p-4 text-center text-[13px] text-slate-400"
+          data-testid="initiative-planning-idle"
+        >
+          {{ t('initiative.planning.idle') }}
+        </div>
+
         <!-- Converged / no pending questions -->
         <div
-          v-if="converged || questions.length === 0"
+          v-else-if="phase === 'converged' || questions.length === 0"
           class="rounded-lg border border-slate-800 bg-slate-950/40 p-4 text-center text-[13px] text-slate-400"
           data-testid="initiative-planning-converged"
         >
@@ -166,13 +221,21 @@ const onProceed = () => flushThen((id) => initiatives.proceedPlanning(id))
       </template>
     </div>
 
-    <!-- Action rail -->
+    <!-- Action rail. Only while the run is actually parked on the human: mid-pass these would
+         re-submit a question set already in flight, and the resume is a no-op once it isn't. -->
     <footer
-      v-if="initiative && !converged && questions.length > 0"
+      v-if="initiative && phase === 'awaiting' && questions.length > 0"
       class="flex items-center justify-between gap-3 border-t border-slate-800 px-5 py-3"
     >
       <p class="text-[11px] text-slate-500">
-        {{ t('initiative.planning.hint') }}
+        <span
+          v-if="unanswered > 0"
+          class="text-amber-400/90"
+          data-testid="initiative-planning-unanswered"
+        >
+          {{ t('initiative.planning.unanswered', { count: unanswered }) }}
+        </span>
+        <span v-else>{{ t('initiative.planning.hint') }}</span>
       </p>
       <div class="flex items-center gap-2">
         <UButton
@@ -180,6 +243,7 @@ const onProceed = () => flushThen((id) => initiatives.proceedPlanning(id))
           variant="ghost"
           size="sm"
           :loading="resuming"
+          :title="t('initiative.planning.proceedTitle')"
           data-testid="initiative-planning-proceed"
           @click="onProceed"
         >
@@ -189,7 +253,12 @@ const onProceed = () => flushThen((id) => initiatives.proceedPlanning(id))
           color="primary"
           size="sm"
           :loading="resuming"
-          :disabled="!allAnswered"
+          :disabled="unanswered > 0"
+          :title="
+            unanswered > 0
+              ? t('initiative.planning.unanswered', { count: unanswered })
+              : t('initiative.planning.continueTitle')
+          "
           data-testid="initiative-planning-continue"
           @click="onContinue"
         >

package/app/components/layout/DefaultTestEnvBanner.vue

@@ -0,0 +1,117 @@
+<script setup lang="ts">
+// Convenience prompt to pick the board's DEFAULT test-environment provisioning mechanism — the
+// provision type suggested for every newly added service. Fires on a workspace that has recorded
+// no choice, which covers all three cases the product asked for with ONE condition rather than
+// three: a board created by hand, the board the SPA creates implicitly on first launch, and an
+// older board that predates the setting. All of them simply have `defaultProvisionType == null`.
+//
+// The nag ends the moment a decision is RECORDED, including `infraless` ("services stand up no
+// environment") — that is a real answer, not an absence. See the contracts block comment on
+// `defaultProvisionType` for why the field is nullable rather than defaulted.
+//
+// Positioning/stacking against the sibling advisory banners is owned by the shared click-through
+// column in `pages/index.vue`; this renders only its card and re-enables pointer events on it.
+import { computed } from 'vue'
+import {
+  defaultProvisioningConfigUrl,
+  needsDefaultProvisioningChoice,
+} from '~/utils/defaultProvisioning'
+
+const { t } = useI18n()
+const ui = useUiStore()
+const workspace = useWorkspaceStore()
+const settingsStore = useWorkspaceSettingsStore()
+const { canManageSettings } = useWorkspaceAccess()
+
+// Only prompt someone who can actually answer. A member/viewer cannot write workspace settings
+// (the endpoint is `settings.manage`-gated), so for them this would be an un-actionable nag
+// pointing at a screen that would refuse their save.
+const show = computed(
+  () =>
+    workspace.ready &&
+    canManageSettings.value &&
+    needsDefaultProvisioningChoice(settingsStore.settings) &&
+    !ui.defaultProvisionDismissed,
+)
+
+// A real, copyable link to the configuration screen — so this can be handed to whoever owns the
+// board's infrastructure instead of being described. Clicking it opens the screen in place
+// (no reload); the `href` is what makes middle-click, "copy link address" and open-in-new-tab
+// work, and the ui store consumes the same param on load so a pasted link lands on the section.
+const configUrl = computed(() => defaultProvisioningConfigUrl())
+
+function openConfig(event: MouseEvent) {
+  // Leave the modified clicks (new tab / new window / download) to the browser.
+  if (event.metaKey || event.ctrlKey || event.shiftKey || event.altKey || event.button !== 0) return
+  event.preventDefault()
+  ui.openDefaultProvisionSettings()
+}
+</script>
+
+<template>
+  <Transition name="fade">
+    <div
+      v-if="show"
+      class="pointer-events-auto w-full max-w-3xl rounded-2xl border border-sky-500/50 bg-sky-950/90 p-4 shadow-xl backdrop-blur"
+      role="status"
+      aria-live="polite"
+      data-testid="default-test-env-banner"
+    >
+      <div class="flex items-start gap-3">
+        <UIcon name="i-lucide-flask-conical" class="mt-0.5 h-7 w-7 shrink-0 text-sky-400" />
+        <div class="min-w-0 flex-1">
+          <div class="flex items-start justify-between gap-3">
+            <h2 class="text-sm font-semibold text-sky-100">
+              {{ t('layout.defaultTestEnvBanner.title') }}
+            </h2>
+            <UButton
+              color="neutral"
+              variant="ghost"
+              size="xs"
+              icon="i-lucide-x"
+              :aria-label="t('common.close')"
+              data-testid="default-test-env-dismiss"
+              @click="ui.dismissDefaultProvision()"
+            />
+          </div>
+          <p class="mt-1 text-[13px] text-sky-200/90">
+            {{ t('layout.defaultTestEnvBanner.body') }}
+          </p>
+          <div class="mt-3 flex flex-wrap items-center gap-x-3 gap-y-2">
+            <UButton
+              :to="configUrl"
+              size="sm"
+              color="info"
+              variant="solid"
+              icon="i-lucide-settings"
+              data-testid="default-test-env-configure"
+              @click="openConfig"
+            >
+              {{ t('layout.defaultTestEnvBanner.action') }}
+            </UButton>
+            <!-- The URL itself, shown so it can be read and copied, not just clicked. -->
+            <a
+              :href="configUrl"
+              class="min-w-0 truncate font-mono text-[11px] text-sky-300/80 underline decoration-dotted underline-offset-2 hover:text-sky-200"
+              data-testid="default-test-env-url"
+              @click="openConfig"
+            >
+              {{ configUrl }}
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </Transition>
+</template>
+
+<style scoped>
+.fade-enter-active,
+.fade-leave-active {
+  transition: opacity 0.2s ease;
+}
+.fade-enter-from,
+.fade-leave-to {
+  opacity: 0;
+}
+</style>

package/app/components/panels/inspector/InitiativeInspector.vue

@@ -23,6 +23,7 @@ const {
   planningPipeline,
   running,
   awaitingAnswers,
+  interviewing,
   starting,
   runPlanning,
   openPlanning,
@@ -66,6 +67,20 @@ function control(action: 'pause' | 'resume' | 'cancel') {
       >
         {{ t('initiative.inspector.answerPlanning') }}
       </UButton>
+      <!-- Mid-pass there is nothing to answer, but the window must stay reachable — it is where
+           the "planner is working" state is shown. -->
+      <UButton
+        v-else-if="interviewing"
+        data-testid="initiative-planning-in-progress"
+        color="neutral"
+        variant="soft"
+        size="sm"
+        icon="i-lucide-loader-circle"
+        :ui="{ leadingIcon: 'animate-spin' }"
+        @click="openPlanning"
+      >
+        {{ t('initiative.inspector.planningInProgress') }}
+      </UButton>
       <UButton
         data-testid="initiative-run-planning"
         color="primary"

package/app/components/settings/DefaultProvisionTypeSection.vue

@@ -0,0 +1,176 @@
+<script setup lang="ts">
+// The workspace's DEFAULT test-environment provisioning mechanism — the provision type stamped
+// onto every newly added service frame so the operator declares it once per board instead of
+// once per service. Lives at the top of the Infrastructure window's "Test environments" tab,
+// above the per-type handler configurator, because it answers the question that comes FIRST:
+// what do this board's services produce, before you configure how each type is handled.
+//
+// This is a SUGGESTION for new services, never a run-time override: the engine still reads only
+// a service's own `provisioning`, so saving a different default here never changes what an
+// existing service provisions (each stays editable in its inspector).
+//
+// The section opens on the workspace's recorded choice, or — with nothing recorded — on the first
+// REGISTERED custom provider when the deployment brought one. All of that precedence lives in
+// `utils/defaultProvisioning.ts` so it is unit-tested and shared with the banner that nags about
+// the unset state. Nothing is persisted until the operator saves.
+import { computed, ref, watch } from 'vue'
+import type { ProvisionType } from '@cat-factory/contracts'
+import {
+  canSaveDefaultProvisioning,
+  suggestDefaultProvisioning,
+  type DefaultProvisioningSelection,
+} from '~/utils/defaultProvisioning'
+
+const { t } = useI18n()
+const infra = useInfraConfigStore()
+const settingsStore = useWorkspaceSettingsStore()
+const toast = useToast()
+
+onMounted(() => {
+  void infra.ensureLoaded()
+})
+
+// The saved state, and the (unsaved) edit state seeded from it. Re-seeded whenever the saved
+// choice or the custom-type catalog changes — the catalog arrives asynchronously, so without the
+// second dependency a board whose only sensible answer is a registered provider would open unset
+// and never pick it up.
+const selection = ref<DefaultProvisioningSelection>({ type: null, manifestId: null })
+watch(
+  [() => settingsStore.settings, () => infra.customTypes],
+  ([settings, customTypes]) => {
+    selection.value = suggestDefaultProvisioning(settings, customTypes)
+  },
+  { immediate: true, deep: true },
+)
+
+// Whether what's on screen differs from what's stored — drives both the Save button and the
+// "this is only a suggestion so far" hint, so a preselected-but-unsaved custom provider can
+// never read as already configured.
+const dirty = computed(
+  () =>
+    selection.value.type !== settingsStore.settings.defaultProvisionType ||
+    (selection.value.manifestId ?? null) !==
+      (settingsStore.settings.defaultProvisionManifestId ?? null),
+)
+const unset = computed(() => settingsStore.settings.defaultProvisionType == null)
+const canSave = computed(() => canSaveDefaultProvisioning(selection.value) && dirty.value)
+
+const PROVISION_TYPES = computed<{ value: ProvisionType; label: string }[]>(() => [
+  { value: 'infraless', label: t('inspector.testConfig.provisionTypes.infraless') },
+  { value: 'docker-compose', label: t('inspector.testConfig.provisionTypes.docker-compose') },
+  { value: 'kubernetes', label: t('inspector.testConfig.provisionTypes.kubernetes') },
+  { value: 'cloudflare', label: t('inspector.testConfig.provisionTypes.cloudflare') },
+  { value: 'custom', label: t('inspector.testConfig.provisionTypes.custom') },
+])
+
+const customTypeItems = computed(() =>
+  infra.customTypes.map((c) => ({ label: `${c.label} (${c.manifestId})`, value: c.manifestId })),
+)
+
+function setType(type: ProvisionType) {
+  // Switching away from `custom` drops the pinned id, matching the server's normalisation — a
+  // retained id would silently reappear on switching back.
+  selection.value =
+    type === 'custom'
+      ? { type, manifestId: selection.value.manifestId ?? infra.customTypes[0]?.manifestId ?? null }
+      : { type, manifestId: null }
+}
+
+function setManifestId(manifestId: string) {
+  selection.value = { type: 'custom', manifestId: manifestId || null }
+}
+
+const saving = ref(false)
+async function save() {
+  if (!canSave.value || saving.value) return
+  saving.value = true
+  try {
+    await settingsStore.update({
+      defaultProvisionType: selection.value.type,
+      defaultProvisionManifestId: selection.value.manifestId,
+    })
+    toast.add({ title: t('settings.defaultProvision.saved'), color: 'success' })
+  } catch (e) {
+    toast.add({
+      title: t('settings.defaultProvision.saveFailed'),
+      description: e instanceof Error ? e.message : undefined,
+      color: 'error',
+    })
+  } finally {
+    saving.value = false
+  }
+}
+</script>
+
+<template>
+  <section class="space-y-3" data-testid="default-provision-section">
+    <div>
+      <h3 class="text-sm font-semibold text-slate-200">
+        {{ t('settings.defaultProvision.title') }}
+      </h3>
+      <p class="mt-1 text-[11px] leading-snug text-slate-500">
+        {{ t('settings.defaultProvision.hint') }}
+      </p>
+    </div>
+
+    <div class="flex flex-wrap gap-1">
+      <UButton
+        v-for="p in PROVISION_TYPES"
+        :key="p.value"
+        :color="selection.type === p.value ? 'primary' : 'neutral'"
+        :variant="selection.type === p.value ? 'soft' : 'ghost'"
+        size="xs"
+        :data-testid="`default-provision-type-${p.value}`"
+        @click="setType(p.value)"
+      >
+        {{ p.label }}
+      </UButton>
+    </div>
+
+    <div v-if="selection.type === 'custom'" class="space-y-1">
+      <label class="text-[11px] text-slate-400">
+        {{ t('inspector.testConfig.customManifestId') }}
+      </label>
+      <USelect
+        v-if="customTypeItems.length"
+        :model-value="selection.manifestId ?? ''"
+        :items="customTypeItems"
+        size="xs"
+        class="w-full"
+        data-testid="default-provision-manifest-id"
+        :placeholder="t('inspector.testConfig.customManifestIdPlaceholder')"
+        @update:model-value="(v: string) => setManifestId(v)"
+      />
+      <p v-else class="text-[11px] leading-snug text-amber-300/80">
+        {{ t('inspector.testConfig.customNoTypes') }}
+      </p>
+    </div>
+
+    <!-- A preselected suggestion must never read as already configured: say so explicitly while
+         the workspace still has nothing stored. -->
+    <p
+      v-if="unset && selection.type"
+      class="text-[11px] leading-snug text-amber-300/80"
+      data-testid="default-provision-suggestion-hint"
+    >
+      {{ t('settings.defaultProvision.suggestionHint') }}
+    </p>
+
+    <div class="flex items-center gap-2">
+      <UButton
+        size="xs"
+        color="primary"
+        icon="i-lucide-check"
+        :loading="saving"
+        :disabled="!canSave"
+        data-testid="default-provision-save"
+        @click="save"
+      >
+        {{ t('settings.defaultProvision.save') }}
+      </UButton>
+      <span v-if="!unset && !dirty" class="text-[11px] text-slate-500">
+        {{ t('settings.defaultProvision.savedState') }}
+      </span>
+    </div>
+  </section>
+</template>