@rebasepro/admin 0.14.1 → 0.14.2-canary.g27a129e

package/src/components/RebaseNavigation.tsx

@@ -1,4 +1,4 @@
-import React, { useMemo, useRef, useEffect, useCallback, useContext, lazy, Suspense } from "react";
+import React, { useMemo, useRef, useEffect, useCallback, useContext, Suspense } from "react";
 import {
     useRebaseRegistry,
     useRebaseContext,
@@ -16,9 +16,9 @@ import {
     RebaseDataContext
 } from "@rebasepro/app";
 import { buildRoutedRebaseData, resolveDataSource } from "@rebasepro/common";
-import { CircularProgressCenter } from "@rebasepro/ui";
+import { CircularProgressCenter, lazyChunk } from "@rebasepro/ui";
 
-import type { AppView, CollectionEditorOptions, EntityCustomView, EntityAction, RebasePlugin, AdminCollection } from "@rebasepro/admin-types";
+import type { AppView, CollectionCustomView, CollectionEditorOptions, EntityCustomView, EntityAction, RebasePlugin, AdminCollection } from "@rebasepro/admin-types";
 import type { CollectionRegistryController } from "@rebasepro/types";
 import type { UrlController, NavigationStateController } from "@rebasepro/admin-types";
 
@@ -41,7 +41,7 @@ import { ConfigControllerProvider } from "../collection_editor/ConfigControllerP
 import { useCollectionsConfigController } from "../collection_editor/useCollectionsConfigController";
 
 // Lazy-load the schema view — only fetched when studio schema tool is active
-const CollectionsStudioView = lazy(() =>
+const CollectionsStudioView = lazyChunk(() =>
     import("../collection_editor/ui/collection_editor/RouterCollectionsStudioView")
         .then(m => ({ default: m.RouterCollectionsStudioView }))
 );
@@ -260,7 +260,10 @@ export function RebaseNavigation({ children }: RebaseNavigationProps) {
     const enrichedCustomizationController = useMemo(() => {
         const cmsEntityViews = (registry.cmsConfig?.entityViews ?? []) as EntityCustomView[];
         const cmsEntityActions = (registry.cmsConfig?.entityActions ?? []) as EntityAction[];
-        if (cmsEntityViews.length === 0 && cmsEntityActions.length === 0) {
+        // Collection view modes ride the same channel, for the same reason:
+        // `admin.customViews: ["map"]` has to find the component somewhere.
+        const cmsCollectionViews = (registry.cmsConfig?.collectionViews ?? []) as CollectionCustomView[];
+        if (cmsEntityViews.length === 0 && cmsEntityActions.length === 0 && cmsCollectionViews.length === 0) {
             return parentCustomizationController;
         }
         return {
@@ -272,9 +275,13 @@ export function RebaseNavigation({ children }: RebaseNavigationProps) {
             entityActions: [
                 ...(parentCustomizationController.entityActions ?? []),
                 ...cmsEntityActions.filter(a => !(parentCustomizationController.entityActions ?? []).some(ea => ea.key === a.key))
+            ],
+            collectionViews: [
+                ...(parentCustomizationController.collectionViews ?? []),
+                ...cmsCollectionViews.filter(v => !(parentCustomizationController.collectionViews ?? []).some(cv => cv.key === v.key))
             ]
         };
-    }, [parentCustomizationController, registry.cmsConfig?.entityViews, registry.cmsConfig?.entityActions]);
+    }, [parentCustomizationController, registry.cmsConfig?.entityViews, registry.cmsConfig?.entityActions, registry.cmsConfig?.collectionViews]);
 
     // ── Inner content with all context providers ──────────────────────
     // Re-provide RebaseDataContext with the routed data so that every admin

package/src/form/field_bindings/MarkdownEditorFieldBinding.tsx

@@ -1,4 +1,4 @@
-import React, { lazy, Suspense, useCallback, useEffect, useMemo, useRef, useState } from "react";
+import React, { Suspense, useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { FieldHelperText } from "../components/FieldHelperText";
 import { LabelWithIconAndTooltip } from "../components/LabelWithIconAndTooltip";
 import { useAuthController, useStorageSource } from "@rebasepro/app";
@@ -13,6 +13,7 @@ import {
     fieldBackgroundHoverMixin,
     fieldBackgroundMixin,
     IconButton,
+    lazyChunk,
     Skeleton,
     XIcon
 } from "@rebasepro/ui";
@@ -22,7 +23,7 @@ import { randomString } from "@rebasepro/utils";
 
 // Lazy-load ProseMirror editor + markdown parser/serializer (~300KB)
 // Only fetched when a markdown field is actually rendered.
-const RichTextEditor = lazy(() => import("../../editor").then(m => ({ default: m.RichTextEditor })));
+const RichTextEditor = lazyChunk(() => import("../../editor").then(m => ({ default: m.RichTextEditor })));
 const loadMarkdownUtils = () => import("../../editor/markdown");
 let _markdownUtils: Awaited<ReturnType<typeof loadMarkdownUtils>> | null = null;
 const getMarkdownUtils = async () => {

package/src/util/resolutions.ts

@@ -1,6 +1,7 @@
 import { HistoryIcon } from "@rebasepro/ui";
 import React from "react";
-import type { CustomizationController, EntityAction, EntityCustomView } from "@rebasepro/admin-types";
+import type { CollectionCustomView, CustomizationController, EntityAction, EntityCustomView } from "@rebasepro/admin-types";
+import { VIEW_MODES } from "./view_mode";
 
 /**
  * Built-in entity views that are resolved by token name.
@@ -29,6 +30,34 @@ export function resolveEntityView(
     }
 }
 
+/**
+ * Resolve a collection's `admin.customViews` into the views it can actually
+ * render, dropping every entry that names a key nothing registered.
+ *
+ * Dropping is deliberate: an unresolvable key must not become a switcher entry
+ * that renders a blank panel. It falls out of `enabledViews` too, so a user
+ * whose saved view mode was removed lands on a built-in.
+ */
+export function resolveCollectionViews(
+    customViews: (string | CollectionCustomView<any>)[] | undefined,
+    contextCollectionViews?: CollectionCustomView<any>[]
+): CollectionCustomView<any>[] {
+    if (!customViews) return [];
+    const resolved: CollectionCustomView<any>[] = [];
+    const seen = new Set<string>();
+    for (const entry of customViews) {
+        const view = typeof entry === "string"
+            ? contextCollectionViews?.find((candidate) => candidate.key === entry)
+            : entry;
+        // A custom view keyed "table" would shadow a built-in in the switcher
+        // and be unreachable in the render chain, which checks built-ins first.
+        if (!view || VIEW_MODES.includes(view.key) || seen.has(view.key)) continue;
+        seen.add(view.key);
+        resolved.push(view);
+    }
+    return resolved;
+}
+
 export function resolveEntityAction<M extends Record<string, unknown>>(
     entityAction: string | EntityAction<M>,
     contextEntityActions?: EntityAction<M>[]

package/src/util/view_mode.ts

@@ -1,11 +1,12 @@
 
-import type { ViewMode, AdminCollection } from "@rebasepro/admin-types";
+import type { ViewMode, AdminCollection, CollectionCustomView } from "@rebasepro/admin-types";
 
 /**
  * Query param that carries the active collection view mode across navigations.
  */
 export const VIEW_MODE_PARAM = "__view";
 
+/** The view modes every collection has, before custom views are added. */
 export const VIEW_MODES: ViewMode[] = ["list", "table", "cards", "kanban"];
 
 export const DEFAULT_VIEW_MODE: ViewMode = "list";
@@ -14,20 +15,34 @@ export type OpenEntityMode = "side_panel" | "full_screen" | "split" | "dialog";
 
 export const DEFAULT_OPEN_ENTITY_MODE: OpenEntityMode = "split";
 
-export function isViewMode(value: string | null | undefined): value is ViewMode {
-    return Boolean(value) && VIEW_MODES.includes(value as ViewMode);
+/**
+ * Whether `value` names a view mode this collection can actually render.
+ *
+ * `customKeys` are the keys of the collection's resolved custom views. They
+ * have to be passed in rather than looked up: a custom view is registered per
+ * collection, so there is no global set to check against, and validating
+ * against the built-ins alone is what would send `?__view=map` to the table.
+ *
+ * Omitting them checks the built-ins only, which is the right answer for
+ * callers that have no collection in hand.
+ */
+export function isViewMode(value: string | null | undefined, customKeys?: readonly string[]): value is ViewMode {
+    if (!value) return false;
+    return VIEW_MODES.includes(value as ViewMode) || Boolean(customKeys?.includes(value));
 }
 
 /**
- * Read the active view mode from a query string, if it holds a valid one.
+ * Read the active view mode from a query string, if it holds one this
+ * collection can render.
  *
  * @param search a query string (e.g. `location.search`). Falls back to the
  *        current browser location when omitted.
+ * @param customKeys keys of the collection's custom views, if any.
  */
-export function getViewModeFromSearch(search?: string): ViewMode | null {
+export function getViewModeFromSearch(search?: string, customKeys?: readonly string[]): ViewMode | null {
     const source = search ?? (typeof window !== "undefined" ? window.location.search : "");
     const value = new URLSearchParams(source).get(VIEW_MODE_PARAM);
-    return isViewMode(value) ? value : null;
+    return isViewMode(value, customKeys) ? value : null;
 }
 
 /**
@@ -42,7 +57,14 @@ export function getViewModeFromSearch(search?: string): ViewMode | null {
  *        current browser location.
  */
 export function withViewMode(url: string, search?: string): string {
-    const viewMode = getViewModeFromSearch(search);
+    // Carries whatever the param holds rather than validating it. These call
+    // sites are navigations — they have no collection in hand, so they cannot
+    // know whether `map` is one of *this* collection's custom views. Checking
+    // against the built-ins here would drop every custom view on the first
+    // record click. The binding validates on read, which is where the answer
+    // is knowable.
+    const source = search ?? (typeof window !== "undefined" ? window.location.search : "");
+    const viewMode = new URLSearchParams(source).get(VIEW_MODE_PARAM);
     if (!viewMode) return url;
 
     // Preserve any hash — the param belongs to the query, which precedes it.
@@ -101,16 +123,24 @@ export function withListState(url: string, search?: string): string {
 export function resolveViewMode({
     collection,
     search,
-    savedViewMode
+    savedViewMode,
+    customKeys
 }: {
     collection?: Pick<AdminCollection<any>, "defaultViewMode">;
     search?: string;
     savedViewMode?: ViewMode | null;
+    /** Keys of the collection's resolved custom views. */
+    customKeys?: readonly string[];
 }): ViewMode {
-    const fromUrl = getViewModeFromSearch(search);
+    const fromUrl = getViewModeFromSearch(search, customKeys);
     if (fromUrl) return fromUrl;
-    if (isViewMode(savedViewMode)) return savedViewMode;
-    return collection?.defaultViewMode ?? DEFAULT_VIEW_MODE;
+    if (isViewMode(savedViewMode, customKeys)) return savedViewMode;
+    // A `defaultViewMode` naming a custom view that is no longer registered
+    // would leave the collection on a mode nothing renders, so it gets the
+    // same check the other two sources get.
+    const configured = collection?.defaultViewMode;
+    if (isViewMode(configured, customKeys)) return configured;
+    return DEFAULT_VIEW_MODE;
 }
 
 /**
@@ -127,12 +157,19 @@ export function resolveViewMode({
  */
 export function resolveOpenEntityMode({
     collection,
-    viewMode
+    viewMode,
+    customView
 }: {
     collection?: Pick<AdminCollection<any>, "openEntityMode">;
     viewMode?: ViewMode;
+    /** The resolved custom view, when `viewMode` names one. */
+    customView?: Pick<CollectionCustomView, "openEntityMode">;
 }): OpenEntityMode {
     if (collection?.openEntityMode) return collection.openEntityMode;
+    // A custom view gets to say, because only it knows whether it owns its
+    // surface. Falls to the board's answer: a map or a calendar keeps its
+    // canvas and shows the record over it, where "split" would halve it.
+    if (customView) return customView.openEntityMode ?? "side_panel";
     if (viewMode === "kanban") return "side_panel";
     if (viewMode === "table" || viewMode === "cards") return "full_screen";
     return DEFAULT_OPEN_ENTITY_MODE;