@swiss-ai-hub/web 0.319.0 → 0.321.0

package/components/Role/AccessRulesEditor.vue

@@ -70,7 +70,7 @@
               variant="text"
               rounded
               size="small"
-              @click="remove(data.accessRule)"
+              @click="removeRules([data.accessRule])"
             />
           </template>
         </Column>
@@ -123,7 +123,7 @@
               type="button"
               class="flex flex-col items-start gap-1 rounded-md p-2 text-left hover:bg-surface-100 disabled:opacity-40 dark:hover:bg-surface-800"
               :disabled="rules.includes(preset.rule)"
-              @click="addPreset(preset.rule)"
+              @click="addRules([preset.rule])"
             >
               <span class="flex items-center gap-2 text-sm font-medium">
                 {{ preset.name }}
@@ -147,8 +147,8 @@
     <AccessCapabilities
       :rules="rules"
       :restrict-to-tenant="restrictToTenant"
-      @add="addPreset"
-      @remove="remove"
+      @add="addRules"
+      @remove="removeRules"
     />
   </div>
 </template>
@@ -197,17 +197,20 @@ const newRule = ref('')
 
 const isNew = (rule: string) => !props.initialRules.includes(rule)
 
-const add = () => {
-  if (!newRule.value) return
-  if (!rules.value.includes(newRule.value)) rules.value.push(newRule.value)
-  newRule.value = ''
+// Both write the model once per call, never once per rule: `rules` is a `defineModel`, so a second write in
+// the same tick would still read the value the first one replaced. Assignment rather than in-place mutation
+// for the same reason — a parent binding this through a computed never observes a mutated array.
+const addRules = (added: string[]) => {
+  rules.value = [...rules.value, ...added.filter(rule => !rules.value.includes(rule))]
 }
 
-const addPreset = (rule: string) => {
-  if (!rules.value.includes(rule)) rules.value.push(rule)
+const removeRules = (removed: string[]) => {
+  rules.value = rules.value.filter(rule => !removed.includes(rule))
 }
 
-const remove = (rule: string) => {
-  rules.value = rules.value.filter(r => r !== rule)
+const add = () => {
+  if (!newRule.value) return
+  addRules([newRule.value])
+  newRule.value = ''
 }
 </script>

package/composables/app/useAppVersion.ts

@@ -1,23 +1,32 @@
 import { getHealth } from '@core/sdk/client'
 import { minutesToMilliseconds } from 'date-fns'
 
-// Surfaces the running version of both services. The UI service version is baked
-// into the static bundle at build time (runtimeConfig.public.appVersion); the API
-// version is read from the health endpoint, which reports the channel tag (e.g.
-// `latest`) the running image was pulled as. When both match a single number is
-// shown, otherwise both are shown as `UI / API`.
+// Surfaces the running version of both services. When both name the same release
+// a single version is shown, otherwise both are shown as `UI / API` so a genuine
+// skew — one service rolled, the other not — stays visible.
 //
-// A release is promoted onto the `latest` channel by retagging the exact `-rc.N`
-// build that was tested, so the baked version keeps its release-candidate suffix
-// (e.g. `v0.317.0-rc.3`) even though the artifact IS the final release. Strip that
-// suffix only on the `latest` channel, so a promoted build shows its release
-// version (`v0.317.0`). On any other channel the build is genuinely a candidate or
-// rolling build, so keep the suffix to stay identifiable.
+// Neither container can know its own version at build time: a release is promoted
+// by retagging the exact `-rc.N` build that was tested, so anything baked into an
+// image keeps the candidate's name even though the artifact IS the final release.
+// The deployment is the only party that knows the tag it pulled, so both sides
+// take their version from it — the UI through APP_VERSION in /config.js (see
+// plugins/0.runtime-config.client.ts), the API through its AIHUB_VERSION env var.
+// Each falls back to its build-time value when the deployment injects nothing,
+// which is why a promoted build can still report `-rc.N` on one side only.
+//
+// docker-compose is the one flavour that pins a rolling channel tag instead of an
+// exact version, so it reports the channel name (`latest`) rather than a number.
+//
+// Versions are compared with the leading `v` normalised away, because one side is
+// a git tag (`v0.319.0`) and the other can be Python package metadata (`0.319.0`)
+// — the same version, and rendering it as `UI / API` would read as skew.
 const RELEASE_CHANNEL = 'latest'
-const toReleaseVersion = (version: string): string => version.replace(/-rc\.\d+$/, '')
+const RC_SUFFIX = /-rc\.\d+$/
+const toReleaseVersion = (version: string): string => version.replace(RC_SUFFIX, '')
+const toComparable = (version: string): string => toReleaseVersion(version.replace(/^v/, ''))
 
 export const useAppVersion = defineQuery(() => {
-  const bakedUiVersion = useRuntimeConfig().public.appVersion as string
+  const declaredUiVersion = useRuntimeConfig().public.appVersion as string
 
   const { data: apiVersion } = useQuery<string>({
     key: () => ['app-version', 'api'],
@@ -28,15 +37,23 @@ export const useAppVersion = defineQuery(() => {
     },
   })
 
-  const uiVersion = computed(() =>
-    apiVersion.value === RELEASE_CHANNEL ? toReleaseVersion(bakedUiVersion) : bakedUiVersion,
-  )
-
-  const versionDisplay = computed(() => {
+  // The one version both services agree on, or null when they genuinely differ.
+  const agreedVersion = computed(() => {
     const api = apiVersion.value
-    if (!api || api === uiVersion.value) return uiVersion.value
-    return `${uiVersion.value} / ${api}`
+    if (!api) return declaredUiVersion
+    if (api === RELEASE_CHANNEL) return toReleaseVersion(declaredUiVersion)
+    if (toComparable(api) !== toComparable(declaredUiVersion)) return null
+    // Same release. If either side reports the promoted, suffix-free name then
+    // that is what this deployment is; if both still carry `-rc.N` it really is a
+    // candidate build and the suffix stays to keep it identifiable.
+    return RC_SUFFIX.test(declaredUiVersion) ? api : declaredUiVersion
   })
 
+  const uiVersion = computed(() => agreedVersion.value ?? declaredUiVersion)
+
+  const versionDisplay = computed(
+    () => agreedVersion.value ?? `${declaredUiVersion} / ${apiVersion.value}`,
+  )
+
   return { uiVersion, apiVersion, versionDisplay }
 })

package/composables/auth/useAuth.ts

@@ -2,20 +2,12 @@ export const useAuth = () => {
   const login = (idpHint?: string) => {
     const { $auth } = useNuxtApp()
     const extraQueryParams = idpHint ? { kc_idp_hint: idpHint } : {}
-    $auth.signinRedirect({ prompt: 'login', extraQueryParams })
+    $auth.signinRedirect({ extraQueryParams })
   }
 
   const logout = async () => {
-    const { $auth, $keycloakClient } = useNuxtApp()
-    const user = await $auth.getUser()
-
-    if (user?.refresh_token) {
-      await $keycloakClient.logout(user.refresh_token)
-        .catch((error: unknown) => console.error('Keycloak session revocation failed:', error))
-    }
-
-    await $auth.removeUser()
-    navigateTo('/auth/login')
+    const { $auth } = useNuxtApp()
+    await $auth.signoutRedirect()
   }
 
   const getUser = async () => {

package/composables/document/useCreateDatabase.ts

@@ -0,0 +1,21 @@
+import { createDatabase, type CreateDatabaseRequest } from '@core/sdk/client'
+
+export const useCreateDatabase = defineMutation(() => {
+  const queryCache = useQueryCache()
+  const { tenantId } = useTenant()
+
+  return useMutation({
+    mutation: (params: { database: string, tenantId: string, request: CreateDatabaseRequest }) =>
+      createDatabase({
+        composable: '$fetch',
+        body: params.request,
+        path: {
+          tenant_id: params.tenantId,
+          database: params.database,
+        },
+      }),
+    onSuccess: () => {
+      queryCache.invalidateQueries({ key: ['tenant', tenantId.value, 'knowledge'] })
+    },
+  })
+})

package/composables/document/useDeleteDatabase.ts

@@ -0,0 +1,29 @@
+import { deleteDatabase } from '@core/sdk/client'
+
+export const useDeleteDatabase = defineMutation(() => {
+  const queryCache = useQueryCache()
+
+  const {
+    mutateAsync: deleteDatabaseMutation,
+    isLoading: isDeleting,
+    error: deleteError,
+  } = useMutation({
+    mutation: async ({ tenantId, database }: { tenantId: string, database: string }) => {
+      await deleteDatabase({
+        composable: '$fetch',
+        path: {
+          tenant_id: tenantId,
+          database,
+        },
+      })
+
+      queryCache.invalidateQueries({ key: ['tenant', tenantId, 'knowledge'] })
+    },
+  })
+
+  return {
+    deleteDatabase: deleteDatabaseMutation,
+    isDeleting,
+    deleteError,
+  }
+})

package/composables/document/useDeleteDocument.ts

@@ -5,7 +5,7 @@ export const useDeleteDocument = defineMutation(() => {
 
   const {
     mutateAsync: deleteDocumentMutation,
-    isPending: isDeleting,
+    isLoading: isDeleting,
     error: deleteError,
   } = useMutation({
     mutation: async ({ tenantId, database, namespace, documentId }: { tenantId: string, database: string, namespace: string, documentId: string }) => {

package/composables/document/useDeleteDocuments.ts

@@ -7,7 +7,7 @@ export const useDeleteDocuments = defineMutation(() => {
 
   const {
     mutateAsync: deleteDocumentsMutation,
-    isPending: isDeleting,
+    isLoading: isDeleting,
     error: deleteError,
   } = useMutation({
     mutation: async ({ tenantId, database, namespace, documentIds }: { tenantId: string, database: string, namespace: string, documentIds: string[] }): Promise<BatchDeleteDocumentsResponse> => {

package/composables/document/useDeleteNamespace.ts

@@ -0,0 +1,30 @@
+import { deleteNamespace } from '@core/sdk/client'
+
+export const useDeleteNamespace = defineMutation(() => {
+  const queryCache = useQueryCache()
+
+  const {
+    mutateAsync: deleteNamespaceMutation,
+    isLoading: isDeleting,
+    error: deleteError,
+  } = useMutation({
+    mutation: async ({ tenantId, database, namespace }: { tenantId: string, database: string, namespace: string }) => {
+      await deleteNamespace({
+        composable: '$fetch',
+        path: {
+          tenant_id: tenantId,
+          database,
+          namespace,
+        },
+      })
+
+      queryCache.invalidateQueries({ key: ['tenant', tenantId, 'knowledge'] })
+    },
+  })
+
+  return {
+    deleteNamespace: deleteNamespaceMutation,
+    isDeleting,
+    deleteError,
+  }
+})

package/composables/document/useIngestors.ts

@@ -0,0 +1,23 @@
+import { getIngestors, type IngestorDto } from '@core/sdk/client'
+import { minutesToMilliseconds } from 'date-fns'
+
+export const useIngestors = defineQuery(() => {
+  const { tenantId } = useTenant()
+
+  const { data: ingestors, isPending: ingestorsAreLoading } = useQuery<IngestorDto[]>({
+    key: () => ['tenant', tenantId.value, 'ingestors'],
+    staleTime: minutesToMilliseconds(5),
+    enabled: useTenantReady(),
+    query: async () => {
+      return await getIngestors({
+        composable: '$fetch',
+        path: { tenant_id: tenantId.value! },
+      })
+    },
+  })
+
+  return {
+    ingestors,
+    ingestorsAreLoading,
+  }
+})

package/composables/document/useScheduledDeletions.ts

@@ -2,11 +2,15 @@ import { useStorage } from '@vueuse/core'
 
 import type { MaybeRefOrGetter } from 'vue'
 
-// Deletion is eventual (the pipeline cleans the stores minutes after the API returns 202), so the
-// list keeps returning a deleted document for a while. We persist scheduled ids in localStorage —
-// surviving page refreshes — to drive a "Deleting" badge, and expire them after a TTL so a failed
-// cleanup eventually re-surfaces the row instead of hiding it forever.
-const TTL_MS = 30 * 60 * 1000
+// Deletion is eventual (the pipeline cleans the stores well after the API returns), so the list keeps
+// returning a deleted document for a while. We persist scheduled ids in localStorage — surviving page
+// refreshes — to drive a "Deleting" badge, and expire them after a TTL so a failed cleanup eventually
+// re-surfaces the row instead of hiding it forever.
+//
+// The TTL has to cover a Dagster backlog, not just a slow run: the cleanup waits on a NATS sensor tick,
+// then the observe job's turn in the queue, then a run-status sensor tick, then the remove job's turn.
+// A busy instance can push that out for hours, so a day is the honest bound.
+const TTL_MS = 24 * 60 * 60 * 1000
 
 const store = useStorage<Record<string, number>>('aihub:scheduled-deletions', {})
 
@@ -15,9 +19,13 @@ function entryKey(database: string, namespace: string, documentId: string): stri
 }
 
 export function useScheduledDeletions(database: MaybeRefOrGetter<string>, namespace: MaybeRefOrGetter<string>) {
+  function scheduledAt(documentId: string): number | undefined {
+    const at = store.value[entryKey(toValue(database), toValue(namespace), documentId)]
+    return at != null && Date.now() - at < TTL_MS ? at : undefined
+  }
+
   function isScheduled(documentId: string): boolean {
-    const scheduledAt = store.value[entryKey(toValue(database), toValue(namespace), documentId)]
-    return scheduledAt != null && Date.now() - scheduledAt < TTL_MS
+    return scheduledAt(documentId) != null
   }
 
   function schedule(documentIds: string[]): void {
@@ -44,5 +52,5 @@ export function useScheduledDeletions(database: MaybeRefOrGetter<string>, namesp
     }
   }
 
-  return { isScheduled, schedule, unschedule }
+  return { isScheduled, scheduledAt, schedule, unschedule }
 }

package/composables/form/useCreateInstanceForm.ts

@@ -115,9 +115,9 @@ export function useCreateInstanceForm<T extends ClassDataLike>(options: CreateIn
 
   function resetForm() {
     selectedClass.value = initialClass()
-    formData.value = {}
+    formData.value = hydrateFormData({}, configForm.value as FormElement[])
     activeStep.value = 0
-    seededForClass = null
+    seededForClass = selectedClassData.value ? selectedClass.value : null
   }
 
   return {

package/composables/form/useFormKitTransform.ts

@@ -339,15 +339,25 @@ function nullableToggleId(element: FormElement): string {
 
 /**
  * Combines a synthetic toggle condition with any existing condition_if.
+ *
+ * The `$` on every `$get(...)` must survive. `$:` marks the string as an expression; it does not put the
+ * references inside it into scope. Stripping their `$` made FormKit's compiler see a bare `get`, which it
+ * treats as a literal rather than a provided function — the expression then evaluated to the truthy string
+ * `"0{[nativecode]}.value"`, so a gated field rendered unconditionally and neither checkbox could hide it.
  */
 function combineConditions(toggleCondition: string, existing: string | undefined): string {
   if (!existing) return toggleCondition
-  if (existing.startsWith('$:')) {
-    return `$: ${toggleCondition.slice(1)} && (${existing.slice(2).trim()})`
-  }
-  return `$: ${toggleCondition.slice(1)} && (${existing.slice(1)})`
+  const existingExpression = existing.startsWith('$:') ? existing.slice(2).trim() : existing
+  return `$: ${toggleCondition} && (${existingExpression})`
 }
 
+/**
+ * The toggle inherits the element's own `condition_if` so it disappears with the section it belongs to.
+ * Without this, a nullable field gated on a sibling checkbox (e.g. the memory model, which only applies
+ * while memory storage is on) would hide its input but leave a stray "Enable X" checkbox behind.
+ * The element's nullable-toggle condition is deliberately NOT inherited — that is the condition this very
+ * node controls.
+ */
 function buildNullableToggleNode(
   element: FormElement,
   label: string | undefined,
@@ -355,13 +365,19 @@ function buildNullableToggleNode(
 ): Record<string, unknown> {
   const fieldName = element.name as string
   const toggleId = nullableToggleId(element)
+  const gatingCondition = element.if as string | undefined
   return {
     $formkit: 'primeCheckbox',
+    // `preserve: true` for the same reason the gated input itself carries it: when this toggle's own
+    // condition unmounts it, FormKit would otherwise drop `__<field>__enabled` from the group data, and the
+    // state seeded from the saved value is lost — an already-configured field then remounts reading "off".
+    preserve: true,
     name: nullableToggleName(fieldName),
     id: toggleId,
     key: toggleId,
     label: label ? `Enable ${label}` : 'Enable',
     ...(help ? { help } : {}),
+    ...(gatingCondition ? { if: gatingCondition } : {}),
     binary: true,
   }
 }
@@ -682,17 +698,18 @@ export function coerceNullableToggles(
 }
 
 /**
- * Recursively fills missing leaf keys with the backend's serialised Pydantic defaults
- * (`element.value`). FormKit no longer receives `value` in the schema (it would clobber
- * the v-model on registration), so defaults must be merged into the form data instead.
- * Existing values — including falsy ones like `false` or `""` — are preserved.
- *
- * NOTE: This helper is load-bearing for edit/clone/template flows but has no direct
- * unit tests yet — Vitest is not configured for packages/web (see packages/web/CLAUDE.md).
- * The Python-side `Form.to_formkit_form()` tests in packages/core lock in what
- * `element.value` looks like; behaviour here is exercised end-to-end on agent and
- * process edit forms.
+ * A nullable leaf stored as `null` is seeded with its default too, mirroring how `seedGroupDefault`
+ * materialises a null nullable group: `null` means "the toggle is off", not "the input holds nothing",
+ * so the field behind the toggle should still offer the default the backend ships (e.g. the memory
+ * model starting on the platform-wide one). Safe in both directions — `seedNullableToggles` has
+ * already decided the toggle from the raw null-ness, so this cannot switch one on, and
+ * `coerceNullableToggles` re-nullifies a disabled field at submit time, so the seeded value is never
+ * persisted while the toggle is off.
  */
+function isDisabledNullableLeaf(element: FormElement, value: unknown): boolean {
+  return element.nullable === true && value === null
+}
+
 /**
  * Seed a group field's value: always materialise its children's defaults (starting from
  * the existing object when present, `{}` otherwise — including for a saved `null`). A null
@@ -726,6 +743,18 @@ function seedRepeaterDefault(value: unknown, children: FormElement[]): unknown {
   return value === undefined ? [] : value
 }
 
+/**
+ * Recursively fills missing leaf keys with the backend's serialised Pydantic defaults
+ * (`element.value`). FormKit no longer receives `value` in the schema (it would clobber
+ * the v-model on registration), so defaults must be merged into the form data instead.
+ * Existing values — including falsy ones like `false` or `""` — are preserved.
+ *
+ * NOTE: This helper is load-bearing for edit/clone/template flows but has no direct
+ * unit tests yet — Vitest is not configured for packages/web (see packages/web/CLAUDE.md).
+ * The Python-side `Form.to_formkit_form()` tests in packages/core lock in what
+ * `element.value` looks like; behaviour here is exercised end-to-end on agent and
+ * process edit forms.
+ */
 export function seedFormDefaults(
   data: Record<string, unknown>,
   elements: FormElement[],
@@ -744,7 +773,7 @@ export function seedFormDefaults(
     else if (formkitType === 'repeater') {
       result[name] = seedRepeaterDefault(value, children)
     }
-    else if (!(name in result) && element.value !== undefined) {
+    else if (element.value !== undefined && (!(name in result) || isDisabledNullableLeaf(element, value))) {
       result[name] = element.value
     }
   }

package/formkit.config.ts

@@ -1,5 +1,6 @@
 import AgentSelector from '@core/components/FormKit/AgentSelector.vue'
 import ChipsInput from '@core/components/FormKit/ChipsInput.vue'
+import CronInput from '@core/components/FormKit/CronInput.vue'
 import IconSelector from '@core/components/FormKit/IconSelector.vue'
 import KnowledgeDatabaseSelector from '@core/components/FormKit/KnowledgeDatabaseSelector.vue'
 import LocaleInput from '@core/components/FormKit/LocaleInput.vue'
@@ -11,7 +12,7 @@ import { createInput } from '@formkit/vue'
 import { primeInputs } from '@sfxcode/formkit-primevue'
 
 import type { FormKitNode } from '@formkit/core'
-import type { DefaultConfigOptions } from '@formkit/vue'
+import type { DefaultConfigOptions, PluginConfigs } from '@formkit/vue'
 
 const LOCALES = ['de', 'en', 'fr', 'it'] as const
 
@@ -31,6 +32,36 @@ function localeRequired(node: FormKitNode): boolean {
 // create form: precisely the case this rule exists to catch.
 localeRequired.skipEmpty = false
 
+// Same shape of problem for agentSelector: its value is always an `{agent_class, agent_id}` object,
+// so picking a class alone yields a non-empty object with a blank `agent_id` that `required` accepts.
+// A blank id then renders as a NATS wildcard at runtime and the delegation reaches no agent at all.
+// Backend `AgentSelector` elements emit `agentRefRequired` instead
+// (see packages/core/swiss_ai_hub/core/form/elements/agent_selector.py).
+function agentRefRequired(node: FormKitNode): boolean {
+  const value = node.value as { agent_class?: string | null, agent_id?: string | null } | null | undefined
+  if (!value) return false
+  return !!value.agent_class?.trim() && !!value.agent_id?.trim()
+}
+
+// As with localeRequired: without this the rule never runs on a never-touched field, whose value is
+// still `null`, so a fresh create form would submit with no agent selected at all.
+agentRefRequired.skipEmpty = false
+
+/**
+ * Passes when the value is listed in the sibling field named by `address`, or when that list is
+ * empty — backend allow-lists treat empty as unrestricted. Reading the sibling through `node.at()`
+ * registers it as a validation dependency, so FormKit re-runs this rule when the list itself
+ * changes, not only when this field does.
+ *
+ * Advisory only: it exists so an admin sees the conflict in the form. The backend never depends on
+ * it — a value outside the allow-list is rejected where it is actually used.
+ */
+const memberOf: PluginConfigs['rules'][string] = (node, address: string) => {
+  const allowed = node.at(address)?.value
+  if (!Array.isArray(allowed) || allowed.length === 0) return true
+  return allowed.includes(node.value)
+}
+
 const localeRequiredMessages = {
   de: 'Mindestens eine Sprache muss ausgefüllt sein.',
   en: 'At least one language must be filled in.',
@@ -38,10 +69,30 @@ const localeRequiredMessages = {
   it: 'Almeno una lingua deve essere compilata.',
 }
 
+const agentRefRequiredMessages = {
+  de: 'Bitte wählen Sie einen Agententyp und ein Agentenprofil aus.',
+  en: 'Please select both an agent type and an agent profile.',
+  fr: 'Veuillez sélectionner un type d\'agent et un profil d\'agent.',
+  it: 'Seleziona sia un tipo di agente sia un profilo di agente.',
+}
+
+const memberOfMessages = {
+  de: 'Dieser Wert steht nicht in der Liste der erlaubten Werte.',
+  en: 'This value is not in the allowed list.',
+  fr: 'Cette valeur ne figure pas dans la liste des valeurs autorisées.',
+  it: 'Questo valore non è presente nell\'elenco dei valori consentiti.',
+}
+
 const config: DefaultConfigOptions = {
-  rules: { localeRequired },
+  rules: { localeRequired, agentRefRequired, memberOf },
   messages: Object.fromEntries(
-    LOCALES.map(locale => [locale, { validation: { localeRequired: localeRequiredMessages[locale] } }]),
+    LOCALES.map(locale => [locale, {
+      validation: {
+        localeRequired: localeRequiredMessages[locale],
+        agentRefRequired: agentRefRequiredMessages[locale],
+        memberOf: memberOfMessages[locale],
+      },
+    }]),
   ),
   inputs: {
     ...primeInputs,
@@ -51,6 +102,9 @@ const config: DefaultConfigOptions = {
     chipsInput: createInput(ChipsInput, {
       props: ['placeholder'],
     }),
+    cronInput: createInput(CronInput, {
+      props: ['timezonePlaceholder', 'filter'],
+    }),
     knowledgeDatabaseSelector: createInput(KnowledgeDatabaseSelector, {
       props: ['placeholder', 'filter'],
     }),