@rebasepro/admin 0.13.0 → 0.13.1-canary.g06dbe5b

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@rebasepro/admin",
   "type": "module",
-  "version": "0.13.0",
+  "version": "0.13.1-canary.g06dbe5b",
   "description": "Rebase CMS — content management views, forms, and routing",
   "funding": {
     "url": "https://github.com/sponsors/rebaseco"
@@ -83,14 +83,14 @@
     "react-dropzone": "^19.1.1",
     "react-use-measure": "^2.1.7",
     "zod": "^4.4.3",
-    "@rebasepro/admin-types": "0.13.0",
-    "@rebasepro/app": "0.13.0",
-    "@rebasepro/common": "0.13.0",
-    "@rebasepro/inference": "0.13.0",
-    "@rebasepro/forms": "0.13.0",
-    "@rebasepro/ui": "0.13.0",
-    "@rebasepro/types": "0.13.0",
-    "@rebasepro/utils": "0.13.0"
+    "@rebasepro/admin-types": "0.13.1-canary.g06dbe5b",
+    "@rebasepro/app": "0.13.1-canary.g06dbe5b",
+    "@rebasepro/common": "0.13.1-canary.g06dbe5b",
+    "@rebasepro/inference": "0.13.1-canary.g06dbe5b",
+    "@rebasepro/ui": "0.13.1-canary.g06dbe5b",
+    "@rebasepro/utils": "0.13.1-canary.g06dbe5b",
+    "@rebasepro/forms": "0.13.1-canary.g06dbe5b",
+    "@rebasepro/types": "0.13.1-canary.g06dbe5b"
   },
   "peerDependencies": {
     "react": ">=19.2.7",
@@ -107,6 +107,7 @@
     "@types/react-dom": "^19.2.3",
     "@types/react-measure": "^2.0.12",
     "@vitejs/plugin-react": "^6.0.4",
+    "fast-check": "^4.9.0",
     "jest": "^30.4.2",
     "react-router": "^8.3.0",
     "ts-jest": "^29.4.12",

package/src/collection_editor/serializable_types.ts

@@ -155,6 +155,7 @@ export interface SerializableAdminRelationOptions extends SerializableAdminBaseO
     fixedFilter?: FilterValues<string>;
     includeId?: boolean;
     includeEntityLink?: boolean;
+    renderInForm?: boolean;
 }
 
 /** JSON-serializable version of `AdminArrayOptions`. */

package/src/collection_editor/ui/collection_editor/CollectionsStudioView.tsx

@@ -17,6 +17,7 @@ import { CollectionsConfigController } from "../../types/config_controller";
 import { CollectionStudioView } from "./CollectionStudioView";
 import type { CollectionEditorExtensionProps } from "../../extensibility_types";
 import type { AdminCollection } from "@rebasepro/admin-types";
+import { readStoredString, writeStoredString } from "@rebasepro/utils";
 
 export interface CollectionsStudioViewProps extends CollectionEditorExtensionProps {
     configController: CollectionsConfigController;
@@ -77,21 +78,18 @@ export function CollectionsStudioView({
     const collections = collectionsProp ?? configController.collections ?? [];
 
     // ── Sidebar sizing ──────────────────────────────────────────────────
+    // Checked, not just parsed: `parseFloat` answers NaN for anything it cannot
+    // read, and a NaN pane size lays the sidebar out to nothing — with the bad
+    // value still in storage on reload. `SplitListView.getSavedPanelSize` is the
+    // same read, done this way.
     const [sidebarSize, setSidebarSize] = useState(() => {
-        try {
-            const saved = localStorage.getItem("rebase_collections_editor_sidebar_size");
-            return saved !== null ? parseFloat(saved) : 25;
-        } catch (e) {
-            return 25;
-        }
+        const saved = readStoredString("rebase_collections_editor_sidebar_size");
+        const parsed = saved === null ? NaN : parseFloat(saved);
+        return Number.isFinite(parsed) && parsed > 0 && parsed < 100 ? parsed : 25;
     });
 
     useEffect(() => {
-        try {
-            localStorage.setItem("rebase_collections_editor_sidebar_size", sidebarSize.toString());
-        } catch (e) {
-            // ignore local storage error
-        }
+        writeStoredString("rebase_collections_editor_sidebar_size", sidebarSize.toString());
     }, [sidebarSize]);
 
     return (

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

@@ -111,7 +111,7 @@ export function MapPropertyField({ disabled, getData, allowDataInference, proper
                     position={"start"}
                     size={"medium"}
                     label={t("spread_children_as_columns")}
-                    onValueChange={(v) => setFieldValue("ui.spreadChildren", v)}
+                    onValueChange={(v) => setFieldValue("admin.spreadChildren", v)}
                     value={values.admin?.spreadChildren ?? false}
                 />
                 <FieldCaption>

package/src/collection_editor/ui/collection_editor/properties/advanced/AdvancedPropertyValidation.tsx

@@ -7,8 +7,11 @@ export function AdvancedPropertyValidation({ disabled }: {
     disabled: boolean
 }) {
 
-    const hideFromCollection = "ui.hideFromCollection";
-    const readOnly = "ui.readOnly";
+    // `ui` was renamed to `admin` in 0.11. Nothing reads `ui.*` — the toggles did
+    // nothing — and the boot validator treats the old name as a removed key, so a
+    // save through here left a project that would not start.
+    const hideFromCollection = "admin.hideFromCollection";
+    const readOnly = "admin.readOnly";
 
     return (
 

package/src/collection_editor/useLocalCollectionsConfigController.tsx

@@ -202,13 +202,18 @@ collectionData });
             await request("/collection/delete", { collectionId: id });
         },
 
+        // The follow-up write carries exactly one key, and `partial` is what says
+        // so. Read as a whole-collection save it deletes everything it does not
+        // mention — `securityRules` first, which then falls back to the
+        // directory default and widens who can read the collection.
         saveProperty: async ({ path, propertyKey, property, newPropertiesOrder }: SavePropertyParams) => {
             await request("/property/save", { collectionId: path,
 propertyKey,
 propertyConfig: property });
             if (newPropertiesOrder) {
                 await request("/collection/save", { collectionId: path,
-collectionData: { propertiesOrder: newPropertiesOrder } });
+collectionData: { propertiesOrder: newPropertiesOrder },
+partial: true });
             }
         },
         deleteProperty: async ({ path, propertyKey, newPropertiesOrder }: DeletePropertyParams) => {
@@ -216,14 +221,16 @@ collectionData: { propertiesOrder: newPropertiesOrder } });
 propertyKey });
             if (newPropertiesOrder) {
                 await request("/collection/save", { collectionId: path,
-collectionData: { propertiesOrder: newPropertiesOrder } });
+collectionData: { propertiesOrder: newPropertiesOrder },
+partial: true });
             }
         },
 
         updatePropertiesOrder: async ({ collection, fullPath, newPropertiesOrder }: UpdatePropertiesOrderParams) => {
             const collectionId = (collection as AdminCollection & { id?: string }).id || fullPath.split("/").pop();
             await request("/collection/save", { collectionId,
-collectionData: { propertiesOrder: newPropertiesOrder } });
+collectionData: { propertiesOrder: newPropertiesOrder },
+partial: true });
         },
         updateKanbanColumnsOrder: async () => {
             // Kanban order mapping logic can be added later if needed natively.

package/src/components/AdditionalFieldValue.tsx

@@ -0,0 +1,68 @@
+import type { AdditionalFieldDelegate, RebaseContext } from "@rebasepro/admin-types";
+import type { Entity } from "@rebasepro/types";
+import React, { useEffect, useState } from "react";
+
+export interface AdditionalFieldValueProps<M extends Record<string, unknown>> {
+    field: AdditionalFieldDelegate<M>;
+    entity: Entity<M>;
+    context: RebaseContext;
+}
+
+/**
+ * Renders an `additionalFields` entry that supplies a `value` rather than a
+ * `Builder`.
+ *
+ * `value` is typed `string | number | Promise<string | number>`, and the promise
+ * arm has been part of that type from the start — the CSV export awaits it
+ * correctly. Every *renderer* called `.toString()` on the result instead, so an
+ * async value drew the literal text `[object Promise]` in the cell: a shape the
+ * type promised, that worked in one of its two consumers, and failed silently in
+ * the other. That is what made the obvious port of a FireCMS column — one that
+ * fetches a title from a subcollection — look supported and not be.
+ *
+ * Three call sites had the same three lines copied between them (the table cell,
+ * the form and the read-only record), which is why the bug reached all three.
+ * Now there is one.
+ */
+export function AdditionalFieldValue<M extends Record<string, unknown>>({
+    field,
+    entity,
+    context
+}: AdditionalFieldValueProps<M>) {
+
+    const [resolved, setResolved] = useState<string | number | undefined>(() => {
+        const value = field.value?.({ entity, context });
+        // A synchronous value is available on the first render, so it never
+        // flashes empty on its way in.
+        return isPromise(value) ? undefined : value;
+    });
+
+    useEffect(() => {
+        const value = field.value?.({ entity, context });
+        if (!isPromise(value)) {
+            setResolved(value);
+            return;
+        }
+
+        // The row may scroll out, or the record change, before this lands.
+        let live = true;
+        value.then(
+            result => {
+                if (live) setResolved(result);
+            },
+            error => {
+                if (live) setResolved(undefined);
+                console.warn(`[rebase] Additional field "${field.key}" failed to resolve:`, error);
+            }
+        );
+        return () => {
+            live = false;
+        };
+    }, [field, entity, context]);
+
+    return <>{resolved === undefined || resolved === null ? null : String(resolved)}</>;
+}
+
+function isPromise(value: unknown): value is Promise<string | number | undefined> {
+    return typeof (value as Promise<unknown> | undefined)?.then === "function";
+}

package/src/components/ClearFilterSortButton.tsx

@@ -1,13 +1,20 @@
-import { Button, FilterXIcon, iconSize, Tooltip } from "@rebasepro/ui";
+import { FilterXIcon, iconSize, IconButton, Tooltip } from "@rebasepro/ui";
 import { EntityTableController } from "@rebasepro/admin-types";
 import { useTranslation } from "@rebasepro/app";
 
 export function ClearFilterSortButton({
     tableController,
-    enabled
+    enabled,
+    compact
 }: {
     enabled: boolean;
-    tableController: EntityTableController
+    tableController: EntityTableController;
+    /**
+     * Toolbar showing icon-only controls (split view, or a layout too narrow
+     * for the filters button's label). Only decides the icon size, which
+     * follows that button — see `CollectionViewStartActions`.
+     */
+    compact?: boolean;
 }) {
     const { t } = useTranslation();
 
@@ -29,17 +36,19 @@ export function ClearFilterSortButton({
         }
         return (
             <Tooltip title={label}>
-                <Button
+                {/* An `IconButton`, like every other icon-only control in this
+                    toolbar. As a `Button` it was a rounded-md box with text
+                    padding sitting between two circular icon buttons. */}
+                <IconButton
                     size={"small"}
-                    variant={"text"}
                     aria-label={label}
                     onClick={() => {
                         tableController.clearFilter?.();
                         tableController.setSortBy?.(undefined);
                     }}
                 >
-                    <FilterXIcon size={iconSize.small}/>
-                </Button>
+                    <FilterXIcon size={compact ? iconSize.smallest : iconSize.small}/>
+                </IconButton>
             </Tooltip>
         );
     }

package/src/components/CollectionTableBinding/CollectionTableBinding.tsx

@@ -1,4 +1,5 @@
 import type { AdditionalFieldDelegate, AdminCollection } from "@rebasepro/admin-types";
+import { AdditionalFieldValue } from "../AdditionalFieldValue";
 import React, { useCallback, useMemo, useRef } from "react";
 import { Entity, User, Property } from "@rebasepro/types";
 import { CollectionSize, RebaseContext } from "@rebasepro/admin-types";
@@ -16,7 +17,7 @@ import { propertiesToColumns } from "./column_utils";
 import { ErrorView } from "@rebasepro/app";
 import { SelectableTable } from "../SelectableTable/SelectableTable";
 import { cls } from "@rebasepro/ui";
-import { getRowHeight } from "@rebasepro/app";
+import { getRowHeight, isDisabled } from "@rebasepro/app";
 import { getValueInPath } from "@rebasepro/utils";
 
 /**
@@ -146,7 +147,7 @@ export const CollectionTableBinding = function CollectionTableBinding<M extends
             propertyKey,
             entity
         }) ?? columnCustom?.resolvedProperty;
-        if (!property?.admin?.disabled) {
+        if (!property || !isDisabled(property)) {
             disabled = false;
         }
 
@@ -214,12 +215,10 @@ export const CollectionTableBinding = function CollectionTableBinding<M extends
 
         const child: React.ReactNode = Builder
             ? <Builder entity={entity} context={context}/>
-            : <>
-                {additionalField.value?.({
-                    entity,
-                    context: context as RebaseContext
-                })?.toString()}
-            </>;
+            : <AdditionalFieldValue
+                field={additionalField}
+                entity={entity}
+                context={context as RebaseContext}/>;
 
         return (
             <EntityTableCell

package/src/components/CollectionTableBinding/PropertyTableCell.tsx

@@ -18,7 +18,7 @@ import { EntityTableCellActions } from "./internal/EntityTableCellActions";
 import { useSelectableTableController } from "../SelectableTable/SelectableTableContext";
 import { useClearRestoreValue } from "../../form/useClearRestoreValue";
 import { getRowHeight } from "@rebasepro/app";
-import { isReadOnly } from "@rebasepro/app";
+import { isDisabled, isReadOnly } from "@rebasepro/app";
 import { TableRelationField } from "./fields/TableRelationField";
 import { TableRelationSelectorField } from "./fields/TableRelationSelectorField";
 
@@ -95,7 +95,7 @@ export const PropertyTableCell = React.memo<PropertyTableCellProps<any>>(
         const customPreview = Boolean(property.admin?.Preview);
         const readOnlyProperty = isReadOnly(property);
         const disabledTooltip: string | undefined = typeof property.admin?.disabled === "object" ? property.admin?.disabled.disabledMessage : undefined;
-        const disabled = readonly || disabledProp || Boolean(property.admin?.disabled);
+        const disabled = readonly || disabledProp || isDisabled(property);
 
         const validation = useMemo(() => mapPropertyToZod({
             property,

package/src/components/CollectionTableBinding/column_utils.tsx

@@ -39,15 +39,24 @@ export function propertiesToColumns<M extends Record<string, unknown>>({ propert
     const disabledFilter = Boolean(fixedFilter);
     return Object.entries<Property>(properties)
         .flatMap(([key, property]) => getColumnKeysForProperty(property, key))
-        .map(({
+        .flatMap(({
             key,
             disabled
         }) => {
-            const property = getResolvedPropertyInPath(properties, key) as Property;
-            if (!property)
-                throw Error("Internal error: no property found in path " + key);
+            const property = getResolvedPropertyInPath(properties, key) as Property | undefined;
+            // One unresolvable key used to throw, and this runs inside the
+            // memo that builds the table's columns — so a single bad column
+            // took down the header, the rows and the empty state together,
+            // leaving a blank pane with nothing to attribute it to. A column
+            // that cannot be resolved is one column the table cannot offer;
+            // say so and carry the rest. Same choice, and now the same
+            // behaviour, as `getSortablePropertyOptions` below.
+            if (!property) {
+                console.warn(`No property found in path "${key}" — skipping that column.`);
+                return [];
+            }
             const filterable = filterableProperty(property, false, engine);
-            return {
+            return [{
                 key: key as string,
                 align: getTableCellAlignment(property),
                 icon: getIconForProperty(property, "small"),
@@ -63,7 +72,7 @@ export function propertiesToColumns<M extends Record<string, unknown>>({ propert
                 AdditionalHeaderWidget: AdditionalHeaderWidget
                     ? ({ onHover }: { onHover: boolean }) => <AdditionalHeaderWidget property={property} propertyKey={key} onHover={onHover}/>
                     : undefined
-            } satisfies VirtualTableColumn;
+            } satisfies VirtualTableColumn];
         });
 }
 

package/src/components/CollectionTableBinding/internal/popup_field/PopupFormField.tsx

@@ -16,7 +16,7 @@ import { getPropertyInPath } from "../../../../util/property_utils";
 import { PropertyFieldBinding, zodToFormErrors } from "../../../../form";
 import { useAuthController, useCustomizationController, useData, useRebaseContext } from "@rebasepro/app";
 import type { OnCellValueChangeParams } from "@rebasepro/app";
-import { isReadOnly } from "@rebasepro/app";
+import { isDisabled, isReadOnly } from "@rebasepro/app";
 import type { AdminCollection } from "@rebasepro/admin-types";
 
 interface PopupFormFieldProps<M extends Record<string, unknown>> {
@@ -295,7 +295,7 @@ export function PopupFormFieldInternal<M extends Record<string, unknown>>({
     const fieldProps: PropertyFieldBindingProps<M> | undefined = propertyKey && property
         ? {
             propertyKey: propertyKey as string,
-            disabled: isSubmitting || isReadOnly(property) || !!property.admin?.disabled,
+            disabled: isSubmitting || isReadOnly(property) || isDisabled(property),
             property,
             includeDescription: false,
             underlyingValueHasChanged: false,

package/src/components/CollectionTableBinding/table_bindings.tsx

@@ -240,7 +240,13 @@ export function getTableBindingForProperty(
                     Component: RelationDialogBindingComponent,
                     allowScroll: false
                 };
-            } else {
+            } else if (selected) {
+                // Gated on `selected`, like the number and string editors above.
+                // This one mounts a live picker against the *target* collection,
+                // and the cell is rendered once per visible row: ungated, opening
+                // a table with one relation column fired a request — or, on the
+                // realtime path, a subscription — per row, for data nobody had
+                // asked to see. Unselected cells fall through to PropertyPreview.
                 return {
                     Component: RelationSelectorBindingComponent,
                     allowScroll: false

package/src/components/CollectionViewBinding/BoardCardBinding.tsx

@@ -6,7 +6,8 @@ import { PropertyPreview } from "../../preview";
 import { useAuthController, useCustomizationController } from "@rebasepro/app";
 import { IconForView } from "@rebasepro/app";
 import { BoardItemViewProps } from "@rebasepro/ui";
-import { useCollectionSlotKeys, resolveEntitySlots } from "./usePreviewSlots";
+import { useCollectionSlotKeys, useEntitySlots } from "./usePreviewSlots";
+import { SlotValue, TagChips } from "./SlotValue";
 import type { AdminCollection } from "@rebasepro/admin-types";
 
 export type BoardCardBindingProps<M extends Record<string, unknown> = Record<string, unknown>> = BoardItemViewProps<Entity<M>> & {
@@ -46,13 +47,10 @@ function BoardCardBindingInner<M extends Record<string, unknown> = Record<string
         customizationController.propertyConfigs
     );
 
-    const slots = useMemo(
-        () => resolveEntitySlots(
-            entity as Entity<Record<string, unknown>>,
-            collection as AdminCollection<Record<string, unknown>>,
-            slotKeys
-        ),
-        [entity, collection, slotKeys]
+    const slots = useEntitySlots(
+        entity as Entity<Record<string, unknown>>,
+        collection as AdminCollection<Record<string, unknown>>,
+        slotKeys
     );
 
     const handleClick = useCallback((e: React.MouseEvent) => {
@@ -126,13 +124,7 @@ function BoardCardBindingInner<M extends Record<string, unknown> = Record<string
                             selectionEnabled && "group-hover/card:opacity-30",
                             selected && "opacity-0"
                         )}>
-                            <PropertyPreview
-                                property={slots.image.property}
-                                propertyKey={slots.image.propertyKey}
-                                size="small"
-                                value={slots.image.value}
-                                fill={true}
-                            />
+                            <SlotValue slot={slots.image} size="small" fill={true}/>
                         </div>
                     ) : (
                         <div className={cls(
@@ -177,12 +169,7 @@ function BoardCardBindingInner<M extends Record<string, unknown> = Record<string
                     {/* Title slot */}
                     <div className="line-clamp-2 text-sm font-medium">
                         {slots.title ? (
-                            <PropertyPreview
-                                propertyKey={slots.title.propertyKey}
-                                value={slots.title.value}
-                                property={slots.title.property}
-                                size="small"
-                            />
+                            <SlotValue slot={slots.title} size="small"/>
                         ) : (
                             <span className="text-surface-500">{entity.id}</span>
                         )}
@@ -193,12 +180,7 @@ function BoardCardBindingInner<M extends Record<string, unknown> = Record<string
                             {typeof slots.subtitle.value === "string" ? (
                                 <Markdown source={slots.subtitle.value} size="small" />
                             ) : (
-                                <PropertyPreview
-                                    propertyKey={slots.subtitle.propertyKey}
-                                    value={slots.subtitle.value}
-                                    property={slots.subtitle.property}
-                                    size="small"
-                                />
+                                <SlotValue slot={slots.subtitle} size="small"/>
                             )}
                         </div>
                     ) : (
@@ -228,6 +210,23 @@ function BoardCardBindingInner<M extends Record<string, unknown> = Record<string
                             )}
                         </div>
                     )}
+
+                    {/* Tags slot */}
+                    {slots.tags && (
+                        <div className="flex items-center gap-1 mt-1 flex-wrap">
+                            <TagChips slot={slots.tags} max={3}/>
+                        </div>
+                    )}
+
+                    {/* Date slot — a board card is a list row without the image, and
+                        the row shows it. The status is deliberately not repeated
+                        here: on a board grouped by it, the column header is already
+                        saying it. */}
+                    {slots.date && (
+                        <div className="text-[10px] text-surface-500 dark:text-surface-400 mt-1">
+                            {slots.date.formatted}
+                        </div>
+                    )}
                 </div>
             </div>
         </div>

package/src/components/CollectionViewBinding/CollectionBoardViewBinding.tsx

@@ -1,6 +1,6 @@
 
 import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { Entity, EnumValueConfig } from "@rebasepro/types";
+import { Entity, EnumValueConfig, MAX_LIST_LIMIT } from "@rebasepro/types";
 import { EntityTableController, SelectionController, AdminCollection } from "@rebasepro/admin-types";
 import { BoardCardBinding } from "./BoardCardBinding";
 import {
@@ -376,13 +376,19 @@ parentEntityIds,
         setBackfillLoading(true);
 
         try {
-            // Fetch ALL documents from collection (not relying on loaded
-            // entities). No `orderBy`: with no usable order key there is
-            // nothing to order by, and this is the same query the columns
-            // themselves run, so the keys are handed out in the order the
-            // board is showing — which is what the dialog promises.
+            // Fetch the documents to key (not relying on loaded entities). No
+            // `orderBy`: with no usable order key there is nothing to order by,
+            // and this is the same query the columns themselves run, so the
+            // keys are handed out in the order the board is showing — which is
+            // what the dialog promises.
+            //
+            // `MAX_LIST_LIMIT`, not a made-up 10 000: that is the most a single
+            // read serves, and asking for more is now refused outright rather
+            // than quietly answered with the first thousand. A board past the
+            // ceiling still gets only its first page backfilled — the same rows
+            // as before this became explicit — and wants a paged walk.
             const allDocsRes = await dataClient.collection(fullPath).find({
-                limit: 10000 // Fetch all
+                limit: MAX_LIST_LIMIT
             });
             const allDocs = allDocsRes.data as Entity<M>[];
 

package/src/components/CollectionViewBinding/CollectionCardViewBinding.tsx

@@ -145,6 +145,7 @@ export function CollectionCardViewBinding<M extends Record<string, unknown> = Re
                     key={`${entity.path}_${entity.id}`}
                     entity={entity}
                     collection={collection}
+                    searchString={tableController.searchString}
                     onClick={onClick as any}
                     selected={selected}
                     highlighted={highlighted}
@@ -152,7 +153,7 @@ export function CollectionCardViewBinding<M extends Record<string, unknown> = Re
                     selectionEnabled={selectionEnabled}
                     size={size}
                 />
-            ), [collection, selectionEnabled, size, handleRowSelectionChange, ResolvedEntityCard])}
+            ), [collection, selectionEnabled, size, handleRowSelectionChange, ResolvedEntityCard, tableController.searchString])}
         />
     );
 }