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

package/src/features/magic-pdf/MagicPdfProvider.tsx

@@ -16,8 +16,6 @@ interface MagicPdfContextValue {
     layoutProvider: PageLayoutProvider;
     markdownProvider: PageMarkdownProvider;
     imageProvider: PageImageProvider;
-    xml: string;
-    xmlPages: string[];
     pdfUrl: string;
     pdfUrlLoading: boolean;
 }
@@ -201,54 +199,42 @@ interface MagicPdfProviderProps {
 export function MagicPdfProvider({ children, object }: MagicPdfProviderProps) {
     const { client } = useUserSession();
     const page_count = (object.metadata as DocumentMetadata).page_count || DEFAULT_PAGE_COUNT;
-    const isMarkdownProcessor = (object.metadata as DocumentMetadata)?.content_processor?.type === 'markdown';
 
-    // Create initial context immediately (synchronously) for both processor types
     const [info, setInfo] = useState<MagicPdfContextValue>(() => {
         const markdownProvider = new PageMarkdownProvider(page_count);
-        if (isMarkdownProcessor && object.text) {
+        if (object.text) {
             markdownProvider.initFromContent(object.text);
         }
-        const xml = object.text ? cleanXml(object.text) : '';
         return {
             count: page_count,
             layoutProvider: new PageLayoutProvider(client, object.id, page_count),
             markdownProvider,
             imageProvider: new PageImageProvider(client, object.id, page_count),
-            xml,
-            xmlPages: object.text ? extractXmlPages(xml) : [],
             pdfUrl: '',
             pdfUrlLoading: true,
         };
     });
 
     useEffect(() => {
-        if (isMarkdownProcessor) {
-            // For markdown processor, fetch the PDF URL lazily
-            // Priority: PDF rendition > source (only if source is PDF)
-            const metadata = object.metadata as DocumentMetadata;
-            const pdfRendition = metadata?.renditions?.find((r) => r.name === PDF_RENDITION_NAME);
-            const isPdfSource = object.content?.type === 'application/pdf';
-            const sourceToResolve = pdfRendition?.content?.source || (isPdfSource ? object.content?.source : undefined);
-
-            if (sourceToResolve) {
-                client.store.objects
-                    .getDownloadUrl(sourceToResolve, undefined, 'inline')
-                    .then((response) => {
-                        setInfo((prev) => ({ ...prev, pdfUrl: response.url, pdfUrlLoading: false }));
-                    })
-                    .catch((e) => {
-                        console.warn('Failed to get PDF URL:', e);
-                        setInfo((prev) => ({ ...prev, pdfUrlLoading: false }));
-                    });
-            } else {
-                setInfo((prev) => ({ ...prev, pdfUrlLoading: false }));
-            }
+        const metadata = object.metadata as DocumentMetadata;
+        const pdfRendition = metadata?.renditions?.find((r) => r.name === PDF_RENDITION_NAME);
+        const isPdfSource = object.content?.type === 'application/pdf';
+        const sourceToResolve = pdfRendition?.content?.source || (isPdfSource ? object.content?.source : undefined);
+
+        if (sourceToResolve) {
+            client.store.objects
+                .getDownloadUrl(sourceToResolve, undefined, 'inline')
+                .then((response) => {
+                    setInfo((prev) => ({ ...prev, pdfUrl: response.url, pdfUrlLoading: false }));
+                })
+                .catch((e) => {
+                    console.warn('Failed to get PDF URL:', e);
+                    setInfo((prev) => ({ ...prev, pdfUrlLoading: false }));
+                });
         } else {
-            // For XML processor, no pre-loading needed - images load on demand
             setInfo((prev) => ({ ...prev, pdfUrlLoading: false }));
         }
-    }, [client, isMarkdownProcessor, object.metadata, object.content?.type, object.content?.source]);
+    }, [client, object.metadata, object.content?.type, object.content?.source]);
 
     return <MagicPdfContext.Provider value={info}>{children}</MagicPdfContext.Provider>;
 }
@@ -264,19 +250,3 @@ export function useMagicPdfContext() {
     }
     return context;
 }
-
-function extractXmlPages(xml: string): string[] {
-    // Parse the XML string
-    const doc = new DOMParser().parseFromString(cleanXml(xml), 'text/xml');
-    const pages = doc.getElementsByTagName('page');
-    const serializer = new XMLSerializer();
-    return Array.from(pages).map((p) => serializer.serializeToString(p));
-}
-
-function cleanXml(xml: string) {
-    const cleanedXML = xml
-        // biome-ignore lint/suspicious/noControlCharactersInRegex: deliberately stripping XML-illegal control characters
-        .replace(/[\x00-\x08\x0B\x0C\x0E-\x1F\x7F]/g, '')
-        .replace(/<\?xml.*?\?>/g, '');
-    return cleanedXML;
-}

package/src/features/magic-pdf/MagicPdfView.tsx

@@ -1,4 +1,4 @@
-import type { ContentObject, DocumentMetadata } from '@vertesia/common';
+import type { ContentObject } from '@vertesia/common';
 import {
     Button,
     ErrorBox,
@@ -13,7 +13,6 @@ import { useUserSession } from '@vertesia/ui/session';
 import { X } from 'lucide-react';
 import { Component, type ErrorInfo, type ReactNode, useState } from 'react';
 import { PdfPageSlider } from '../pdf-viewer/PdfPageSlider';
-import { AnnotatedImageSlider } from './AnnotatedImageSlider';
 import { DownloadPopover } from './DownloadPopover';
 import { ExtractedContentView } from './ExtractedContentView';
 import { MagicPdfProvider, useMagicPdfContext } from './MagicPdfProvider';
@@ -94,7 +93,7 @@ export function MagicPdfView({ objectId, onClose }: MagicPdfViewProps) {
                 {/* Header matching the main view layout */}
                 <div className="flex h-9 items-center justify-end shrink-0 bg-sidebar px-2 border-b border-sidebar-border">
                     {onClose && (
-                        <Button variant="ghost" size="xs" onClick={onClose} alt={t('pdf.close')}>
+                        <Button variant="ghost" size="xs" onClick={onClose} title={t('pdf.close')}>
                             <X className="size-4" />
                         </Button>
                     )}
@@ -124,55 +123,8 @@ interface _MagicPdfViewProps {
 function MagicPdfViewImpl({ object, onClose }: _MagicPdfViewProps) {
     const { t } = useUITranslation();
     const { count: totalPages, pdfUrl, pdfUrlLoading } = useMagicPdfContext();
-
-    const getProcessorType = (): 'xml' | 'markdown' => {
-        if (object.metadata?.type === 'document') {
-            const docMetadata = object.metadata as DocumentMetadata;
-            const type = docMetadata.content_processor?.type;
-            if (type === 'markdown') return 'markdown';
-        }
-        return 'xml'; // default
-    };
-
     const [pageNumber, setPageNumber] = useState(1);
-    const processorType = getProcessorType();
-
-    // XML processor: ImageSlider (annotated images) on left, XML/JSON/Markdown text on right
-    // Markdown processor: PageSlider (PDF thumbnails) on left, Markdown on right
-    if (processorType === 'xml') {
-        return (
-            <ResizablePanelGroup direction="horizontal" className="absolute inset-0">
-                <ResizablePanel defaultSize={50} minSize={20} maxSize={80} className="bg-muted">
-                    <AnnotatedImageSlider className="h-full" currentPage={pageNumber} onChange={setPageNumber} />
-                </ResizablePanel>
-                <ResizableHandle className="w-[4px] bg-border cursor-ew-resize" />
-                <ResizablePanel defaultSize={50} minSize={20} className="flex flex-col">
-                    {/* Header */}
-                    <div className="flex h-9 items-center justify-between shrink-0 bg-sidebar px-2 border-b border-sidebar-border">
-                        <div className="flex items-center gap-x-2">
-                            <DownloadPopover object={object} />
-                        </div>
-                        <span className="text-xs text-muted-foreground">
-                            {t('pdf.pageOf', { pageNumber, totalPages })}
-                        </span>
-                        <div className="flex items-center gap-x-2">
-                            {!!onClose && (
-                                <Button variant="ghost" size="xs" onClick={onClose} alt={t('pdf.close')}>
-                                    <X className="size-4" />
-                                </Button>
-                            )}
-                        </div>
-                    </div>
-                    {/* Content */}
-                    <div className="flex-1 overflow-auto px-2">
-                        <ExtractedContentView pageNumber={pageNumber} viewType="xml" />
-                    </div>
-                </ResizablePanel>
-            </ResizablePanelGroup>
-        );
-    }
 
-    // Markdown processor: PDF thumbnails on left, Markdown on right
     return (
         <ResizablePanelGroup direction="horizontal" className="absolute inset-0">
             <ResizablePanel defaultSize={50} minSize={20} maxSize={80} className="bg-muted">
@@ -195,7 +147,7 @@ function MagicPdfViewImpl({ object, onClose }: _MagicPdfViewProps) {
                     <span className="text-xs text-muted-foreground">{t('pdf.pageOf', { pageNumber, totalPages })}</span>
                     <div className="flex items-center gap-x-2">
                         {!!onClose && (
-                            <Button variant="ghost" size="xs" onClick={onClose} alt={t('pdf.close')}>
+                            <Button variant="ghost" size="xs" onClick={onClose} title={t('pdf.close')}>
                                 <X className="size-4" />
                             </Button>
                         )}

package/src/features/magic-pdf/index.ts

@@ -1 +1,2 @@
+export * from './GroundedExtractionView';
 export * from './MagicPdfView';

package/src/features/magic-pdf/types.ts

@@ -1 +1 @@
-export type ViewType = 'xml' | 'json' | 'markdown';
+export type ViewType = 'json' | 'markdown';

package/src/features/oauth/McpConnectionsButton.tsx

@@ -161,7 +161,6 @@ export function McpConnectionsInlineList({
                                 size="sm"
                                 disabled
                                 className="h-6 w-32 justify-center px-2 text-xs"
-                                aria-label={t('mcpConnections.checkingStatus')}
                                 title={t('mcpConnections.checkingStatus')}
                             >
                                 <Spinner className="size-3" />
@@ -234,7 +233,6 @@ export function McpConnectionsActionMenu({
                         variant="ghost"
                         size="icon"
                         className="size-8 rounded-md text-muted hover:bg-muted"
-                        aria-label={t('mcpConnections.settings')}
                         title={t('mcpConnections.settings')}
                         disabled={loading}
                     >

package/src/features/oauth/McpConnectionsDialog.tsx

@@ -98,7 +98,6 @@ export function McpConnectionsDialog({
                                                 size="sm"
                                                 disabled
                                                 className="h-6 w-32 justify-center px-2 text-xs"
-                                                aria-label={t('mcpConnections.checkingStatus')}
                                                 title={t('mcpConnections.checkingStatus')}
                                             >
                                                 <Spinner className="size-3" />

package/src/features/oauth/RemoteMcpConnectionButton.tsx

@@ -144,7 +144,6 @@ export function RemoteMcpConnectionButton({
                     size="sm"
                     disabled
                     className={compactActionClassName}
-                    aria-label={t('mcpConnections.checkingStatus')}
                     title={t('mcpConnections.checkingStatus')}
                 >
                     <Spinner className="size-3" />

package/src/features/pdf-viewer/PdfPageSlider.tsx

@@ -308,7 +308,7 @@ export function PdfPageSlider({
     return (
         <div ref={ref} className={clsx('flex flex-col items-stretch', compact ? 'gap-y-1' : 'gap-y-2', className)}>
             <div className={clsx('relative flex items-center justify-center px-2', compact ? 'h-6' : 'h-9')}>
-                <Button variant="ghost" size="xs" onClick={goPrev} alt={t('pdf.previousPage')}>
+                <Button variant="ghost" size="xs" onClick={goPrev} title={t('pdf.previousPage')}>
                     <ChevronsUp className="size-4" />
                 </Button>
                 <div className="absolute start-2 flex items-center gap-x-1">
@@ -378,7 +378,7 @@ export function PdfPageSlider({
                 />
             </div>
             <div className={clsx('flex items-center justify-center', compact ? 'h-6' : 'h-9')}>
-                <Button variant="ghost" size="xs" onClick={goNext} alt={t('pdf.nextPage')}>
+                <Button variant="ghost" size="xs" onClick={goNext} title={t('pdf.nextPage')}>
                     <ChevronsDown className="size-4" />
                 </Button>
             </div>
@@ -454,18 +454,18 @@ function ZoomControls({ zoom, onZoomIn, onZoomOut, onFitToView, canZoomIn, canZo
     const { t } = useUITranslation();
     return (
         <div className="flex items-center gap-x-0.5">
-            <Button variant="ghost" size="xs" onClick={onZoomOut} isDisabled={!canZoomOut} alt={t('pdf.zoomOut')}>
+            <Button variant="ghost" size="xs" onClick={onZoomOut} isDisabled={!canZoomOut} title={t('pdf.zoomOut')}>
                 <Minus />
             </Button>
             <span className="text-xs text-muted-foreground min-w-[32px] text-center">{zoom}%</span>
-            <Button variant="ghost" size="xs" onClick={onZoomIn} isDisabled={!canZoomIn} alt={t('pdf.zoomIn')}>
+            <Button variant="ghost" size="xs" onClick={onZoomIn} isDisabled={!canZoomIn} title={t('pdf.zoomIn')}>
                 <Plus />
             </Button>
             <Button
                 variant="ghost"
                 size="xs"
                 onClick={onFitToView}
-                alt={t('pdf.fitToWidth')}
+                title={t('pdf.fitToWidth')}
                 className={zoom === DEFAULT_ZOOM ? 'text-muted-foreground/40' : undefined}
             >
                 <Maximize />

package/src/features/pdf-viewer/SimplePdfViewer.tsx

@@ -1,5 +1,5 @@
 import type { ContentObject } from '@vertesia/common';
-import { Button, Spinner, VTooltip } from '@vertesia/ui/core';
+import { Button, Spinner } from '@vertesia/ui/core';
 import { useUITranslation } from '@vertesia/ui/i18n';
 import { useUserSession } from '@vertesia/ui/session';
 import { Maximize2, X } from 'lucide-react';
@@ -100,7 +100,7 @@ export function SimplePdfViewer({ object, url, source, className }: SimplePdfVie
                         variant="ghost"
                         size="xs"
                         onClick={() => setIsFullscreen(false)}
-                        alt={t('pdf.closeFullscreen')}
+                        title={t('pdf.closeFullscreen')}
                     >
                         <X className="size-4" />
                     </Button>
@@ -131,16 +131,15 @@ export function SimplePdfViewer({ object, url, source, className }: SimplePdfVie
                 className={className}
                 compact
                 headerExtra={
-                    <VTooltip description={t('pdf.fullscreen')} placement="bottom" size="xs">
-                        <Button
-                            variant="unstyled"
-                            className="p-1 rounded cursor-pointer transition-colors text-muted-foreground hover:text-foreground hover:bg-muted"
-                            onClick={() => setIsFullscreen(true)}
-                            aria-label={t('pdf.fullscreen')}
-                        >
-                            <Maximize2 className="size-4" />
-                        </Button>
-                    </VTooltip>
+                    <Button
+                        title={t('pdf.fullscreen')}
+                        tooltipPlacement="bottom"
+                        variant="unstyled"
+                        className="p-1 rounded cursor-pointer transition-colors text-muted-foreground hover:text-foreground hover:bg-muted"
+                        onClick={() => setIsFullscreen(true)}
+                    >
+                        <Maximize2 className="size-4" />
+                    </Button>
                 }
             />
         </div>

package/src/features/permissions/UserPermissionsProvider.tsx

@@ -1,7 +1,7 @@
-import { type Permission, PrincipalType, type SystemRoleDefinition } from '@vertesia/common';
+import { type AuthTokenPayload, type Permission, PrincipalType, type SystemRoleDefinition } from '@vertesia/common';
 import { ErrorBox, errorMessage, useFetch } from '@vertesia/ui/core';
 import { useUITranslation } from '@vertesia/ui/i18n';
-import { type UserSession, useUserSession } from '@vertesia/ui/session';
+import { useUserSession } from '@vertesia/ui/session';
 import { createContext, useContext, useMemo } from 'react';
 import { isAnyOf } from './helpers';
 
@@ -12,39 +12,18 @@ export class UserPermissions {
     roles: Set<string>; // all roles of the current user
     permissions: Set<string>; // all permissions of the current user
 
-    constructor(session: UserSession, roles: ListRolesResponse) {
-        if (!session.authToken) {
-            throw new Error('No auth token found in user session');
-        }
+    constructor(authToken: AuthTokenPayload, roles: ListRolesResponse = []) {
         this.system_roles = roles;
-        const userRoles = new Set<string>(session.authToken.account_roles || []);
-        if (session.authToken.project_roles) {
-            for (const role of session.authToken.project_roles) {
-                userRoles.add(role);
-            }
-        }
+        const roleNames = [...(authToken.account_roles || []), ...(authToken.project_roles || [])];
+        const userRoles = new Set<string>(roleNames);
         this.roles = userRoles;
-        // build a temporary role to permissions map
-        const map: Record<string, Permission[]> = {};
-        for (const role of roles) {
-            map[role.name] = role.permissions;
-        }
+        const rolePermissions = authToken.permissions ?? getPermissionsForRolesFromMappings(roleNames, roles);
+        // OAuth access tokens are capped to the permissions granted to the token (its scopes).
         const permissionCap =
-            session.authToken.type === PrincipalType.OAuthAccess
-                ? new Set<string>(session.authToken.permissions ?? [])
-                : undefined;
-        const permissions = new Set<string>();
-        for (const role of userRoles) {
-            const rolePermissions = map[role];
-            if (rolePermissions) {
-                for (const permission of rolePermissions) {
-                    if (!permissionCap || permissionCap.has(permission)) {
-                        permissions.add(permission);
-                    }
-                }
-            }
-        }
-        this.permissions = permissions;
+            authToken.type === PrincipalType.OAuthAccess ? new Set<string>(authToken.permissions ?? []) : undefined;
+        this.permissions = new Set(
+            permissionCap ? rolePermissions.filter((permission) => permissionCap.has(permission)) : rolePermissions,
+        );
     }
 
     hasPermission(permission: string | string[]) {
@@ -64,6 +43,17 @@ export class UserPermissions {
     }
 }
 
+function getPermissionsForRolesFromMappings(roleNames: Iterable<string>, roles: ListRolesResponse): Permission[] {
+    const permissionsByRole = new Map(roles.map((role) => [role.name, role.permissions]));
+    const permissions = new Set<Permission>();
+    for (const role of roleNames) {
+        for (const permission of permissionsByRole.get(role) ?? []) {
+            permissions.add(permission);
+        }
+    }
+    return Array.from(permissions);
+}
+
 const UserPermissionsContext = createContext<UserPermissions | undefined>(undefined);
 
 export { UserPermissionsContext };
@@ -82,21 +72,28 @@ interface UserPermissionProviderProps {
 export function UserPermissionProvider({ children }: UserPermissionProviderProps) {
     const { t } = useUITranslation();
     const session = useUserSession();
+    const authToken = session.authToken;
+    const shouldFetchRoleMappings = Boolean(authToken && !authToken.permissions);
     const { data, error, isLoading } = useFetch<ListRolesResponse | undefined>(() => {
-        if (session.user) {
+        if (shouldFetchRoleMappings) {
             return session.client.iam.roles.listSystem();
-        } else {
-            return Promise.resolve(undefined);
         }
-    }, [session.user]);
+        return Promise.resolve(undefined);
+    }, [session.client, authToken, shouldFetchRoleMappings]);
 
     const perms = useMemo(() => {
-        if (session.authToken && data && !isLoading) {
-            return new UserPermissions(session, data);
+        if (authToken) {
+            if (authToken.permissions || !shouldFetchRoleMappings) {
+                return new UserPermissions(authToken);
+            }
+            if (data && !isLoading) {
+                return new UserPermissions(authToken, data);
+            }
         } else {
             return undefined;
         }
-    }, [session, data, isLoading]);
+        return undefined;
+    }, [authToken, data, isLoading, shouldFetchRoleMappings]);
 
     if (error) {
         return <ErrorBox title={t('store.failedToFetchRoleMappings')}>{errorMessage(error)}</ErrorBox>;

package/src/features/store/objects/DocumentQuickFilter.tsx

@@ -1,4 +1,4 @@
-import { Button, CopyButton, VTooltip } from '@vertesia/ui/core';
+import { Button, CopyButton } from '@vertesia/ui/core';
 import { Filter } from 'lucide-react';
 import { createContext, type ReactNode, useContext } from 'react';
 
@@ -52,20 +52,18 @@ export function DocumentCellActions({
                 <CopyButton content={copyContent} className={ACTION_BTN_CLASS} />
             )}
             {hasValue && value !== undefined && (
-                <VTooltip description={`Filter by ${label}`} asChild size="xs">
-                    <Button
-                        variant="ghost"
-                        size="sm"
-                        aria-label={`Filter by ${label}`}
-                        className={ACTION_BTN_CLASS}
-                        onClick={(e) => {
-                            e.stopPropagation();
-                            onFilter?.(field, value);
-                        }}
-                    >
-                        <Filter className="size-3" />
-                    </Button>
-                </VTooltip>
+                <Button
+                    variant="ghost"
+                    size="sm"
+                    title={`Filter by ${label}`}
+                    className={ACTION_BTN_CLASS}
+                    onClick={(e) => {
+                        e.stopPropagation();
+                        onFilter?.(field, value);
+                    }}
+                >
+                    <Filter className="size-3" />
+                </Button>
             )}
         </>
     );

package/src/features/store/objects/DocumentSearchResults.tsx

@@ -12,7 +12,6 @@ import {
     Spinner,
     useIntersectionObserver,
     useToast,
-    VTooltip,
 } from '@vertesia/ui/core';
 import { useUITranslation } from '@vertesia/ui/i18n';
 import { useNavigate } from '@vertesia/ui/router';
@@ -452,11 +451,9 @@ function Toolsbar(props: ToolsbarProps) {
             )}
             <div className="flex gap-1 items-center">
                 {toolbarActions}
-                <VTooltip description={t('store.refresh')} asChild size="xs" placement="top">
-                    <Button variant="outline" onClick={handleRefetch} aria-label={t('store.refresh')}>
-                        <RefreshCw size={16} />
-                    </Button>
-                </VTooltip>
+                <Button variant="outline" onClick={handleRefetch} title={t('store.refresh')}>
+                    <RefreshCw size={16} />
+                </Button>
                 <ContentDispositionButton onUpdate={setIsGridView} />
             </div>
         </div>

package/src/features/store/objects/components/ContentDispositionButton.tsx

@@ -33,7 +33,11 @@ export function ContentDispositionButton({ onUpdate }: Readonly<ContentDispositi
     };
 
     return (
-        <Button variant="outline" onClick={updateView} alt={isGridView ? t('misc.tableView') : t('misc.thumbnailView')}>
+        <Button
+            variant="outline"
+            onClick={updateView}
+            title={isGridView ? t('misc.tableView') : t('misc.thumbnailView')}
+        >
             {isGridView ? <TableProperties /> : <LayoutGrid />}
         </Button>
     );