@rebasepro/admin 0.7.0 → 0.9.0

package/src/collection_editor/ui/collection_editor/PropertyEditView.tsx

@@ -6,10 +6,10 @@ import { Formex, FormexController, getIn, useCreateFormex } from "@rebasepro/for
 import { ConfirmationDialog } from "@rebasepro/core";
 import { DEFAULT_FIELD_CONFIGS, getFieldConfig, getFieldId } from "../../../components/field_configs";
 import { PropertyConfigBadge } from "../../../components/PropertyConfigBadge";
-import { EntityCollection, Property, PropertyConfig, PropertyConfigId } from "@rebasepro/types";
+import { CollectionConfig, Property, PropertyConfig, PropertyConfigId } from "@rebasepro/types";
 import type { PropertyTypePreset, PropertyType } from "../../extensibility_types";
-import { toSerializableProperty, toSerializableCollection } from "../../serializable_utils";
-import type { SerializableProperty, SerializableCollection } from "../../serializable_types";
+import { toSerializableProperty, toSerializableCollectionConfig } from "../../serializable_utils";
+import type { SerializableProperty, SerializableCollectionConfig } from "../../serializable_types";
 import { isPropertyBuilder } from "@rebasepro/common";
 import {
     AlertTriangleIcon,
@@ -91,9 +91,9 @@ export type PropertyFormProps = {
         metadata: Record<string, unknown>;
         onMetadataChange: (key: string, value: unknown) => void;
         property: SerializableProperty;
-        collection: SerializableCollection;
+        collection: SerializableCollectionConfig;
     }) => React.ReactNode;
-    collectionValues?: EntityCollection;
+    collectionValues?: CollectionConfig;
 
 };
 
@@ -368,7 +368,7 @@ function PropertyEditFormFields({
     propertyTypePresets?: PropertyTypePreset[];
     hiddenPropertyTypes?: PropertyType[];
     renderExtraPropertyFields?: PropertyFormProps["renderExtraPropertyFields"];
-    collectionValues?: EntityCollection;
+    collectionValues?: CollectionConfig;
 
 } & FormexController<PropertyWithId>) {
 
@@ -505,13 +505,6 @@ function PropertyEditFormFields({
                 existing={existing}
                 multiple={false}
                 disabled={disabled}/>;
-    } else if (selectedFieldConfigId === "reference_as_string") {
-        childComponent =
-            <ReferencePropertyField showErrors={showErrors}
-                existing={existing}
-                asString={true}
-                multiple={false}
-                disabled={disabled}/>;
     } else if (selectedFieldConfigId === "date_time") {
         childComponent = <DateTimePropertyField disabled={disabled}/>;
     } else if (selectedFieldConfigId === "multi_references") {
@@ -619,7 +612,7 @@ function PropertyEditFormFields({
                                 } as PropertyWithId);
                             },
                             property: toSerializableProperty(values as Property),
-                            collection: toSerializableCollection(collectionValues),
+                            collection: toSerializableCollectionConfig(collectionValues),
                         })}
                     </div>
                 )}
@@ -686,7 +679,6 @@ const WIDGET_TYPE_MAP: Record<PropertyConfigId, string> = {
     multi_file_upload: "File",
     relation: "Relation",
     reference: "Reference",
-    reference_as_string: "Text",
     multi_references: "Reference",
     date_time: "Date",
     group: "Group",
@@ -707,7 +699,6 @@ const WIDGET_BASE_TYPE_MAP: Record<string, PropertyType> = {
     multi_select: "string",
     file_upload: "string",
     multi_file_upload: "string",
-    reference_as_string: "string",
     user_select: "string",
     number_input: "number",
     number_select: "number",

package/src/collection_editor/ui/collection_editor/PropertyFieldPreview.tsx

@@ -47,39 +47,49 @@ export function PropertyFieldPreview({
         >
             <PropertyConfigBadge propertyConfig={propertyConfig} size="small"/>
 
-            <div className="flex-1 flex flex-col min-w-0 pr-8">
+            <div className="flex-1 flex flex-col min-w-0 mr-16">
                 {includeName &&
                     <ErrorBoundary>
-                        <div className="flex items-center gap-2">
-                            <Typography variant="body2" component="span">
+                        <div className="flex items-center gap-2 min-w-0">
+                            <Typography variant="body2" component="span" className="truncate font-medium">
                                 {property.name || propertyKey || "\u00a0"}
                             </Typography>
-                            {property.name && propertyKey && property.name !== propertyKey && (
-                                <Typography variant="caption" component="span" color="secondary" className="font-mono">
+                            {propertyConfig?.name && (
+                                <Typography
+                                    variant={"caption"}
+                                    component="span"
+                                    className="text-text-secondary dark:text-text-secondary-dark shrink-0">
+                                    {propertyConfig.name}
+                                </Typography>
+                            )}
+                        </div>
+                        <div className="flex items-center gap-1.5 mt-0.5 min-w-0">
+                            {propertyKey && (
+                                <Typography variant="caption" component="span" color="secondary" className="font-mono truncate">
                                     {propertyKey}
                                 </Typography>
                             )}
+                            <ErrorBoundary>
+                                <Typography variant="caption" component="span" className="shrink-0 text-text-disabled dark:text-text-disabled-dark font-mono">
+                                    · {"columnType" in property ? (property as { columnType?: string }).columnType ?? property.type : property.type}
+                                </Typography>
+                            </ErrorBoundary>
                         </div>
                     </ErrorBoundary>}
 
-                <div className="flex flex-row items-center gap-2 mt-0.5">
-                    <ErrorBoundary>
-                        <Typography
-                            variant={"caption"}
-                            component="span"
-                            className="text-text-secondary dark:text-text-secondary-dark font-medium">
-                            {propertyConfig?.name}
-                        </Typography>
-                    </ErrorBoundary>
-                </div>
+                {!includeName &&
+                    <div className="flex flex-row items-center gap-2">
+                        <ErrorBoundary>
+                            <Typography
+                                variant={"caption"}
+                                component="span"
+                                className="text-text-secondary dark:text-text-secondary-dark font-medium">
+                                {propertyConfig?.name}
+                            </Typography>
+                        </ErrorBoundary>
+                    </div>}
             </div>
 
-            <ErrorBoundary>
-                <Typography variant="caption" component="span" className="ml-auto shrink-0 text-text-disabled dark:text-text-disabled-dark font-mono bg-surface-100 dark:bg-surface-900 px-1.5 py-0.5 rounded mr-8">
-                    {"columnType" in property ? (property as { columnType?: string }).columnType ?? property.type : property.type}
-                </Typography>
-            </ErrorBoundary>
-
             {includeEditButton && <Typography variant={"button"}>EDIT</Typography>}
         </div>
         </div>
@@ -120,35 +130,34 @@ export function NonEditablePropertyPreview({
                 <MinusCircleIcon className={"text-surface-accent-400 absolute -right-2 -top-2 bg-surface-50 dark:bg-surface-900 rounded-full"} size={iconSize.small}/>
             </div>
 
-            <div className="flex-1 flex flex-col min-w-0 pr-8">
-                <Typography variant="label" component="span" className="grow pr-2">
-                    {property?.name ? property.name : name}
-                </Typography>
-
-                <div className="flex flex-row items-center gap-2 mt-0.5">
-                    {propertyConfig && <Typography variant={"caption"} component="span" className="text-text-secondary dark:text-text-secondary-dark font-medium">
+            <div className="flex-1 flex flex-col min-w-0 mr-16">
+                <div className="flex items-center gap-2 min-w-0">
+                    <Typography variant="label" component="span" className="truncate">
+                        {property?.name ? property.name : name}
+                    </Typography>
+                    {propertyConfig && <Typography variant={"caption"} component="span" className="text-text-secondary dark:text-text-secondary-dark shrink-0">
                         {propertyConfig?.name}
                     </Typography>}
+                </div>
+
+                <div className="flex flex-row items-center gap-1.5 mt-0.5 min-w-0">
+                    <Typography variant="caption" component="span" color="secondary" className="font-mono truncate">
+                        {name}
+                    </Typography>
 
                     {property && isPropertyBuilder(property) && <ErrorBoundary>
                         <Typography variant="caption" component="span" className="text-text-disabled dark:text-text-disabled-dark">
-                            Defined in code
+                            · Defined in code
                         </Typography>
                     </ErrorBoundary>}
 
                     {!property && <ErrorBoundary>
                         <Typography variant="caption" component="span" className="text-text-disabled dark:text-text-disabled-dark">
-                            Additional field
+                            · Additional field
                         </Typography>
                     </ErrorBoundary>}
                 </div>
             </div>
-
-            {property && !isPropertyBuilder(property) && <ErrorBoundary>
-                <Typography variant="caption" component="span" className="ml-auto shrink-0 text-text-disabled dark:text-text-disabled-dark font-mono bg-surface-100 dark:bg-surface-900 px-1.5 py-0.5 rounded mr-8">
-                    {"columnType" in property ? (property as { columnType?: string }).columnType ?? property.type : property.type}
-                </Typography>
-            </ErrorBoundary>}
         </div>
         </div>
     )

package/src/collection_editor/ui/collection_editor/PropertyTree.tsx

@@ -287,7 +287,7 @@ export function PropertyTreeEntry({
                             selected={selected}/>}
                 </div>
 
-                <div className="absolute top-1/2 -translate-y-1/2 right-3 flex flex-row items-center gap-1">
+                <div className="absolute top-1/2 -translate-y-1/2 right-2 flex flex-row items-center gap-1">
                     {isAIModified && <AIModifiedIndicator/>}
                     {isPropertyInferred && <>
                         <Tooltip title={"Inferred property"} asChild={true}>

package/src/collection_editor/ui/collection_editor/SubcollectionsEditTab.tsx

@@ -5,7 +5,7 @@ import {
     useCustomizationController
 } from "@rebasepro/core";
 import { resolveEntityView } from "../../_cms_internals";
-import { EntityCollection, EntityCustomView, User } from "@rebasepro/types";
+import { CollectionConfig, EntityCustomView, User } from "@rebasepro/types";
 import { getSubcollections } from "@rebasepro/common";
 import {
     Alert,
@@ -37,8 +37,8 @@ export function SubcollectionsEditTab({
     getUser,
     parentCollectionSlugs
 }: {
-    collection: EntityCollection,
-    parentCollection?: EntityCollection,
+    collection: CollectionConfig,
+    parentCollection?: CollectionConfig,
     configController: CollectionsConfigController;
     collectionInference?: CollectionInference;
     getUser?: (uid: string) => User | null;
@@ -59,9 +59,9 @@ export function SubcollectionsEditTab({
     const {
         values,
         setFieldValue
-    } = useFormex<EntityCollection>();
+    } = useFormex<CollectionConfig>();
 
-    const [subcollections, setSubcollections] = React.useState<EntityCollection[]>(getSubcollections(collection) ?? []);
+    const [subcollections, setSubcollections] = React.useState<CollectionConfig[]>(getSubcollections(collection) ?? []);
     const resolvedEntityViews = values.entityViews?.filter(e => typeof e === "string")
         .map(e => resolveEntityView(e, contextEntityViews))
         .filter(Boolean) as EntityCustomView[] ?? [];

package/src/collection_editor/ui/collection_editor/import/CollectionEditorImportDataPreview.tsx

@@ -1,8 +1,8 @@
 import { useCollectionRegistryController } from "../../../_cms_internals";
 import { convertDataToEntity, ImportConfig } from "../../../_cms_internals";
 import { useAuthController } from "@rebasepro/core";
-import { EntityCollectionTable } from "../../../../components/EntityCollectionTable/EntityCollectionTable";
-import { useSelectionController } from "../../../../components/EntityCollectionView/useSelectionController";
+import { CollectionTableBinding } from "../../../../components/CollectionTableBinding/CollectionTableBinding";
+import { useSelectionController } from "../../../../components/CollectionViewBinding/useSelectionController";
 import { CircularProgressCenter } from "@rebasepro/ui";
 import { Properties } from "@rebasepro/types";
 import { useEffect, useState } from "react";
@@ -42,7 +42,7 @@ export function CollectionEditorImportDataPreview({
     if (loading)
         return <CircularProgressCenter/>
 
-    return <EntityCollectionTable
+    return <CollectionTableBinding
         title={<div>
             <Typography variant={"subtitle2"}>Imported data preview</Typography>
             <Typography variant={"caption"}>Entities with the same id will be overwritten</Typography>

package/src/collection_editor/ui/collection_editor/import/CollectionEditorImportMapping.tsx

@@ -6,7 +6,7 @@ import { getIn, useFormex } from "@rebasepro/formex";
 
 import { getFieldConfig, getFieldId } from "../../../../components/field_configs";
 import { PropertyConfigBadge } from "../../../../components/PropertyConfigBadge";
-import { EntityCollection, Properties, Property, PropertyConfig } from "@rebasepro/types";
+import { CollectionConfig, Properties, Property, PropertyConfig } from "@rebasepro/types";
 import { cls, Container, Select, SelectItem, Tooltip, Typography } from "@rebasepro/ui";
 import React, { useState } from "react";
 import { OnPropertyChangedParams, PropertyFormDialog, PropertyWithId } from "../PropertyEditView";
@@ -36,7 +36,7 @@ export function CollectionEditorImportMapping({
         setFieldValue,
         setFieldTouched,
         values
-    } = useFormex<EntityCollection>();
+    } = useFormex<CollectionConfig>();
     const [selectedProperty, setSelectedProperty] = useState<PropertyWithId | undefined>(undefined);
 
     const currentPropertiesOrderRef = React.useRef<{

package/src/collection_editor/ui/collection_editor/properties/RelationPropertyField.tsx

@@ -8,7 +8,7 @@ import {
     TextField,
     Typography
 } from "@rebasepro/ui";
-import { EntityCollection, OnAction, RelationProperty } from "@rebasepro/types";
+import { CollectionConfig, OnAction, RelationProperty } from "@rebasepro/types";
 
 import { CollectionsSelect } from "./ReferencePropertyField";
 
@@ -87,7 +87,7 @@ targetColumn: "" };
         }
     }, [targetSlug, relationName, setFieldValue]);
 
-    const collections: EntityCollection[] = collectionRegistry?.collections ?? [];
+    const collections: CollectionConfig[] = collectionRegistry?.collections ?? [];
 
     return (
         <>

package/src/collection_editor/ui/collection_editor/properties/StoragePropertyField.tsx

@@ -13,7 +13,8 @@ import {
 } from "@rebasepro/ui";
 
 import { Field, FormexFieldProps, getIn, useFormex } from "@rebasepro/formex";
-import { useTranslation } from "@rebasepro/core";
+import { useStorageSources, useTranslation } from "@rebasepro/core";
+import { DEFAULT_STORAGE_SOURCE_KEY } from "@rebasepro/types";
 import { GeneralPropertyValidation } from "./validation/GeneralPropertyValidation";
 import { ArrayPropertyValidation } from "./validation/ArrayPropertyValidation";
 import { ValidationPanel } from "./validation/ValidationPanel";
@@ -42,9 +43,11 @@ export function StoragePropertyField({
         setFieldValue
     } = useFormex();
     const { t } = useTranslation();
+    const storageSources = useStorageSources();
 
     const baseStoragePath = multiple ? "of.storage" : "storage";
     const acceptedFiles = `${baseStoragePath}.acceptedFiles`;
+    const storageSource = `${baseStoragePath}.storageSource`;
 
     const metadata = `${baseStoragePath}.metadata`;
     const fileName = `${baseStoragePath}.fileName`;
@@ -76,6 +79,11 @@ export function StoragePropertyField({
     const fileTypesValue: string[] | undefined = Array.isArray(storedValue) ? storedValue : undefined;
     const allFileTypesSelected = !fileTypesValue || fileTypesValue.length === 0;
 
+    // Available storage backends (from `<Rebase storageSources={...}>`).
+    const sourceKeys = Object.keys(storageSources.sources)
+        .filter((key) => key !== DEFAULT_STORAGE_SOURCE_KEY);
+    const storageSourceValue = (getIn(values, storageSource) as string | undefined) ?? DEFAULT_STORAGE_SOURCE_KEY;
+
     const handleTypesChange = (value: string[]) => {
         if (!value) setFieldValue(acceptedFiles, undefined);
         else setFieldValue(acceptedFiles, value);
@@ -102,6 +110,32 @@ export function StoragePropertyField({
 
                     <div className={"grid grid-cols-12 gap-2 p-4"}>
 
+                        {sourceKeys.length > 0 && (
+                            <div className={"col-span-12"}>
+                                <Select
+                                    className={"w-full"}
+                                    disabled={disabled}
+                                    name={storageSource}
+                                    value={storageSourceValue}
+                                    onValueChange={(value) =>
+                                        setFieldValue(storageSource, !value || value === DEFAULT_STORAGE_SOURCE_KEY ? undefined : value)}
+                                    label={"Storage backend"}
+                                    renderValue={(key) => {
+                                        const label = storageSources.registry[key]?.label;
+                                        return label ?? (key === DEFAULT_STORAGE_SOURCE_KEY ? "Default" : key);
+                                    }}>
+                                    <SelectItem value={DEFAULT_STORAGE_SOURCE_KEY}>
+                                        Default
+                                    </SelectItem>
+                                    {sourceKeys.map((key) => (
+                                        <SelectItem key={key} value={key}>
+                                            {storageSources.registry[key]?.label ?? key}
+                                        </SelectItem>
+                                    ))}
+                                </Select>
+                            </div>
+                        )}
+
                         <div className={"col-span-12"}>
 
                             <MultiSelect

package/src/collection_editor/ui/collection_editor/templates/blog_template.ts

@@ -1,4 +1,4 @@
-import type { EntityCollection } from "@rebasepro/types";
+import type { CollectionConfig } from "@rebasepro/types";
 
 export const blogCollectionTemplate = {
     slug: "blog",
@@ -93,7 +93,7 @@ export const blogCollectionTemplate = {
         publish_date: {
             name: "Publish date",
             type: "date",
-            clearable: true
+            ui: { clearable: true }
         },
         reviewed: {
             name: "Reviewed",
@@ -109,4 +109,4 @@ export const blogCollectionTemplate = {
             }
         }
     }
-} as unknown as EntityCollection;
+} as unknown as CollectionConfig;

package/src/collection_editor/ui/collection_editor/templates/pages_template.ts

@@ -1,4 +1,4 @@
-import type { EntityCollection } from "@rebasepro/types";
+import type { CollectionConfig } from "@rebasepro/types";
 
 export const pagesCollectionTemplate = {
     slug: "pages",
@@ -180,4 +180,4 @@ export const pagesCollectionTemplate = {
             description: "Should this page be live on the site?"
         }
     }
-} as unknown as EntityCollection;
+} as unknown as CollectionConfig;

package/src/collection_editor/ui/collection_editor/templates/products_template.ts

@@ -1,4 +1,4 @@
-import type { EntityCollection } from "@rebasepro/types";
+import type { CollectionConfig } from "@rebasepro/types";
 
 export const productsCollectionTemplate = {
     slug: "products",
@@ -85,4 +85,4 @@ export const productsCollectionTemplate = {
             autoValue: "on_create"
         }
     }
-} as unknown as EntityCollection;
+} as unknown as CollectionConfig;

package/src/collection_editor/ui/collection_editor/templates/users_template.ts

@@ -1,4 +1,4 @@
-import type { EntityCollection } from "@rebasepro/types";
+import type { CollectionConfig } from "@rebasepro/types";
 
 export const usersCollectionTemplate = {
     slug: "users",
@@ -39,4 +39,4 @@ export const usersCollectionTemplate = {
             url: "image"
         }
     }
-} as unknown as EntityCollection;
+} as unknown as CollectionConfig;

package/src/collection_editor/ui/collection_editor/utils/supported_fields.tsx

@@ -16,7 +16,6 @@ export const supportedFieldsIds: PropertyConfigId[] = [
     "file_upload",
     "multi_file_upload",
     "reference",
-    "reference_as_string",
     "multi_references",
     "relation",
     "switch",

package/src/collection_editor/ui/collection_editor/utils/update_property_for_widget.ts

@@ -14,10 +14,8 @@ export function updatePropertyFromWidget(propertyData: any,
                 type: "string",
                 propertyConfig: "text_field",
                 storage: undefined,
-                multiline: undefined,
-                markdown: undefined,
+                ui: { multiline: undefined, markdown: undefined, url: undefined },
                 email: undefined,
-                url: undefined,
                 enum: undefined,
                 userSelect: undefined
             } as StringProperty
@@ -29,10 +27,8 @@ export function updatePropertyFromWidget(propertyData: any,
                 type: "string",
                 propertyConfig: "user_select",
                 storage: undefined,
-                multiline: undefined,
-                markdown: undefined,
+                ui: { multiline: undefined, markdown: undefined, url: undefined },
                 email: undefined,
-                url: undefined,
                 enum: undefined,
                 userSelect: true
             } as StringProperty
@@ -43,11 +39,9 @@ export function updatePropertyFromWidget(propertyData: any,
             {
                 type: "string",
                 propertyConfig: "multiline",
-                multiline: true,
+                ui: { multiline: true, markdown: undefined, url: undefined },
                 storage: undefined,
-                markdown: undefined,
                 email: undefined,
-                url: undefined,
                 enum: undefined,
                 userSelect: undefined
             } as StringProperty
@@ -59,10 +53,8 @@ export function updatePropertyFromWidget(propertyData: any,
                 type: "string",
                 propertyConfig: "markdown",
                 storage: undefined,
-                multiline: undefined,
-                markdown: true,
+                ui: { multiline: undefined, markdown: true, url: undefined },
                 email: undefined,
-                url: undefined,
                 userSelect: undefined
             } as StringProperty
         );
@@ -73,10 +65,8 @@ export function updatePropertyFromWidget(propertyData: any,
                 type: "string",
                 propertyConfig: "url",
                 storage: undefined,
-                multiline: undefined,
-                markdown: undefined,
+                ui: { multiline: undefined, markdown: undefined, url: true },
                 email: undefined,
-                url: true,
                 enum: undefined,
                 userSelect: undefined
             } as StringProperty
@@ -88,10 +78,8 @@ export function updatePropertyFromWidget(propertyData: any,
                 type: "string",
                 propertyConfig: "email",
                 storage: undefined,
-                multiline: undefined,
-                markdown: undefined,
+                ui: { multiline: undefined, markdown: undefined, url: undefined },
                 email: true,
-                url: undefined,
                 enum: undefined,
                 userSelect: undefined
             } as StringProperty
@@ -103,10 +91,8 @@ export function updatePropertyFromWidget(propertyData: any,
                 type: "string",
                 propertyConfig: "select",
                 storage: undefined,
-                multiline: undefined,
-                markdown: undefined,
+                ui: { multiline: undefined, markdown: undefined, url: undefined },
                 email: undefined,
-                url: undefined,
                 enum: propertyData.enum ?? [],
                 userSelect: undefined
             } as StringProperty
@@ -206,14 +192,6 @@ export function updatePropertyFromWidget(propertyData: any,
                 propertyConfig: "reference"
             } as Property
         );
-    } else if (selectedWidgetId === "reference_as_string") {
-        updatedProperty = mergeDeep(
-            propertyData,
-            {
-                type: "string",
-                propertyConfig: "reference_as_string"
-            } as Property
-        );
     } else if (selectedWidgetId === "multi_references") {
         updatedProperty = mergeDeep(
             propertyData,

package/src/collection_editor/useJsonCollectionsConfigController.tsx

@@ -1,5 +1,5 @@
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
-import type { EntityCollection, NavigationGroupMapping, Property } from "@rebasepro/types";
+import type { EngineProperties, CollectionConfig, NavigationGroupMapping, Property } from "@rebasepro/types";
 import type {
     CollectionsConfigController,
     SaveCollectionParams,
@@ -10,8 +10,8 @@ import type {
     UpdatePropertiesOrderParams,
     UpdateKanbanColumnsOrderParams,
 } from "./types/config_controller";
-import type { JsonCollectionStore, SerializableCollection } from "./serializable_types";
-import { toSerializableCollection, toSerializableProperty, fromSerializableCollection } from "./serializable_utils";
+import type { JsonCollectionStore, SerializableCollectionConfig } from "./serializable_types";
+import { toSerializableCollectionConfig, toSerializableProperty, fromSerializableCollectionConfig } from "./serializable_utils";
 
 export interface UseJsonCollectionsConfigControllerOptions {
     /**
@@ -55,7 +55,7 @@ export function useJsonCollectionsConfigController({
     readOnly = false,
     autoLoad = true,
 }: UseJsonCollectionsConfigControllerOptions): CollectionsConfigController {
-    const [collections, setCollections] = useState<EntityCollection[]>([]);
+    const [collections, setCollections] = useState<CollectionConfig[]>([]);
     const [loading, setLoading] = useState(autoLoad);
     const [navigationEntries, setNavigationEntries] = useState<NavigationGroupMapping[]>([]);
 
@@ -75,7 +75,7 @@ export function useJsonCollectionsConfigController({
                     storeRef.current.loadNavigationEntries?.() ?? Promise.resolve([]),
                 ]);
                 if (cancelled) return;
-                setCollections(serialized.map(fromSerializableCollection));
+                setCollections(serialized.map(fromSerializableCollectionConfig));
                 setNavigationEntries(navEntries);
             } catch (e) {
                 console.error("useJsonCollectionsConfigController: failed to load collections", e);
@@ -92,15 +92,15 @@ export function useJsonCollectionsConfigController({
     /**
      * Update local state and persist a collection to the store.
      */
-    const persistCollection = useCallback(async (collection: EntityCollection) => {
-        const serializable = toSerializableCollection(collection);
+    const persistCollection = useCallback(async (collection: CollectionConfig) => {
+        const serializable = toSerializableCollectionConfig(collection);
         await storeRef.current.save(collection.slug, serializable);
     }, []);
 
     /**
      * Find collection by id (slug).
      */
-    const getCollection = useCallback((id: string): EntityCollection => {
+    const getCollection = useCallback((id: string): CollectionConfig => {
         const found = collections.find(c => c.slug === id);
         if (found) return found;
         throw new Error(`Collection "${id}" not found`);
@@ -111,7 +111,7 @@ export function useJsonCollectionsConfigController({
     const saveCollection = useCallback(async <M extends Record<string, unknown>>(
         { id, collectionData }: SaveCollectionParams<M>
     ) => {
-        const collection = collectionData as EntityCollection;
+        const collection = collectionData as CollectionConfig;
         await persistCollection(collection);
         setCollections(prev => {
             const idx = prev.findIndex(c => c.slug === id);
@@ -132,7 +132,7 @@ export function useJsonCollectionsConfigController({
             const idx = prev.findIndex(c => c.slug === lookupId);
             if (idx < 0) return prev;
 
-            const merged = { ...prev[idx], ...collectionData } as EntityCollection;
+            const merged = { ...prev[idx], ...collectionData } as CollectionConfig;
             const next = [...prev];
             next[idx] = merged;
 
@@ -171,13 +171,13 @@ export function useJsonCollectionsConfigController({
             collection.properties = {
                 ...collection.properties,
                 [propertyKey]: property,
-            };
+            } as EngineProperties;
             if (newPropertiesOrder) {
                 collection.propertiesOrder = newPropertiesOrder as typeof collection.propertiesOrder;
             }
 
             const next = [...prev];
-            next[idx] = collection as EntityCollection;
+            next[idx] = collection as CollectionConfig;
 
             persistCollection(next[idx]).catch(e =>
                 console.error("useJsonCollectionsConfigController: failed to save property", e)
@@ -204,7 +204,7 @@ export function useJsonCollectionsConfigController({
             }
 
             const next = [...prev];
-            next[idx] = collection as EntityCollection;
+            next[idx] = collection as CollectionConfig;
 
             persistCollection(next[idx]).catch(e =>
                 console.error("useJsonCollectionsConfigController: failed to delete property", e)
@@ -221,7 +221,7 @@ export function useJsonCollectionsConfigController({
         const updated = {
             ...collection,
             propertiesOrder: newPropertiesOrder,
-        } as EntityCollection;
+        } as CollectionConfig;
 
         setCollections(prev => {
             const idx = prev.findIndex(c => c.slug === collection.slug);