@vertesia/ui 1.5.0-dev.20260714.072725Z → 1.5.0-dev.20260722.120446Z

package/src/features/store/types/SelectContentTypeModal.tsx

@@ -110,10 +110,10 @@ export function SelectContentTypeModal({
                 )}
             </ModalBody>
             <ModalFooter>
-                <Button variant="ghost" onClick={handleClose} alt={t('modal.cancel')}>
+                <Button variant="ghost" onClick={handleClose} title={t('modal.cancel')}>
                     {t('modal.cancel')}
                 </Button>
-                <Button onClick={handleConfirm} alt={t('store.confirmSelection')}>
+                <Button onClick={handleConfirm} title={t('store.confirmSelection')}>
                     {t('modal.confirm')}
                 </Button>
             </ModalFooter>

package/src/features/store/types/index.ts

@@ -1,6 +1,7 @@
 export * from './ContentObjectTypesSearch';
 export * from './ContentObjectTypesTable';
 export * from './CreateOrUpdateTypeModal';
+export * from './IntakePolicyEditor';
 export * from './ObjectSchemaEditor';
 export * from './SelectContentType';
 export * from './SelectContentTypeModal';
@@ -8,3 +9,4 @@ export * from './search';
 export * from './TableLayoutEditor';
 export * from './TypeRegistry';
 export * from './TypeRegistryProvider';
+export * from './typeCatalogCache';

package/src/features/store/types/intake-policy-editor.logic.test.ts

@@ -0,0 +1,109 @@
+import type { ContentTypeIntakePolicy, InteractionExecutionConfiguration } from '@vertesia/common';
+import { describe, expect, it } from 'vitest';
+import {
+    replaceIntakeRange,
+    updateExecutionEnvironment,
+    updateExecutionModel,
+    updateIntakePolicy,
+} from './intake-policy-editor.logic.js';
+
+const MODEL_OPTIONS = { temperature: 0 } as unknown as NonNullable<InteractionExecutionConfiguration['model_options']>;
+
+describe('updateIntakePolicy', () => {
+    it('updates a nested field without losing sibling or advanced fields', () => {
+        const policy = {
+            extraction: {
+                enabled: true,
+                grounding: {
+                    enabled: true,
+                    config: {
+                        model: 'model-a',
+                        model_options: { temperature: 0 },
+                    },
+                },
+            },
+        } as ContentTypeIntakePolicy;
+
+        const updated = updateIntakePolicy(policy, ['extraction', 'grounding', 'config', 'model'], 'model-b');
+
+        expect(updated.extraction?.grounding).toEqual({
+            enabled: true,
+            config: {
+                model: 'model-b',
+                model_options: { temperature: 0 },
+            },
+        });
+        expect(policy.extraction?.grounding?.config?.model).toBe('model-a');
+    });
+
+    it('removes cleared fields and prunes empty containers', () => {
+        const policy: ContentTypeIntakePolicy = {
+            identification: {
+                guidance: 'Invoices',
+            },
+            default_view: 'pdf',
+        };
+
+        expect(updateIntakePolicy(policy, ['identification', 'guidance'], undefined)).toEqual({
+            default_view: 'pdf',
+        });
+    });
+
+    it('creates missing containers for a new nested value', () => {
+        expect(updateIntakePolicy({}, ['extraction', 'vision', 'max_pages_per_call'], 8)).toEqual({
+            extraction: {
+                vision: {
+                    max_pages_per_call: 8,
+                },
+            },
+        });
+    });
+});
+
+describe('replaceIntakeRange', () => {
+    it('updates one endpoint without mutating the source range', () => {
+        const ranges: [number, number][] = [
+            [1, 3],
+            [-1, -1],
+        ];
+
+        expect(replaceIntakeRange(ranges, 0, 1, 5)).toEqual([
+            [1, 5],
+            [-1, -1],
+        ]);
+        expect(ranges[0]).toEqual([1, 3]);
+    });
+});
+
+describe('execution configuration selection', () => {
+    it('clears a stale model and model options when the environment changes', () => {
+        expect(
+            updateExecutionEnvironment(
+                {
+                    environment: 'environment-a',
+                    model: 'model-a',
+                    model_options: MODEL_OPTIONS,
+                    do_validate: true,
+                },
+                'environment-b',
+            ),
+        ).toEqual({
+            environment: 'environment-b',
+            do_validate: true,
+        });
+    });
+
+    it('clears model options only when the model changes', () => {
+        const config = {
+            environment: 'environment-a',
+            model: 'model-a',
+            model_options: MODEL_OPTIONS,
+        };
+
+        expect(updateExecutionModel(config, 'model-a')).toEqual(config);
+        expect(updateExecutionModel(config, 'model-b')).toEqual({
+            environment: 'environment-a',
+            model: 'model-b',
+        });
+    });
+});

package/src/features/store/types/intake-policy-editor.logic.ts

@@ -0,0 +1,87 @@
+import type { ContentTypeIntakePolicy, InteractionExecutionConfiguration } from '@vertesia/common';
+
+export type IntakePolicyPath = readonly string[];
+
+export function updateIntakePolicy(
+    policy: ContentTypeIntakePolicy,
+    path: IntakePolicyPath,
+    value: unknown,
+): ContentTypeIntakePolicy {
+    if (path.length === 0) {
+        return policy;
+    }
+
+    const next = structuredClone(policy) as Record<string, unknown>;
+    const parents: Record<string, unknown>[] = [next];
+    let target = next;
+
+    for (const key of path.slice(0, -1)) {
+        const existing = target[key];
+        const child = isRecord(existing) ? existing : {};
+        target[key] = child;
+        target = child;
+        parents.push(target);
+    }
+
+    const leaf = path[path.length - 1];
+    if (value === undefined || value === '') {
+        delete target[leaf];
+        pruneEmptyParents(parents, path);
+    } else {
+        target[leaf] = value;
+    }
+
+    return next as ContentTypeIntakePolicy;
+}
+
+export function replaceIntakeRange(
+    ranges: [number, number][] | undefined,
+    index: number,
+    endpoint: 0 | 1,
+    value: number,
+): [number, number][] {
+    const next = ranges?.map((range) => [...range] as [number, number]) ?? [];
+    const current = next[index] ?? [1, 1];
+    current[endpoint] = value;
+    next[index] = current;
+    return next;
+}
+
+export function updateExecutionEnvironment(
+    config: InteractionExecutionConfiguration | undefined,
+    environment: string | undefined,
+): InteractionExecutionConfiguration | undefined {
+    const next = { ...config, environment };
+    delete next.model;
+    delete next.model_options;
+    return hasConfiguration(next) ? next : undefined;
+}
+
+export function updateExecutionModel(
+    config: InteractionExecutionConfiguration | undefined,
+    model: string | undefined,
+): InteractionExecutionConfiguration | undefined {
+    const next = { ...config, model };
+    if (model !== config?.model) {
+        delete next.model_options;
+    }
+    return hasConfiguration(next) ? next : undefined;
+}
+
+function pruneEmptyParents(parents: Record<string, unknown>[], path: IntakePolicyPath) {
+    for (let index = parents.length - 1; index > 0; index -= 1) {
+        const child = parents[index];
+        if (Object.keys(child).length > 0) {
+            break;
+        }
+        delete parents[index - 1][path[index - 1]];
+    }
+}
+
+function isRecord(value: unknown): value is Record<string, unknown> {
+    return typeof value === 'object' && value !== null && !Array.isArray(value);
+}
+
+function hasConfiguration(config: InteractionExecutionConfiguration) {
+    return Object.values(config).some((value) => value !== undefined);
+}

package/src/features/store/types/typeCatalogCache.ts

@@ -0,0 +1,45 @@
+import type { VertesiaClient } from '@vertesia/client';
+import type { ContentObjectTypeItem } from '@vertesia/common';
+
+/**
+ * Browser-session cache for content-type catalog lookups, so render-time consumers
+ * (e.g. the document view resolving a type's `default_view`) don't pay a catalog request
+ * per document view.
+ *
+ * Scoped per VertesiaClient instance (WeakMap), so switching project/session naturally
+ * starts a fresh cache. Entries are cached promises to dedupe concurrent lookups; failed
+ * lookups self-evict so the next view retries. In-app type edits must call
+ * `invalidateTypeCache` — edits made elsewhere (assistant, another tab) are picked up on
+ * the next session.
+ */
+const cachePerClient = new WeakMap<VertesiaClient, Map<string, Promise<ContentObjectTypeItem | undefined>>>();
+
+export function resolveTypeCached(client: VertesiaClient, typeId: string): Promise<ContentObjectTypeItem | undefined> {
+    let cache = cachePerClient.get(client);
+    if (!cache) {
+        cache = new Map();
+        cachePerClient.set(client, cache);
+    }
+    let entry = cache.get(typeId);
+    if (!entry) {
+        entry = client.types.catalog.resolve(typeId).then(
+            (type) => type ?? undefined,
+            () => {
+                cachePerClient.get(client)?.delete(typeId);
+                return undefined;
+            },
+        );
+        cache.set(typeId, entry);
+    }
+    return entry;
+}
+
+export function invalidateTypeCache(client: VertesiaClient, typeId?: string): void {
+    const cache = cachePerClient.get(client);
+    if (!cache) return;
+    if (typeId) {
+        cache.delete(typeId);
+    } else {
+        cache.clear();
+    }
+}

package/src/features/user/UserInfo.tsx

@@ -140,7 +140,7 @@ function EmailAgentAvatar({ email, showTitle = false, size = 'md' }: EmailAgentA
 
     const description = (
         <>
-            <div>{t('user.serviceAccountDescription')}</div>
+            <div>{t('user.agentOnBehalfOf')}</div>
             <div className="text-muted text-sm">
                 <span className="font-semibold">Email:</span> {email}
             </div>
@@ -158,11 +158,7 @@ function EmailAgentAvatar({ email, showTitle = false, size = 'md' }: EmailAgentA
                     />
                     <Avatar name={email} size={size} className="border-2 border-white dark:border-gray-800" />
                 </div>
-                {showTitle && (
-                    <div className="text-sm font-semibold truncate">
-                        {t('user.agentOnBehalfOf')} : {email}
-                    </div>
-                )}
+                {showTitle && <div className="text-sm font-semibold truncate">Agent&#8194;({email})</div>}
             </div>
         </UserPopoverPanel>
     );
@@ -260,7 +256,11 @@ function AgentAvatar({
                 </div>
                 {showTitle && (
                     <div className="text-sm font-semibold truncate">
-                        {user ? `Agent      (${user.name || user.email})` : apiKey ? `Agent (${apiKey.name})` : title}
+                        {user
+                            ? `Agent${'\u2003'}(${user.name || user.email})`
+                            : apiKey
+                              ? `Agent (${apiKey.name})`
+                              : title}
                     </div>
                 )}
             </div>

package/src/features/views/ViewExperience.test.tsx

@@ -0,0 +1,273 @@
+import { cleanup, fireEvent, screen, waitFor } from '@testing-library/react';
+import { ContentObjectStatus, type ViewExecutionResult } from '@vertesia/common';
+import { afterEach, describe, expect, it, vi } from 'vitest';
+import { renderWithProviders } from '../../__tests__/test-utils.js';
+import { ViewExperience } from './ViewExperience.js';
+
+const result: ViewExecutionResult = {
+    view: 'document-lib',
+    revision: 2,
+    definition: {
+        name: 'Document Library',
+        layout: { mode: 'browse', navigation_position: 'sidebar' },
+        search: { mode: 'deterministic', placeholder: 'Find documents' },
+        navigation: [
+            {
+                id: 'brand',
+                label: 'Brand',
+                source: 'terms',
+                field: 'properties.brand',
+                presentation: 'list',
+            },
+        ],
+        results: {
+            default_display: 'table',
+            displays: [
+                {
+                    id: 'table',
+                    label: 'Table',
+                    type: 'table',
+                    columns: [
+                        { field: 'name', label: 'Name' },
+                        { field: 'properties.brand', label: 'Brand' },
+                    ],
+                },
+            ],
+        },
+    },
+    display: 'table',
+    search: { requested_mode: 'browse', applied_mode: 'browse', warnings: [] },
+    hits: [
+        {
+            id: 'document-1',
+            document: {
+                id: 'document-1',
+                name: 'Renewal Agreement',
+                created_at: '2026-01-01T00:00:00.000Z',
+                created_by: 'user-1',
+                updated_at: '2026-01-02T00:00:00.000Z',
+                updated_by: 'user-1',
+                location: '/Customers/Acme',
+                status: ContentObjectStatus.completed,
+                properties: { brand: 'Acme' },
+                revision: { root: 'document-1', head: true },
+            },
+        },
+    ],
+    total: 1,
+    navigation: {
+        brand: {
+            id: 'brand',
+            selected: [],
+            nodes: [{ id: 'Acme', label: 'Acme', count: 1 }],
+        },
+    },
+    took: 5,
+};
+
+describe('ViewExperience', () => {
+    afterEach(() => {
+        cleanup();
+        vi.clearAllMocks();
+    });
+
+    it('renders configured search, navigation, and table results and executes selected facets', async () => {
+        const execute = vi.fn().mockResolvedValue(result);
+        renderWithProviders(
+            <ViewExperience viewId="document-lib" execute={execute} syncUrl={false} showHeader={false} />,
+        );
+
+        expect(await screen.findByText('Renewal Agreement')).not.toBeNull();
+        expect(screen.getByPlaceholderText('Find documents')).not.toBeNull();
+        expect(screen.getAllByText('Brand').length).toBeGreaterThan(0);
+        expect(screen.getAllByText('Acme').length).toBeGreaterThan(0);
+
+        fireEvent.click(screen.getByRole('checkbox', { name: /Acme/ }));
+
+        await waitFor(() => {
+            expect(execute).toHaveBeenLastCalledWith(expect.objectContaining({ navigation: { brand: ['Acme'] } }));
+        });
+    });
+
+    it('places results before sidebar navigation visually for worklist layouts', async () => {
+        const execute = vi.fn().mockResolvedValue({
+            ...result,
+            definition: {
+                ...result.definition,
+                layout: { mode: 'worklist', navigation_position: 'sidebar' },
+            },
+        } satisfies ViewExecutionResult);
+        renderWithProviders(
+            <ViewExperience viewId="case-worklist" execute={execute} syncUrl={false} showHeader={false} />,
+        );
+
+        expect(await screen.findByText('Renewal Agreement')).not.toBeNull();
+        expect(document.querySelector('main')?.className).toContain('lg:order-1');
+        expect(document.querySelector('aside')?.className).toContain('lg:order-2');
+        expect(document.querySelector('main')?.parentElement?.className).toContain(
+            'lg:grid-cols-[minmax(0,1fr)_18rem]',
+        );
+    });
+
+    it('uses an app-provided resolver for content thumbnails', async () => {
+        const execute = vi.fn().mockResolvedValue({
+            ...result,
+            definition: {
+                name: 'Visual assets',
+                results: {
+                    default_display: 'gallery',
+                    displays: [
+                        {
+                            id: 'gallery',
+                            label: 'Gallery',
+                            type: 'gallery',
+                            title: { field: 'name' },
+                            media: { source: 'content_thumbnail', fallback: 'type_icon' },
+                        },
+                    ],
+                },
+            },
+            display: 'gallery',
+        } satisfies ViewExecutionResult);
+        const resolveMedia = vi.fn().mockResolvedValue('https://example.com/thumbnail.jpg');
+
+        renderWithProviders(
+            <ViewExperience
+                viewId="visual-assets"
+                execute={execute}
+                resolveMedia={resolveMedia}
+                syncUrl={false}
+                showHeader={false}
+            />,
+        );
+
+        await waitFor(() => {
+            expect(document.querySelector('img')?.getAttribute('src')).toBe('https://example.com/thumbnail.jpg');
+        });
+        expect(resolveMedia).toHaveBeenCalledWith(
+            expect.objectContaining({ id: 'document-1' }),
+            expect.objectContaining({ source: 'content_thumbnail' }),
+        );
+    });
+
+    it('resolves content thumbnails in list displays', async () => {
+        const execute = vi.fn().mockResolvedValue({
+            ...result,
+            definition: {
+                name: 'Visual assets',
+                results: {
+                    default_display: 'list',
+                    displays: [
+                        {
+                            id: 'list',
+                            label: 'List',
+                            type: 'list',
+                            title: { field: 'name' },
+                            media: { source: 'content_thumbnail', fallback: 'type_icon' },
+                        },
+                    ],
+                },
+            },
+            display: 'list',
+        } satisfies ViewExecutionResult);
+        const resolveMedia = vi.fn().mockResolvedValue('https://example.com/list-thumbnail.jpg');
+
+        renderWithProviders(
+            <ViewExperience
+                viewId="visual-list"
+                execute={execute}
+                resolveMedia={resolveMedia}
+                syncUrl={false}
+                showHeader={false}
+            />,
+        );
+
+        await waitFor(() => {
+            expect(document.querySelector('img')?.getAttribute('src')).toBe('https://example.com/list-thumbnail.jpg');
+        });
+    });
+
+    it('honors configured media fallbacks', async () => {
+        const execute = vi.fn().mockResolvedValue({
+            ...result,
+            definition: {
+                name: 'Visual assets',
+                results: {
+                    default_display: 'cards',
+                    displays: [
+                        {
+                            id: 'cards',
+                            label: 'Cards',
+                            type: 'cards',
+                            title: { field: 'name' },
+                            media: { source: 'content_thumbnail', fallback: 'placeholder' },
+                        },
+                    ],
+                },
+            },
+            display: 'cards',
+        } satisfies ViewExecutionResult);
+        const resolveMedia = vi.fn().mockResolvedValue(undefined);
+
+        renderWithProviders(
+            <ViewExperience
+                viewId="visual-fallback"
+                execute={execute}
+                resolveMedia={resolveMedia}
+                syncUrl={false}
+                showHeader={false}
+            />,
+        );
+
+        await waitFor(() => expect(resolveMedia).toHaveBeenCalled());
+        expect(document.querySelector('svg.lucide-image')).not.toBeNull();
+        expect(document.querySelector('svg.lucide-file-text')).toBeNull();
+    });
+
+    it('executes the sort option configured on a table column', async () => {
+        const sortableResult = {
+            ...result,
+            sort: 'name_asc',
+            definition: {
+                ...result.definition,
+                results: {
+                    default_display: 'table',
+                    default_sort: 'name_asc',
+                    displays: [
+                        {
+                            id: 'table',
+                            label: 'Table',
+                            type: 'table',
+                            columns: [
+                                {
+                                    field: 'name',
+                                    label: 'Name',
+                                    sortable: true,
+                                    sort_option: 'name_asc',
+                                },
+                            ],
+                        },
+                    ],
+                    sort_options: [
+                        {
+                            id: 'name_asc',
+                            label: 'Name',
+                            sort: [{ field: 'name.keyword', order: 'asc' }],
+                        },
+                    ],
+                },
+            },
+        } satisfies ViewExecutionResult;
+        const execute = vi.fn().mockResolvedValue(sortableResult);
+
+        renderWithProviders(<ViewExperience viewId="sortable" execute={execute} syncUrl={false} showHeader={false} />);
+
+        const sortButton = await screen.findByRole('button', { name: 'Name' });
+        expect(sortButton.closest('th')?.getAttribute('aria-sort')).toBe('ascending');
+        fireEvent.click(sortButton);
+
+        await waitFor(() => {
+            expect(execute).toHaveBeenLastCalledWith(expect.objectContaining({ sort: 'name_asc' }));
+        });
+    });
+});