@cat-factory/app 0.137.1 → 0.138.0

package/app/components/visualConfirm/VisualConfirmationWindow.vue

@@ -10,9 +10,9 @@
 import { computed, onUnmounted, reactive, ref, watch } from 'vue'
 import type { VisualConfirmStepState } from '~/types/execution'
 import { useArtifactBlobs } from '~/composables/useArtifactBlobs'
-import { useFocusTrap } from '~/composables/useFocusTrap'
 import ImageCompare from '~/components/media/ImageCompare.vue'
 import ArtifactLightbox from '~/components/media/ArtifactLightbox.vue'
+import ResultWindowShell from '~/components/panels/ResultWindowShell.vue'
 import StepRunMeta from '~/components/panels/StepRunMeta.vue'
 
 const board = useBoardStore()
@@ -26,8 +26,17 @@ const access = useWorkspaceAccess()
 const blobs = useArtifactBlobs()
 onUnmounted(() => blobs.revokeAll())
 
-const { open, blockId, instanceId, stepIndex, close } = useResultView('visual-confirm')
+// `manageEscape: false` — `ResultWindowShell` owns Escape (and the focus trap + scroll lock +
+// stacking); the nested lightbox layers above it on the same shared overlay stack.
+const { open, blockId, instanceId, stepIndex, close } = useResultView('visual-confirm', {
+  manageEscape: false,
+})
 const block = computed(() => (blockId.value ? board.getBlock(blockId.value) : undefined))
+const headerTitle = computed(() =>
+  block.value
+    ? t('visualConfirm.titleWithBlock', { title: block.value.title })
+    : t('visualConfirm.title'),
+)
 
 const instance = computed(() =>
   instanceId.value === null ? null : (execution.getInstance(instanceId.value) ?? null),
@@ -95,14 +104,6 @@ function expand(artifactId: string) {
   lightboxOpen.value = true
 }
 
-// Focus management for the modal panel. While the lightbox is open it owns the trap, so the
-// window hands off (active = open && !lightbox) to avoid two Tab traps fighting.
-const dialogRoot = ref<HTMLElement | null>(null)
-useFocusTrap(
-  dialogRoot,
-  computed(() => open.value && !lightboxOpen.value),
-)
-
 // --- Request a fix: per-view notes + a freeform box, composed into one findings string. ---
 const perViewNotes = reactive<Record<string, string>>({})
 const noteOpen = reactive<Record<string, boolean>>({})
@@ -187,278 +188,239 @@ const canApprove = computed(
 </script>
 
 <template>
-  <Teleport to="body">
-    <div
-      v-if="open"
-      class="fixed inset-0 z-50 flex max-h-[100dvh] items-stretch justify-center bg-slate-950/70 backdrop-blur-sm"
-      @click.self="close"
-    >
+  <ResultWindowShell
+    :open="open"
+    icon="i-lucide-image-play"
+    icon-class="bg-amber-500/15 text-amber-300"
+    :title="headerTitle"
+    :subtitle="phase ? PHASE_LABEL[phase] : t('visualConfirm.subtitle')"
+    width="5xl"
+    @close="close"
+  >
+    <div class="flex min-h-0 flex-1 flex-col gap-4 overflow-y-auto px-5 py-4">
       <div
-        ref="dialogRoot"
-        tabindex="-1"
-        role="dialog"
-        aria-modal="true"
-        :aria-label="t('visualConfirm.ariaLabel')"
-        class="m-4 flex w-full max-w-5xl flex-col overflow-hidden rounded-2xl border border-slate-800 bg-slate-900 shadow-2xl focus:outline-none"
+        v-if="!vc"
+        class="flex flex-col items-center justify-center gap-2 py-10 text-center text-slate-400"
       >
-        <header class="flex items-center gap-3 border-b border-slate-800 px-5 py-3">
-          <span
-            class="flex h-8 w-8 items-center justify-center rounded-lg bg-amber-500/15 text-amber-300"
-          >
-            <UIcon name="i-lucide-image-play" class="h-4 w-4" />
-          </span>
-          <div class="min-w-0 flex-1">
-            <h2 class="truncate text-sm font-semibold text-slate-100">
-              {{
-                block
-                  ? t('visualConfirm.titleWithBlock', { title: block.title })
-                  : t('visualConfirm.title')
-              }}
-            </h2>
-            <p class="truncate text-[11px] text-slate-400">
-              {{ phase ? PHASE_LABEL[phase] : t('visualConfirm.subtitle') }}
-            </p>
-          </div>
-          <button
-            class="rounded-md p-1.5 text-slate-400 hover:bg-slate-800 hover:text-slate-200"
-            @click="close"
-          >
-            <UIcon name="i-lucide-x" class="h-4 w-4" />
-          </button>
-        </header>
-
-        <div class="flex min-h-0 flex-1 flex-col gap-4 overflow-y-auto px-5 py-4">
-          <div
-            v-if="!vc"
-            class="flex flex-col items-center justify-center gap-2 py-10 text-center text-slate-400"
-          >
-            <UIcon name="i-lucide-image-play" class="h-8 w-8 opacity-40" />
-            <p class="text-sm">{{ t('visualConfirm.notStarted') }}</p>
-          </div>
+        <UIcon name="i-lucide-image-play" class="h-8 w-8 opacity-40" />
+        <p class="text-sm">{{ t('visualConfirm.notStarted') }}</p>
+      </div>
 
-          <template v-else>
-            <p
-              v-if="vc.degradedReason"
-              class="rounded-lg border border-amber-700/40 bg-amber-500/5 px-3 py-2 text-[12px] text-amber-300/90"
-            >
-              {{ vc.degradedReason }}
-            </p>
+      <template v-else>
+        <p
+          v-if="vc.degradedReason"
+          class="rounded-lg border border-amber-700/40 bg-amber-500/5 px-3 py-2 text-[12px] text-amber-300/90"
+        >
+          {{ vc.degradedReason }}
+        </p>
 
-            <p
-              v-if="working"
-              class="flex items-center gap-2 rounded-lg border border-slate-800 bg-slate-950/40 px-3 py-2 text-[12px] text-slate-300"
-            >
-              <UIcon name="i-lucide-loader" class="h-3.5 w-3.5 animate-spin text-amber-300" />
-              {{ phase ? PHASE_LABEL[phase] : '' }}
-            </p>
+        <p
+          v-if="working"
+          class="flex items-center gap-2 rounded-lg border border-slate-800 bg-slate-950/40 px-3 py-2 text-[12px] text-slate-300"
+        >
+          <UIcon name="i-lucide-loader" class="h-3.5 w-3.5 animate-spin text-amber-300" />
+          {{ phase ? PHASE_LABEL[phase] : '' }}
+        </p>
 
-            <!-- Actual-vs-reference gallery. Keyed by `view` (the contract's unique per-pair
+        <!-- Actual-vs-reference gallery. Keyed by `view` (the contract's unique per-pair
                  identity) so a pair's note/expand state stays bound to its view across recaptures. -->
-            <section v-if="pairs.length" class="space-y-4">
-              <div v-for="p in pairs" :key="p.view" class="space-y-2">
-                <ImageCompare
-                  :view="p.view"
-                  :actual-id="p.actualArtifactId"
-                  :reference-id="p.referenceArtifactId"
-                  :blobs="blobs"
-                  :busy="busy"
-                  @expand="expand"
-                  @upload-reference="(file: File) => uploadFor(p.view, file)"
-                />
-                <!-- Per-view note (folded into the fixer findings) -->
-                <div v-if="awaitingHuman" class="px-1">
-                  <button
-                    class="flex items-center gap-1.5 text-[11px] text-slate-400 hover:text-slate-200"
-                    @click="noteOpen[p.view] = !noteOpen[p.view]"
-                  >
-                    <UIcon
-                      :name="noteOpen[p.view] ? 'i-lucide-chevron-down' : 'i-lucide-chevron-right'"
-                      class="h-3 w-3"
-                    />
-                    {{ t('visualConfirm.noteIssue', { view: p.view }) }}
-                    <span
-                      v-if="perViewNotes[p.view]?.trim()"
-                      class="rounded-full bg-amber-500/15 px-1.5 text-[9px] text-amber-300"
-                      >{{ t('visualConfirm.noted') }}</span
-                    >
-                  </button>
-                  <textarea
-                    v-if="noteOpen[p.view]"
-                    v-model="perViewNotes[p.view]"
-                    rows="2"
-                    :placeholder="t('visualConfirm.notePlaceholder', { view: p.view })"
-                    class="mt-1 w-full rounded-md border border-slate-700 bg-slate-950 px-2 py-1.5 text-[12px] text-slate-200 placeholder:text-slate-600 focus:border-amber-500 focus:outline-none focus-visible:ring-2 focus-visible:ring-amber-500/60"
-                  />
-                </div>
-              </div>
-            </section>
-            <p v-else class="text-[12px] italic text-slate-500">
-              {{ t('visualConfirm.noScreenshots') }}
-            </p>
-
-            <!-- Upload a reference for any view -->
-            <section class="rounded-lg border border-slate-800 bg-slate-900/60 p-3">
-              <h3 class="mb-2 text-[11px] font-semibold uppercase tracking-wide text-slate-500">
-                {{ t('visualConfirm.upload.heading') }}
-              </h3>
-              <div class="flex flex-wrap items-center gap-2">
-                <input
-                  v-model="uploadView"
-                  list="vc-views"
-                  :placeholder="t('visualConfirm.upload.viewPlaceholder')"
-                  class="rounded-md border border-slate-700 bg-slate-950 px-2 py-1 text-[12px] text-slate-200 placeholder:text-slate-600"
-                />
-                <datalist id="vc-views">
-                  <option v-for="p in pairs" :key="p.view" :value="p.view" />
-                </datalist>
-                <input
-                  ref="fileInput"
-                  type="file"
-                  accept="image/png,image/jpeg"
-                  :disabled="busy || !uploadView.trim()"
-                  class="text-[12px] text-slate-300 file:me-2 file:rounded file:border-0 file:bg-slate-800 file:px-2 file:py-1 file:text-slate-200 disabled:opacity-40"
-                  @change="onFilePicked"
+        <section v-if="pairs.length" class="space-y-4">
+          <div v-for="p in pairs" :key="p.view" class="space-y-2">
+            <ImageCompare
+              :view="p.view"
+              :actual-id="p.actualArtifactId"
+              :reference-id="p.referenceArtifactId"
+              :blobs="blobs"
+              :busy="busy"
+              @expand="expand"
+              @upload-reference="(file: File) => uploadFor(p.view, file)"
+            />
+            <!-- Per-view note (folded into the fixer findings) -->
+            <div v-if="awaitingHuman" class="px-1">
+              <button
+                class="flex items-center gap-1.5 text-[11px] text-slate-400 hover:text-slate-200"
+                @click="noteOpen[p.view] = !noteOpen[p.view]"
+              >
+                <UIcon
+                  :name="noteOpen[p.view] ? 'i-lucide-chevron-down' : 'i-lucide-chevron-right'"
+                  class="h-3 w-3"
                 />
-              </div>
-              <p class="mt-1.5 text-[10px] text-slate-600">
-                {{
-                  uploadView.trim()
-                    ? t('visualConfirm.upload.tipReady')
-                    : t('visualConfirm.upload.tipNeedView')
-                }}
-              </p>
-            </section>
-
-            <!-- Request fix -->
-            <section
-              v-if="awaitingHuman"
-              class="rounded-lg border border-slate-800 bg-slate-900/60 p-3"
-            >
-              <h3 class="mb-2 text-[11px] font-semibold uppercase tracking-wide text-slate-500">
-                {{ t('visualConfirm.requestFix.heading') }}
-              </h3>
+                {{ t('visualConfirm.noteIssue', { view: p.view }) }}
+                <span
+                  v-if="perViewNotes[p.view]?.trim()"
+                  class="rounded-full bg-amber-500/15 px-1.5 text-[9px] text-amber-300"
+                  >{{ t('visualConfirm.noted') }}</span
+                >
+              </button>
               <textarea
-                v-model="globalFindings"
-                rows="3"
-                :placeholder="t('visualConfirm.requestFix.placeholder')"
-                class="w-full rounded-md border border-slate-700 bg-slate-950 px-3 py-2 text-[13px] text-slate-200 placeholder:text-slate-600 focus:border-amber-500 focus:outline-none focus-visible:ring-2 focus-visible:ring-amber-500/60"
+                v-if="noteOpen[p.view]"
+                v-model="perViewNotes[p.view]"
+                rows="2"
+                :placeholder="t('visualConfirm.notePlaceholder', { view: p.view })"
+                class="mt-1 w-full rounded-md border border-slate-700 bg-slate-950 px-2 py-1.5 text-[12px] text-slate-200 placeholder:text-slate-600 focus:border-amber-500 focus:outline-none focus-visible:ring-2 focus-visible:ring-amber-500/60"
               />
-              <div class="mt-2 flex items-center justify-between">
-                <span class="text-[11px] text-slate-500">
-                  {{ t('visualConfirm.requestFix.foldedHint') }}
-                </span>
-                <UButton
-                  size="sm"
-                  color="warning"
-                  icon="i-lucide-wrench"
-                  :loading="busy"
-                  :disabled="busy || !hasFindings || !access.canExecuteRuns.value"
-                  :title="access.canExecuteRuns.value ? undefined : t('access.noRunExecute')"
-                  @click="submitFix"
-                >
-                  {{ t('visualConfirm.requestFix.send') }}
-                </UButton>
-              </div>
-            </section>
+            </div>
+          </div>
+        </section>
+        <p v-else class="text-[12px] italic text-slate-500">
+          {{ t('visualConfirm.noScreenshots') }}
+        </p>
 
-            <!-- Rounds history -->
-            <section
-              v-if="vc.rounds && vc.rounds.length"
-              class="rounded-lg border border-slate-800 bg-slate-900/60 p-3"
-            >
-              <h3 class="mb-2 text-[11px] font-semibold uppercase tracking-wide text-slate-500">
-                {{ t('visualConfirm.history.heading', { count: vc.attempts }, vc.attempts) }}
-              </h3>
-              <ol class="space-y-2">
-                <li v-for="(r, i) in vc.rounds" :key="i" class="flex items-start gap-2 text-[12px]">
-                  <UIcon
-                    name="i-lucide-wrench"
-                    class="mt-0.5 h-3.5 w-3.5 shrink-0 text-slate-400"
-                  />
-                  <div class="min-w-0 flex-1">
-                    <span class="text-slate-200">{{
-                      t('visualConfirm.history.fixRequested')
-                    }}</span>
-                    <span
-                      class="ms-1.5 rounded px-1 text-[10px] uppercase"
-                      :class="
-                        r.outcome === 'completed'
-                          ? 'bg-emerald-500/15 text-emerald-300'
-                          : r.outcome === 'failed'
-                            ? 'bg-rose-500/15 text-rose-300'
-                            : 'bg-slate-500/15 text-slate-300'
-                      "
-                    >
-                      {{
-                        r.outcome
-                          ? OUTCOME_LABELS[r.outcome]
-                          : t('visualConfirm.outcome.inProgress')
-                      }}
-                    </span>
-                    <p v-if="r.findings" class="whitespace-pre-wrap leading-snug text-slate-400">
-                      {{ r.findings }}
-                    </p>
-                  </div>
-                </li>
-              </ol>
-            </section>
-          </template>
-        </div>
+        <!-- Upload a reference for any view -->
+        <section class="rounded-lg border border-slate-800 bg-slate-900/60 p-3">
+          <h3 class="mb-2 text-[11px] font-semibold uppercase tracking-wide text-slate-500">
+            {{ t('visualConfirm.upload.heading') }}
+          </h3>
+          <div class="flex flex-wrap items-center gap-2">
+            <input
+              v-model="uploadView"
+              list="vc-views"
+              :placeholder="t('visualConfirm.upload.viewPlaceholder')"
+              class="rounded-md border border-slate-700 bg-slate-950 px-2 py-1 text-[12px] text-slate-200 placeholder:text-slate-600"
+            />
+            <datalist id="vc-views">
+              <option v-for="p in pairs" :key="p.view" :value="p.view" />
+            </datalist>
+            <input
+              ref="fileInput"
+              type="file"
+              accept="image/png,image/jpeg"
+              :disabled="busy || !uploadView.trim()"
+              class="text-[12px] text-slate-300 file:me-2 file:rounded file:border-0 file:bg-slate-800 file:px-2 file:py-1 file:text-slate-200 disabled:opacity-40"
+              @change="onFilePicked"
+            />
+          </div>
+          <p class="mt-1.5 text-[10px] text-slate-600">
+            {{
+              uploadView.trim()
+                ? t('visualConfirm.upload.tipReady')
+                : t('visualConfirm.upload.tipNeedView')
+            }}
+          </p>
+        </section>
 
-        <footer
-          v-if="vc"
-          class="flex items-center justify-between gap-3 border-t border-slate-800 px-5 py-3"
+        <!-- Request fix -->
+        <section
+          v-if="awaitingHuman"
+          class="rounded-lg border border-slate-800 bg-slate-900/60 p-3"
         >
-          <StepRunMeta
-            v-if="step"
-            :step="step"
-            :instance-id="instanceId ?? undefined"
-            :step-number="stepIndex === null ? undefined : stepIndex + 1"
-            :total-steps="instance?.steps.length"
-            :run-failed="instance?.status === 'failed'"
-            :failure-at="instance?.failure?.occurredAt"
+          <h3 class="mb-2 text-[11px] font-semibold uppercase tracking-wide text-slate-500">
+            {{ t('visualConfirm.requestFix.heading') }}
+          </h3>
+          <textarea
+            v-model="globalFindings"
+            rows="3"
+            :placeholder="t('visualConfirm.requestFix.placeholder')"
+            class="w-full rounded-md border border-slate-700 bg-slate-950 px-3 py-2 text-[13px] text-slate-200 placeholder:text-slate-600 focus:border-amber-500 focus:outline-none focus-visible:ring-2 focus-visible:ring-amber-500/60"
           />
-          <div class="flex items-center gap-2">
-            <label
-              v-if="awaitingHuman && needsAck"
-              class="flex items-center gap-1.5 text-[11px] text-amber-300/90"
-            >
-              <input v-model="ackDegraded" type="checkbox" class="accent-amber-500" />
-              {{ t('visualConfirm.reviewedManually') }}
-            </label>
+          <div class="mt-2 flex items-center justify-between">
+            <span class="text-[11px] text-slate-500">
+              {{ t('visualConfirm.requestFix.foldedHint') }}
+            </span>
             <UButton
               size="sm"
-              variant="soft"
-              color="neutral"
-              icon="i-lucide-refresh-cw"
+              color="warning"
+              icon="i-lucide-wrench"
               :loading="busy"
-              :disabled="busy || !awaitingHuman || !access.canExecuteRuns.value"
+              :disabled="busy || !hasFindings || !access.canExecuteRuns.value"
               :title="access.canExecuteRuns.value ? undefined : t('access.noRunExecute')"
-              @click="recapture"
+              @click="submitFix"
             >
-              {{ t('visualConfirm.recapture') }}
-            </UButton>
-            <UButton
-              color="primary"
-              icon="i-lucide-circle-check"
-              :loading="busy"
-              :disabled="!canApprove || !access.canExecuteRuns.value"
-              :title="access.canExecuteRuns.value ? undefined : t('access.noRunExecute')"
-              @click="approve"
-            >
-              {{ t('visualConfirm.approve') }}
+              {{ t('visualConfirm.requestFix.send') }}
             </UButton>
           </div>
-        </footer>
-      </div>
+        </section>
+
+        <!-- Rounds history -->
+        <section
+          v-if="vc.rounds && vc.rounds.length"
+          class="rounded-lg border border-slate-800 bg-slate-900/60 p-3"
+        >
+          <h3 class="mb-2 text-[11px] font-semibold uppercase tracking-wide text-slate-500">
+            {{ t('visualConfirm.history.heading', { count: vc.attempts }, vc.attempts) }}
+          </h3>
+          <ol class="space-y-2">
+            <li v-for="(r, i) in vc.rounds" :key="i" class="flex items-start gap-2 text-[12px]">
+              <UIcon name="i-lucide-wrench" class="mt-0.5 h-3.5 w-3.5 shrink-0 text-slate-400" />
+              <div class="min-w-0 flex-1">
+                <span class="text-slate-200">{{ t('visualConfirm.history.fixRequested') }}</span>
+                <span
+                  class="ms-1.5 rounded px-1 text-[10px] uppercase"
+                  :class="
+                    r.outcome === 'completed'
+                      ? 'bg-emerald-500/15 text-emerald-300'
+                      : r.outcome === 'failed'
+                        ? 'bg-rose-500/15 text-rose-300'
+                        : 'bg-slate-500/15 text-slate-300'
+                  "
+                >
+                  {{
+                    r.outcome ? OUTCOME_LABELS[r.outcome] : t('visualConfirm.outcome.inProgress')
+                  }}
+                </span>
+                <p v-if="r.findings" class="whitespace-pre-wrap leading-snug text-slate-400">
+                  {{ r.findings }}
+                </p>
+              </div>
+            </li>
+          </ol>
+        </section>
+      </template>
     </div>
 
-    <!-- Shared zoom/pan viewer for any screenshot in the gallery. -->
-    <ArtifactLightbox
-      v-model:open="lightboxOpen"
-      v-model:index="lightboxIndex"
-      :items="lightboxItems"
-      :blobs="blobs"
-    />
-  </Teleport>
+    <footer
+      v-if="vc"
+      class="flex items-center justify-between gap-3 border-t border-slate-800 px-5 py-3"
+    >
+      <StepRunMeta
+        v-if="step"
+        :step="step"
+        :instance-id="instanceId ?? undefined"
+        :step-number="stepIndex === null ? undefined : stepIndex + 1"
+        :total-steps="instance?.steps.length"
+        :run-failed="instance?.status === 'failed'"
+        :failure-at="instance?.failure?.occurredAt"
+      />
+      <div class="flex items-center gap-2">
+        <label
+          v-if="awaitingHuman && needsAck"
+          class="flex items-center gap-1.5 text-[11px] text-amber-300/90"
+        >
+          <input v-model="ackDegraded" type="checkbox" class="accent-amber-500" />
+          {{ t('visualConfirm.reviewedManually') }}
+        </label>
+        <UButton
+          size="sm"
+          variant="soft"
+          color="neutral"
+          icon="i-lucide-refresh-cw"
+          :loading="busy"
+          :disabled="busy || !awaitingHuman || !access.canExecuteRuns.value"
+          :title="access.canExecuteRuns.value ? undefined : t('access.noRunExecute')"
+          @click="recapture"
+        >
+          {{ t('visualConfirm.recapture') }}
+        </UButton>
+        <UButton
+          color="primary"
+          icon="i-lucide-circle-check"
+          :loading="busy"
+          :disabled="!canApprove || !access.canExecuteRuns.value"
+          :title="access.canExecuteRuns.value ? undefined : t('access.noRunExecute')"
+          @click="approve"
+        >
+          {{ t('visualConfirm.approve') }}
+        </UButton>
+      </div>
+    </footer>
+  </ResultWindowShell>
+
+  <!-- Shared zoom/pan viewer for any screenshot in the gallery — a sibling overlay that layers
+       above this window on the shared modal stack while open. -->
+  <ArtifactLightbox
+    v-model:open="lightboxOpen"
+    v-model:index="lightboxIndex"
+    :items="lightboxItems"
+    :blobs="blobs"
+  />
 </template>

package/app/modular/panels/inspector.logic.spec.ts

@@ -44,6 +44,24 @@ describe('inspector panel group', () => {
     ])
   })
 
+  it('a document frame hides the test-infra / test-credentials / release-health panels', () => {
+    // A doc repo stands up no test env and ships no release, so those panels don't apply.
+    expect(visibleIds(block('frame', 'document'))).toEqual([
+      'container-summary',
+      'service-fragments',
+    ])
+  })
+
+  it('a library frame still shows the test/deploy panels (only document is excluded)', () => {
+    expect(visibleIds(block('frame', 'library'))).toEqual([
+      'container-summary',
+      'service-test-config',
+      'service-test-secrets',
+      'service-fragments',
+      'service-release-health',
+    ])
+  })
+
   it('a frontend frame swaps connections for frontend-config', () => {
     expect(visibleIds(block('frame', 'frontend'))).toEqual([
       'container-summary',

package/app/modular/panels/inspector.logic.ts

@@ -75,6 +75,14 @@ const isTask = (b: Block) => b.level === 'task'
 const isFrame = (b: Block) => b.level === 'frame'
 /** frame OR module — the "container" panels. */
 const isContainer = (b: Block) => b.level === 'frame' || b.level === 'module'
+/**
+ * A frame that gets built, tested and deployed as a running thing — i.e. every frame
+ * EXCEPT a `document` repo. A document repo (`FrameRepoType` `document`) only runs
+ * doc/spike tasks + doc pipelines: it stands up no test environment, holds no test
+ * credentials and never ships a release to watch, so the test-infrastructure /
+ * test-credentials / post-release-health panels don't apply to it and are hidden.
+ */
+const isDeployableFrame = (b: Block) => isFrame(b) && b.type !== 'document'
 
 /**
  * The built-in panel specs. The `when` predicates and orders reproduce
@@ -83,7 +91,9 @@ const isContainer = (b: Block) => b.level === 'frame' || b.level === 'module'
  *  - task body: context docs/issues, then schedule → execution → estimate →
  *    dependencies → run-settings → agent-config → structure.
  *  - service/module body: container summary (frame|module), then the frame-only
- *    panels, with frontend-config / service-connections further gated on `type`.
+ *    panels, with frontend-config / service-connections further gated on `type`,
+ *    and the test-infrastructure / test-credentials / post-release-health panels
+ *    hidden for a `document` frame (a doc repo has no test env / release to config).
  *  - epic / initiative bodies: their single inspector.
  *
  * The frame-only "view requirements" button and the cross-cutting run banners
@@ -104,10 +114,10 @@ export const INSPECTOR_PANEL_SPECS: readonly InspectorPanelSpec[] = [
   { id: 'container-summary', order: 110, when: isContainer },
   { id: 'frontend-config', order: 120, when: (b) => isFrame(b) && b.type === 'frontend' },
   { id: 'service-connections', order: 130, when: (b) => isFrame(b) && b.type === 'service' },
-  { id: 'service-test-config', order: 140, when: isFrame },
-  { id: 'service-test-secrets', order: 150, when: isFrame },
+  { id: 'service-test-config', order: 140, when: isDeployableFrame },
+  { id: 'service-test-secrets', order: 150, when: isDeployableFrame },
   { id: 'service-fragments', order: 160, when: isFrame },
-  { id: 'service-release-health', order: 170, when: isFrame },
+  { id: 'service-release-health', order: 170, when: isDeployableFrame },
   { id: 'epic-children', order: 200, when: (b) => b.level === 'epic' },
   { id: 'initiative-inspector', order: 210, when: (b) => b.level === 'initiative' },
 ]

package/i18n/locales/de.json

@@ -4445,7 +4445,6 @@
     "footer": "Szenarien sind die Bereiche, die der Tester zum Prüfen gewählt hat (seine Akzeptanzszenarien aus der Spezifikation). Ergebnisse und Bedenken werden nach Name darunter gruppiert."
   },
   "visualConfirm": {
-    "ariaLabel": "Visuelle Bestätigung",
     "title": "Visuelle Bestätigung",
     "titleWithBlock": "Visuelle Bestätigung — {title}",
     "subtitle": "Die UI mit den Referenzdesigns vergleichen",

package/i18n/locales/en.json

@@ -4281,7 +4281,6 @@
     }
   },
   "visualConfirm": {
-    "ariaLabel": "Visual confirmation",
     "title": "Visual confirmation",
     "titleWithBlock": "Visual confirmation — {title}",
     "subtitle": "Review the UI against the reference designs",

package/i18n/locales/es.json

@@ -4111,7 +4111,6 @@
     }
   },
   "visualConfirm": {
-    "ariaLabel": "Confirmación visual",
     "title": "Confirmación visual",
     "titleWithBlock": "Confirmación visual — {title}",
     "subtitle": "Revisa la interfaz frente a los diseños de referencia",

package/i18n/locales/fr.json

@@ -4111,7 +4111,6 @@
     }
   },
   "visualConfirm": {
-    "ariaLabel": "Confirmation visuelle",
     "title": "Confirmation visuelle",
     "titleWithBlock": "Confirmation visuelle — {title}",
     "subtitle": "Comparez l'interface aux maquettes de référence",