@cat-factory/app 0.250.0 → 0.251.0

package/app/components/documents/DocumentSyncState.logic.spec.ts

@@ -1,7 +1,11 @@
 import { describe, expect, it } from 'vitest'
-import { documentFreshnessChangeSchema, documentFreshnessGapSchema } from '@cat-factory/contracts'
+import {
+  documentFreshnessChangeSchema,
+  documentFreshnessGapSchema,
+  documentRenderStatusSchema,
+} from '@cat-factory/contracts'
 import { missingI18nKeys } from '../../../test/i18nKeys'
-import { CHANGE_KEYS, GAP_KEYS } from './DocumentSyncState.logic'
+import { CHANGE_KEYS, GAP_KEYS, RENDER_STATUS_KEYS } from './DocumentSyncState.logic'
 
 /**
  * The half of these tables' correctness that no guard can see.
@@ -24,10 +28,20 @@ describe('DocumentSyncState freshness tables', () => {
     expect(missingI18nKeys(Object.values(CHANGE_KEYS))).toEqual([])
   })
 
+  it('names a key the base catalog holds for every render status that states one', () => {
+    // The `null` half is deliberate (see the table): only the statuses that name a FIX render.
+    expect(missingI18nKeys(Object.values(RENDER_STATUS_KEYS).filter((k) => k !== null))).toEqual([])
+  })
+
   it('covers exactly the contracts vocabularies, with no entry for a member that is gone', () => {
     expect(Object.keys(GAP_KEYS).sort()).toEqual([...documentFreshnessGapSchema.options].sort())
     expect(Object.keys(CHANGE_KEYS).sort()).toEqual(
       [...documentFreshnessChangeSchema.options].sort(),
     )
+    // A new render status has to be CLASSIFIED (a key or an explicit null), never omitted into
+    // silence: an unclassified one would render nothing and read as "the images are fine".
+    expect(Object.keys(RENDER_STATUS_KEYS).sort()).toEqual(
+      [...documentRenderStatusSchema.options].sort(),
+    )
   })
 })

package/app/components/documents/DocumentSyncState.logic.ts

@@ -1,4 +1,8 @@
-import type { DocumentFreshnessChange, DocumentFreshnessGap } from '~/types/domain'
+import type {
+  DocumentFreshnessChange,
+  DocumentFreshnessGap,
+  DocumentRenderStatus,
+} from '~/types/domain'
 
 /**
  * The i18n keys `DocumentSyncState` renders a freshness verdict through, in their own module so a
@@ -36,3 +40,25 @@ export const CHANGE_KEYS = {
   reimported: 'documents.freshness.change.reimported',
   revision_only: 'documents.freshness.change.revision_only',
 } as const satisfies Record<DocumentFreshnessChange, string>
+
+/**
+ * What became of a design document's rendered images, for the three statuses that ask something of
+ * a person, and `null` for the two that do not.
+ *
+ * A design import retains its frames as reference images, and every way of failing to renders as
+ * the same absence: no picture. `stored` and `none` are the states nothing can be done about
+ * ("they are there" and "the design had none"), so they say nothing on an eleven-pixel line already
+ * carrying a stamp, a verdict and a button. The other three each name a DIFFERENT fix, which is
+ * exactly why they are worth the room: configure image storage, or retry a source that would not
+ * render.
+ *
+ * `null` here rather than an omitted key so the `satisfies` still spans the whole vocabulary: a new
+ * status has to be classified rather than falling silently into the unremarkable half.
+ */
+export const RENDER_STATUS_KEYS = {
+  stored: null,
+  none: null,
+  partial: 'documents.renders.partial',
+  failed: 'documents.renders.failed',
+  storage_unavailable: 'documents.renders.storage_unavailable',
+} as const satisfies Record<DocumentRenderStatus, string | null>

package/app/components/documents/DocumentSyncState.vue

@@ -1,7 +1,11 @@
 <script setup lang="ts">
 import { isConnectableSource } from '@cat-factory/contracts'
 import type { SourceDocument } from '~/types/domain'
-import { CHANGE_KEYS, GAP_KEYS } from '~/components/documents/DocumentSyncState.logic'
+import {
+  CHANGE_KEYS,
+  GAP_KEYS,
+  RENDER_STATUS_KEYS,
+} from '~/components/documents/DocumentSyncState.logic'
 
 // When a stored document was last written, and a way to ask its source whether that is still the
 // current revision.
@@ -129,6 +133,20 @@ const detail = computed(() =>
     .join(' · '),
 )
 
+/**
+ * What became of the design's rendered images, when that is something a person can act on.
+ *
+ * A THIRD fact beside the two above, and separate for the same reason they are separate from each
+ * other: it is about the pictures rather than the text, it is written by the import rather than by
+ * a click, and folding it into either would make an absent image read as a stale body. It renders
+ * only for the statuses that name a fix, so the common case adds nothing to the line.
+ */
+const renders = computed(() => {
+  const status = props.doc.renderStatus
+  const key = status ? RENDER_STATUS_KEYS[status] : null
+  return key ? t(key) : ''
+})
+
 const TONE_CLASS: Record<Stated['tone'], string> = {
   ok: 'text-emerald-400',
   warn: 'text-amber-400',
@@ -165,6 +183,10 @@ async function refresh() {
       <UIcon :name="stated.icon" class="h-3 w-3 shrink-0" />
       <span class="truncate">{{ stated.text }}</span>
     </span>
+    <span v-if="renders" class="flex min-w-0 items-center gap-1 text-slate-500" :title="renders">
+      <UIcon name="i-lucide-image-off" class="h-3 w-3 shrink-0" />
+      <span class="truncate">{{ renders }}</span>
+    </span>
     <UButton
       v-if="askable"
       color="neutral"

package/app/stores/documents.spec.ts

@@ -24,6 +24,7 @@ function doc(over: Partial<SourceDocument> = {}): SourceDocument {
     role: null,
     docKind: null,
     syncedAt: 1_000,
+    renderStatus: null,
     ...over,
   }
 }

package/app/types/documents.ts

@@ -18,6 +18,7 @@ export type {
   DocumentFreshness,
   DocumentFreshnessChange,
   DocumentFreshnessGap,
+  DocumentRenderStatus,
   RefreshedDocumentView,
   SourceDocument,
   DocumentSearchResult,

package/i18n/locales/de.json

@@ -3925,6 +3925,11 @@
       },
       "refreshFailed": "Prüfung auf Änderungen fehlgeschlagen"
     },
+    "renders": {
+      "partial": "Einige Design-Frames konnten nicht als Bilder gespeichert werden.",
+      "failed": "Die Design-Bilder konnten nicht von der Quelle abgerufen werden.",
+      "storage_unavailable": "Design-Bilder wurden nicht gespeichert: für diese Installation ist kein Bildspeicher konfiguriert."
+    },
     "connect": {
       "title": "Quelle verbinden",
       "sourceFallback": "Quelle",

package/i18n/locales/en.json

@@ -4448,6 +4448,11 @@
       },
       "refreshFailed": "Could not check for changes"
     },
+    "renders": {
+      "partial": "Some design frames could not be saved as images.",
+      "failed": "The design images could not be retrieved from the source.",
+      "storage_unavailable": "Design images were not saved: this deployment has no image storage configured."
+    },
     "connect": {
       "title": "Connect source",
       "sourceFallback": "Source",

package/i18n/locales/es.json

@@ -4311,6 +4311,11 @@
       },
       "refreshFailed": "No se han podido buscar cambios"
     },
+    "renders": {
+      "partial": "Algunos marcos del diseño no se pudieron guardar como imágenes.",
+      "failed": "No se pudieron obtener las imágenes del diseño desde el origen.",
+      "storage_unavailable": "Las imágenes del diseño no se guardaron: esta instalación no tiene almacenamiento de imágenes configurado."
+    },
     "connect": {
       "title": "Conectar fuente",
       "sourceFallback": "Fuente",

package/i18n/locales/fr.json

@@ -4311,6 +4311,11 @@
       },
       "refreshFailed": "Impossible de vérifier les changements"
     },
+    "renders": {
+      "partial": "Certains cadres de la maquette n'ont pas pu être enregistrés en images.",
+      "failed": "Les images de la maquette n'ont pas pu être récupérées depuis la source.",
+      "storage_unavailable": "Les images de la maquette n'ont pas été enregistrées : aucun stockage d'images n'est configuré pour ce déploiement."
+    },
     "connect": {
       "title": "Connecter une source",
       "sourceFallback": "Source",

package/i18n/locales/he.json

@@ -4311,6 +4311,11 @@
       },
       "refreshFailed": "לא ניתן היה לבדוק שינויים"
     },
+    "renders": {
+      "partial": "חלק ממסגרות העיצוב לא נשמרו כתמונות.",
+      "failed": "לא ניתן היה לאחזר את תמונות העיצוב מהמקור.",
+      "storage_unavailable": "תמונות העיצוב לא נשמרו: לפריסה הזו לא מוגדר אחסון תמונות."
+    },
     "connect": {
       "title": "חבר מקור",
       "sourceFallback": "מקור",

package/i18n/locales/it.json

@@ -3925,6 +3925,11 @@
       },
       "refreshFailed": "Impossibile verificare le modifiche"
     },
+    "renders": {
+      "partial": "Alcuni frame del design non è stato possibile salvarli come immagini.",
+      "failed": "Non è stato possibile recuperare le immagini del design dalla sorgente.",
+      "storage_unavailable": "Le immagini del design non sono state salvate: questa installazione non ha uno spazio di archiviazione per le immagini configurato."
+    },
     "connect": {
       "title": "Collega sorgente",
       "sourceFallback": "Sorgente",

package/i18n/locales/ja.json

@@ -4311,6 +4311,11 @@
       },
       "refreshFailed": "変更を確認できませんでした"
     },
+    "renders": {
+      "partial": "一部のデザインフレームを画像として保存できませんでした。",
+      "failed": "ソースからデザイン画像を取得できませんでした。",
+      "storage_unavailable": "デザイン画像は保存されていません。このデプロイには画像ストレージが設定されていません。"
+    },
     "connect": {
       "title": "ソースを接続",
       "sourceFallback": "ソース",

package/i18n/locales/pl.json

@@ -4311,6 +4311,11 @@
       },
       "refreshFailed": "Nie udało się sprawdzić zmian"
     },
+    "renders": {
+      "partial": "Niektórych ramek projektu nie udało się zapisać jako obrazy.",
+      "failed": "Nie udało się pobrać obrazów projektu ze źródła.",
+      "storage_unavailable": "Obrazy projektu nie zostały zapisane: to wdrożenie nie ma skonfigurowanego magazynu obrazów."
+    },
     "connect": {
       "title": "Połącz źródło",
       "sourceFallback": "Źródło",

package/i18n/locales/tr.json

@@ -4311,6 +4311,11 @@
       },
       "refreshFailed": "Değişiklikler denetlenemedi"
     },
+    "renders": {
+      "partial": "Bazı tasarım çerçeveleri görsel olarak kaydedilemedi.",
+      "failed": "Tasarım görselleri kaynaktan alınamadı.",
+      "storage_unavailable": "Tasarım görselleri kaydedilmedi: bu kurulumda yapılandırılmış bir görsel deposu yok."
+    },
     "connect": {
       "title": "Kaynak bağla",
       "sourceFallback": "Kaynak",

package/i18n/locales/uk.json

@@ -4311,6 +4311,11 @@
       },
       "refreshFailed": "Не вдалося перевірити зміни"
     },
+    "renders": {
+      "partial": "Деякі кадри дизайну не вдалося зберегти як зображення.",
+      "failed": "Не вдалося отримати зображення дизайну з джерела.",
+      "storage_unavailable": "Зображення дизайну не збережено: у цьому розгортанні не налаштовано сховище зображень."
+    },
     "connect": {
       "title": "Підключити джерело",
       "sourceFallback": "Джерело",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cat-factory/app",
-  "version": "0.250.0",
+  "version": "0.251.0",
   "description": "Reusable Nuxt layer for the Agent Architecture Board SPA (components, stores, composables, pages). Consume it from a thin deployment app via `extends: ['@cat-factory/app']` and point it at your backend with NUXT_PUBLIC_API_BASE. See deploy/frontend for an example.",
   "repository": {
     "type": "git",
@@ -40,7 +40,7 @@
     "valibot": "^1.4.2",
     "vue": "3.5.40",
     "wretch": "^3.0.9",
-    "@cat-factory/contracts": "0.272.0"
+    "@cat-factory/contracts": "0.273.0"
   },
   "devDependencies": {
     "@toad-contracts/testing": "0.3.2",