@rebasepro/admin 0.6.1 → 0.8.0

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

@@ -0,0 +1,286 @@
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import type { EngineProperties, EntityCollection, NavigationGroupMapping, Property } from "@rebasepro/types";
+import type {
+    CollectionsConfigController,
+    SaveCollectionParams,
+    UpdateCollectionParams,
+    DeleteCollectionParams,
+    SavePropertyParams,
+    DeletePropertyParams,
+    UpdatePropertiesOrderParams,
+    UpdateKanbanColumnsOrderParams,
+} from "./types/config_controller";
+import type { JsonCollectionStore, SerializableCollection } from "./serializable_types";
+import { toSerializableCollection, toSerializableProperty, fromSerializableCollection } from "./serializable_utils";
+
+export interface UseJsonCollectionsConfigControllerOptions {
+    /**
+     * The store adapter for persisting/loading collections.
+     */
+    store: JsonCollectionStore;
+
+    /**
+     * If true, the configuration cannot be modified.
+     */
+    readOnly?: boolean;
+
+    /**
+     * If true, collections will be loaded from the store on mount.
+     * Defaults to true.
+     */
+    autoLoad?: boolean;
+}
+
+/**
+ * A `CollectionsConfigController` implementation that persists collection
+ * configurations as JSON via a pluggable `JsonCollectionStore` adapter.
+ *
+ * Use this when you want to store collection schemas in a database, API,
+ * localStorage, or any other JSON-compatible backend — as opposed to the
+ * default code-based persistence.
+ *
+ * @example
+ * ```tsx
+ * const store: JsonCollectionStore = {
+ *     load: async () => { const res = await fetch('/api/schemas'); return res.json(); },
+ *     save: async (slug, data) => { await fetch(`/api/schemas/${slug}`, { method: 'PUT', body: JSON.stringify(data) }); },
+ *     delete: async (slug) => { await fetch(`/api/schemas/${slug}`, { method: 'DELETE' }); },
+ * };
+ *
+ * const configController = useJsonCollectionsConfigController({ store });
+ * ```
+ */
+export function useJsonCollectionsConfigController({
+    store,
+    readOnly = false,
+    autoLoad = true,
+}: UseJsonCollectionsConfigControllerOptions): CollectionsConfigController {
+    const [collections, setCollections] = useState<EntityCollection[]>([]);
+    const [loading, setLoading] = useState(autoLoad);
+    const [navigationEntries, setNavigationEntries] = useState<NavigationGroupMapping[]>([]);
+
+    // Keep store ref stable to avoid stale closures in callbacks
+    const storeRef = useRef(store);
+    storeRef.current = store;
+
+    // ── Load on mount ─────────────────────────────────────────────────
+    useEffect(() => {
+        if (!autoLoad) return;
+        let cancelled = false;
+
+        (async () => {
+            try {
+                const [serialized, navEntries] = await Promise.all([
+                    storeRef.current.load(),
+                    storeRef.current.loadNavigationEntries?.() ?? Promise.resolve([]),
+                ]);
+                if (cancelled) return;
+                setCollections(serialized.map(fromSerializableCollection));
+                setNavigationEntries(navEntries);
+            } catch (e) {
+                console.error("useJsonCollectionsConfigController: failed to load collections", e);
+            } finally {
+                if (!cancelled) setLoading(false);
+            }
+        })();
+
+        return () => { cancelled = true; };
+    }, [autoLoad]);
+
+    // ── Helpers ────────────────────────────────────────────────────────
+
+    /**
+     * Update local state and persist a collection to the store.
+     */
+    const persistCollection = useCallback(async (collection: EntityCollection) => {
+        const serializable = toSerializableCollection(collection);
+        await storeRef.current.save(collection.slug, serializable);
+    }, []);
+
+    /**
+     * Find collection by id (slug).
+     */
+    const getCollection = useCallback((id: string): EntityCollection => {
+        const found = collections.find(c => c.slug === id);
+        if (found) return found;
+        throw new Error(`Collection "${id}" not found`);
+    }, [collections]);
+
+    // ── CRUD operations ───────────────────────────────────────────────
+
+    const saveCollection = useCallback(async <M extends Record<string, unknown>>(
+        { id, collectionData }: SaveCollectionParams<M>
+    ) => {
+        const collection = collectionData as EntityCollection;
+        await persistCollection(collection);
+        setCollections(prev => {
+            const idx = prev.findIndex(c => c.slug === id);
+            if (idx >= 0) {
+                const next = [...prev];
+                next[idx] = collection;
+                return next;
+            }
+            return [...prev, collection];
+        });
+    }, [persistCollection]);
+
+    const updateCollection = useCallback(async <M extends Record<string, unknown>>(
+        { id, collectionData, previousId }: UpdateCollectionParams<M>
+    ) => {
+        setCollections(prev => {
+            const lookupId = previousId ?? id;
+            const idx = prev.findIndex(c => c.slug === lookupId);
+            if (idx < 0) return prev;
+
+            const merged = { ...prev[idx], ...collectionData } as EntityCollection;
+            const next = [...prev];
+            next[idx] = merged;
+
+            // Persist async — fire-and-forget with error logging
+            persistCollection(merged).catch(e =>
+                console.error("useJsonCollectionsConfigController: failed to update collection", e)
+            );
+
+            // If slug changed, clean up the old entry in the store
+            if (previousId && previousId !== id) {
+                storeRef.current.delete(previousId).catch(e =>
+                    console.error("useJsonCollectionsConfigController: failed to delete old slug", e)
+                );
+            }
+
+            return next;
+        });
+    }, [persistCollection]);
+
+    const deleteCollection = useCallback(async ({ id }: DeleteCollectionParams) => {
+        await storeRef.current.delete(id);
+        setCollections(prev => prev.filter(c => c.slug !== id));
+    }, []);
+
+    const saveProperty = useCallback(async ({
+        path,
+        propertyKey,
+        property,
+        newPropertiesOrder,
+    }: SavePropertyParams) => {
+        setCollections(prev => {
+            const idx = prev.findIndex(c => c.slug === path);
+            if (idx < 0) return prev;
+
+            const collection = { ...prev[idx] };
+            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;
+
+            persistCollection(next[idx]).catch(e =>
+                console.error("useJsonCollectionsConfigController: failed to save property", e)
+            );
+
+            return next;
+        });
+    }, [persistCollection]);
+
+    const deleteProperty = useCallback(async ({
+        path,
+        propertyKey,
+        newPropertiesOrder,
+    }: DeletePropertyParams) => {
+        setCollections(prev => {
+            const idx = prev.findIndex(c => c.slug === path);
+            if (idx < 0) return prev;
+
+            const collection = { ...prev[idx] };
+            const { [propertyKey]: _removed, ...remaining } = collection.properties;
+            collection.properties = remaining;
+            if (newPropertiesOrder) {
+                collection.propertiesOrder = newPropertiesOrder as typeof collection.propertiesOrder;
+            }
+
+            const next = [...prev];
+            next[idx] = collection as EntityCollection;
+
+            persistCollection(next[idx]).catch(e =>
+                console.error("useJsonCollectionsConfigController: failed to delete property", e)
+            );
+
+            return next;
+        });
+    }, [persistCollection]);
+
+    const updatePropertiesOrder = useCallback(async ({
+        collection,
+        newPropertiesOrder,
+    }: UpdatePropertiesOrderParams) => {
+        const updated = {
+            ...collection,
+            propertiesOrder: newPropertiesOrder,
+        } as EntityCollection;
+
+        setCollections(prev => {
+            const idx = prev.findIndex(c => c.slug === collection.slug);
+            if (idx < 0) return prev;
+            const next = [...prev];
+            next[idx] = updated;
+            return next;
+        });
+
+        await persistCollection(updated);
+    }, [persistCollection]);
+
+    const updateKanbanColumnsOrder = useCallback(async ({
+        collection,
+        kanbanColumnProperty,
+        newColumnsOrder,
+    }: UpdateKanbanColumnsOrderParams) => {
+        // Kanban column order is stored in the enum order of the column property.
+        // For JSON persistence, we store it as-is — the view layer reads enum order.
+        // This is a no-op for now; the kanban order is determined by the enum
+        // definition on the property itself.
+    }, []);
+
+    const saveNavigationEntriesHandler = useCallback(async (entries: NavigationGroupMapping[]) => {
+        setNavigationEntries(entries);
+        if (storeRef.current.saveNavigationEntries) {
+            await storeRef.current.saveNavigationEntries(entries);
+        }
+    }, []);
+
+    // ── Return controller ─────────────────────────────────────────────
+    return useMemo<CollectionsConfigController>(() => ({
+        loading,
+        readOnly,
+        readOnlyReason: readOnly ? "Configuration is read-only." : undefined,
+        collections,
+        getCollection,
+        saveCollection,
+        updateCollection,
+        deleteCollection,
+        saveProperty,
+        deleteProperty,
+        updatePropertiesOrder,
+        updateKanbanColumnsOrder,
+        navigationEntries,
+        saveNavigationEntries: saveNavigationEntriesHandler,
+    }), [
+        loading,
+        readOnly,
+        collections,
+        getCollection,
+        saveCollection,
+        updateCollection,
+        deleteCollection,
+        saveProperty,
+        deleteProperty,
+        updatePropertiesOrder,
+        updateKanbanColumnsOrder,
+        navigationEntries,
+        saveNavigationEntriesHandler,
+    ]);
+}

package/src/collection_editor/useSafeSnackbarController.ts

@@ -0,0 +1,9 @@
+import { useSnackbarController } from "@rebasepro/core";
+
+export function useSafeSnackbarController(): ReturnType<typeof useSnackbarController> | undefined {
+    try {
+        return useSnackbarController();
+    } catch {
+        return undefined;
+    }
+}

package/src/collection_editor_ui.ts

@@ -13,3 +13,9 @@ export type { CollectionStudioViewProps } from "./collection_editor/ui/collectio
 
 export { CollectionsStudioView } from "./collection_editor/ui/collection_editor/CollectionsStudioView";
 export type { CollectionsStudioViewProps } from "./collection_editor/ui/collection_editor/CollectionsStudioView";
+
+export { RouterCollectionStudioView } from "./collection_editor/ui/collection_editor/RouterCollectionStudioView";
+export type { RouterCollectionStudioViewProps } from "./collection_editor/ui/collection_editor/RouterCollectionStudioView";
+
+export { RouterCollectionsStudioView } from "./collection_editor/ui/collection_editor/RouterCollectionsStudioView";
+export type { RouterCollectionsStudioViewProps } from "./collection_editor/ui/collection_editor/RouterCollectionsStudioView";

package/src/components/DefaultDrawer.tsx

@@ -165,11 +165,21 @@ function CMSNavigationContent() {
 
     const allNavigationEntries = navigationState.topLevelNavigation?.navigationEntries ?? [];
 
-    // Studio mode shows view-type entries (devViews) + admin entries (Users/Roles).
-    // Content mode shows collections and custom entries + admin entries (Users/Roles), but not studio views.
+    // Build a set of Studio-only dev view slugs so we can distinguish them from
+    // CMS custom views added via <RebaseCMS views={...}> or plugins.
+    const studioViewSlugs = useMemo(() => {
+        const slugs = new Set<string>();
+        (registry.studioConfig?.devViews ?? []).forEach(v => slugs.add(v.slug));
+        // The schema view is also a Studio dev view (auto-injected when collectionEditor is enabled)
+        if (registry.studioConfig && registry.cmsConfig?.collectionEditor) slugs.add("schema");
+        return slugs;
+    }, [registry.studioConfig, registry.cmsConfig?.collectionEditor]);
+
+    // Studio mode shows Studio dev views + admin entries (Users/Roles).
+    // Content mode shows collections, CMS custom views, and admin entries — but not Studio dev views.
     const filteredEntries = adminModeController.mode === "studio"
-        ? allNavigationEntries.filter(e => e.type === "view" || e.type === "admin")
-        : allNavigationEntries.filter(e => e.type !== "view");
+        ? allNavigationEntries.filter(e => (e.type === "view" && studioViewSlugs.has(e.slug)) || e.type === "admin")
+        : allNavigationEntries.filter(e => e.type !== "view" || !studioViewSlugs.has(e.slug));
 
     // Derive groups from the filtered entries, preserving the order from topLevelNavigation.groups
     const entryGroups = new Set(filteredEntries.map(e => e.group).filter(Boolean));

package/src/components/DrawerNavigationGroup.tsx

@@ -1,7 +1,7 @@
 import type { NavigationEntry } from "@rebasepro/types";
 import React from "react";
 import { ChevronDownIcon, cls, iconSize, Typography } from "@rebasepro/ui";
-;
+
 import { IconForView } from "@rebasepro/core";
 import { DrawerNavigationItem } from "./DrawerNavigationItem";
 import { useTranslation, useComponentOverride } from "@rebasepro/core";
@@ -108,7 +108,7 @@ export function DrawerNavigationGroup({
                     "transition-all duration-200 ease-in-out",
                     "overflow-hidden",
                     !hideHeader && "dark:bg-transparent",
-                    !hideHeader ? (drawerOpen ? "rounded-lg" : "rounded-lg") : "rounded-lg",
+                    "rounded-lg",
                     (!hideHeader && collapsed) ? "max-h-0 opacity-0" : "max-h-[2000px] opacity-100"
                 )}
             >

package/src/components/EntityCollectionTable/EntityCollectionTable.tsx

@@ -42,7 +42,7 @@ import { getValueInPath } from "@rebasepro/utils";
  * @see VirtualTable
  * @group Components
  */
-export const EntityCollectionTable = function EntityCollectionTable<M extends Record<string, unknown> = any, USER extends User = any>
+export const EntityCollectionTable = function EntityCollectionTable<M extends Record<string, unknown> = Record<string, unknown>, USER extends User = User>
     ({
         className,
         style,
@@ -113,7 +113,7 @@ export const EntityCollectionTable = function EntityCollectionTable<M extends Re
     const additionalFieldsMap: Record<string, AdditionalFieldDelegate<M, USER>> = useMemo(() => {
         return (additionalFields
             ? additionalFields
-                .map((aC) => ({ [aC.key]: aC as AdditionalFieldDelegate<M, any> }))
+                .map((aC) => ({ [aC.key]: aC as AdditionalFieldDelegate<M, USER> }))
                 .reduce((a, b) => ({ ...a,
 ...b }), {})
             : {}) as Record<string, AdditionalFieldDelegate<M, USER>>;
@@ -132,9 +132,10 @@ export const EntityCollectionTable = function EntityCollectionTable<M extends Re
         isDragging,
         isDraggable,
         frozen
-    }: CellRendererParams<any>) => {
+    }: CellRendererParams<Entity<M>>) => {
 
-        const entity: Entity<M> = rowData;
+        const entity: Entity<M> | undefined = rowData;
+        if (!entity) return null;
 
         const propertyKey = column.key;
 
@@ -192,9 +193,10 @@ export const EntityCollectionTable = function EntityCollectionTable<M extends Re
         isDragging,
         isDraggable,
         frozen
-    }: CellRendererParams<any>) => {
+    }: CellRendererParams<Entity<M>>) => {
 
-        const entity: Entity<M> = rowData;
+        const entity: Entity<M> | undefined = rowData;
+        if (!entity) return null;
 
         const additionalField = additionalFieldsMap[column.key as string];
         const value = additionalField.dependencies
@@ -293,7 +295,7 @@ export const EntityCollectionTable = function EntityCollectionTable<M extends Re
             : collectionColumns) as VirtualTableColumn[]
     ], [idColumn, displayedColumnIds, collectionColumns]);
 
-    const cellRenderer = useCallback((props: CellRendererParams<any>) => {
+    const cellRenderer = useCallback((props: CellRendererParams<Entity<M>>) => {
         const column = props.column;
         const columns = props.columns;
         const columnKey = column.key;
@@ -302,13 +304,13 @@ export const EntityCollectionTable = function EntityCollectionTable<M extends Re
             if (props.columnIndex === 0) {
                 if (tableRowActionsBuilder)
                     return tableRowActionsBuilder({
-                        entity: props.rowData,
+                        entity: props.rowData!,
                         size,
                         width: column.width,
                         frozen: column.frozen
                     });
                 else
-                    return <EntityCollectionRowActions entity={props.rowData}
+                    return <EntityCollectionRowActions entity={props.rowData!}
                         width={column.width}
                         frozen={column.frozen}
                         isSelected={false}

package/src/components/EntityCollectionTable/fields/TableMultipleRelationField.tsx

@@ -1,5 +1,6 @@
 import { useEntitySelectionDialog } from "../../../hooks/useEntitySelectionDialog";
 import type { EntityCollection } from "@rebasepro/types";
+import { getCollectionDataPath } from "@rebasepro/types";
 import React, { useCallback } from "react";
 import { deepEqual as equal } from "fast-equals";
 
@@ -58,7 +59,7 @@ export const TableMultipleRelationFieldInternal = React.memo(
 
         const relationDialogController = useEntitySelectionDialog({
             multiselect: true,
-            path: collection.slug,
+            path: getCollectionDataPath(collection),
             collection,
             onMultipleEntitiesSelected,
             selectedEntityIds,

package/src/components/EntityCollectionTable/fields/TableRelationField.tsx

@@ -1,5 +1,6 @@
 import { useEntitySelectionDialog } from "../../../hooks/useEntitySelectionDialog";
 import type { EntityCollection } from "@rebasepro/types";
+import { getCollectionDataPath } from "@rebasepro/types";
 import React, { useCallback } from "react";
 import { deepEqual as equal } from "fast-equals"
 
@@ -90,7 +91,7 @@ export const TableRelationFieldInternal = React.memo(
 
         const relationDialogController = useEntitySelectionDialog({
             multiselect,
-            path: collection.slug,
+            path: getCollectionDataPath(collection),
             collection,
             onMultipleEntitiesSelected,
             onSingleEntitySelected,

package/src/components/EntityCollectionTable/fields/TableStorageUpload.tsx

@@ -8,7 +8,7 @@ import { useDropzone } from "react-dropzone";
 import { PropertyPreview } from "../../../preview";
 import { ErrorBoundary } from "@rebasepro/ui";
 import { cls, IconButton, PencilIcon, Typography } from "@rebasepro/ui";
-import { useSnackbarController, useStorageSource, useTranslation, StorageFieldItem, useStorageUploadController } from "@rebasepro/core";
+import { useSnackbarController, useStorageSource, useTranslation, StorageFieldItem, useStorageUploadController, StorageSourceContext } from "@rebasepro/core";
 import { getThumbnailMeasure } from "../../../preview/util";
 import { StorageUploadProgress } from "../../../form/components/StorageUploadProgress";
 import { EntityTableCellActions } from "../internal/EntityTableCellActions";
@@ -64,7 +64,8 @@ export function TableStorageUpload(props: {
         storage,
         onFileUploadComplete,
         storagePathBuilder,
-        multipleFilesSupported
+        multipleFilesSupported,
+        resolvedStorageSource
     } = useStorageUploadController({
         entityValues: entity.values,
         entityId: entity.id,
@@ -79,24 +80,26 @@ export function TableStorageUpload(props: {
 
     return (
 
-        <StorageUpload
-            internalValue={internalValue}
-            setInternalValue={setInternalValue}
-            name={propertyKey}
-            disabled={disabled}
-            autoFocus={false}
-            openPopup={openPopup}
-            error={error}
-            selected={selected}
-            property={property}
-            onChange={updateValue}
-            entity={entity}
-            storagePathBuilder={storagePathBuilder}
-            storage={storage}
-            multipleFilesSupported={multipleFilesSupported}
-            onFilesAdded={onFilesAdded}
-            onFileUploadComplete={onFileUploadComplete}
-            previewSize={previewSize}/>
+        <StorageSourceContext.Provider value={resolvedStorageSource}>
+            <StorageUpload
+                internalValue={internalValue}
+                setInternalValue={setInternalValue}
+                name={propertyKey}
+                disabled={disabled}
+                autoFocus={false}
+                openPopup={openPopup}
+                error={error}
+                selected={selected}
+                property={property}
+                onChange={updateValue}
+                entity={entity}
+                storagePathBuilder={storagePathBuilder}
+                storage={storage}
+                multipleFilesSupported={multipleFilesSupported}
+                onFilesAdded={onFilesAdded}
+                onFileUploadComplete={onFileUploadComplete}
+                previewSize={previewSize}/>
+        </StorageSourceContext.Provider>
 
     );
 }

package/src/components/EntityCollectionTable/index.tsx

@@ -11,4 +11,4 @@ export * from "./EntityCollectionRowActions";
 
 export * from "./column_utils";
 
-export { VirtualTableInput } from "./fields/VirtualTableInput";
+export { VirtualTableInput } from "@rebasepro/ui";