@rebasepro/admin 0.6.1 → 0.7.0

package/src/components/EntityEditViewFormActions.tsx

@@ -123,7 +123,7 @@ type ActionsViewProps<M extends Record<string, unknown>> = {
     status: "new" | "existing" | "copy",
     sideDialogContext: SideDialogController,
     pluginActions?: React.ReactNode[],
-    openEntityMode: "side_panel" | "full_screen" | "split" | "dialog";
+    openEntityMode?: "side_panel" | "full_screen" | "split" | "dialog";
     navigateBack: () => void;
     formContext: FormContext,
     formex: FormexController<Record<string, unknown>>;
@@ -164,6 +164,7 @@ function buildBottomActions<M extends Record<string, unknown>>({
         {formActions.length > 0 && <div className="grow flex overflow-auto no-scrollbar">
             {formActions.map((action, index) => {
 
+
                 const props = {
                     view: "form",
                     entity,
@@ -208,17 +209,19 @@ function buildBottomActions<M extends Record<string, unknown>>({
                 {t("back_to_detail") ?? "Back to details"}
             </Button>
         )}
-        <Button variant={canClose ? "text" : "filled"}
-            color="primary"
-            type="submit"
-            disabled={disabled || formex.isSubmitting}
-            onClick={() => {
-                sideDialogContext.setPendingClose(false);
-            }}>
-            {status === "existing" && t("save")}
-            {status === "copy" && t("create_copy")}
-            {status === "new" && t("create")}
-        </Button>
+        <Tooltip title={hasErrors ? (t("fix_errors_before_saving") ?? "Fix highlighted errors before saving") : undefined}>
+            <Button variant={canClose ? "text" : "filled"}
+                color="primary"
+                type="submit"
+                disabled={disabled || formex.isSubmitting}
+                onClick={() => {
+                    sideDialogContext.setPendingClose(false);
+                }}>
+                {status === "existing" && t("save")}
+                {status === "copy" && t("create_copy")}
+                {status === "new" && t("create")}
+            </Button>
+        </Tooltip>
         {canClose && <LoadingButton variant="filled"
             color="primary"
             type="submit"
@@ -256,19 +259,22 @@ function buildSideActions<M extends Record<string, unknown>>({
     const hasErrors = Object.keys(formex.errors).length > 0 && formex.submitCount > 0;
     return <div
         className={cls("overflow-auto h-full flex flex-col gap-2 w-80 2xl:w-96 px-4 py-16 sticky top-0 border-l", defaultBorderMixin, className)}>
-        <LoadingButton fullWidth={true}
-            variant="filled"
-            color="primary"
-            type="submit"
-            startIcon={hasErrors ? <AlertCircleIcon/> : undefined}
-            disabled={disabled || formex.isSubmitting}
-            onClick={() => {
-                sideDialogContext.setPendingClose?.(false);
-            }}>
-            {status === "existing" && t("save")}
-            {status === "copy" && t("create_copy")}
-            {status === "new" && t("create")}
-        </LoadingButton>
+        <Tooltip title={hasErrors ? (t("fix_errors_before_saving") ?? "Fix highlighted errors before saving") : undefined}>
+            <LoadingButton fullWidth={true}
+                variant="filled"
+                color="primary"
+                type="submit"
+                loading={formex.isSubmitting}
+                startIcon={hasErrors ? <AlertCircleIcon/> : undefined}
+                disabled={disabled || formex.isSubmitting}
+                onClick={() => {
+                    sideDialogContext.setPendingClose?.(false);
+                }}>
+                {status === "existing" && t("save")}
+                {status === "copy" && t("create_copy")}
+                {status === "new" && t("create")}
+            </LoadingButton>
+        </Tooltip>
 
         <Button fullWidth={true} variant="text" disabled={disabled || formex.isSubmitting} type="reset">
             {status === "existing" ? t("discard") : t("clear")}
@@ -293,7 +299,7 @@ function buildSideActions<M extends Record<string, unknown>>({
                     openEntityMode,
                     navigateBack,
                     formContext
-                } satisfies EntityActionClickProps<any>;
+                } satisfies EntityActionClickProps<Record<string, unknown>>;
                 const isEnabled = !action.isEnabled || action.isEnabled(props);
                 return (
                     <EntityActionButton key={action.key ?? action.name ?? index} action={action} enabled={isEnabled} props={props}/>

package/src/components/HomePage/ContentHomePage.tsx

@@ -63,14 +63,23 @@ export function ContentHomePage({
         onNavigationEntriesUpdate = () => {}
     } = navigationStateController.topLevelNavigation || {};
 
-    // Studio mode shows view-type entries (devViews) + admin entries (Users/Roles).
-    // Content mode shows collections, admin entries (Users/Roles), and custom entries — 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));
+        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 rawNavigationEntries = useMemo(() => {
         if (adminModeController.mode === "studio") {
             return unFilteredNavigationEntries.filter(e => e.type === "view" || e.type === "admin");
         }
-        return unFilteredNavigationEntries.filter(e => e.type !== "view");
-    }, [unFilteredNavigationEntries, adminModeController.mode]);
+        return unFilteredNavigationEntries.filter(e => e.type !== "view" || !studioViewSlugs.has(e.slug));
+    }, [unFilteredNavigationEntries, adminModeController.mode, studioViewSlugs]);
 
     const groupOrderFromNavController = useMemo(() => {
         const entryGroups = new Set(rawNavigationEntries.map(e => e.group).filter(Boolean));

package/src/components/RebaseCMS.tsx

@@ -10,11 +10,12 @@ import type { RebaseCMSConfig } from "@rebasepro/types";
  * is auto-wired as a native feature (slots, provider, Studio view) without
  * needing any external plugin.
  */
-export function RebaseCMS({ collections, homePage, entityViews, entityActions, plugins, collectionEditor, navigationGroupMappings }: RebaseCMSConfig) {
+export function RebaseCMS({ collections, views, homePage, entityViews, entityActions, plugins, collectionEditor, navigationGroupMappings }: RebaseCMSConfig) {
     const dispatch = useRebaseRegistryDispatch();
 
     useLayoutEffect(() => {
         dispatch.registerCMS({ collections,
+views,
 homePage,
 entityViews,
 entityActions,
@@ -22,7 +23,7 @@ plugins,
 collectionEditor,
 navigationGroupMappings });
         return () => dispatch.unregisterCMS();
-    }, [dispatch, collections, homePage, entityViews, entityActions, plugins, collectionEditor, navigationGroupMappings]);
+    }, [dispatch, collections, views, homePage, entityViews, entityActions, plugins, collectionEditor, navigationGroupMappings]);
 
     return null;
 }

package/src/components/RebaseNavigation.tsx

@@ -1,4 +1,4 @@
-import React, { useMemo, lazy, Suspense } from "react";
+import React, { useMemo, useRef, useEffect, lazy, Suspense } from "react";
 import {
     useRebaseRegistry,
     useRebaseContext,
@@ -7,10 +7,14 @@ import {
     useAdminModeController,
     useBuildLocalConfigurationPersistence,
     useRebaseClient,
+    useData,
+    useDataSources,
     StudioBridgeRegistryProvider,
     useBridgeRegistration,
-    CustomizationControllerContext
+    CustomizationControllerContext,
+    RebaseDataContext
 } from "@rebasepro/core";
+import { buildRoutedRebaseData, resolveDataSource } from "@rebasepro/common";
 import { CircularProgressCenter } from "@rebasepro/ui";
 import type { AppView, CollectionEditorOptions, EntityCustomView, EntityAction, EntityCollection, RebasePlugin } from "@rebasepro/types";
 import type { CollectionRegistryController } from "@rebasepro/types";
@@ -35,8 +39,8 @@ import { ConfigControllerProvider } from "../collection_editor/ConfigControllerP
 
 // Lazy-load the schema view — only fetched when studio schema tool is active
 const CollectionsStudioView = lazy(() =>
-    import("../collection_editor/ui/collection_editor/CollectionsStudioView")
-        .then(m => ({ default: m.CollectionsStudioView }))
+    import("../collection_editor/ui/collection_editor/RouterCollectionsStudioView")
+        .then(m => ({ default: m.RouterCollectionsStudioView }))
 );
 
 export interface RebaseNavigationProps {
@@ -86,7 +90,24 @@ export function RebaseNavigation({ children }: RebaseNavigationProps) {
     // ── Build the navigation controllers ──────────────────────────────
     const collectionsBuilder = useMemo(() => Array.isArray(cmsCollections) ? () => [...cmsCollections] : cmsCollections, [cmsCollections]);
 
-    const collectionRegistryController = useBuildCollectionRegistryController({ userConfigPersistence });
+    const dataSources = useDataSources();
+    const collectionRegistryController = useBuildCollectionRegistryController({ userConfigPersistence, dataSources: dataSources.registry });
+
+    // ── Multi-data-source routing ─────────────────────────────────────
+    // Combine the default data source (server transport) with the registered
+    // direct/custom sources from <Rebase> and route each collection by its
+    // resolved data-source key, looked up by path against the collection
+    // registry. A stable resolver ref keeps the routed data instance
+    // referentially stable across registry rebuilds, so data-effect
+    // dependencies don't thrash.
+    const defaultData = useData();
+    const getCollectionRef = useRef(collectionRegistryController.getCollection);
+    getCollectionRef.current = collectionRegistryController.getCollection;
+    const routedData = useMemo(() => buildRoutedRebaseData({
+        defaultData,
+        sources: dataSources.sources,
+        resolveKey: (slugOrPath) => resolveDataSource(getCollectionRef.current(slugOrPath), dataSources.registry).key
+    }), [defaultData, dataSources]);
 
     const urlController = useBuildUrlController({
         basePath: "/",
@@ -102,6 +123,26 @@ export function RebaseNavigation({ children }: RebaseNavigationProps) {
         [cmsCollections]
     );
 
+    // ── Dev-only data-source sanity check ─────────────────────────────
+    // Warn about data sources declared with a direct/custom transport that
+    // have no client-side driver — these silently fall back to the default
+    // (server) source, a common source of misrouting. Unambiguous: it never
+    // false-positives on server-mediated sources (which intentionally have
+    // no client driver).
+    useEffect(() => {
+        if (process.env.NODE_ENV === "production") return;
+        const { registry, sources } = dataSources;
+        const missing = Object.values(registry)
+            .filter((d) => (d.transport === "direct" || d.transport === "custom") && !sources[d.key])
+            .map((d) => d.key);
+        if (missing.length > 0) {
+            console.warn(
+                `[Rebase] These data source(s) declare a direct/custom transport but have no client-side driver and will fall back to the default data source: ${missing.map(k => `"${k}"`).join(", ")}. ` +
+                `Provide a \`driver\` for them in \`dataSources\` on <Rebase>.`
+            );
+        }
+    }, [dataSources]);
+
     const internalConfigController = useLocalCollectionsConfigController(
         rebaseClient,
         resolvedCollections,
@@ -120,6 +161,7 @@ export function RebaseNavigation({ children }: RebaseNavigationProps) {
         return {
             slug: "schema",
             name: "Edit collections",
+            group: "Database",
             icon: "LayoutList",
             nestedRoutes: true,
             view: (
@@ -136,13 +178,30 @@ export function RebaseNavigation({ children }: RebaseNavigationProps) {
         return base;
     }, [registry.studioConfig?.devViews, schemaView]);
 
+    // Merge CMS-registered views with Studio dev views.
+    // Order: CMS views (developer's primary content) → Studio dev views (tooling).
+    // Plugin views are merged later inside resolveAppViews.
+    const cmsViews = registry.cmsConfig?.views;
+    const mergedViews = useMemo(() => {
+        if (!cmsViews) return devViews;
+        if (Array.isArray(cmsViews) && cmsViews.length === 0) return devViews;
+        // When cmsViews is a builder function, wrap it to append devViews after resolution
+        if (typeof cmsViews === "function") {
+            return async (params: Parameters<typeof cmsViews>[0]) => {
+                const resolved = await cmsViews(params) ?? [];
+                return [...resolved, ...devViews];
+            };
+        }
+        return [...cmsViews, ...devViews];
+    }, [cmsViews, devViews]);
+
     const navigationStateController = useBuildNavigationStateController({
         plugins: registry.cmsConfig?.plugins ?? EMPTY_PLUGINS,
         collections: collectionsBuilder,
-        views: devViews,
+        views: mergedViews,
         navigationGroupMappings: registry.cmsConfig?.navigationGroupMappings,
         authController: context.authController!,
-        data: context.data,
+        data: routedData,
         collectionRegistryController,
         urlController,
         adminMode: adminModeController?.mode
@@ -175,7 +234,11 @@ export function RebaseNavigation({ children }: RebaseNavigationProps) {
     }, [parentCustomizationController, registry.cmsConfig?.entityViews, registry.cmsConfig?.entityActions]);
 
     // ── Inner content with all context providers ──────────────────────
+    // Re-provide RebaseDataContext with the routed data so that every CMS
+    // consumer (list/entity views, references, board, import/export, and
+    // `context.data`) is routed to the correct driver by collection path.
     const navigationContent = (
+        <RebaseDataContext.Provider value={routedData}>
         <CustomizationControllerContext.Provider value={enrichedCustomizationController}>
         <StudioBridgeRegistryProvider>
             <CollectionRegistryContext.Provider value={collectionRegistryController}>
@@ -194,6 +257,7 @@ export function RebaseNavigation({ children }: RebaseNavigationProps) {
             </CollectionRegistryContext.Provider>
         </StudioBridgeRegistryProvider>
         </CustomizationControllerContext.Provider>
+        </RebaseDataContext.Provider>
     );
 
     // ── Wrap with ConfigControllerProvider when collection editor is enabled ──

package/src/components/SelectableTable/SelectableTable.tsx

@@ -2,7 +2,7 @@ import { createSelectionStore } from "./SelectionStore";
 import type { Property } from "@rebasepro/types";
 import React, { useCallback, useEffect, useMemo, useRef } from "react";
 import { CollectionSize, Entity, EntityRelation, EntityTableController, FilterValues, SelectedCellProps } from "@rebasepro/types";
-import { CellRendererParams, VirtualTable, VirtualTableColumn, VirtualTableFilterValues, OnRowClickParams, VirtualTableWhereFilterOp } from "@rebasepro/ui";
+import { CellRendererParams, TableView, VirtualTableColumn, VirtualTableFilterValues, OnRowClickParams, VirtualTableWhereFilterOp } from "@rebasepro/ui";
 import { enumToObjectEntries } from "@rebasepro/common";
 import { DEFAULT_PAGE_SIZE, EntityCollectionTableController, OnCellValueChange, OnColumnResizeParams } from "@rebasepro/core";
 import { FilterFormFieldProps } from "@rebasepro/ui";
@@ -244,7 +244,7 @@ export const SelectableTable = function SelectableTable<M extends Record<string,
             <div className="h-full w-full flex flex-col bg-white dark:bg-surface-900"
                 ref={ref}>
 
-                <VirtualTable
+                 <TableView
                     data={data as unknown as Record<string, unknown>[]}
                     columns={columns}
                     cellRenderer={(props) => cellRenderer(props as unknown as CellRendererParams<Entity<M>>)}

package/src/components/SideDialogs.tsx

@@ -179,13 +179,6 @@ function SideDialogView({
                     style={{ zIndex: 45 + panelIndex * 10 }}
                     onOpenChange={(open) => {
                         if (!open) {
-                            // Check if any suggestion menu is visible in DOM
-                            const suggestionMenu = document.querySelector("[data-suggestion-menu=\"true\"]");
-                            if (suggestionMenu && window.getComputedStyle(suggestionMenu).visibility !== "hidden") {
-                                // Don't close the sheet if a suggestion menu is visible
-                                // Let Tiptap handle closing the menu first
-                                return;
-                            }
                             onCloseRequest();
                         }
                     }}

package/src/components/common/default_entity_actions.tsx

@@ -36,7 +36,7 @@ export const editEntityAction: EntityAction = {
 
         highlightEntity?.(entity);
 
-        context.analyticsController?.onAnalyticsEvent?.("entity_click", {
+        context?.analyticsController?.onAnalyticsEvent?.("entity_click", {
             path: entity.path,
             entityId: entity.id
         });
@@ -62,7 +62,7 @@ export const editEntityAction: EntityAction = {
             path: newFullIdPath,
             sideEntityController,
             onClose: () => unhighlightEntity?.(entity),
-            navigation: context.urlController!,
+            navigation: context?.urlController!,
             selectedTab: defaultSelectedView
         });
 
@@ -92,7 +92,7 @@ export const copyEntityAction: EntityAction = {
             throw new Error("INTERNAL: copyEntityAction: sideEntityController is undefined");
         }
         highlightEntity?.(entity);
-        context.analyticsController?.onAnalyticsEvent?.("copy_entity_click", {
+        context?.analyticsController?.onAnalyticsEvent?.("copy_entity_click", {
             path: entity.path,
             entityId: entity.id
         });
@@ -106,7 +106,7 @@ export const copyEntityAction: EntityAction = {
             copy: true,
             sideEntityController,
             onClose: () => unhighlightEntity?.(entity),
-            navigation: context.urlController!
+            navigation: context?.urlController!
         });
 
         return Promise.resolve(undefined);
@@ -131,7 +131,7 @@ export const deleteEntityAction: EntityAction = {
         if (!entity) {
             throw new Error("INTERNAL: deleteEntityAction: Entity is undefined");
         }
-        if (!context.dialogsController) {
+        if (!context?.dialogsController) {
             throw new Error("INTERNAL: deleteEntityAction: context.dialogsController is undefined");
         }
         const { closeDialog } = context.dialogsController.open({
@@ -146,14 +146,14 @@ export const deleteEntityAction: EntityAction = {
                     callbacks={collection.callbacks}
                     open={open}
                     onEntityDelete={() => {
-                        context.analyticsController?.onAnalyticsEvent?.("single_entity_deleted", {
+                        context?.analyticsController?.onAnalyticsEvent?.("single_entity_deleted", {
                             path
                         });
                         selectionController?.setSelectedEntities(selectionController.selectedEntities.filter(e => e.id !== entity.id));
                         onCollectionChange?.();
                         // In full-screen mode, navigateBack would go to the deleted entity's
                         // detail URL, which no longer exists. Navigate to the parent collection instead.
-                        if (openEntityMode === "full_screen" && context.urlController) {
+                        if (openEntityMode === "full_screen" && context?.urlController) {
                             const collectionUrl = context.urlController.buildUrlCollectionPath(path);
                             context.urlController.navigate(collectionUrl, { replace: true });
                         } else {
@@ -258,7 +258,7 @@ export const resetPasswordAction: EntityAction = {
         if (!entity) {
             throw new Error("INTERNAL: resetPasswordAction: Entity is undefined");
         }
-        if (!context.dialogsController) {
+        if (!context?.dialogsController) {
             throw new Error("INTERNAL: resetPasswordAction: context.dialogsController is undefined");
         }
 
@@ -272,7 +272,7 @@ export const resetPasswordAction: EntityAction = {
             roles: entity.values?.roles as string[] || []
         };
 
-        const { closeDialog } = context.dialogsController.open({
+        const { closeDialog } = context!.dialogsController.open({
             key: "reset_password_dialog_" + entity.id,
             Component: ({ open }) => (
                 <ResetPasswordActionDialog

package/src/contexts/BreacrumbsContext.tsx

@@ -22,14 +22,23 @@ export const BreadcrumbsProvider: React.FC<BreadcrumbsProviderProps> = ({ childr
     const set = useCallback((props: {
         breadcrumbs: BreadcrumbEntry[];
     }) => {
-        setBreadcrumbs(prev => props.breadcrumbs.map(newEntry => {
-            const prevEntry = newEntry.id ? prev.find(p => p.id === newEntry.id) : undefined;
-            if (prevEntry && newEntry.count === null && typeof prevEntry.count === "number") {
-                return { ...newEntry,
+        setBreadcrumbs(prev => {
+            const next = props.breadcrumbs.map(newEntry => {
+                const prevEntry = newEntry.id ? prev.find(p => p.id === newEntry.id) : undefined;
+                if (prevEntry && newEntry.count === null && typeof prevEntry.count === "number") {
+                    return { ...newEntry,
 count: prevEntry.count };
+                }
+                return newEntry;
+            });
+            // Bail out if nothing changed — return same reference to skip re-render
+            if (prev.length === next.length && prev.every((p, i) =>
+                p.title === next[i].title && p.url === next[i].url && p.id === next[i].id && p.count === next[i].count
+            )) {
+                return prev;
             }
-            return newEntry;
-        }));
+            return next;
+        });
     }, []);
 
     const updateCount = useCallback((id: string, count: number | null | undefined) => {

package/src/editor/selectors/ai-selector.tsx

@@ -36,7 +36,6 @@
 //   },
 // ];
 //
-// //TODO: I think it makes more sense to create a custom Tiptap extension for this functionality https://tiptap.dev/docs/editor/ai/introduction
 //
 // interface AISelectorProps {
 //   open: boolean;