@vertesia/ui 1.4.0-dev.20260615.051508Z → 1.4.0

package/src/features/permissions/UserPermissionsProvider.tsx

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

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

@@ -123,9 +123,11 @@ export function DocumentPreviewPanel({ objectId, isOpen, onClose }: DocumentPrev
 
     if (!isOpen) return null;
 
+    const panelTranslateClass = isOpen ? 'translate-x-0' : 'translate-x-full rtl:-translate-x-full'; // rtl-ok: mirrored inline-end transform
+
     return (
         <div
-            className={`fixed inset-y-0 end-0 w-2/5 dark:bg-slate-900 shadow-xl z-50 flex flex-col transition-transform duration-300 transform ${isOpen ? 'translate-x-0' : 'translate-x-full rtl:-translate-x-full'}`}
+            className={`fixed inset-y-0 end-0 w-2/5 dark:bg-slate-900 shadow-xl z-50 flex flex-col transition-transform duration-300 transform ${panelTranslateClass}`}
         >
             {/* Header */}
             <div className="flex items-center justify-between px-4 py-3 border-b dark:border-gray-700 bg-gradient-to-r from-indigo-50 to-gray-50 dark:from-gray-800 dark:to-gray-900">
@@ -135,7 +137,7 @@ export function DocumentPreviewPanel({ objectId, isOpen, onClose }: DocumentPrev
                         {isLoading ? t('store.loadingDocument') : object?.name || t('store.documentPreview')}
                     </h2>
                 </div>
-                <div className="flex items-center space-x-2">
+                <div className="flex items-center gap-2">
                     <Button
                         variant="ghost"
                         size="sm"

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

@@ -0,0 +1,72 @@
+import { Button, CopyButton, VTooltip } from '@vertesia/ui/core';
+import { Filter } from 'lucide-react';
+import { createContext, type ReactNode, useContext } from 'react';
+
+export type DocumentQuickFilter = (field: string, value: string | string[]) => void;
+
+const DocumentQuickFilterContext = createContext<DocumentQuickFilter | undefined>(undefined);
+
+/**
+ * Provides a quick-filter handler to the document table cells below it (read via
+ * {@link useDocumentQuickFilter}). Only surfaces that own a filter bar — e.g. DocumentSearchResults —
+ * need to supply one; everywhere else the per-cell filter buttons stay inert.
+ */
+export function DocumentQuickFilterProvider({
+    onFilter,
+    children,
+}: {
+    onFilter?: DocumentQuickFilter;
+    children: ReactNode;
+}) {
+    return <DocumentQuickFilterContext.Provider value={onFilter}>{children}</DocumentQuickFilterContext.Provider>;
+}
+
+export function useDocumentQuickFilter() {
+    return useContext(DocumentQuickFilterContext);
+}
+
+const ACTION_BTN_CLASS =
+    'h-6 w-6 p-0 opacity-0 group-hover/field:opacity-100 text-muted hover:text-foreground transition-opacity shrink-0';
+
+/**
+ * Hover-revealed per-cell actions for the document table: an optional copy button (for id-valued
+ * fields) and a "Filter by ..." button wired to the {@link DocumentQuickFilterProvider} handler.
+ */
+export function DocumentCellActions({
+    field,
+    value,
+    label,
+    copyContent,
+}: {
+    field: string;
+    value?: string | string[];
+    label: string;
+    copyContent?: string;
+}) {
+    const onFilter = useDocumentQuickFilter();
+    const hasValue = Array.isArray(value) ? value.length > 0 : value !== undefined && value !== '';
+
+    return (
+        <>
+            {copyContent !== undefined && copyContent !== '' && (
+                <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>
+            )}
+        </>
+    );
+}

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

@@ -26,6 +26,7 @@ import { ContentDispositionButton } from './components/ContentDispositionButton'
 import { ContentOverview } from './components/ContentOverview';
 import { useDownloadFile } from './components/useDownloadFile';
 import { VectorSearchWidget } from './components/VectorSearchWidget';
+import { DocumentQuickFilterProvider } from './DocumentQuickFilter';
 import { DocumentTable } from './DocumentTable';
 import type { ExtendedColumnLayout } from './layout/DocumentTableColumn';
 import {
@@ -278,6 +279,22 @@ export function DocumentSearchResults({
         handleFilterLogic(newFilters);
     };
 
+    // Per-row quick filters from the table cells: merge into the same filter list (so a chip shows in
+    // the bar) and re-run the search via handleFilterChange.
+    const addQuickFilter = (name: string, value: string | string[]) => {
+        const group = filterGroups.find((g) => g.name === name);
+        const base = { name, type: group?.type, placeholder: group?.placeholder, multiple: group?.multiple };
+        handleFilterChange((prev) => {
+            const others = prev.filter((f) => f.name !== name);
+            if (group?.type === 'stringList' || Array.isArray(value)) {
+                const incoming = Array.isArray(value) ? value : [value];
+                const current = (prev.find((f) => f.name === name)?.value as string[] | undefined) ?? [];
+                return [...others, { ...base, value: Array.from(new Set([...current, ...incoming])) }];
+            }
+            return [...others, { ...base, value: [{ value, label: value }] }];
+        });
+    };
+
     const url = new URL(window.location.href);
     const filtersParam = url.searchParams.get('filters');
 
@@ -332,17 +349,19 @@ export function DocumentSearchResults({
             />
             <div className="flex flex-col w-full flex-1 min-h-0 border rounded-md mb-2">
                 <div ref={scrollRef} className="flex-1 min-h-0 overflow-y-auto">
-                    <DocumentTable
-                        objects={objects}
-                        isLoading={!objects.length && isLoading}
-                        layout={actualLayout}
-                        onRowClick={onRowClick}
-                        previewObject={previewObject}
-                        selectedObject={selectedObject}
-                        onUpload={onUpload}
-                        isGridView={isGridView}
-                        collectionId={searchContext.collectionId}
-                    />
+                    <DocumentQuickFilterProvider onFilter={addQuickFilter}>
+                        <DocumentTable
+                            objects={objects}
+                            isLoading={!objects.length && isLoading}
+                            layout={actualLayout}
+                            onRowClick={onRowClick}
+                            previewObject={previewObject}
+                            selectedObject={selectedObject}
+                            onUpload={onUpload}
+                            isGridView={isGridView}
+                            collectionId={searchContext.collectionId}
+                        />
+                    </DocumentQuickFilterProvider>
                     {hasMore ? (
                         <div ref={loadMoreRef} className="w-full flex justify-center">
                             <Spinner size="xl" />

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

@@ -25,16 +25,12 @@ import {
 import { useUITranslation } from '@vertesia/ui/i18n';
 import { NavLink } from '@vertesia/ui/router';
 import { useUserSession } from '@vertesia/ui/session';
-import { JSONDisplay, Progress } from '@vertesia/ui/widgets';
+import { JSONDisplay, MarkdownRenderer, Progress, XMLViewer } from '@vertesia/ui/widgets';
 import { AlertTriangle, Copy, Download, FileSearch, SquarePen } from 'lucide-react';
-import { memo, type RefObject, useEffect, useMemo, useRef, useState } from 'react';
-import {
-    type UniversalDocumentConverter,
-    type UniversalDocumentSource,
-    UniversalDocumentViewer,
-} from '../../../document-viewer/UniversalDocumentViewer.js';
+import { memo, type RefObject, useEffect, useRef, useState } from 'react';
 import { MagicPdfView } from '../../../magic-pdf';
 import { AudioPanel, ImagePanel, VideoPanel } from '../../../media-viewer';
+import { SimplePdfViewer } from '../../../pdf-viewer';
 import { SecureButton } from '../../../permissions/SecureButton.js';
 import { getWorkflowStatusColor, getWorkflowStatusName, isPreviewableAsPdf } from '../../../utils/index.js';
 import { PropertiesEditorModal } from './PropertiesEditorModal';
@@ -63,12 +59,11 @@ interface TextPanelProps {
 }
 
 interface OfficePdfPreviewPanelProps {
-    object: ContentObject;
     pdfRendition?: { content?: { source?: string } };
     officePdfUrl?: string;
-    converters: UniversalDocumentConverter[];
     officePdfConverting: boolean;
     officePdfError?: string;
+    onConvert: () => void;
 }
 
 interface OfficePdfActionsProps {
@@ -325,7 +320,6 @@ function DataPanel({
     handleCopyContent: (content: string, type: 'text' | 'properties') => Promise<void>;
     refetch?: () => Promise<unknown>;
 }) {
-    const { client } = useUserSession();
     const { t } = useUITranslation();
     const isImage = object?.metadata?.type === ContentNature.Image;
     const isVideo = object?.metadata?.type === ContentNature.Video;
@@ -395,40 +389,9 @@ function DataPanel({
         pdfUrl: officePdfUrl,
         isConverting: officePdfConverting,
         error: officePdfError,
+        triggerConversion: triggerOfficePdfConversion,
     } = useOfficePdfConversion(object.id, isPreviewableAsPdfDoc);
 
-    const officePdfConverters = useMemo<UniversalDocumentConverter[]>(
-        () => [
-            {
-                id: 'office-pdf-rendition',
-                target: 'pdf',
-                canConvert: ({ contentType, extension }) =>
-                    isPreviewableAsPdfDoc ||
-                    (contentType ? isPreviewableAsPdf(contentType) : false) ||
-                    ['doc', 'docx', 'ppt', 'pptx'].includes(extension),
-                convert: async () => {
-                    const response = await client.objects.getRendition(object.id, {
-                        format: MarkdownRenditionFormat.pdf,
-                        generate_if_missing: true,
-                        sign_url: true,
-                        block_on_generation: true,
-                    });
-
-                    if (response.status === 'found' && response.renditions?.length) {
-                        return {
-                            url: response.renditions[0],
-                            contentType: 'application/pdf',
-                            fileName: `${object.name || 'document'}.pdf`,
-                        };
-                    }
-
-                    return null;
-                },
-            },
-        ],
-        [client, isPreviewableAsPdfDoc, object.id, object.name],
-    );
-
     // Load text once processing completes without triggering a full object refetch
     // (which would flash the page-level loading spinner).
     useEffect(() => {
@@ -520,6 +483,9 @@ function DataPanel({
                                 alt={t('store.viewAsPdf')}
                                 onClick={() => {
                                     setCurrentPanel(PanelView.Pdf);
+                                    if (!pdfRendition && !officePdfUrl && !officePdfConverting) {
+                                        void triggerOfficePdfConversion();
+                                    }
                                 }}
                                 disabled={officePdfConverting}
                             >
@@ -573,12 +539,11 @@ function DataPanel({
             {isPreviewableAsPdfDoc && keepPdfPreviewMounted && (
                 <div className={getPanelVisibility(showPdfPreviewPanel)}>
                     <OfficePdfPreviewPanel
-                        object={object}
                         pdfRendition={pdfRendition}
                         officePdfUrl={officePdfUrl}
-                        converters={officePdfConverters}
                         officePdfConverting={officePdfConverting}
                         officePdfError={officePdfError}
+                        onConvert={triggerOfficePdfConversion}
                     />
                 </div>
             )}
@@ -778,24 +743,18 @@ function TextActions({ object, text, fullText, handleCopyContent, onToggleEdit,
 
 const TextPanel = memo(({ object, text, isTextCropped, textContainerRef }: TextPanelProps) => {
     const { t } = useUITranslation();
+    const content = object.content;
     const isCreatedOrProcessing = isCreatedOrProcessingStatus(object?.status);
+
+    // Check content processor type for XML
     const contentProcessorType = getContentProcessorType(object);
     const isXml = contentProcessorType === 'xml';
 
     // Check if content type is markdown or plain text
-    const isMarkdownOrText =
-        object.content?.type && (object.content.type === 'text/markdown' || object.content.type === 'text/plain');
+    const isMarkdownOrText = content?.type && (content.type === 'text/markdown' || content.type === 'text/plain');
 
     // Render as markdown if it's markdown/text type OR if text looks like markdown (but not if XML)
     const shouldRenderAsMarkdown = !isXml && (isMarkdownOrText || looksLikeMarkdown(text));
-    const source: UniversalDocumentSource = {
-        id: object.id,
-        title: object.name,
-        fileName: object.content?.name || object.name,
-        contentType: isXml ? 'text/xml' : shouldRenderAsMarkdown ? 'text/markdown' : object.content?.type,
-        content: text,
-        sourcePath: object.content?.source,
-    };
 
     return text ? (
         <>
@@ -808,12 +767,17 @@ const TextPanel = memo(({ object, text, isTextCropped, textContainerRef }: TextP
                 </div>
             )}
             <div className={`max-w-7xl px-2 h-full overflow-auto`} ref={textContainerRef}>
-                <UniversalDocumentViewer
-                    source={source}
-                    className="h-full"
-                    bodyClassName="overflow-auto"
-                    markdownComponents={createMarkdownComponents()}
-                />
+                {isXml ? (
+                    <div className="px-4 py-2">
+                        <XMLViewer xml={text} collapsible />
+                    </div>
+                ) : shouldRenderAsMarkdown ? (
+                    <div className="vprose prose-sm p-1">
+                        <MarkdownRenderer components={createMarkdownComponents()}>{text}</MarkdownRenderer>
+                    </div>
+                ) : (
+                    <pre className="text-wrap bg-muted text-muted p-2">{text}</pre>
+                )}
             </div>
         </>
     ) : (
@@ -958,17 +922,9 @@ function OfficePdfActions({ object, pdfRendition, officePdfUrl }: OfficePdfActio
 }
 
 function PdfPreviewPanel({ object }: { object: ContentObject }) {
-    const source: UniversalDocumentSource = {
-        id: object.id,
-        title: object.name,
-        fileName: object.content?.name || object.name,
-        contentType: object.content?.type,
-        sourcePath: object.content?.source,
-    };
-
     return (
         <div className="h-full">
-            <UniversalDocumentViewer source={source} className="h-full" />
+            <SimplePdfViewer object={object} className="h-full" />
         </div>
     );
 }
@@ -978,12 +934,11 @@ function PdfPreviewPanel({ object }: { object: ContentObject }) {
  * Handles the various states: converting, error, showing PDF.
  */
 function OfficePdfPreviewPanel({
-    object,
     pdfRendition,
     officePdfUrl,
-    converters,
     officePdfConverting,
     officePdfError,
+    onConvert,
 }: OfficePdfPreviewPanelProps) {
     const { t } = useUITranslation();
     if (officePdfConverting) {
@@ -1005,48 +960,24 @@ function OfficePdfPreviewPanel({
     }
 
     if (pdfRendition?.content?.source) {
-        const source: UniversalDocumentSource = {
-            id: object.id,
-            title: object.name,
-            fileName: `${object.name || 'document'}.pdf`,
-            contentType: 'application/pdf',
-            sourcePath: pdfRendition.content.source,
-        };
-
         return (
             <div className="h-full">
-                <UniversalDocumentViewer source={source} className="h-full" />
+                <SimplePdfViewer source={pdfRendition.content.source} className="h-full" />
             </div>
         );
     }
 
     if (officePdfUrl) {
-        const source: UniversalDocumentSource = {
-            id: object.id,
-            title: object.name,
-            fileName: `${object.name || 'document'}.pdf`,
-            contentType: 'application/pdf',
-            url: officePdfUrl,
-        };
-
         return (
             <div className="h-full">
-                <UniversalDocumentViewer source={source} className="h-full" />
+                <SimplePdfViewer url={officePdfUrl} className="h-full" />
             </div>
         );
     }
 
-    const source: UniversalDocumentSource = {
-        id: object.id,
-        title: object.name,
-        fileName: object.content?.name || object.name,
-        contentType: object.content?.type,
-        sourcePath: object.content?.source,
-    };
-
     return (
-        <div className="h-full">
-            <UniversalDocumentViewer source={source} converters={converters} className="h-full" />
+        <div className="flex flex-col justify-center items-center flex-1 gap-2">
+            <Button onClick={onConvert}>Convert to PDF</Button>
         </div>
     );
 }

package/src/features/store/objects/layout/DocumentTableColumn.tsx

@@ -1,6 +1,7 @@
 import type { ColumnLayout, ContentObjectItem } from '@vertesia/common';
 import type React from 'react';
 
+import { DocumentCellActions } from '../DocumentQuickFilter';
 import renderers from './renderers';
 
 const defaultRenderer = renderers.string();
@@ -43,7 +44,7 @@ export interface ExtendedColumnLayout extends Omit<ColumnLayout, 'field'> {
 }
 
 export class DocumentTableColumn {
-    renderer: (value: unknown, index: number) => React.ReactNode = defaultRenderer;
+    renderer: (value: unknown, index: number, actions?: React.ReactNode) => React.ReactNode = defaultRenderer;
     path: string[];
     fallbackPath?: string[];
     previewObject?: (objectId: string) => void;
@@ -91,7 +92,7 @@ export class DocumentTableColumn {
         // If there's a custom render function, wrap its result in a td
         if (this.layout.render) {
             return (
-                <td key={index} className="whitespace-nowrap px-3 py-4 text-sm">
+                <td key={index} className="whitespace-nowrap px-3 py-4 text-sm group">
                     {this.layout.render(object)}
                 </td>
             );
@@ -99,6 +100,7 @@ export class DocumentTableColumn {
 
         const type = this.layout.type || 'string';
         const baseType = type.indexOf('?') > 0 ? type.substring(0, type.indexOf('?')) : type;
+        const actions = this.buildActions(object, baseType);
 
         if ((baseType === 'objectId' || baseType === 'objectLink') && this.previewObject) {
             const i = type.indexOf('?');
@@ -106,10 +108,33 @@ export class DocumentTableColumn {
             const renderer = renderers[baseType](params, (_id: string) => {
                 this.previewObject?.(object.id);
             });
-            return renderer(object, index);
+            return renderer(object, index, actions);
         }
 
         // Otherwise use the type-based renderer with the resolved value
-        return this.renderer(this.resolveValue(object), index);
+        return this.renderer(this.resolveValue(object), index, actions);
+    }
+
+    /**
+     * Per-cell quick-filter/copy actions, derived from the column's field/type. Returns undefined for
+     * columns that aren't backed by a filterable facet field. The filter handler itself is read from
+     * {@link DocumentQuickFilterProvider} context by {@link DocumentCellActions}.
+     */
+    private buildActions(object: ContentObjectItem, baseType: string): React.ReactNode {
+        const field = this.layout.field;
+        if (baseType === 'objectId' || baseType === 'objectLink' || field === 'id') {
+            return <DocumentCellActions field="id" value={object.id} label={object.id} copyContent={object.id} />;
+        }
+        if (baseType === 'objectName' || field === 'name') {
+            return <DocumentCellActions field="name" value={object.name} label={object.name ?? object.id} />;
+        }
+        if (baseType === 'typeLink' || field === 'type.name' || field === 'type') {
+            const typeId = object.type?.id;
+            return <DocumentCellActions field="type" value={typeId} label={object.type?.name ?? typeId ?? 'type'} />;
+        }
+        if (field === 'status') {
+            return <DocumentCellActions field="status" value={object.status} label={object.status} />;
+        }
+        return undefined;
     }
 }

package/src/features/store/objects/layout/documentLayout.tsx

@@ -53,7 +53,7 @@ export function DocumentTableView({
                     return (
                         <tr
                             key={obj.id}
-                            className={`cursor-pointer hover:bg-muted group ${selectedObject?.id === obj.id ? 'bg-muted' : ''} ${isHighlighted ? 'bg-blue-50 dark:bg-blue-900/20' : ''}`}
+                            className={`group cursor-pointer hover:bg-muted ${selectedObject?.id === obj.id ? 'bg-muted' : ''} ${isHighlighted ? 'bg-blue-50 dark:bg-blue-900/20' : ''}`}
                             onClick={() => {
                                 onRowClick?.(obj);
                             }}