@swiss-ai-hub/web 0.290.11

package/composables/memory/useMemoryCRUD.ts

@@ -0,0 +1,88 @@
+import { useToast } from 'primevue/usetoast'
+import { useRouter } from 'vue-router'
+
+import type { ComputedRef } from 'vue'
+
+export interface UseMemoryCRUDOptions {
+  selectedMemory: ComputedRef<{ id: string } | undefined>
+  updateMemory: (params: { memoryId: string, data: string }) => Promise<void>
+  deleteMemory: (params: { memoryId: string }) => Promise<void>
+  closeRoute: string
+}
+
+/**
+ * Shared composable for memory CRUD operations with toast notifications.
+ * Eliminates duplication across user/org detail pages.
+ *
+ * Provides:
+ * - Update handler with success/error toasts (matches MemoryEdit @update signature)
+ * - Delete handler with success/error toasts + navigation (matches MemoryEdit @delete signature)
+ * - Close handler for navigation back to list (matches MemoryEdit @close signature)
+ *
+ * @param options - Selected memory ref, CRUD mutation functions, and close route
+ * @returns CRUD handlers with toast notifications
+ */
+export function useMemoryCRUD(options: UseMemoryCRUDOptions) {
+  const { t } = useI18n()
+  const toast = useToast()
+  const router = useRouter()
+  const tenantPath = useTenantPath()
+
+  const handleUpdate = async (data: string) => {
+    if (!options.selectedMemory.value) return
+
+    try {
+      await options.updateMemory({ memoryId: options.selectedMemory.value.id, data })
+      toast.add({
+        severity: 'success',
+        summary: t('memory.update.success.title'),
+        detail: t('memory.update.success.message'),
+        life: 3000,
+      })
+    }
+    catch (error) {
+      console.error('Failed to update memory:', error)
+      toast.add({
+        severity: 'error',
+        summary: t('memory.update.error.title'),
+        detail: t('memory.update.error.message'),
+        life: 5000,
+      })
+    }
+  }
+
+  const handleDelete = async () => {
+    if (!options.selectedMemory.value) return
+
+    try {
+      await options.deleteMemory({ memoryId: options.selectedMemory.value.id })
+      toast.add({
+        severity: 'success',
+        summary: t('memory.delete.success.title'),
+        detail: t('memory.delete.success.message'),
+        life: 3000,
+      })
+      // Navigate back to list after successful deletion
+      router.push(tenantPath(options.closeRoute))
+    }
+    catch (error) {
+      console.error('Failed to delete memory:', error)
+      toast.add({
+        severity: 'error',
+        summary: t('memory.delete.error.title'),
+        detail: t('memory.delete.error.message'),
+        life: 5000,
+      })
+    }
+  }
+
+  const handleClose = () => {
+    router.push(tenantPath(options.closeRoute))
+  }
+
+  return {
+    handleUpdate,
+    handleDelete,
+    handleClose,
+  }
+}

package/composables/memory/useMemoryFactory.ts

@@ -0,0 +1,319 @@
+import {
+  getUserMemories,
+  searchUserMemories,
+  updateUserMemory,
+  deleteUserMemory,
+  deleteAllUserMemories,
+  getOrganizationMemories,
+  searchOrganizationMemories,
+  updateOrganizationMemory,
+  deleteOrganizationMemory,
+  deleteAllOrganizationMemories,
+} from '@core/sdk/client'
+import { minutesToMilliseconds } from 'date-fns'
+import { computed, ref } from 'vue'
+
+import type { MemoriesResponse, MemorySearchResponse } from '@core/sdk/client'
+
+type MemoryType = 'user' | 'organization'
+
+interface MemoryContext {
+  type: MemoryType
+  agent_class?: string
+  agent_id?: string
+  thread_id?: string
+}
+
+/**
+ * Factory function to create memory composables for both user and organization memory types.
+ * This eliminates code duplication by generating type-specific hooks from a single implementation.
+ *
+ * @param context - Memory context specifying type (user/organization)
+ * @returns Object containing all memory-related composables
+ *
+ * @example
+ * // User memory
+ * const { useMemories, useMemorySearch } = createMemoryComposables({ type: 'user' })
+ *
+ * @example
+ * // Organization memory (tenant from env-var)
+ * const { useMemories, useMemorySearch } = createMemoryComposables({ type: 'organization' })
+ */
+export function createMemoryComposables(context: MemoryContext) {
+  const { type, agent_class, agent_id, thread_id } = context
+
+  /**
+   * Generate cache keys with proper scoping for user vs organization memory.
+   * Includes the tenant prefix for hierarchical cache invalidation.
+   */
+  const getCacheKey = (operation: string, params: Record<string, unknown> = {}) => {
+    const baseParams = { ...params, agent_class, agent_id, thread_id }
+    const memoryType = type === 'user' ? 'user' : 'organization'
+    return ['tenant', params.tenant, 'memories', memoryType, operation, baseParams]
+  }
+
+  /**
+   * Composable for fetching and paginating memories
+   */
+  const useMemories = () => {
+    const { tenantId } = useTenant()
+    const currentPage = ref(1)
+    const pageSize = ref(20)
+
+    const {
+      data: memoriesData,
+      isPending: memoriesAreLoading,
+    } = useQuery<MemoriesResponse>({
+      key: () => getCacheKey('list', { tenant: tenantId.value, page: currentPage.value }),
+      staleTime: minutesToMilliseconds(5),
+      enabled: useTenantReady(),
+      query: async () => {
+        // Use search endpoint when filters are provided (agent_class/agent_id/thread_id)
+        const hasFilters = agent_class || agent_id || thread_id
+
+        if (type === 'user') {
+          if (hasFilters) {
+            // Search endpoint supports filtering
+            return await searchUserMemories({
+              composable: '$fetch',
+              path: { tenant_id: tenantId.value! },
+              query: {
+                query: '', // Empty query returns all memories
+                limit: 1000,
+                agent_class: agent_class || null,
+                agent_id: agent_id || null,
+                thread_id: thread_id || null,
+              },
+            })
+          }
+          return await getUserMemories({
+            composable: '$fetch',
+            path: { tenant_id: tenantId.value! },
+            query: { limit: 1000 },
+          })
+        }
+
+        if (hasFilters) {
+          return await searchOrganizationMemories({
+            composable: '$fetch',
+            path: { tenant_id: tenantId.value! },
+            query: {
+              query: '', // Empty query returns all memories
+              limit: 1000,
+              agent_class: agent_class || null,
+              agent_id: agent_id || null,
+              thread_id: thread_id || null,
+            },
+          })
+        }
+        return await getOrganizationMemories({
+          composable: '$fetch',
+          path: { tenant_id: tenantId.value! },
+          query: {
+            limit: 1000,
+          },
+        })
+      },
+    })
+
+    const paginatedMemories = computed(() => {
+      if (!memoriesData.value) return []
+      const start = (currentPage.value - 1) * pageSize.value
+      const end = start + pageSize.value
+      return memoriesData.value.memories.slice(start, end)
+    })
+
+    const totalPages = computed(() => {
+      if (!memoriesData.value) return 0
+      return Math.ceil(memoriesData.value.memories.length / pageSize.value)
+    })
+
+    const allRelations = computed(() => {
+      return memoriesData.value?.relations || []
+    })
+
+    const nextPage = () => {
+      if (currentPage.value < totalPages.value) {
+        currentPage.value++
+      }
+    }
+
+    const prevPage = () => {
+      if (currentPage.value > 1) {
+        currentPage.value--
+      }
+    }
+
+    return {
+      memoriesData,
+      memoriesAreLoading,
+      paginatedMemories,
+      allRelations,
+      currentPage,
+      pageSize,
+      totalPages,
+      nextPage,
+      prevPage,
+    }
+  }
+
+  /**
+   * Composable for semantic memory search
+   */
+  const useMemorySearch = () => {
+    const { tenantId } = useTenant()
+    const query = ref<string>('')
+    const limit = ref(100)
+
+    const {
+      data: searchData,
+      isPending: searchIsLoading,
+    } = useQuery<MemorySearchResponse>({
+      key: () => getCacheKey('search', { tenant: tenantId.value, query: query.value, limit: limit.value }),
+      staleTime: minutesToMilliseconds(1),
+      enabled: () => !!query.value && !!tenantId.value,
+      query: async () => {
+        if (type === 'user') {
+          return await searchUserMemories({
+            composable: '$fetch',
+            path: { tenant_id: tenantId.value! },
+            query: {
+              query: query.value,
+              limit: limit.value,
+              agent_class: agent_class || null,
+              agent_id: agent_id || null,
+              thread_id: thread_id || null,
+            },
+          })
+        }
+
+        return await searchOrganizationMemories({
+          composable: '$fetch',
+          path: { tenant_id: tenantId.value! },
+          query: {
+            query: query.value,
+            limit: limit.value,
+            agent_class: agent_class || null,
+            agent_id: agent_id || null,
+            thread_id: thread_id || null,
+          },
+        })
+      },
+    })
+
+    const isSearchActive = computed(() => !!query.value)
+
+    const setSearchQuery = (q: string) => {
+      query.value = q
+    }
+
+    const clearSearch = () => {
+      query.value = ''
+    }
+
+    return {
+      searchData,
+      searchIsLoading,
+      query,
+      isSearchActive,
+      setSearchQuery,
+      clearSearch,
+    }
+  }
+
+  /**
+   * Composable for updating memory content
+   */
+  const useUpdateMemory = () => {
+    const queryCache = useQueryCache()
+    const { tenantId } = useTenant()
+
+    const { mutate: updateMemoryMutation } = useMutation({
+      mutation: async ({ memoryId, data }: { memoryId: string, data: string }) => {
+        const tenant = tenantId.value!
+        if (type === 'user') {
+          await updateUserMemory({
+            composable: '$fetch',
+            path: { tenant_id: tenant, memory_id: memoryId },
+            body: { data },
+          })
+        }
+        else {
+          await updateOrganizationMemory({
+            composable: '$fetch',
+            path: { tenant_id: tenant, memory_id: memoryId },
+            body: { data },
+          })
+        }
+
+        // Invalidate cache to trigger refetch
+        queryCache.invalidateQueries({ key: getCacheKey('list', { tenant }) })
+      },
+    })
+
+    return { updateMemory: updateMemoryMutation }
+  }
+
+  /**
+   * Composable for deleting memories
+   */
+  const useDeleteMemory = () => {
+    const queryCache = useQueryCache()
+    const { tenantId } = useTenant()
+
+    const { mutate: deleteMemoryMutation } = useMutation({
+      mutation: async ({ memoryId }: { memoryId: string }) => {
+        const tenant = tenantId.value!
+        if (type === 'user') {
+          await deleteUserMemory({
+            composable: '$fetch',
+            path: { tenant_id: tenant, memory_id: memoryId },
+          })
+        }
+        else {
+          await deleteOrganizationMemory({
+            composable: '$fetch',
+            path: { tenant_id: tenant, memory_id: memoryId },
+          })
+        }
+
+        // Invalidate cache to trigger refetch
+        queryCache.invalidateQueries({ key: getCacheKey('list', { tenant }) })
+      },
+    })
+
+    const { mutate: deleteAllMemoriesMutation } = useMutation({
+      mutation: async () => {
+        const tenant = tenantId.value!
+        if (type === 'user') {
+          await deleteAllUserMemories({
+            composable: '$fetch',
+            path: { tenant_id: tenant },
+          })
+        }
+        else {
+          await deleteAllOrganizationMemories({
+            composable: '$fetch',
+            path: { tenant_id: tenant },
+          })
+        }
+
+        // Invalidate both list and search cache
+        queryCache.invalidateQueries({ key: getCacheKey('list', { tenant }) })
+        queryCache.invalidateQueries({ key: getCacheKey('search', { tenant }) })
+      },
+    })
+
+    return {
+      deleteMemory: deleteMemoryMutation,
+      deleteAllMemories: deleteAllMemoriesMutation,
+    }
+  }
+
+  return {
+    useMemories,
+    useMemorySearch,
+    useUpdateMemory,
+    useDeleteMemory,
+  }
+}

package/composables/memory/useMemorySearchFilter.ts

@@ -0,0 +1,74 @@
+import { computed, onMounted } from 'vue'
+
+import type { Ref } from 'vue'
+
+export interface UseMemorySearchFilterOptions {
+  searchData: Ref<{ memories: unknown[] } | undefined>
+  paginatedMemories: Ref<unknown[]>
+  isSearchActive: Ref<boolean>
+  setSearchQuery: (query: string) => void
+  clearSearch: () => void
+  searchIsLoading: Ref<boolean>
+  currentPage?: Ref<number>
+  totalPages?: Ref<number>
+}
+
+/**
+ * Shared composable for memory search and filtering logic.
+ * Eliminates duplication across user/org list and graph pages.
+ *
+ * Provides:
+ * - Search input synced with URL query param
+ * - Displayed memories (search results or paginated)
+ * - Search/clear handlers
+ * - Loading states
+ *
+ * @param options - Memory search composable outputs from factory
+ * @returns Search filter state and handlers
+ */
+export function useMemorySearchFilter(options: UseMemorySearchFilterOptions) {
+  const searchInput = useRouteQuery('q', '')
+  const isSearchButtonLoading = computed(() =>
+    options.isSearchActive.value && options.searchIsLoading.value,
+  )
+
+  // Sync URL query param with search on mount
+  onMounted(() => {
+    if (searchInput.value) {
+      options.setSearchQuery(searchInput.value as string)
+    }
+  })
+
+  const displayedMemories = computed(() => {
+    return options.isSearchActive.value && options.searchData.value
+      ? options.searchData.value.memories
+      : options.paginatedMemories.value
+  })
+
+  const displayedCurrentPage = computed(() => {
+    return options.isSearchActive.value ? 1 : (options.currentPage?.value ?? 1)
+  })
+
+  const displayedTotalPages = computed(() => {
+    return options.isSearchActive.value ? 1 : (options.totalPages?.value ?? 1)
+  })
+
+  const handleSearch = () => {
+    options.setSearchQuery(searchInput.value)
+  }
+
+  const handleClearSearch = () => {
+    searchInput.value = null
+    options.clearSearch()
+  }
+
+  return {
+    searchInput,
+    isSearchButtonLoading,
+    displayedMemories,
+    displayedCurrentPage,
+    displayedTotalPages,
+    handleSearch,
+    handleClearSearch,
+  }
+}

package/composables/models/useModelsList.ts

@@ -0,0 +1,24 @@
+import { getLitellmModels, type ModelTypeGroupDto } from '@core/sdk/client'
+import { minutesToMilliseconds } from 'date-fns'
+
+export const useModelsList = defineQuery(() => {
+  const { tenantId } = useTenant()
+
+  const { data: modelTypes, isPending: modelsAreLoading, error } = useQuery<ModelTypeGroupDto[]>({
+    key: () => ['tenant', tenantId.value, 'models'],
+    staleTime: minutesToMilliseconds(5),
+    enabled: useTenantReady(),
+    query: async () => {
+      return await getLitellmModels({
+        composable: '$fetch',
+        path: { tenant_id: tenantId.value! },
+      })
+    },
+  })
+
+  return {
+    modelTypes,
+    modelsAreLoading,
+    error,
+  }
+})

package/composables/models/useSingleModel.ts

@@ -0,0 +1,30 @@
+import { getLitellmModel, type ModelDto } from '@core/sdk/client'
+import { minutesToMilliseconds } from 'date-fns'
+
+export const useSingleModel = () => {
+  const route = useRoute()
+  const { tenantId } = useTenant()
+
+  const modelName = computed<string>(() => decodeURIComponent(route.params?.model_name as string))
+
+  const { data: model, isPending: modelIsLoading, error } = useQuery<ModelDto>({
+    key: () => ['tenant', tenantId.value, 'model', modelName.value],
+    staleTime: minutesToMilliseconds(5),
+    enabled: useTenantReady('model_name'),
+    query: async () => {
+      return await getLitellmModel({
+        composable: '$fetch',
+        path: {
+          tenant_id: tenantId.value!,
+          model_name: modelName.value,
+        },
+      })
+    },
+  })
+
+  return {
+    model,
+    modelIsLoading,
+    error,
+  }
+}

package/composables/notification/useNotificationPoller.ts

@@ -0,0 +1,58 @@
+import { getNotifications, type NotificationDto } from '@core/sdk/client'
+import { useIntervalFn } from '@vueuse/core'
+import { useToast } from 'primevue/usetoast'
+
+export const useNotificationPoller = (options?: {
+  pollingInterval?: number
+  enabled?: boolean
+}) => {
+  const { tenantId } = useTenant()
+  const toast = useToast()
+  const queryCache = useQueryCache()
+
+  const knownUnreadIds = ref(new Set<string>())
+
+  const { data: unreadResponse, refetch } = useQuery({
+    key: () => ['tenant', tenantId.value, 'notifications_poller_data'],
+    query: () =>
+      getNotifications({
+        composable: '$fetch',
+        path: { tenant_id: tenantId.value! },
+        query: { read: false, page_size: 100 },
+      }),
+    enabled: useTenantReady(),
+  })
+
+  watch(unreadResponse, (newData) => {
+    const newNotifications = newData?.notifications
+    if (!newNotifications) return
+
+    let hasNew = false
+    newNotifications.forEach((notification: NotificationDto) => {
+      if (!knownUnreadIds.value.has(notification.id)) {
+        hasNew = true
+        toast.add({
+          severity: notification.type,
+          summary: notification.title,
+          detail: notification.message,
+          life: 5000,
+        })
+      }
+    })
+
+    knownUnreadIds.value = new Set(newNotifications.map(n => n.id))
+
+    if (hasNew) {
+      queryCache.invalidateQueries({ key: ['tenant', tenantId.value, 'notifications'] })
+    }
+  })
+
+  const pollingInterval = options?.pollingInterval ?? 30_000
+  const enabled = options?.enabled ?? true
+
+  useIntervalFn(() => {
+    if (tenantId.value) {
+      refetch()
+    }
+  }, pollingInterval, { immediate: enabled })
+}

package/composables/notification/useNotifications.ts

@@ -0,0 +1,57 @@
+import { getNotifications, type PaginatedNotificationsResponse } from '@core/sdk/client'
+
+export const useNotifications = (options: {
+  currentPage: Ref<number>
+  pageSize: Ref<number>
+  filters?: {
+    read?: Ref<boolean | undefined>
+    done?: Ref<boolean | undefined>
+    types?: Ref<string[] | undefined>
+    severities?: Ref<string[] | undefined>
+  }
+}) => {
+  const { tenantId } = useTenant()
+  const { currentPage, pageSize, filters } = options
+
+  const key = () => [
+    'tenant',
+    tenantId.value,
+    'notifications',
+    {
+      page: currentPage.value,
+      pageSize: pageSize.value,
+      read: filters?.read?.value,
+      done: filters?.done?.value,
+      types: filters?.types?.value,
+      severities: filters?.severities?.value,
+    },
+  ]
+
+  const query = useQuery<PaginatedNotificationsResponse>({
+    key,
+    enabled: useTenantReady(),
+    query: () =>
+      getNotifications({
+        composable: '$fetch',
+        path: { tenant_id: tenantId.value! },
+        query: {
+          page: currentPage.value,
+          page_size: pageSize.value,
+          read: filters?.read?.value,
+          done: filters?.done?.value,
+          types: filters?.types?.value,
+          severities: filters?.severities?.value,
+        },
+      }),
+  })
+
+  const notifications = computed(() => query.data.value?.notifications ?? [])
+  const totalRecords = computed(() => query.data.value?.total ?? 0)
+
+  return {
+    notifications,
+    isLoading: query.isPending,
+    refetch: query.refetch,
+    totalRecords,
+  }
+}

package/composables/notification/useUpdateMultipleNotifications.ts

@@ -0,0 +1,17 @@
+import { type UpdateNotificationRequest, updateNotificationsBulk } from '@core/sdk/client'
+
+export const useUpdateMultipleNotifications = defineMutation(() => {
+  const queryCache = useQueryCache()
+  const { tenantId } = useTenant()
+  return useMutation({
+    mutation: ({ ids, payload, tenantId }: { ids: string[], payload: Ref<UpdateNotificationRequest>, tenantId: string }) =>
+      updateNotificationsBulk({
+        composable: '$fetch',
+        path: { tenant_id: tenantId },
+        body: { notification_ids: ids, updates: payload },
+      }),
+    onSuccess: () => {
+      queryCache.invalidateQueries({ key: ['tenant', tenantId.value, 'notifications'] })
+    },
+  })
+})

package/composables/notification/useUpdateNotification.ts

@@ -0,0 +1,17 @@
+import { updateNotification, type UpdateNotificationRequest } from '@core/sdk/client'
+
+export const useUpdateNotification = defineMutation(() => {
+  const queryCache = useQueryCache()
+  const { tenantId } = useTenant()
+  return useMutation({
+    mutation: ({ id, payload, tenantId }: { id: string, payload: Ref<UpdateNotificationRequest>, tenantId: string }) =>
+      updateNotification({
+        composable: '$fetch',
+        path: { tenant_id: tenantId, notification_id: id },
+        body: payload,
+      }),
+    onSuccess: () => {
+      queryCache.invalidateQueries({ key: ['tenant', tenantId.value, 'notifications'] })
+    },
+  })
+})