@cat-factory/app 0.46.10 → 0.46.12

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

@@ -20,6 +20,7 @@ const board = useBoardStore()
 const accounts = useAccountsStore()
 const github = useGitHubStore()
 const services = useServicesStore()
+const { t } = useI18n()
 
 const composePath = computed(() => props.block.testComposePath ?? '')
 const noInfra = computed(() => props.block.noInfraDependencies === true)
@@ -29,14 +30,20 @@ const noInfra = computed(() => props.block.noInfraDependencies === true)
 // against a provisioned environment. A task can override it per-task in its agent
 // settings. Absent ⇒ the built-in `ephemeral`.
 type TestEnvironment = 'local' | 'ephemeral'
-const TEST_ENVIRONMENTS: { value: TestEnvironment; label: string; hint: string }[] = [
-  {
-    value: 'ephemeral',
-    label: 'Ephemeral environment',
-    hint: 'tests run against a provisioned env',
-  },
-  { value: 'local', label: 'Local (docker-compose)', hint: 'the Tester stands deps up locally' },
-]
+const TEST_ENVIRONMENTS = computed<{ value: TestEnvironment; label: string; hint: string }[]>(
+  () => [
+    {
+      value: 'ephemeral',
+      label: t('inspector.testConfig.env.ephemeral'),
+      hint: t('inspector.testConfig.env.ephemeralHint'),
+    },
+    {
+      value: 'local',
+      label: t('inspector.testConfig.env.local'),
+      hint: t('inspector.testConfig.env.localHint'),
+    },
+  ],
+)
 const effectiveTestEnv = computed<TestEnvironment>(
   () => props.block.defaultTestEnvironment ?? 'ephemeral',
 )
@@ -86,20 +93,20 @@ function toggleNoInfra(value: boolean) {
   board.updateBlock(props.block.id, { noInfraDependencies: value })
 }
 
-const PROVIDERS: { value: CloudProvider; label: string }[] = [
+const PROVIDERS = computed<{ value: CloudProvider; label: string }[]>(() => [
   { value: 'cloudflare', label: 'Cloudflare' },
-  { value: 'docker', label: 'Docker (local)' },
+  { value: 'docker', label: t('inspector.testConfig.providers.docker') },
   { value: 'aws', label: 'AWS' },
   { value: 'gcp', label: 'GCP' },
   { value: 'azure', label: 'Azure' },
-  { value: 'custom', label: 'Custom' },
-]
-const SIZES: { value: InstanceSize; label: string }[] = [
-  { value: 'small', label: 'Small' },
-  { value: 'medium', label: 'Medium' },
-  { value: 'large', label: 'Large' },
-  { value: 'xlarge', label: 'XLarge' },
-]
+  { value: 'custom', label: t('inspector.testConfig.providers.custom') },
+])
+const SIZES = computed<{ value: InstanceSize; label: string }[]>(() => [
+  { value: 'small', label: t('inspector.testConfig.sizes.small') },
+  { value: 'medium', label: t('inspector.testConfig.sizes.medium') },
+  { value: 'large', label: t('inspector.testConfig.sizes.large') },
+  { value: 'xlarge', label: t('inspector.testConfig.sizes.xlarge') },
+])
 
 function setProvider(value: CloudProvider) {
   board.updateBlock(props.block.id, { cloudProvider: value })
@@ -114,11 +121,11 @@ const missingInfra = computed(() => !noInfra.value && composePath.value.trim() =
 <template>
   <div class="space-y-3">
     <div class="text-[11px] font-semibold uppercase tracking-wide text-slate-500">
-      Test infrastructure
+      {{ t('inspector.testConfig.title') }}
     </div>
 
     <div class="space-y-1">
-      <span class="text-[11px] text-slate-400">Default test environment</span>
+      <span class="text-[11px] text-slate-400">{{ t('inspector.testConfig.defaultEnv') }}</span>
       <div class="flex flex-wrap gap-1">
         <UButton
           v-for="e in TEST_ENVIRONMENTS"
@@ -133,13 +140,12 @@ const missingInfra = computed(() => !noInfra.value && composePath.value.trim() =
         </UButton>
       </div>
       <p class="text-[11px] leading-snug text-slate-500">
-        The default tasks under this service are spawned with — each task can override it in its
-        agent settings.
+        {{ t('inspector.testConfig.defaultEnvHint') }}
       </p>
     </div>
 
     <div class="space-y-1">
-      <label class="text-[11px] text-slate-400">docker-compose path</label>
+      <label class="text-[11px] text-slate-400">{{ t('inspector.testConfig.composePath') }}</label>
       <div class="flex items-center gap-1">
         <UInput
           :model-value="composePath"
@@ -159,20 +165,20 @@ const missingInfra = computed(() => !noInfra.value && composePath.value.trim() =
           color="neutral"
           icon="i-lucide-folder-search"
           :disabled="noInfra"
-          title="Browse the repository for the compose file"
+          :title="t('inspector.testConfig.browseRepo')"
           @click="openBrowse"
         />
       </div>
       <p class="text-[11px] leading-snug text-slate-500">
-        Used by the Tester to stand up the service's dependencies locally.
+        {{ t('inspector.testConfig.composeHint') }}
       </p>
     </div>
 
-    <UModal v-model:open="browseOpen" title="Select the docker-compose file">
+    <UModal v-model:open="browseOpen" :title="t('inspector.testConfig.selectComposeTitle')">
       <template #body>
         <div v-if="repoContext" class="space-y-3">
           <p class="text-xs text-slate-400">
-            Pick the compose file in the repository — its path is stored relative to the repo root.
+            {{ t('inspector.testConfig.selectComposeHint') }}
           </p>
           <RepoTreeBrowser
             v-model="pickedPath"
@@ -183,12 +189,16 @@ const missingInfra = computed(() => !noInfra.value && composePath.value.trim() =
           <div class="flex items-center justify-between gap-2">
             <p class="truncate text-xs text-slate-400">
               <template v-if="pickedPath">
-                Selected: <code class="text-slate-200">{{ pickedPath }}</code>
+                <i18n-t keypath="inspector.testConfig.selected" tag="span" scope="global">
+                  <template #path>
+                    <code class="text-slate-200">{{ pickedPath }}</code>
+                  </template>
+                </i18n-t>
               </template>
-              <template v-else>No file selected.</template>
+              <template v-else>{{ t('inspector.testConfig.noFileSelected') }}</template>
             </p>
             <UButton size="xs" color="primary" :disabled="!pickedPath" @click="applyPicked">
-              Use this file
+              {{ t('inspector.testConfig.useThisFile') }}
             </UButton>
           </div>
         </div>
@@ -200,12 +210,11 @@ const missingInfra = computed(() => !noInfra.value && composePath.value.trim() =
         :model-value="noInfra"
         @update:model-value="(v: boolean | 'indeterminate') => toggleNoInfra(v === true)"
       />
-      No infra dependencies (the Tester spins nothing up)
+      {{ t('inspector.testConfig.noInfra') }}
     </label>
 
     <p v-if="missingInfra" class="text-[11px] leading-snug text-amber-500">
-      Set a docker-compose path or enable “no infra dependencies”, otherwise a pipeline with a
-      Tester won't start.
+      {{ t('inspector.testConfig.missingInfra') }}
     </p>
 
     <!-- Provisioning hints: advisory inputs to the ephemeral-environment provisioner.
@@ -220,18 +229,18 @@ const missingInfra = computed(() => !noInfra.value && composePath.value.trim() =
           :name="showProvisioning ? 'i-lucide-chevron-down' : 'i-lucide-chevron-right'"
           class="h-3.5 w-3.5"
         />
-        Ephemeral environment provisioning
+        {{ t('inspector.testConfig.provisioningTitle') }}
       </button>
 
       <div v-if="showProvisioning" class="mt-2 space-y-3">
         <p class="text-[11px] leading-snug text-slate-500">
-          A hint for provisioning this service's ephemeral test environment — which cloud provider
-          to deploy to and how large an instance to request. Ignored for local (docker-compose)
-          testing.
+          {{ t('inspector.testConfig.provisioningHint') }}
         </p>
 
         <div class="space-y-1">
-          <span class="text-[11px] text-slate-400">Cloud provider</span>
+          <span class="text-[11px] text-slate-400">{{
+            t('inspector.testConfig.cloudProvider')
+          }}</span>
           <div class="flex flex-wrap gap-1">
             <UButton
               v-for="p in PROVIDERS"
@@ -247,7 +256,9 @@ const missingInfra = computed(() => !noInfra.value && composePath.value.trim() =
         </div>
 
         <div class="space-y-1">
-          <span class="text-[11px] text-slate-400">Instance size</span>
+          <span class="text-[11px] text-slate-400">{{
+            t('inspector.testConfig.instanceSize')
+          }}</span>
           <div class="flex flex-wrap gap-1">
             <UButton
               v-for="s in SIZES"

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

@@ -13,6 +13,7 @@ const props = defineProps<{ block: Block }>()
 const board = useBoardStore()
 const agentConfig = useAgentConfigStore()
 const execution = useExecutionStore()
+const { t } = useI18n()
 
 // The descriptors that apply: those contributed by the task's pinned pipeline, plus
 // any whose value is already set (so an existing choice always stays visible/editable
@@ -77,20 +78,20 @@ function setValue(id: string, value: string) {
 <template>
   <div v-if="descriptors.length" class="space-y-3">
     <div class="text-[11px] font-semibold uppercase tracking-wide text-slate-500">
-      Agent configuration
+      {{ t('inspector.agentConfig.title') }}
     </div>
     <div v-for="d in descriptors" :key="d.id" class="space-y-1">
       <div class="flex items-center justify-between">
         <span class="text-[11px] text-slate-400">{{ d.label }}</span>
         <div class="flex items-center gap-1.5">
-          <span v-if="isInherited(d)" class="text-[10px] text-slate-500"
-            >inherited from service</span
-          >
+          <span v-if="isInherited(d)" class="text-[10px] text-slate-500">{{
+            t('inspector.agentConfig.inherited')
+          }}</span>
           <UIcon
             v-if="isFrozen(d.agentKind)"
             name="i-lucide-lock"
             class="h-3 w-3 text-slate-500"
-            title="Frozen — the agent has started"
+            :title="t('inspector.agentConfig.frozen')"
           />
         </div>
       </div>

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

@@ -5,6 +5,7 @@ const props = defineProps<{ block: Block }>()
 
 const board = useBoardStore()
 const { depLabel } = useDepLabels()
+const { t } = useI18n()
 
 const deps = computed(() =>
   (props.block.dependsOn ?? []).map((id) => board.getBlock(id)).filter((b): b is Block => !!b),
@@ -35,7 +36,7 @@ function removeDep(depId: string) {
   <div>
     <div class="mb-1 flex items-center justify-between">
       <span class="text-[11px] font-semibold uppercase tracking-wide text-slate-400">
-        Depends on
+        {{ t('inspector.dependencies.title') }}
       </span>
       <UDropdownMenu v-if="depMenu.length" :items="depMenu">
         <UButton
@@ -55,16 +56,20 @@ function removeDep(depId: string) {
         variant="subtle"
         size="sm"
         class="cursor-pointer"
-        :title="d.status === 'done' ? 'Merged' : 'Not merged yet'"
+        :title="
+          d.status === 'done'
+            ? t('inspector.dependencies.merged')
+            : t('inspector.dependencies.notMerged')
+        "
         @click="removeDep(d.id)"
       >
         {{ label(d) }}
         <UIcon name="i-lucide-x" class="ml-0.5 h-3 w-3" />
       </UBadge>
     </div>
-    <div v-else class="text-[11px] text-slate-500">No dependencies — can run any time.</div>
+    <div v-else class="text-[11px] text-slate-500">{{ t('inspector.dependencies.empty') }}</div>
     <div v-if="!runnable" class="mt-1 text-[10px] text-amber-400">
-      Blocked until dependencies merge.
+      {{ t('inspector.dependencies.blocked') }}
     </div>
   </div>
 </template>

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

@@ -6,18 +6,19 @@ import { computed } from 'vue'
 import type { Block } from '~/types/domain'
 
 const props = defineProps<{ block: Block }>()
+const { t, n } = useI18n()
 
 const estimate = computed(() => props.block.estimate ?? null)
 
-const AXES = [
-  { key: 'complexity', label: 'Complexity' },
-  { key: 'risk', label: 'Risk' },
-  { key: 'impact', label: 'Impact' },
-] as const
+const AXES = computed(
+  () =>
+    [
+      { key: 'complexity', label: t('inspector.estimate.complexity') },
+      { key: 'risk', label: t('inspector.estimate.risk') },
+      { key: 'impact', label: t('inspector.estimate.impact') },
+    ] as const,
+)
 
-function pct(n: number): number {
-  return Math.round(n * 100)
-}
 /** Cool→hot bar colour by severity (low = sky, mid = amber, high = rose). */
 function barClass(n: number): string {
   if (n >= 0.66) return 'bg-rose-500'
@@ -32,7 +33,7 @@ function barClass(n: number): string {
       class="flex items-center gap-1.5 text-xs font-semibold uppercase tracking-wide text-slate-400"
     >
       <UIcon name="i-lucide-gauge" class="h-3.5 w-3.5" />
-      Estimate
+      {{ t('inspector.estimate.title') }}
     </div>
     <div class="space-y-1.5 rounded-lg border border-slate-800 bg-slate-900/40 p-2.5">
       <div v-for="axis in AXES" :key="axis.key" class="flex items-center gap-2">
@@ -41,12 +42,12 @@ function barClass(n: number): string {
           <div
             class="h-full rounded-full"
             :class="barClass(estimate[axis.key])"
-            :style="{ width: `${pct(estimate[axis.key])}%` }"
+            :style="{ width: `${Math.round(estimate[axis.key] * 100)}%` }"
           />
         </div>
-        <span class="w-9 shrink-0 text-right text-xs tabular-nums text-slate-300"
-          >{{ pct(estimate[axis.key]) }}%</span
-        >
+        <span class="w-9 shrink-0 text-right text-xs tabular-nums text-slate-300">{{
+          n(estimate[axis.key], { key: 'percent' })
+        }}</span>
       </div>
       <p v-if="estimate.rationale" class="pt-1 text-xs leading-relaxed text-slate-500">
         {{ estimate.rationale }}

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

@@ -11,6 +11,7 @@ const agentRuns = useAgentRunsStore()
 const ui = useUiStore()
 const models = useModelsStore()
 const reviews = useReviewStage()
+const { t } = useI18n()
 
 // The async stage this task's iterative reviewer gate (requirements-review / clarity-review)
 // is mid-cycle in (folding the answers, then re-reviewing), or null. While set, the gate is
@@ -19,11 +20,11 @@ const reviews = useReviewStage()
 const reviewStage = computed(() => reviews.stageForBlock(props.block.id))
 const reviewStageLabel = computed(() =>
   reviewStage.value === 'incorporating'
-    ? 'Incorporating…'
+    ? t('inspector.execution.stage.incorporating')
     : reviewStage.value === 'reviewing'
-      ? 'Re-reviewing…'
+      ? t('inspector.execution.stage.reviewing')
       : reviewStage.value === 'recommending'
-        ? 'Recommending…'
+        ? t('inspector.execution.stage.recommending')
         : null,
 )
 
@@ -44,14 +45,16 @@ const pr = computed(() => props.block.pullRequest)
 const prMerged = computed(() => props.block.status === 'done')
 const prLabel = computed(() => {
   const number = pr.value?.number
-  return number ? `PR #${number}` : 'Pull request'
+  return number
+    ? t('inspector.execution.prNumber', { number })
+    : t('inspector.execution.pullRequest')
 })
 
 const stepLabel: Record<string, string> = {
-  pending: 'Pending',
-  working: 'Working',
-  waiting_decision: 'Needs decision',
-  done: 'Done',
+  pending: 'inspector.execution.stepState.pending',
+  working: 'inspector.execution.stepState.working',
+  waiting_decision: 'inspector.execution.stepState.waiting_decision',
+  done: 'inspector.execution.stepState.done',
 }
 
 /** A step left mid-flight (`working`) on a failed run gave up — not still working. */
@@ -68,17 +71,19 @@ function labelForStep(s: {
   startingContainer?: boolean
 }) {
   // A step left mid-flight on a failed run reads "Failed", not the misleading "Working".
-  if (stepFailed(s)) return 'Failed'
+  if (stepFailed(s)) return t('inspector.execution.failed')
   // A reviewer gate mid-cycle reads its working stage, not "Needs approval".
   if (reviews.isBackground(s.agentKind, props.block.id) && reviewStageLabel.value)
     return reviewStageLabel.value
   // A companion that spent its rework budget needs a decision, not an approval.
-  if (s.approval?.status === 'pending' && s.companion?.exceeded) return 'Needs decision'
-  if (s.approval?.status === 'pending') return 'Needs approval'
+  if (s.approval?.status === 'pending' && s.companion?.exceeded)
+    return t('inspector.execution.needsDecision')
+  if (s.approval?.status === 'pending') return t('inspector.execution.needsApproval')
   // A container-backed step whose container is still cold-booting (only while the
   // run is live — a failed run's mid-flight step is no longer spinning up).
-  if (s.startingContainer && !runFailed.value) return 'Spinning up…'
-  return stepLabel[s.state]
+  if (s.startingContainer && !runFailed.value) return t('inspector.execution.spinningUp')
+  const key = stepLabel[s.state]
+  return key ? t(key) : s.state
 }
 
 function openDecisionFor(decisionId: string) {
@@ -138,11 +143,11 @@ async function resetRun() {
             size="xs"
             :loading="stopping"
             :disabled="resetting"
-            title="Stop the run but keep it (readable + retryable)"
+            :title="t('inspector.execution.stopTooltip')"
             data-testid="run-stop"
             @click="stopRun"
           >
-            Stop
+            {{ t('inspector.execution.stop') }}
           </UButton>
           <!-- Destructive: discard the run and return the task to planned. -->
           <UButton
@@ -152,11 +157,11 @@ async function resetRun() {
             size="xs"
             :loading="resetting"
             :disabled="stopping"
-            title="Discard this run and reset the task to planned"
+            :title="t('inspector.execution.resetTooltip')"
             data-testid="run-reset"
             @click="resetRun"
           >
-            Reset
+            {{ t('inspector.execution.reset') }}
           </UButton>
         </div>
       </div>
@@ -173,7 +178,11 @@ async function resetRun() {
             <button
               type="button"
               class="flex min-w-0 cursor-pointer items-center gap-2 text-left transition hover:text-white"
-              :title="s.output ? 'View details & read output' : 'View step details'"
+              :title="
+                s.output
+                  ? t('inspector.execution.viewDetailsOutput')
+                  : t('inspector.execution.viewDetails')
+              "
               @click="openStep(i)"
             >
               <UIcon
@@ -187,9 +196,9 @@ async function resetRun() {
               <span
                 v-if="isCompanionKind(s.agentKind)"
                 class="shrink-0 rounded bg-slate-700/60 px-1 text-[9px] font-medium uppercase tracking-wide text-slate-300"
-                title="Companion of a producer step"
+                :title="t('inspector.execution.companionTooltip')"
               >
-                Companion
+                {{ t('inspector.execution.companion') }}
               </span>
               <UIcon
                 :name="s.output ? 'i-lucide-book-open-text' : 'i-lucide-info'"
@@ -201,8 +210,15 @@ async function resetRun() {
               class="ml-auto font-mono text-[10px] tabular-nums text-slate-300"
               :title="
                 s.subtasks.inProgress > 0
-                  ? `${s.subtasks.completed} of ${s.subtasks.total} subtasks done, ${s.subtasks.inProgress} in progress`
-                  : `${s.subtasks.completed} of ${s.subtasks.total} subtasks done`
+                  ? t('inspector.execution.subtasksProgress', {
+                      completed: s.subtasks.completed,
+                      total: s.subtasks.total,
+                      inProgress: s.subtasks.inProgress,
+                    })
+                  : t('inspector.execution.subtasksDone', {
+                      completed: s.subtasks.completed,
+                      total: s.subtasks.total,
+                    })
               "
             >
               {{ s.subtasks.completed }}/{{ s.subtasks.total }}
@@ -225,7 +241,7 @@ async function resetRun() {
               icon="i-lucide-circle-help"
               @click="openDecisionFor(s.decision.id)"
             >
-              Resolve
+              {{ t('inspector.execution.resolve') }}
             </UButton>
             <!-- reviewer gate folding/re-reviewing in the background: a working
                  indicator, NOT a "Review" gate (the human is summoned only if needed) -->
@@ -248,7 +264,7 @@ async function resetRun() {
               icon="i-lucide-alert-triangle"
               @click="openApprovalFor(s.approval.id)"
             >
-              Decide
+              {{ t('inspector.execution.decide') }}
             </UButton>
             <UButton
               v-else-if="s.approval && s.approval.status === 'pending'"
@@ -262,7 +278,11 @@ async function resetRun() {
               "
               @click="openApprovalFor(s.approval.id)"
             >
-              {{ agentKindMeta(s.agentKind).resultView ? 'Review' : 'Approve' }}
+              {{
+                agentKindMeta(s.agentKind).resultView
+                  ? t('inspector.execution.review')
+                  : t('inspector.execution.approve')
+              }}
             </UButton>
           </div>
           <div
@@ -286,10 +306,20 @@ async function resetRun() {
           <div
             v-if="s.selectedFragmentIds && s.selectedFragmentIds.length"
             class="mt-0.5 flex flex-wrap items-center gap-1 pl-6 text-[10px] text-slate-500"
-            :title="`Best-practice fragments folded into this step: ${s.selectedFragmentIds.join(', ')}`"
+            :title="
+              t('inspector.execution.fragmentsTooltip', {
+                fragments: s.selectedFragmentIds.join(', '),
+              })
+            "
           >
             <UIcon name="i-lucide-book-marked" class="h-3 w-3 shrink-0" />
-            <span>{{ s.selectedFragmentIds.length }} standard(s) applied</span>
+            <span>{{
+              t(
+                'inspector.execution.standardsApplied',
+                { count: s.selectedFragmentIds.length },
+                s.selectedFragmentIds.length,
+              )
+            }}</span>
           </div>
           <!-- Conditionally-run companion (the Tester's fixer): possible/running/
                completed/skipped, so it's clear whether a fix pass ran. -->
@@ -306,7 +336,11 @@ async function resetRun() {
               ]"
             />
             <span class="text-slate-400">
-              {{ agentKindMeta(gateCompanionFor(s, runFailed)!.kind).label }} (companion)
+              {{
+                t('inspector.execution.companionOf', {
+                  label: agentKindMeta(gateCompanionFor(s, runFailed)!.kind).label,
+                })
+              }}
             </span>
             <span
               class="ml-auto"
@@ -325,7 +359,7 @@ async function resetRun() {
     <!-- Open PR: link straight to it on GitHub -->
     <div v-if="pr" class="space-y-2">
       <span class="text-[11px] font-semibold uppercase tracking-wide text-slate-400">
-        Pull request
+        {{ t('inspector.execution.pullRequest') }}
       </span>
       <UButton
         :to="pr.url"
@@ -342,7 +376,7 @@ async function resetRun() {
         <span class="flex w-full items-center gap-2">
           {{ prLabel }}
           <UBadge :color="prMerged ? 'success' : 'info'" variant="subtle" size="sm" class="ml-auto">
-            {{ prMerged ? 'Merged' : 'Open' }}
+            {{ prMerged ? t('inspector.execution.merged') : t('inspector.execution.open') }}
           </UBadge>
         </span>
       </UButton>
@@ -362,7 +396,7 @@ async function resetRun() {
       block
       @click="execution.mergePr(block.id)"
     >
-      Merge PR
+      {{ t('inspector.execution.mergePr') }}
     </UButton>
   </div>
 </template>