@cat-factory/app 0.116.2 → 0.116.3

package/app/components/providers/PersonalSubscriptionSection.vue

@@ -4,7 +4,7 @@
 // rather than pooled on the workspace. Each token is double-encrypted server-side under a
 // personal PASSWORD (never stored); that password is what you'll enter when you start/retry
 // such a run (cached locally so it's usually transparent). Recurring schedules can't use them.
-import { computed, onMounted, ref } from 'vue'
+import { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue'
 import type { SubscriptionVendor } from '~/types/domain'
 import SecretInput from '~/components/common/SecretInput.vue'
 
@@ -87,7 +87,33 @@ const password = ref('')
 const expiresOn = ref('') // yyyy-mm-dd (optional)
 const busy = ref(false)
 
+// A transient "credentials stored" confirmation shown inline right after a successful save.
+// Emptying the form on success recomputes `disabledReason` back to "enter a token", so without
+// this the user is greeted by a red validation error immediately after they succeeded — which
+// reads as a failure. While this notice is set we suppress `disabledReason` and show it instead,
+// then clear it after a few seconds (or the moment the user starts entering a new credential).
+const savedNotice = ref<string | null>(null)
+let savedTimer: ReturnType<typeof setTimeout> | undefined
+
+function clearSavedNotice() {
+  savedNotice.value = null
+  if (savedTimer) {
+    clearTimeout(savedTimer)
+    savedTimer = undefined
+  }
+}
+
+// Once the user touches the form again the success notice is stale — drop it so `disabledReason`
+// guides the next entry as usual. Guard on non-empty input so the programmatic clear performed by
+// a successful `connect()` (which resets the fields to empty) doesn't immediately wipe the notice
+// we just set; switching vendor always clears it.
+watch([token, password], ([tok, pwd]) => {
+  if (savedNotice.value && (tok.trim() || pwd)) clearSavedNotice()
+})
+watch(vendor, () => clearSavedNotice())
+
 onMounted(() => void personal.load())
+onBeforeUnmount(() => clearSavedNotice())
 
 const selectedMeta = computed(() => vendorMeta(vendor.value) ?? PERSONAL_VENDORS.value[0]!)
 const existing = computed(() => personal.subscriptions.find((s) => s.vendor === vendor.value))
@@ -118,6 +144,7 @@ const renewals = computed(() =>
 
 async function connect() {
   if (!token.value.trim() || password.value.length < 6) return
+  const vendorName = selectedMeta.value.label
   busy.value = true
   try {
     await personal.store({
@@ -133,13 +160,19 @@ async function connect() {
     password.value = ''
     label.value = ''
     expiresOn.value = ''
+    // Confirm success inline (and transiently) so emptying the form doesn't surface the
+    // `disabledReason` validation text as if the save had failed. It clears after a few
+    // seconds, or as soon as the user starts entering another credential.
+    savedNotice.value = t('personalSubscriptions.saved', { vendor: vendorName })
+    if (savedTimer) clearTimeout(savedTimer)
+    savedTimer = setTimeout(clearSavedNotice, 5000)
     // A connected subscription makes its vendor's models usable, so refresh the catalog:
     // this clears the "No AI model configured" banner and, if the default preset still
     // points at models this subscription doesn't cover, reactively surfaces the
     // preset-mismatch prompt (with its "pick a different preset" link).
     if (workspace.workspaceId) await models.refresh(workspace.workspaceId)
     toast.add({
-      title: t('personalSubscriptions.toast.connected', { vendor: selectedMeta.value.label }),
+      title: t('personalSubscriptions.toast.connected', { vendor: vendorName }),
       icon: 'i-lucide-check',
       color: 'success',
     })
@@ -266,7 +299,11 @@ async function disconnect(v: SubscriptionVendor) {
         </UFormField>
       </div>
       <div class="flex items-center justify-end gap-3">
-        <p v-if="disabledReason" class="text-sm text-rose-400">{{ disabledReason }}</p>
+        <p v-if="savedNotice" class="flex items-center gap-1.5 text-sm text-emerald-400">
+          <UIcon name="i-lucide-check" class="size-4" />
+          {{ savedNotice }}
+        </p>
+        <p v-else-if="disabledReason" class="text-sm text-rose-400">{{ disabledReason }}</p>
         <UButton
           :loading="busy"
           :disabled="disabledReason !== null"

package/i18n/locales/de.json

@@ -2569,6 +2569,7 @@
       "token": "Geben Sie Ihr Token ein, um fortzufahren",
       "password": "Geben Sie ein persönliches Passwort mit mindestens 6 Zeichen ein"
     },
+    "saved": "{vendor}-Zugangsdaten sicher gespeichert",
     "expires": "Läuft ab am {date}",
     "noExpiry": "Kein Ablaufdatum gesetzt",
     "renewal": {

package/i18n/locales/en.json

@@ -538,6 +538,7 @@
       "token": "Enter your token to continue",
       "password": "Enter a personal password of at least 6 characters"
     },
+    "saved": "{vendor} credentials stored securely",
     "expires": "Expires {date}",
     "noExpiry": "No expiry set",
     "renewal": {

package/i18n/locales/es.json

@@ -487,6 +487,7 @@
       "token": "Introduce tu token para continuar",
       "password": "Introduce una contraseña personal de al menos 6 caracteres"
     },
+    "saved": "Credenciales de {vendor} guardadas de forma segura",
     "expires": "Caduca el {date}",
     "noExpiry": "Sin fecha de caducidad",
     "renewal": {

package/i18n/locales/fr.json

@@ -487,6 +487,7 @@
       "token": "Saisissez votre jeton pour continuer",
       "password": "Saisissez un mot de passe personnel d'au moins 6 caractères"
     },
+    "saved": "Identifiants {vendor} enregistrés en toute sécurité",
     "expires": "Expire le {date}",
     "noExpiry": "Aucune date d'expiration",
     "renewal": {

package/i18n/locales/he.json

@@ -487,6 +487,7 @@
       "token": "הזן את הטוקן שלך כדי להמשיך",
       "password": "הזן סיסמה אישית באורך 6 תווים לפחות"
     },
+    "saved": "פרטי ההתחברות של {vendor} נשמרו בבטחה",
     "expires": "פג בתאריך {date}",
     "noExpiry": "לא הוגדרה תפוגה",
     "renewal": {

package/i18n/locales/it.json

@@ -2569,6 +2569,7 @@
       "token": "Inserisci il tuo token per continuare",
       "password": "Inserisci una password personale di almeno 6 caratteri"
     },
+    "saved": "Credenziali {vendor} salvate in modo sicuro",
     "expires": "Scade il {date}",
     "noExpiry": "Nessuna scadenza impostata",
     "renewal": {

package/i18n/locales/ja.json

@@ -487,6 +487,7 @@
       "token": "続行するにはトークンを入力してください",
       "password": "6文字以上の個人パスワードを入力してください"
     },
+    "saved": "{vendor} の認証情報を安全に保存しました",
     "expires": "有効期限 {date}",
     "noExpiry": "有効期限は未設定",
     "renewal": {

package/i18n/locales/pl.json

@@ -487,6 +487,7 @@
       "token": "Wprowadź token, aby kontynuować",
       "password": "Wprowadź hasło osobiste o długości co najmniej 6 znaków"
     },
+    "saved": "Poświadczenia {vendor} zapisane bezpiecznie",
     "expires": "Wygasa {date}",
     "noExpiry": "Brak daty wygaśnięcia",
     "renewal": {

package/i18n/locales/tr.json

@@ -487,6 +487,7 @@
       "token": "Devam etmek için token'ınızı girin",
       "password": "En az 6 karakterlik kişisel bir parola girin"
     },
+    "saved": "{vendor} kimlik bilgileri güvenli şekilde kaydedildi",
     "expires": "Son kullanma {date}",
     "noExpiry": "Son kullanma tarihi ayarlanmadı",
     "renewal": {

package/i18n/locales/uk.json

@@ -487,6 +487,7 @@
       "token": "Введіть свій токен, щоб продовжити",
       "password": "Введіть особистий пароль щонайменше з 6 символів"
     },
+    "saved": "Облікові дані {vendor} надійно збережено",
     "expires": "Завершується {date}",
     "noExpiry": "Дата завершення не вказана",
     "renewal": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cat-factory/app",
-  "version": "0.116.2",
+  "version": "0.116.3",
   "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",