@aleph-alpha/chat-kit 3.2.0 → 4.0.0

package/src/composables/fileUpload/useFileUploadWrapper.spec.ts

@@ -94,30 +94,42 @@ describe('useFileUploadWrapper handleFilesSelected', () => {
     fetchMock.mockImplementation((url: string, init?: RequestInit) => {
       const method = init?.method ?? 'GET';
 
-      if (method === 'GET' && url.includes('/workflows')) {
+      if (method === 'GET' && url.endsWith('search-stores')) {
         return createMockFetchResponse({
           items: [
             {
-              id: 'workflow-api-1',
-              name: 'wf-1',
-              created_at: '2024-01-01T00:00:00Z',
+              id: 'store-1',
+              name: 'conv-1',
+              models: [{ embedding_model: 'test-model' }],
             },
           ],
           total: 1,
         });
       }
-      if (method === 'GET' && url.includes('search-stores')) {
+      if (method === 'GET' && url.includes('/workflows')) {
         return createMockFetchResponse({
-          items: [
-            {
-              id: 'store-1',
-              name: 'test-store',
-              models: [{ embedding_model: 'test-model' }],
-            },
-          ],
-          total: 1,
+          items: [{ id: 'wf-1', name: 'wf-1' }],
         });
       }
+      if (method === 'POST' && url.endsWith('search-stores')) {
+        return createMockFetchResponse({ id: 'new-store-id' });
+      }
+      if (method === 'POST' && url.includes('/files')) {
+        return createMockFetchResponse([{ id: 'remote-1' }]);
+      }
+      if (method === 'POST' && url.includes('/workflows')) {
+        return createMockFetchResponse({ id: 'run-1' });
+      }
+      if (url.includes('/event-stream')) {
+        return createMockFetchResponse(null, 200).then((res) => ({
+          ...res,
+          body: new ReadableStream({
+            start(controller) {
+              controller.close();
+            },
+          }),
+        }));
+      }
       return createMockFetchResponse({});
     });
   });
@@ -222,7 +234,6 @@ describe('useFileUploadWrapper handleFilesSelected', () => {
     });
     await settleAsyncUploads();
     expect(uploadMock.upload).not.toHaveBeenCalled();
-    expect(fetchMock).not.toHaveBeenCalled();
   });
 
   it('does not call onFilesExceeded when exactly at the limit', async () => {
@@ -258,3 +269,173 @@ describe('useFileUploadWrapper handleFilesSelected', () => {
     expect(uploadMock.upload).toHaveBeenCalledOnce();
   });
 });
+
+describe('useFileUploadWrapper search store resolution', () => {
+  let fetchMock: ReturnType<typeof vi.fn>;
+
+  beforeEach(() => {
+    fetchMock = vi.fn();
+    vi.stubGlobal('fetch', fetchMock);
+  });
+
+  afterEach(() => {
+    vi.unstubAllGlobals();
+  });
+
+  it('reuses an existing search store named after the conversation id', async () => {
+    fetchMock.mockImplementation((url: string, init?: RequestInit) => {
+      const method = init?.method ?? 'GET';
+
+      if (method === 'GET' && url.endsWith('search-stores')) {
+        return createMockFetchResponse({
+          items: [
+            {
+              id: 'existing-store',
+              name: 'conv-1',
+              models: [{ embedding_model: 'test-model' }],
+            },
+          ],
+          total: 1,
+        });
+      }
+      if (method === 'GET' && url.includes('/workflows')) {
+        return createMockFetchResponse({
+          items: [{ id: 'wf-1', name: 'wf-1' }],
+        });
+      }
+      return createMockFetchResponse({});
+    });
+
+    const provider = createDocumentUploadProvider(buildConfig());
+    const { storeId } = provider.useDocumentUpload('conv-1');
+
+    await vi.waitFor(() => {
+      expect(storeId.value).toBe('existing-store');
+    });
+
+    expect(fetchMock).toHaveBeenCalledWith(
+      'https://test.example.com/search-stores',
+      expect.objectContaining({ method: 'GET' }),
+    );
+    expect(
+      fetchMock.mock.calls.some(
+        ([url, init]) =>
+          init?.method === 'POST' && String(url).endsWith('search-stores'),
+      ),
+    ).toBe(false);
+  });
+
+  it('creates a search store and workflow when none exists for the conversation', async () => {
+    fetchMock.mockImplementation((url: string, init?: RequestInit) => {
+      const method = init?.method ?? 'GET';
+
+      if (method === 'GET' && url.endsWith('search-stores')) {
+        return createMockFetchResponse({ items: [], total: 0 });
+      }
+      if (method === 'POST' && url.endsWith('search-stores')) {
+        const body = JSON.parse(String(init?.body));
+        expect(body.name).toBe('conv-2');
+        return createMockFetchResponse({ id: 'created-store' });
+      }
+      if (method === 'POST' && url.includes('/workflows')) {
+        return createMockFetchResponse({ id: 'wf-run-1' });
+      }
+      return createMockFetchResponse({});
+    });
+
+    const provider = createDocumentUploadProvider(buildConfig());
+    const { storeId } = provider.useDocumentUpload('conv-2');
+
+    await vi.waitFor(() => {
+      expect(storeId.value).toBe('created-store');
+    });
+
+    expect(
+      fetchMock.mock.calls.some(
+        ([url, init]) =>
+          init?.method === 'POST' &&
+          String(url).endsWith('search-stores/created-store/workflows'),
+      ),
+    ).toBe(true);
+  });
+
+  it('creates a workflow when reusing a store that has none', async () => {
+    fetchMock.mockImplementation((url: string, init?: RequestInit) => {
+      const method = init?.method ?? 'GET';
+
+      if (method === 'GET' && url.endsWith('search-stores')) {
+        return createMockFetchResponse({
+          items: [
+            {
+              id: 'orphan-store',
+              name: 'conv-3',
+              models: [{ embedding_model: 'test-model' }],
+            },
+          ],
+          total: 1,
+        });
+      }
+      if (method === 'GET' && url.includes('/workflows')) {
+        return createMockFetchResponse({ items: [] });
+      }
+      if (method === 'POST' && url.includes('/workflows')) {
+        return createMockFetchResponse({ id: 'wf-1' });
+      }
+      return createMockFetchResponse({});
+    });
+
+    const provider = createDocumentUploadProvider(buildConfig());
+    const { storeId } = provider.useDocumentUpload('conv-3');
+
+    await vi.waitFor(() => {
+      expect(storeId.value).toBe('orphan-store');
+    });
+
+    expect(
+      fetchMock.mock.calls.some(
+        ([url, init]) =>
+          init?.method === 'POST' &&
+          String(url).endsWith('search-stores/orphan-store/workflows'),
+      ),
+    ).toBe(true);
+  });
+
+  it('resolves a different store per conversation id', async () => {
+    fetchMock.mockImplementation((url: string, init?: RequestInit) => {
+      const method = init?.method ?? 'GET';
+
+      if (method === 'GET' && url.endsWith('search-stores')) {
+        return createMockFetchResponse({
+          items: [
+            {
+              id: 'store-a',
+              name: 'conv-a',
+              models: [{ embedding_model: 'test-model' }],
+            },
+            {
+              id: 'store-b',
+              name: 'conv-b',
+              models: [{ embedding_model: 'test-model' }],
+            },
+          ],
+          total: 2,
+        });
+      }
+      if (method === 'GET' && url.includes('/workflows')) {
+        return createMockFetchResponse({
+          items: [{ id: 'wf-1', name: 'wf-1' }],
+        });
+      }
+      return createMockFetchResponse({});
+    });
+
+    const provider = createDocumentUploadProvider(buildConfig());
+    const uploadA = provider.useDocumentUpload('conv-a');
+    const uploadB = provider.useDocumentUpload('conv-b');
+
+    await vi.waitFor(() => {
+      expect(uploadA.storeId.value).toBe('store-a');
+      expect(uploadB.storeId.value).toBe('store-b');
+    });
+  });
+});

package/src/composables/fileUpload/useFileUploadWrapper.ts

@@ -13,7 +13,6 @@ import type {
   UploadEvent,
 } from './types';
 import { useFileUpload } from './useFileUpload';
-import { defaultEndpoints } from './types';
 
 function buildHttpClient(
   baseUrl: string,
@@ -177,34 +176,14 @@ export function createDocumentUploadProvider(
   };
 
   const httpClient = buildHttpClient(baseUrl, defaultHeaders);
-  const endpoints = defaultEndpoints;
 
-  // ---- Search store resolution (one per user) ----
+  // ---- Search store resolution (one per conversation) ----
 
-  let resolvedStoreId: string | null = null;
-  let resolvePromise: Promise<string> | null = null;
-  const resolvedWorkflowIdByStore = new Map<string, string>();
+  const storeIdByConversation = new Map<string, string>();
+  const resolvePromises = new Map<string, Promise<string>>();
 
-  async function createWorkflowForStore(storeId: string): Promise<string> {
-    const workflowRes = await httpClient.post<{ id: string }>(
-      endpoints.createWorkflow(storeId),
-      workflowConfig,
-    );
-    return workflowRes.id;
-  }
-
-  async function createSearchStoreWithWorkflow(): Promise<string> {
-    const name = `store-${new Date().toISOString().replace(/[:.]/g, '-')}`;
-    const storeRes = await httpClient.post<{ id: string }>('search-stores', {
-      name,
-      ...searchStoreConfig,
-    });
-    const newStoreId = storeRes.id;
-
-    const workflowApiId = await createWorkflowForStore(newStoreId);
-    resolvedWorkflowIdByStore.set(newStoreId, workflowApiId);
-
-    return newStoreId;
+  function searchStoreNameForConversation(conversationId: string): string {
+    return conversationId;
   }
 
   interface SearchStoreListResponse {
@@ -217,63 +196,109 @@ export function createDocumentUploadProvider(
   }
 
   interface WorkflowListResponse {
-    items: Array<{
-      id: string;
-      name: string;
-      created_at: string;
-    }>;
-    total: number;
+    items: Array<{ id: string; name?: string }>;
   }
 
-  async function fetchOrCreateWorkflow(storeId: string): Promise<string> {
-    const cached = resolvedWorkflowIdByStore.get(storeId);
-    if (cached) return cached;
+  function findConfiguredWorkflow(
+    items: WorkflowListResponse['items'],
+  ): { id: string } | undefined {
+    const configuredWorkflowName =
+      typeof workflowConfig.name === 'string' ? workflowConfig.name : undefined;
+
+    return items?.find(
+      (workflow) =>
+        workflow.id === workflowId ||
+        workflow.name === workflowId ||
+        (configuredWorkflowName != null &&
+          workflow.name === configuredWorkflowName),
+    );
+  }
 
+  async function resolveWorkflowId(storeId: string): Promise<string> {
     const response = await httpClient.get<WorkflowListResponse>(
-      endpoints.workflows(storeId),
+      `search-stores/${storeId}/workflows`,
     );
+    const existing = findConfiguredWorkflow(response.items);
 
-    if (response.items.length > 0) {
-      const match = response.items.find((item) => item.name === workflowId);
-      const selected = match ?? response.items[0]!;
-      resolvedWorkflowIdByStore.set(storeId, selected.id);
-      return selected.id;
+    if (existing) {
+      return existing.id;
     }
 
-    const workflowApiId = await createWorkflowForStore(storeId);
-    resolvedWorkflowIdByStore.set(storeId, workflowApiId);
-    return workflowApiId;
+    const created = await httpClient.post<{ id: string }>(
+      `search-stores/${storeId}/workflows`,
+      workflowConfig,
+    );
+    return created.id;
   }
 
-  async function fetchOrCreateStore(): Promise<string> {
-    try {
-      const response =
-        await httpClient.get<SearchStoreListResponse>('search-stores');
+  async function createSearchStore(conversationId: string): Promise<string> {
+    const storeRes = await httpClient.post<{ id: string }>('search-stores', {
+      name: searchStoreNameForConversation(conversationId),
+      ...searchStoreConfig,
+    });
 
-      const expectedModel = searchStoreConfig.models[0]?.embedding_model;
-      const match = response.items.find((store) =>
-        store.models.some((m) => m.embedding_model === expectedModel),
-      );
+    await httpClient.post(
+      `search-stores/${storeRes.id}/workflows`,
+      workflowConfig,
+    );
 
-      if (match) {
-        resolvedStoreId = match.id;
-        return resolvedStoreId;
-      }
+    return storeRes.id;
+  }
 
-      resolvedStoreId = await createSearchStoreWithWorkflow();
-      return resolvedStoreId;
-    } catch (err) {
-      resolvePromise = null;
-      throw err;
+  function findStoreForConversation(
+    items: SearchStoreListResponse['items'],
+    conversationId: string,
+  ) {
+    const expectedName = searchStoreNameForConversation(conversationId);
+    const expectedModel = searchStoreConfig.models[0]?.embedding_model;
+
+    return items.find(
+      (store) =>
+        store.name === expectedName &&
+        (!expectedModel ||
+          store.models.some((m) => m.embedding_model === expectedModel)),
+    );
+  }
+
+  async function fetchOrCreateStore(conversationId: string): Promise<string> {
+    const response =
+      await httpClient.get<SearchStoreListResponse>('search-stores');
+
+    const existing = findStoreForConversation(response.items, conversationId);
+
+    if (existing) {
+      await resolveWorkflowId(existing.id);
+      storeIdByConversation.set(conversationId, existing.id);
+      return existing.id;
     }
+
+    const newStoreId = await createSearchStore(conversationId);
+    storeIdByConversation.set(conversationId, newStoreId);
+    return newStoreId;
   }
 
-  async function resolveSearchStore(): Promise<string> {
-    if (resolvedStoreId) return resolvedStoreId;
-    if (resolvePromise) return resolvePromise;
+  async function resolveSearchStore(conversationId: string): Promise<string> {
+    if (!conversationId) {
+      throw new Error('conversationId is required to resolve a search store.');
+    }
+
+    const cached = storeIdByConversation.get(conversationId);
+    if (cached) return cached;
+
+    const pending = resolvePromises.get(conversationId);
+    if (pending) return pending;
+
+    const promise = fetchOrCreateStore(conversationId).catch((err) => {
+      storeIdByConversation.delete(conversationId);
+      throw err;
+    });
+    resolvePromises.set(conversationId, promise);
 
-    resolvePromise = fetchOrCreateStore();
-    return resolvePromise;
+    try {
+      return await promise;
+    } finally {
+      resolvePromises.delete(conversationId);
+    }
   }
 
   // ---- Upload SDK singleton ----
@@ -319,7 +344,9 @@ export function createDocumentUploadProvider(
     const fileInput = ref<HTMLInputElement | null>(null);
     const upload = getUploadInstance();
     const resolvedMaxFiles = upload.getSupportedFileTypes().maxFilesPerUpload;
-    const storeId = ref<string>(resolvedStoreId ?? '');
+    const storeId = ref<string>(
+      storeIdByConversation.get(toValue(conversationIdRef)) ?? '',
+    );
 
     const currentScope = shallowRef<ScopedFileView | null>(
       upload.scopeBy('conversationId', toValue(conversationIdRef)),
@@ -327,15 +354,20 @@ export function createDocumentUploadProvider(
 
     watch(
       () => toValue(conversationIdRef),
-      (newId: string, oldId: string) => {
-        if (oldId && oldId !== newId) {
-          const oldScope = upload.scopeBy('conversationId', oldId);
-          for (const entry of oldScope.files.value) {
-            upload.updateFileMetadata(entry.id, { conversationId: newId });
-          }
-        }
+      async (newId: string) => {
         currentScope.value = upload.scopeBy('conversationId', newId);
+        if (!newId) {
+          storeId.value = '';
+          return;
+        }
+
+        try {
+          storeId.value = await resolveSearchStore(newId);
+        } catch {
+          storeId.value = '';
+        }
       },
+      { immediate: true },
     );
 
     function scopedFiles(): FileEntry[] {
@@ -345,13 +377,15 @@ export function createDocumentUploadProvider(
     async function uploadFiles(files: File[]) {
       if (!files.length) return;
 
-      const userStoreId = await resolveSearchStore();
-      const workflowApiId = await fetchOrCreateWorkflow(userStoreId);
+      const conversationId = toValue(conversationIdRef);
+      if (!conversationId) return;
+
+      const userStoreId = await resolveSearchStore(conversationId);
+      const workflowApiId = await resolveWorkflowId(userStoreId);
       upload.setStoreId(userStoreId);
       upload.setWorkflowId(workflowApiId);
       storeId.value = userStoreId;
 
-      const conversationId = toValue(conversationIdRef);
       const result = await upload.upload({
         id: `${conversationId}::${Date.now()}`,
         files,
@@ -425,13 +459,12 @@ export function createDocumentUploadProvider(
     ) {
       const input = event.target as HTMLInputElement;
       let fileList = Array.from(input.files ?? []);
-      const availableSlots = resolvedMaxFiles - unassignedFiles.value.length;
 
-      if (fileList.length > availableSlots) {
-        const kept = Math.max(0, availableSlots);
+      if (fileList.length > resolvedMaxFiles) {
+        const kept = Math.max(0, resolvedMaxFiles);
         options?.onFilesExceeded?.({
           selected: fileList.length,
-          allowed: availableSlots,
+          allowed: resolvedMaxFiles,
           kept,
         });
         fileList = fileList.slice(0, kept);

package/src/handlers/index.ts

@@ -4,6 +4,8 @@ export {
   remarkNormalizeMath,
   normalizeMathDelimiters,
 } from '../helpers/unified/remarkNormalizeMath';
+export { remarkCitations } from '../helpers/unified/remarkCitations';
+export type { RemarkCitationsOptions } from '../helpers/unified/remarkCitations';
 export {
   provideChatKitLabels,
   useChatKitLabels,

package/src/handlers/useChatKitLabels.spec.ts

@@ -102,6 +102,7 @@ describe('useChatKitLabels', () => {
       inputPlaceholder: 'Custom placeholder',
       copyMessageAction: 'Custom copy',
       copyMessageActionCopied: 'Custom copied',
+      regenerateMessageAction: 'Custom regenerate',
       feedbackThumbsUp: 'Custom up',
       feedbackThumbsDown: 'Custom down',
       feedbackGroup: 'Custom group',

package/src/handlers/useChatKitLabels.ts

@@ -29,6 +29,8 @@ export type ChatKitLabels = {
   copyMessageAction: string;
   /** Accessible label / tooltip for the copy-message action button after a successful copy */
   copyMessageActionCopied: string;
+  /** Accessible label / tooltip for the regenerate-message action button */
+  regenerateMessageAction: string;
   /**
    * Accessible label / tooltip for the thumbs-up button in `CkFeedbackButton`.
    * Optional for backward compatibility; falls back to
@@ -81,6 +83,17 @@ export type ChatKitLabels = {
    * can scroll wide tables). Falls back to `defaultChatKitLabels` when omitted.
    */
   markdownTableLabel?: string;
+  /**
+   * Accessible label for the external-link action in a citation card
+   * (`CkCitation` / `CkCitationCard`). Falls back to `defaultChatKitLabels`.
+   */
+  citationOpenSource?: string;
+  /**
+   * Prefix for a citation marker's accessible name in `CkCitation`, composed
+   * as `"{citationSourceLabel} {index}"` (e.g. "Source 1"). Falls back to
+   * `defaultChatKitLabels`.
+   */
+  citationSourceLabel?: string;
   /** Fallback title used by `CkHistory` when a conversation has no `title`. */
   historyItemUntitled: string;
   /** Accessible name for the trailing kebab trigger on each `CkHistory` row. */
@@ -103,6 +116,7 @@ export const defaultChatKitLabels: ChatKitLabels = {
   inputPlaceholder: 'Type a message...',
   copyMessageAction: 'Copy response',
   copyMessageActionCopied: 'Copied!',
+  regenerateMessageAction: 'Regenerate response',
   feedbackThumbsUp: 'Good response',
   feedbackThumbsDown: 'Bad response',
   feedbackGroup: 'Rate this response',
@@ -123,6 +137,8 @@ export const defaultChatKitLabels: ChatKitLabels = {
   modelSelectorListAriaLabel: 'Models',
   modelSelectorPlaceholder: 'Select model',
   markdownTableLabel: 'Table',
+  citationOpenSource: 'Open source',
+  citationSourceLabel: 'Source',
   historyItemUntitled: 'Untitled conversation',
   historyItemActionAriaLabel: 'Conversation options',
   historyItemEditAction: 'Edit',

package/src/handlers/useMarkdownParser.ts

@@ -83,8 +83,11 @@ function buildProcessor(plugins: PluggableList): SyncProcessor {
     .use(remarkNormalizeMath)
     .use(remarkGfm)
     .use(remarkMath);
-  for (const plugin of plugins) {
-    proc = proc.use(plugin as any);
+  // Apply the whole list at once. unified resolves `[plugin, options]` tuples
+  // when they're entries of a list; calling `.use(tuple)` per entry instead
+  // misreads the options object as a preset and throws.
+  if (plugins.length > 0) {
+    proc = proc.use(plugins);
   }
   return proc.use(remarkRehype).use(rehypeKatex).use(rehypeStringify);
 }

package/src/handlers/useMessageHandler.spec.ts

@@ -146,6 +146,36 @@ describe('useMessageHandler', () => {
       expect('metadata' in msg).toBe(false);
       expect('metadata' in handler.messages.value[0]).toBe(false);
     });
+
+    it('branches off an explicit parentId, updating the parent and activating the new branch', () => {
+      const handler = useMessageHandler();
+
+      handler.setCurrentUserMessage('First');
+      const first = handler.commitUserMessage();
+      handler.setCurrentUserMessage('Second');
+      const second = handler.commitUserMessage();
+
+      // Branch a sibling of `second` off their shared parent `first`.
+      handler.setCurrentUserMessage('Sibling');
+      const sibling = handler.commitUserMessage({ parentId: first.id });
+
+      const parent = handler.getTree().nodes[first.id];
+      expect(parent.childrenIds).toEqual([second.id, sibling.id]);
+      // The freshly created branch becomes the active path.
+      expect(parent.activeChildIndex).toBe(1);
+      expect(handler.messages.value.map((m) => m.id)).toEqual([
+        first.id,
+        sibling.id,
+      ]);
+    });
+
+    it('throws when branching off an unknown parentId', () => {
+      const handler = useMessageHandler();
+      handler.setCurrentUserMessage('Hello');
+      expect(() =>
+        handler.commitUserMessage({ parentId: 'does-not-exist' }),
+      ).toThrow('Unknown parent message id: does-not-exist');
+    });
   });
 
   describe('updateMessage', () => {
@@ -342,6 +372,55 @@ describe('useMessageHandler', () => {
       expect(handler.messages.value).toHaveLength(2);
       expect(getText(handler.messages.value[1].content)).toBe('Streaming...');
     });
+
+    it('branches a new node off an explicit parentId on create', () => {
+      const handler = useMessageHandler();
+      handler.setTree(
+        makeTree(
+          {
+            u1: makeTreeMessage({ id: 'u1', content: [text('Hello')] }),
+            a1: makeTreeMessage({
+              id: 'a1',
+              parentId: 'u1',
+              role: 'assistant',
+              content: [text('Hi')],
+            }),
+          },
+          'u1',
+        ),
+      );
+
+      // Regenerate: add a sibling assistant answer under the same user turn.
+      handler.updateMessage({
+        id: 'a2',
+        content: [text('Hi again')],
+        role: 'assistant',
+        status: 'completed',
+        parentId: 'u1',
+      });
+
+      const parent = handler.getTree().nodes.u1;
+      expect(parent.childrenIds).toEqual(['a1', 'a2']);
+      expect(parent.activeChildIndex).toBe(1);
+      expect(handler.messages.value.map((m) => m.id)).toEqual(['u1', 'a2']);
+    });
+
+    it('ignores parentId when the node already exists', () => {
+      const handler = useMessageHandler();
+      handler.setCurrentUserMessage('Hello');
+      const msg = handler.commitUserMessage();
+
+      handler.updateMessage({
+        id: msg.id,
+        content: [text('Updated')],
+        role: 'user',
+        status: 'completed',
+        parentId: 'does-not-exist',
+      });
+
+      expect(getText(handler.getMessageById(msg.id)!.content)).toBe('Updated');
+      expect(handler.getTree().nodes[msg.id].parentId).toBeNull();
+    });
   });
 
   describe('getMessageById', () => {