@vertesia/ui 0.64.0 → 0.66.0

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

@@ -1,11 +1,12 @@
 import { ColumnLayout, ContentObjectItem } from "@vertesia/common";
-import { ErrorBox, Spinner, useIntersectionObserver } from "@vertesia/ui/core";
+import { Button, ErrorBox, Spinner, useIntersectionObserver } from "@vertesia/ui/core";
 import { useEffect, useRef, useState } from "react";
 import { VFacetsNav } from "../../../facets";
 import { DocumentTable } from "../DocumentTable";
 import { useDocumentSearch, useWatchDocumentSearchFacets, useWatchDocumentSearchResult } from "../search/DocumentSearchContext";
 import { DocumentSearchProvider } from "../search/DocumentSearchProvider";
 import { ContentDispositionButton } from "./ContentDispositionButton";
+import { RefreshCw } from "lucide-react";
 
 const layout: ColumnLayout[] = [
     { "name": "Name", "field": "properties.title", "type": "string", "fallback": "name" },
@@ -33,15 +34,19 @@ export function SelectDocument({ onChange }: SelectDocumentProps) {
 interface SelectDocumentImplProps {
     onRowClick: (selected: ContentObjectItem) => void;
 }
+const LAST_DISPLAYED_VIEW = 'vertesia.content_store.lastDisplayedView'
+
 function SelectDocumentImpl({ onRowClick }: SelectDocumentImplProps) {
     const [isReady, setIsReady] = useState(false);
-    const [isGridView, setIsGridView] = useState(localStorage.getItem('lastDisplayedView') === 'grid');
+    const [isGridView, setIsGridView] = useState(localStorage.getItem(LAST_DISPLAYED_VIEW) === 'grid');
     const { search, isLoading, error, objects } = useWatchDocumentSearchResult();
 
     const loadMoreRef = useRef<HTMLDivElement>(null);
+
     useIntersectionObserver(loadMoreRef, () => {
         isReady && search.loadMore(true)
     }, { deps: [isReady] });
+
     useEffect(() => {
         search.search().then(() => setIsReady(true));
     }, []);
@@ -49,6 +54,11 @@ function SelectDocumentImpl({ onRowClick }: SelectDocumentImplProps) {
     const facets = useWatchDocumentSearchFacets();
     const facetSearch = useDocumentSearch();
 
+    const handleRefetch = () => {
+        setIsReady(false);
+        search.search().then(() => setIsReady(true));
+    }
+
     if (error) {
         return <ErrorBox title="Search failed">{error.message}</ErrorBox>
     }
@@ -57,7 +67,12 @@ function SelectDocumentImpl({ onRowClick }: SelectDocumentImplProps) {
         <div>
             <div className="flex justify-between items-center mb-4">
                 <VFacetsNav facets={facets} search={facetSearch} textSearch="Filter content" />
-                <ContentDispositionButton onUpdate={setIsGridView} />
+                <div className="flex items-center gap-2">
+                    <Button variant="outline" onClick={handleRefetch} alt="Refresh">
+                        <RefreshCw size={16} />
+                    </Button>
+                    <ContentDispositionButton onUpdate={setIsGridView} />
+                </div>
             </div>
             <DocumentTable objects={objects || []} isLoading={false} layout={layout} onRowClick={onRowClick} isGridView={isGridView} />
             <div ref={loadMoreRef} className='mt-10' />

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

@@ -1,5 +1,5 @@
 import { ContentObjectItem } from "@vertesia/common";
-import { Modal, ModalBody, ModalTitle } from "@vertesia/ui/core";
+import { VModal, VModalBody, VModalTitle } from "@vertesia/ui/core";
 import { SelectDocument } from "./SelectDocument";
 
 interface SelectDocumentModalProps {
@@ -10,11 +10,11 @@ interface SelectDocumentModalProps {
 }
 export function SelectDocumentModal({ isOpen, onClose }: SelectDocumentModalProps) {
     return (
-        <Modal onClose={() => onClose()} isOpen={!!isOpen} className='min-w-[60vw]'>
-            <ModalTitle>Select Content</ModalTitle>
-            <ModalBody className='p-4 pt-0 overflow-y-auto max-h-[80vh] min-h-[80vh]'>
+        <VModal onClose={() => onClose()} isOpen={!!isOpen} className='min-w-[60vw]'>
+            <VModalTitle>Select Content</VModalTitle>
+            <VModalBody className='pt-0 overflow-y-auto max-h-[80vh] min-h-[80vh]'>
                 {isOpen && <SelectDocument onChange={onClose} />}
-            </ModalBody>
-        </Modal>
+            </VModalBody>
+        </VModal>
     )
 }

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

@@ -52,7 +52,7 @@ export function DocumentTableView({ objects, selection, isLoading, onRowClick, c
     )
 }
 
-export function DocumentGridView({ objects, selection, isLoading, onSelectionChange }: ViewProps) {
+export function DocumentGridView({ objects, selection, isLoading, onSelectionChange, onRowClick }: ViewProps) {
 
     return (
         <>
@@ -61,7 +61,7 @@ export function DocumentGridView({ objects, selection, isLoading, onSelectionCha
             </div>
             <div className="w-full gap-2 grid lg:grid-cols-6">
                 {objects.map((document) => (
-                    <DocumentIcon key={document.id} document={document} selection={selection} onSelectionChange={onSelectionChange} />
+                    <DocumentIcon key={document.id} document={document} selection={selection} onSelectionChange={onSelectionChange} onRowClick={onRowClick} />
                 ))}
             </div>
         </>

package/src/features/store/objects/search/DocumentSearchContext.ts

@@ -3,6 +3,7 @@ import { createContext, useContext } from 'react';
 import { SharedState, useWatchSharedState } from '@vertesia/ui/core';
 import { ComputeFacetsResponse, ZenoClient } from '@vertesia/client';
 import { ComplexSearchQuery, ContentObjectItem, FacetBucket, FacetSpec, ObjectSearchQuery } from '@vertesia/common';
+import { SearchInterface } from '@vertesia/ui/features'
 
 interface DocumentSearchResult {
     objects: ContentObjectItem[],
@@ -11,7 +12,7 @@ interface DocumentSearchResult {
 }
 
 
-export class DocumentSearch {
+export class DocumentSearch implements SearchInterface {
 
     collectionId?: string;
     facets = new SharedState<ComputeFacetsResponse>({});
@@ -49,13 +50,15 @@ export class DocumentSearch {
         this.search();
     }
 
-    clearFilters() {
+    clearFilters(autoSearch: boolean = true) {
         const parent = this.query.parent;
         this.query = {
             parent
         };
 
-        this.search();
+        if (autoSearch) {
+            this.search();
+        }
     }
 
     getFacetBuckets(name: string): FacetBucket[] {

package/src/features/store/objects/selection/ObjectsActionContext.tsx

@@ -193,4 +193,4 @@ export function useStartWorkflowCallback(cb: ObjectsActionCallback) {
         }
     }, [cb, ctx]);
     return ctx;
-}
+}

package/src/features/store/objects/selection/SelectionActions.tsx

@@ -28,7 +28,6 @@ export function SelectionActions() {
                     <div className="flex items-center gap-x-1 shrink-0">
                         <div className='text-sm nowrap'>{size} document{plural} selected</div>
                         <Button title="Clear selection" variant={"ghost"}
-                            className=" rounded-md p-2"
                             onClick={onClearSelection}>
                             <X className="size-4" />
                         </Button>

package/src/features/store/objects/selection/actions/AddToCollectionAction.tsx

@@ -1,7 +1,7 @@
-import { Button, ErrorBox, Portal, useFetch, useToast, VModal, VModalBody, VModalFooter, VModalTitle, VSelectBox } from "@vertesia/ui/core";
+import { Button, Portal, useToast, VModal, VModalBody, VModalFooter, VModalTitle } from "@vertesia/ui/core";
 import { useUserSession } from "@vertesia/ui/session";
 import { useCallback, useState } from "react";
-import { CreateCollectionForm } from "../../../collections";
+import { CreateCollectionForm, SelectCollection } from "../../../collections";
 import { useObjectsActionCallback } from "../ObjectsActionContext";
 import { ActionComponentTypeProps, ObjectsActionSpec } from "../ObjectsActionSpec";
 
@@ -43,7 +43,7 @@ function SelectCollectionModal({ isOpen, onClose, objectIds }: SelectCollectionM
     return (
         <VModal isOpen={isOpen} onClose={onClose}>
             <VModalTitle>Add to a Collection</VModalTitle>
-            <AddToCollectionForm onClose={onClose} objectIds={objectIds} />
+            <AddToCollectionForm onClose={onClose} objectIds={objectIds}/>
         </VModal>
     )
 }
@@ -55,8 +55,7 @@ interface AddToCollectionFormProps {
 function AddToCollectionForm({ onClose, objectIds }: AddToCollectionFormProps) {
     const toast = useToast();
     const { client } = useUserSession();
-    const [selectedCol, setSelectedCol] = useState<any>();
-    const { data: collections, error } = useFetch(() => client.store.collections.list({ dynamic: false }), []);
+    const [selectedCollectionId, setSelectedCollectionId] = useState<string>();
     const onAddToCollection = ({ collectionId }: { collectionId: string }) => {
         if (!collectionId || !objectIds?.length) {
             return;
@@ -78,28 +77,18 @@ function AddToCollectionForm({ onClose, objectIds }: AddToCollectionFormProps) {
             });
         });
     }
-    if (error) {
-        return <ErrorBox title='Collection fetch failed'>{error.message}</ErrorBox>
-    }
+
+    const onCollectionChange = (collectionId: string | undefined) => {
+        setSelectedCollectionId(collectionId);
+    };
 
     return (
         <>
             <VModalBody>
-                <VSelectBox
-                    filterBy={"name"}
-                    value={selectedCol}
-                    onChange={(collection) => {
-                        setSelectedCol(collection);
-                    }}
-                    placeholder="Select a collection"
-                    options={collections || []}
-                    optionLabel={(col: any) => col.name}
-                    by="id"
-                    className="mb-4"
-                />
+                <SelectCollection onChange={onCollectionChange} value={selectedCollectionId}  className="mb-4"/>
             </VModalBody>
             <VModalFooter>
-                <Button isDisabled={!selectedCol} onClick={() => selectedCol && onAddToCollection({ collectionId: selectedCol.id })}>
+                <Button isDisabled={!selectedCollectionId} onClick={() => selectedCollectionId && onAddToCollection({ collectionId: selectedCollectionId })}>
                     Add to Collection
                 </Button>
             </VModalFooter>

package/src/features/store/objects/selection/actions/ChangeTypeAction.tsx

@@ -1,7 +1,7 @@
 import { useToast } from "@vertesia/ui/core";
 import { useUserSession } from "@vertesia/ui/session";
 import { useCallback, useState } from "react";
-import { SelectContentTypeModal } from "../../../../store";
+import { SelectContentTypeModal } from "../../../types";
 import { useObjectsActionCallback } from "../ObjectsActionContext";
 import { ActionComponentTypeProps, ObjectsActionSpec } from "../ObjectsActionSpec";
 

package/src/features/store/objects/selection/actions/DeleteObjectsAction.tsx

@@ -4,12 +4,12 @@ import { useToast } from '@vertesia/ui/core';
 import { useNavigate } from "@vertesia/ui/router";
 import { useUserSession } from '@vertesia/ui/session';
 
-import { useDocumentSearch } from '../../../../store';
+import { useDocumentSearch } from '../../search/DocumentSearchContext';
 import { useObjectsActionContext } from '../ObjectsActionContext';
 import { ActionComponentTypeProps, ObjectsActionSpec } from '../ObjectsActionSpec';
 import ConfirmAction from './ConfirmAction';
 
-function DeleteObjectsActionComponent({ action, objectIds, children }: ActionComponentTypeProps) {
+export function DeleteObjectsActionComponent({ action, objectIds, children }: ActionComponentTypeProps) {
     const ctx = useObjectsActionContext();
 
     const toast = useToast();

package/src/features/store/objects/selection/actions/ExportPropertiesAction.tsx

@@ -1,7 +1,7 @@
 import { useToast } from "@vertesia/ui/core";
 import { useUserSession } from "@vertesia/ui/session";
 import { useCallback, useState } from "react";
-import { ExportPropertiesModal, ExportTypes } from "../../../../store";
+import { ExportPropertiesModal, ExportTypes } from "../../ExportPropertiesModal";
 import { useObjectsActionCallback } from "../ObjectsActionContext";
 import { ActionComponentTypeProps, ObjectsActionSpec } from "../ObjectsActionSpec";
 

package/src/features/store/objects/selection/actions/RemoveFromCollectionAction.tsx

@@ -8,7 +8,7 @@ import { useObjectsActionContext } from '../ObjectsActionContext';
 import { ActionComponentTypeProps, ObjectsActionSpec } from '../ObjectsActionSpec';
 import ConfirmAction from './ConfirmAction';
 
-function RemoveFromCollectionActionComponent({ action, objectIds, collectionId }: ActionComponentTypeProps) {
+export function RemoveFromCollectionActionComponent({ action, objectIds, collectionId }: ActionComponentTypeProps) {
     const ctx = useObjectsActionContext();
 
     const toast = useToast();

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

@@ -3,8 +3,7 @@ import { useEffect, useRef, useState } from 'react';
 import { ContentObjectTypesTable } from './ContentObjectTypesTable';
 import { useWatchSearchResult } from './search/ObjectTypeSearchContext';
 import { useUserSession } from '@vertesia/ui/session';
-import { EmptyCollection, ErrorBox, Input, SelectBox, useToast } from '@vertesia/ui/core';
-import { useDebounce, useIntersectionObserver } from '@vertesia/ui/core';
+import { EmptyCollection, ErrorBox, Input, SelectBox, useToast, useDebounce, useIntersectionObserver } from '@vertesia/ui/core';
 
 import { CreateOrUpdateTypeModal, CreateOrUpdateTypePayload } from './CreateOrUpdateTypeModal';
 
@@ -90,12 +89,12 @@ export function ContentObjectTypesSearch({ isDirty = false }: ContentObjectTypes
     };
 
     return (
-        <div>
+        <div className='flex flex-col gap-4 h-full'>
             <div className="flex gap-4">
                 <Input placeholder="Filter by Name" value={searchTerm} onChange={setSearchTerm} />
                 <SelectBox className="w-60" isClearable options={Object.values(ChunkableOptions)} value={chunkable} onChange={onChunkableChange} placeholder={"Is Chunkable"} />
             </div>
-            <div className="w-full">
+            <div className="flex-1">
                 {
                     (!isLoading && objects?.length === 0) ?
                         <EmptyCollection title="No Type" buttonLabel='Create Type' onClick={onOpenCreateModal}>

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

@@ -19,7 +19,8 @@ export function ContentObjectTypesTable({ objects, isLoading }: ContentObjectTyp
                 <thead>
                     <tr>
                         <th>Name</th>
-                        <th>Is Chunkable?</th>
+                        <th>Strict Mode</th>
+                        <th>Semantic Chunking</th>
                         <th>Updated At</th>
                     </tr>
                 </thead>
@@ -27,6 +28,7 @@ export function ContentObjectTypesTable({ objects, isLoading }: ContentObjectTyp
                     {objects?.map((obj: any) => (
                         <tr key={obj.id} onClick={() => navigate(`/types/${obj.id}`)} className='cursor-pointer hover:bg-muted'>
                             <td>{obj.name}</td>
+                            <td>{obj.strict_mode ? 'Yes' : 'No'}</td>
                             <td>{obj.is_chunkable ? 'Yes' : 'No'}</td>
                             <td>{dayjs(obj.updated_at).fromNow()}</td>
                         </tr>

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

@@ -1,6 +1,6 @@
 import { useState } from 'react';
 
-import { Button, Input, Modal, ModalBody, ModalFooter, ModalTitle, Switch, useToast } from '@vertesia/ui/core';
+import { Button, Input, Modal, ModalBody, ModalFooter, ModalTitle, useToast, Textarea } from '@vertesia/ui/core';
 
 export interface CreateOrUpdateTypePayload {
     name: string;
@@ -48,14 +48,7 @@ export function CreateOrUpdateTypeModal({ title, isOpen, onClose, okLabel, initi
                     </div>
                     <div>
                         <label className="block text-sm font-medium text-muted">Description</label>
-                        <Input value={description} onChange={setDescription} />
-                    </div>
-                    <div className="flex items-center justify-between">
-                        <label className="block text-sm font-medium text-muted-foreground">Strict Mode</label>
-                        <Switch value={strictMode} onChange={setStrictMode} />
-                    </div>
-                    <div className="text-xs text-muted-foreground">
-                        When enabled, objects will be validated against the schema at generation and save time.
+                        <Textarea value={description} onChange={setDescription} />
                     </div>
                 </div>
             </ModalBody>

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

@@ -3,9 +3,8 @@ import { useMemo, useRef, useState } from 'react';
 
 import { useUserSession } from '@vertesia/ui/session';
 import { json } from '@codemirror/lang-json';
-import { CodeMirrorEditor, EditorApi } from '@vertesia/ui/widgets';
+import { CodeMirrorEditor, EditorApi, SchemaEditor, useSchema } from '@vertesia/ui/widgets';
 import { Button, useToast } from '@vertesia/ui/core';
-import { SchemaEditor, useSchema } from '@vertesia/ui/widgets';
 import { ContentObjectType } from '@vertesia/common';
 
 const CODE_MIRROR_EXTENSIONS = [basicSetup, json()];
@@ -85,9 +84,9 @@ export function ObjectSchemaEditor({ objectType, onSchemaUpdate }: ObjectSchemaE
     };
 
     return (
-        <div className="mx-2 my-2 rounded-md border border-solid shadow-md border-spacing-2">
-            <div className="flex items-center rounded-t-md border-b gap-x-2 py-2 px-4">
-                <div className="text-lg font-semibold">Schema Editor</div>
+        <div className="mx-2 my-2 rounded-2xl border border-solid shadow-md border-spacing-2">
+            <div className="flex items-center rounded-t-md border-b gap-x-2 py-2 pl-4 pr-2">
+                <div className="text-base font-semibold">Schema Editor</div>
                 <div>
                     <Button variant="outline" size="sm" onClick={handleOnSave}>
                         {

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

@@ -81,11 +81,11 @@ export function TableLayoutEditor({ objectType, onLayoutUpdate }: TableLayoutEdi
 
 
     return (
-        <div className="mx-2 my-2 rounded-md border border-solid shadow-xs">
-            <div className="flex items-center rounded-t-md gap-x-2 bg-gray-50 dark:bg-slate-800 py-2 px-2">
-                <div className="text-lg font-semibold ">Table Layout Editor</div>
+        <div className="mx-2 my-2 rounded-2xl border border-solid shadow-xs">
+            <div className="flex items-center rounded-t-md border-b gap-x-2 py-2 pl-4 pr-2">
+                <div className="text-base font-semibold ">Table Layout Editor</div>
                 <div className="ml-auto flex gap-x-2">
-                    <Button isLoading={isUpdating} variant="secondary" onClick={onSave}>Save Changes</Button>
+                    <Button isLoading={isUpdating} variant="outline" size="sm" onClick={onSave}>Save Changes</Button>
                 </div>
             </div>
             <div className="px-4 py-2">

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

@@ -1,7 +1,5 @@
 export * from "./ContentObjectTypesSearch";
 export * from "./ContentObjectTypesTable";
-export * from "./ContentObjectTypesView";
-export * from "./ContentObjectTypeView";
 export * from "./CreateOrUpdateTypeModal";
 export * from "./ObjectSchemaEditor";
 export * from "./search";

package/src/features/user/UserInfo.tsx

@@ -1,7 +1,6 @@
 import { useUserSession } from "@vertesia/ui/session";
 import { ApiKey, ApiKeyTypes, PrincipalType, User } from "@vertesia/common";
-import { Avatar, Table, Popover, PopoverContent, PopoverTrigger } from "@vertesia/ui/core";
-import { useFetch } from "@vertesia/ui/core";
+import { Avatar, Table, Popover, PopoverContent, PopoverTrigger, useFetch } from "@vertesia/ui/core";
 import { ReactNode } from "react";
 
 //TODO use a real cache

package/src/features/utils/rendition.ts

@@ -18,6 +18,7 @@ export async function retrieveRendition(
   doc: ContentObjectItem,
   setRenditionUrl: (url: string) => void,
   setRenditionAlt: (alt: string) => void,
+  setRenditionStatus: (status: string) => void,
 ) {
   if (
     !doc?.content?.type ||
@@ -27,9 +28,11 @@ export async function retrieveRendition(
       isPdf(doc.content.type)
     )
   ) {
+    setRenditionStatus("No preview available");
     return;
   }
 
+  setRenditionStatus("Preparing preview...");
   const currentTime = new Date().getTime() / 1000;
 
   const savedId = localStorage.getItem(
@@ -46,16 +49,27 @@ export async function retrieveRendition(
   ) {
     setRenditionUrl(savedId);
     setRenditionAlt(`${doc.name} Rendition`);
+    setRenditionStatus("ready");
     return savedId;
   }
 
+  setRenditionStatus("Preparing preview...");
   client.objects.getRendition(doc.id, RENDITION_OPTIONS).then((response) => {
     if (response.status === "generating") {
-      setTimeout(retrieveRendition, 60000);
+      setRenditionStatus("Preparing preview...");
+      setRenditionUrl("");
+      setRenditionAlt("");
+      setTimeout(() => retrieveRendition(client, doc, setRenditionUrl, setRenditionAlt, setRenditionStatus), 60000);
     } else if (response.status === "failed") {
+      setRenditionStatus("No preview available");
+      setRenditionUrl("");
+      setRenditionAlt("");
       return;
     } else {
       if (!response?.renditions?.length) {
+        setRenditionStatus("No preview available");
+        setRenditionUrl("");
+        setRenditionAlt("");
         return;
       }
       const rendition = response.renditions[0];
@@ -70,6 +84,14 @@ export async function retrieveRendition(
       );
       setRenditionUrl(rendition);
       setRenditionAlt(`${doc.name} Rendition`);
+      setRenditionStatus("ready");
+      console.log(`Rendition for document ${doc.id} retrieved successfully: ${rendition}`);
     }
+  }).catch((error) => {
+
+    setRenditionStatus("No preview available");
+    console.warn("Failed to retrieve rendition:", error);
+    setRenditionUrl("");
+    setRenditionAlt("");
   });
 }

package/src/session/UserSession.ts

@@ -9,8 +9,8 @@ import { getComposableToken } from './auth/composable';
 import { getFirebaseAuth } from './auth/firebase';
 import { TypeRegistry } from './TypeRegistry';
 
-export const LastSelectedAccountId_KEY = 'composableai.lastSelectedAccountId';
-export const LastSelectedProjectId_KEY = 'composableai.lastSelectedProjectId';
+import { LastSelectedAccountId_KEY, LastSelectedProjectId_KEY } from './constants';
+export { LastSelectedAccountId_KEY, LastSelectedProjectId_KEY };
 
 
 class UserSession {

package/src/session/auth/composable.ts

@@ -4,7 +4,7 @@
 import { AuthTokenPayload } from "@vertesia/common";
 import { jwtDecode } from "jwt-decode";
 import { Env } from '@vertesia/ui/env';
-import { LastSelectedAccountId_KEY, LastSelectedProjectId_KEY } from '../UserSession';
+import { LastSelectedAccountId_KEY, LastSelectedProjectId_KEY } from '../constants';
 import { getFirebaseAuth, getFirebaseAuthToken } from './firebase';
 
 let AUTH_TOKEN_RAW: string | undefined;

package/src/session/constants.ts

@@ -0,0 +1,2 @@
+export const LastSelectedAccountId_KEY = 'composableai.lastSelectedAccountId';
+export const LastSelectedProjectId_KEY = 'composableai.lastSelectedProjectId';

package/src/widgets/codemirror/CodeMirrorEditor.tsx

@@ -30,8 +30,8 @@ const customTheme = EditorView.theme({
     ".cm-gutters": { backgroundColor: "transparent", color: "#ddd" },
     ".cm-focused": { outline: "none" },
     ".cm-cursor": {
-        borderLeft: "2px solid #000",
-        borderLeftColor: "#000",
+        borderLeft: "2px solid #808080",
+        borderLeftColor: "#808080",
         animation: "blink 1.2s step-start infinite"
     },
     "@keyframes blink": { "50%": { opacity: 0 } }

package/src/widgets/properties/PropertiesView.tsx

@@ -1,4 +1,5 @@
-import { Table } from "@vertesia/ui/core";
+import { Table, VTooltip } from "@vertesia/ui/core";
+import { Info } from "lucide-react";
 
 
 interface PropertiesViewProps {
@@ -12,8 +13,15 @@ export function PropertiesView({ className, properties }: PropertiesViewProps) {
                 {
                     properties.map((property) => (
                         <tr key={property.name}>
-                            <td className='w-1/3 font-semibold' >
+                            <td className='w-1/3 font-semibold gap-2' >
                                 <span>{property.name}</span>
+                                {property.description &&
+                                    <VTooltip
+                                        description={property.description}
+                                        placement="top">
+                                        <Info className="size-3 ml-2 text-muted-foreground" />
+                                    </VTooltip>
+                                }
                             </td>
                             <td className='w-2/3'>{property.value ?? 'undefined'}</td>
                         </tr>

package/src/widgets/schema-editor/editor/SchemaEditor.tsx

@@ -154,7 +154,7 @@ function AddPropertyButton({ parent }: AddPropertyButtonProps) {
         parent.reloadTree();
     }
     return (
-        <Button variant="outline" onClick={add}>
+        <Button variant="ghost" onClick={add}>
             <Plus className='size-4' />Add property
         </Button>
     )

package/lib/esm/features/store/collections/CollectionView.js

@@ -1,53 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { ErrorBox, Spinner, useFetch, VTabs, VTabsBar, VTabsPanel } from "@vertesia/ui/core";
-import { FullHeightLayout } from "@vertesia/ui/layout";
-import { NavLink } from "@vertesia/ui/router";
-import { useUserSession } from "@vertesia/ui/session";
-import { PanelErrorBoundary } from "../../errors";
-import { GenericPageNavHeader } from "../../layout";
-import { DocumentSearchProvider, DocumentSelectionProvider } from "../../store";
-import { SelectionActions, UploadObjectsButton } from "../objects/selection/SelectionActions";
-import { BrowseCollectionView } from "./BrowseCollectionView";
-import { EditCollectionView } from "./EditCollectionView";
-const facets = [
-    {
-        name: 'status',
-        field: 'status'
-    },
-    {
-        name: 'type',
-        field: 'type'
-    }
-];
-export function CollectionView({ collectionId }) {
-    const { client } = useUserSession();
-    const { data: collection, error, refetch, isLoading } = useFetch(() => client.store.collections.retrieve(collectionId), [collectionId]);
-    if (error) {
-        return _jsx(ErrorBox, { title: 'Collection fetch failed', children: error.message });
-    }
-    const actions = [
-        _jsx(SelectionActions, {}, 'selection'),
-        _jsx(UploadObjectsButton, { collectionId: collectionId ?? '' }, "upload")
-    ];
-    const title = (_jsx("div", { className: 'flex gap-x-1 items-center', children: _jsx("div", { children: collection?.name || '' }) }));
-    const breadcrumbs = [
-        _jsx(NavLink, { href: '/collections', children: "Collections" }, 'collections'),
-        _jsx("span", { children: "Collection Detail" }, 'collection-detail')
-    ];
-    const tabs = [
-        {
-            name: 'browse',
-            label: 'Browse',
-            content: _jsx(BrowseCollectionView, { collection: collection })
-        },
-        {
-            name: 'metadata',
-            label: 'Metadata',
-            content: _jsx(EditCollectionView, { collection: collection, refetch: refetch })
-        }
-    ];
-    return (_jsx(FullHeightLayout, { children: _jsx(DocumentSearchProvider, { facets: facets, collectionId: collectionId, children: _jsxs(DocumentSelectionProvider, { collectionId: collectionId, children: [_jsx(GenericPageNavHeader, { title: title, description: collection?.description || '', actions: actions, breadcrumbs: breadcrumbs }), _jsxs(VTabs, { defaultValue: "browse", tabs: tabs, children: [_jsx(VTabsBar, { className: "px-4" }), isLoading ?
-                                _jsx("div", { className: "w-full flex justify-center", children: _jsx(Spinner, {}) }) :
-                                _jsx("div", { className: "h-[calc(100vh-165px)] overflow-auto px-4 py-2", children: _jsx(PanelErrorBoundary, { children: _jsx(VTabsPanel, {}) }) })] })] }) }) }));
-}
-//# sourceMappingURL=CollectionView.js.map

package/lib/esm/features/store/collections/CollectionView.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CollectionView.js","sourceRoot":"","sources":["../../../../../src/features/store/collections/CollectionView.tsx"],"names":[],"mappings":"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"}

package/lib/esm/features/store/collections/CollectionsView.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CollectionsView.js","sourceRoot":"","sources":["../../../../../src/features/store/collections/CollectionsView.tsx"],"names":[],"mappings":"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"}