@rebasepro/admin 0.6.1 → 0.8.0

package/src/components/EntityEditViewFormActions.tsx

@@ -3,7 +3,7 @@ import type { EntityCollection } from "@rebasepro/types";
 import type { FormContext } from "../types/fields";
 import type { EntityAction, EntityActionClickProps, SideEntityController } from "@rebasepro/types";
 import React, { useMemo } from "react";
-import { Entity, RebaseContext } from "@rebasepro/types";
+import { Entity, getCollectionDataPath, RebaseContext } from "@rebasepro/types";
 import type { EntityFormActionsProps } from "../types/components/EntityFormActionsProps";
 import { copyEntityAction, deleteEntityAction } from "../components";
 import { mergeEntityActions } from "../util/entity_actions";
@@ -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,10 +164,11 @@ 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,
-                    path: collection.slug,
+                    path: getCollectionDataPath(collection),
                     collection: collection,
                     context,
                     sideEntityController,
@@ -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")}
@@ -286,14 +292,14 @@ function buildSideActions<M extends Record<string, unknown>>({
                 const props = {
                     view: "form",
                     entity,
-                    path: collection.slug,
+                    path: getCollectionDataPath(collection),
                     collection: collection,
                     context,
                     sideEntityController,
                     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" && studioViewSlugs.has(e.slug)) || 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,19 +10,19 @@ 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, collectionEditor, navigationGroupMappings }: RebaseCMSConfig) {
     const dispatch = useRebaseRegistryDispatch();
 
     useLayoutEffect(() => {
         dispatch.registerCMS({ collections,
+views,
 homePage,
 entityViews,
 entityActions,
-plugins,
 collectionEditor,
 navigationGroupMappings });
         return () => dispatch.unregisterCMS();
-    }, [dispatch, collections, homePage, entityViews, entityActions, plugins, collectionEditor, navigationGroupMappings]);
+    }, [dispatch, collections, views, homePage, entityViews, entityActions, 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,32 @@ 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 parentCustomizationController = useCustomizationController();
+
     const navigationStateController = useBuildNavigationStateController({
-        plugins: registry.cmsConfig?.plugins ?? EMPTY_PLUGINS,
+        plugins: parentCustomizationController.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
@@ -154,7 +215,6 @@ export function RebaseNavigation({ children }: RebaseNavigationProps) {
     // automatically merged. We re-provide an enriched controller here so that
     // downstream consumers (EntityEditView, side panels, etc.) can resolve
     // string-keyed entity views like "blog_preview".
-    const parentCustomizationController = useCustomizationController();
     const enrichedCustomizationController = useMemo(() => {
         const cmsEntityViews = (registry.cmsConfig?.entityViews ?? []) as EntityCustomView[];
         const cmsEntityActions = (registry.cmsConfig?.entityActions ?? []) as EntityAction[];
@@ -175,7 +235,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 +258,7 @@ export function RebaseNavigation({ children }: RebaseNavigationProps) {
             </CollectionRegistryContext.Provider>
         </StudioBridgeRegistryProvider>
         </CustomizationControllerContext.Provider>
+        </RebaseDataContext.Provider>
     );
 
     // ── Wrap with ConfigControllerProvider when collection editor is enabled ──

package/src/components/RelationSelector.tsx

@@ -24,7 +24,7 @@ import {
 import * as React from "react";
 import { useCallback, useEffect, useRef, useState } from "react";
 import { Command as CommandPrimitive } from "cmdk";
-import { Entity, EntityRelation, FilterValues, Relation } from "@rebasepro/types";
+import { Entity, EntityRelation, FilterValues, Relation, getCollectionDataPath } from "@rebasepro/types";
 import { EntityPreviewData } from "./EntityPreview";
 import { useData, useRelationSelector } from "@rebasepro/core";
 import { useSideEntityController } from "../hooks/useSideEntityController";
@@ -115,7 +115,7 @@ export const RelationSelector = React.forwardRef<
             loadMore,
             entityToRelationItem
         } = useRelationSelector({
-            path: collection.slug,
+            path: getCollectionDataPath(collection),
             collection,
             fixedFilter,
             pageSize

package/src/components/SelectableTable/SelectableTable.tsx

@@ -1,8 +1,8 @@
-import { createSelectionStore } from "./SelectionStore";
+import { createSelectionStore, AdminSelectedCell } 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";
@@ -192,7 +192,15 @@ export const SelectableTable = function SelectableTable<M extends Record<string,
 
     const select = useCallback((cell?: SelectedCellProps<M>) => {
         setLocalSelectedCell(cell);
-        selectionStore.select(cell);
+        if (cell) {
+            selectionStore.select({
+                ...cell,
+                columnKey: cell.propertyKey,
+                rowId: cell.entityId
+            } as AdminSelectedCell);
+        } else {
+            selectionStore.select(undefined);
+        }
     }, [selectionStore]);
 
     const unselect = useCallback(() => {
@@ -244,7 +252,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>>)}
@@ -255,7 +263,7 @@ export const SelectableTable = function SelectableTable<M extends Record<string,
                     onColumnResize={onColumnResize}
                     rowHeight={getRowHeight(size)}
                     loading={dataLoading}
-                    filter={filterValues}
+                    filter={filterValues as any}
                     onFilterUpdate={setFilterValues ? onFilterUpdate : undefined}
                     sortBy={sortBy}
                     onSortByUpdate={setSortBy as ((sortBy?: [string, "asc" | "desc"]) => void)}

package/src/components/SelectableTable/SelectionStore.ts

@@ -1,64 +1,34 @@
 import { useSyncExternalStore, useCallback, useRef } from "react";
 import { SelectedCellProps } from "@rebasepro/types";
+import {
+    createVirtualTableSelectionStore,
+    VirtualTableSelectionStore,
+    SelectedCell
+} from "@rebasepro/ui";
+
+export interface AdminSelectedCell extends SelectedCell {
+    entityPath: string;
+    entityId: string | number;
+    propertyKey: string;
+    cellRect: DOMRect;
+    width: number;
+    height: number;
+}
 
-/**
- * A ref-based selection store that avoids React context re-renders.
- *
- * The problem with putting `selectedCell` in a React context value is that
- * ANY cell selection change triggers a context value change, which forces
- * ALL consumers (every PropertyTableCell in the table) to re-render.
- * This causes the DOM to be replaced between mousedown and click events,
- * breaking `alwaysInteractive` cells (like relation selectors) where the
- * user needs to click a button on the very first interaction.
- *
- * This store uses `useSyncExternalStore` so only cells whose `selected`
- * derivation actually changed will re-render.
- */
 export function createSelectionStore() {
-    let selectedCell: SelectedCellProps | undefined = undefined;
-    const listeners = new Set<() => void>();
-
-    function getSnapshot(): SelectedCellProps | undefined {
-        return selectedCell;
-    }
-
-    function subscribe(listener: () => void): () => void {
-        listeners.add(listener);
-        return () => listeners.delete(listener);
-    }
-
-    function select(cell: SelectedCellProps | undefined) {
-        selectedCell = cell;
-        listeners.forEach(l => l());
-    }
-
-    return { getSnapshot,
-subscribe,
-select };
+    return createVirtualTableSelectionStore<AdminSelectedCell>();
 }
 
-export type SelectionStore = ReturnType<typeof createSelectionStore>;
+export type SelectionStore = VirtualTableSelectionStore<AdminSelectedCell>;
 
-/**
- * Hook that subscribes a cell to the selection store and returns
- * whether THIS cell is selected. Only re-renders when the cell's
- * `selected` boolean actually changes (not on every store update).
- */
 export function useCellSelected(
     store: { getSnapshot: () => SelectedCellProps | undefined; subscribe: (listener: () => void) => () => void },
     propertyKey: string,
     entityPath: string,
     entityId: string | number
 ): boolean {
-    // Memoize a selector that derives a boolean from the store snapshot.
-    // useSyncExternalStore calls this on every store notification, but
-    // React only re-renders when the returned value !== the previous one.
-    const selectorRef = useRef({ propertyKey,
-entityPath,
-entityId });
-    selectorRef.current = { propertyKey,
-entityPath,
-entityId };
+    const selectorRef = useRef({ propertyKey, entityPath, entityId });
+    selectorRef.current = { propertyKey, entityPath, entityId };
 
     const getSnapshot = useCallback(() => {
         const cell = store.getSnapshot();

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

@@ -1,6 +1,12 @@
 import { CopyIcon, iconSize, KeyRoundIcon, PencilIcon, Trash2Icon } from "@rebasepro/ui";
 import type { EntityAction, User, UserCreationResult } from "@rebasepro/types";
-import { ConfirmationDialog, useSnackbarController, useTranslation, useRebaseClient, useAuthController } from "@rebasepro/core";
+import {
+    ConfirmationDialog,
+    useAuthController,
+    useRebaseClient,
+    useSnackbarController,
+    useTranslation
+} from "@rebasepro/core";
 import { DeleteEntityDialog } from "../DeleteEntityDialog";
 import { addRecentId } from "../EntityCollectionView/utils";
 import { navigateToEntity } from "../../util/navigation_utils";
@@ -8,7 +14,6 @@ import { resolveDefaultSelectedView } from "@rebasepro/common";
 import { CreationResultDialog } from "../admin/CreationResultDialog";
 import React, { useState } from "react";
 
-
 export const editEntityAction: EntityAction = {
     icon: <PencilIcon size={iconSize.smallest}/>,
     key: "edit",
@@ -36,7 +41,7 @@ export const editEntityAction: EntityAction = {
 
         highlightEntity?.(entity);
 
-        context.analyticsController?.onAnalyticsEvent?.("entity_click", {
+        context?.analyticsController?.onAnalyticsEvent?.("entity_click", {
             path: entity.path,
             entityId: entity.id
         });
@@ -55,6 +60,9 @@ export const editEntityAction: EntityAction = {
                     entityId: entity.id
                 }
             );
+        if (!context?.urlController) {
+            throw new Error("INTERNAL: editEntityAction: urlController is undefined");
+        }
         navigateToEntity({
             openEntityMode,
             collection,
@@ -62,7 +70,7 @@ export const editEntityAction: EntityAction = {
             path: newFullIdPath,
             sideEntityController,
             onClose: () => unhighlightEntity?.(entity),
-            navigation: context.urlController!,
+            navigation: context.urlController,
             selectedTab: defaultSelectedView
         });
 
@@ -92,12 +100,15 @@ 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
         });
 
         const usedPath = path ?? collection?.slug ?? entity.path;
+        if (!context?.urlController) {
+            throw new Error("INTERNAL: copyEntityAction: urlController is undefined");
+        }
         navigateToEntity({
             openEntityMode,
             collection,
@@ -106,7 +117,7 @@ export const copyEntityAction: EntityAction = {
             copy: true,
             sideEntityController,
             onClose: () => unhighlightEntity?.(entity),
-            navigation: context.urlController!
+            navigation: context.urlController
         });
 
         return Promise.resolve(undefined);
@@ -131,7 +142,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 +157,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 +269,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 +283,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/components/field_configs.tsx

@@ -9,7 +9,6 @@ import { KeyValueFieldBinding } from "../form/field_bindings/KeyValueFieldBindin
 import { MapFieldBinding } from "../form/field_bindings/MapFieldBinding";
 import { MarkdownEditorFieldBinding } from "../form/field_bindings/MarkdownEditorFieldBinding";
 import { MultiSelectFieldBinding } from "../form/field_bindings/MultiSelectFieldBinding";
-import { ReferenceAsStringFieldBinding } from "../form/field_bindings/ReferenceAsStringFieldBinding";
 import { ReferenceFieldBinding } from "../form/field_bindings/ReferenceFieldBinding";
 import { RepeatFieldBinding } from "../form/field_bindings/RepeatFieldBinding";
 import { SelectFieldBinding } from "../form/field_bindings/SelectFieldBinding";
@@ -220,17 +219,6 @@ Field: TextFieldBinding }
             ui: { Field: StorageUploadFieldBinding }
         }
     },
-    reference_as_string: {
-        key: "reference_as_string",
-        name: "Reference (as string)",
-        description: "The value refers to a different collection (it is saved as a string)",
-        Icon: LinkIcon,
-        color: "#154fb3",
-        property: {
-            type: "string",
-            ui: { Field: ReferenceAsStringFieldBinding }
-        }
-    },
     reference: {
         key: "reference",
         name: "Reference",
@@ -393,8 +381,6 @@ export function getDefaultFieldId(property: Property) {
             return "select";
         } else if (property.userSelect) {
             return "user_select";
-        } else if ((property as StringProperty).reference) {
-            return "reference_as_string";
         } else {
             return "text_field";
         }