@firecms/core 3.3.0 → 3.4.0-canary.2575a08

package/dist/util/navigation_utils.d.ts

@@ -3,22 +3,124 @@ export declare function removeInitialAndTrailingSlashes(s: string): string;
 export declare function removeInitialSlash(s: string): string;
 export declare function removeTrailingSlash(s: string): string;
 export declare function addInitialSlash(s: string): string;
+/**
+ * Characters that would otherwise be read as structure once an entity id is joined into a
+ * path: "/" separates segments, "?" and "#" start the query and hash in a URL, and "%"
+ * has to be escaped first so that no escape sequence we introduce can be misread as one
+ * that was already part of the id.
+ *
+ * Entity ids are escaped ONLY inside URL-facing strings — anything handed to
+ * `buildUrlCollectionPath` or `navigate`. Every other path string (the `path` field of a
+ * navigation entry, datasource paths, `EntityReference.path`) carries raw ids.
+ *
+ * @group Hooks and utilities
+ */
+export declare function encodeEntityId(entityId: string): string;
+/**
+ * Inverse of {@link encodeEntityId}. "%25" is undone last, mirroring the encoder, so an id
+ * that legitimately contains the text "%2F" survives the round trip.
+ *
+ * @group Hooks and utilities
+ */
+export declare function decodeEntityId(encodedEntityId: string): string;
+/**
+ * Segments of a subcollection sitting under the entity `entityId` of `parentPathSegments`.
+ *
+ * The parent entity id is kept whole however many slashes it contains, while the
+ * subcollection's own configured path is spread — a collection path never contains an
+ * entity id, so splitting that one is unambiguous.
+ *
+ * So `["test"] + "test/test" + "accommodation"` yields three segments,
+ * `["test", "test/test", "accommodation"]`, where splitting the flattened path
+ * `"test/test/test/accommodation"` would wrongly yield four.
+ *
+ * Returns undefined when the parent segments are unknown: the parent chain cannot be
+ * recovered from a flattened path, so there is nothing honest to build on.
+ *
+ * @group Hooks and utilities
+ */
+export declare function buildSubcollectionPathSegments(parentPathSegments: string[] | undefined, entityId: string | undefined, subcollectionPath: string): string[] | undefined;
 export declare function getLastSegment(path: string): string;
-export declare function resolveCollectionPathIds(path: string, allCollections: EntityCollection[]): string;
+/**
+ * The outcome of walking a segment chain against a collection tree.
+ * @group Hooks and utilities
+ */
+export type PathSegmentsWalkStep = {
+    collection: EntityCollection;
+    /** Resolved path of this collection, e.g. `"products/pid/locales"`. */
+    collectionPath: string;
+    /** `collectionPath` split at its real segment boundaries. */
+    collectionSegments: string[];
+    /** The entity addressed inside it, when the chain continues past the collection. */
+    entityId?: string;
+};
+export type PathSegmentsWalk = {
+    /** Segments with every collection id replaced by the collection's real `path`. */
+    resolved: string[];
+    /** The collection the chain ends in, if the whole chain matched. */
+    collection?: EntityCollection;
+    /** One entry per collection level traversed, outermost first. */
+    steps: PathSegmentsWalkStep[];
+    /** The first segment that could not be matched, if the walk stopped early. */
+    unmatched?: string;
+};
+/**
+ * Walk a segment chain against a collection tree, matching a collection by either its
+ * `path` or its `id` and treating exactly one segment as each entity id.
+ *
+ * This is the primitive the string-based helpers cannot have: working on the flattened
+ * path they must *guess* where an entity id ends by reading up to the next "/", which is
+ * wrong for any id that contains one. Here the boundaries are given.
+ *
+ * Stops at the first segment it cannot match and reports it, rather than throwing.
+ *
+ * @group Hooks and utilities
+ */
+export declare function walkPathSegments(pathSegments: string[], allCollections: EntityCollection[]): PathSegmentsWalk;
+/**
+ * Resolve collection aliases in a segment array: every collection id is replaced by the
+ * collection's real `path`, and every entity id is carried through untouched.
+ *
+ * The segment-wise counterpart of {@link resolveCollectionPathIds}, and the reason it
+ * exists: that one works on the flattened string, so an entity id containing "/" shifts
+ * the rest of the chain by a segment and resolution fails with
+ * "Collection definition not found for segment starting with …".
+ *
+ * Matching accepts either a collection's `path` or its `id`, so already-resolved segments
+ * pass through unchanged — the function is idempotent.
+ *
+ * Mirrors the string version when a chain cannot be matched: it warns and carries the
+ * remainder through unresolved, rather than throwing.
+ *
+ * @group Hooks and utilities
+ */
+export declare function resolveCollectionPathSegments(pathSegments: string[], allCollections: EntityCollection[]): string[];
+/**
+ * Find the collection a segment chain addresses, whether it ends on the collection itself
+ * or on one of its entities.
+ *
+ * The segment-wise counterpart of {@link getCollectionByPathOrId}, which asserts an odd
+ * number of "/"-separated parts — an assertion a slash-bearing entity id fails, throwing
+ * where it should simply have resolved.
+ *
+ * @group Hooks and utilities
+ */
+export declare function getCollectionByPathSegments(pathSegments: string[], collections: EntityCollection[]): EntityCollection | undefined;
+export declare function resolveCollectionPathIds(path: string, allCollections: EntityCollection[], pathSegments?: string[]): string;
 /**
  * Find the corresponding view at any depth for a given path.
  * Note that path or segments of the paths can be collection aliases.
  * @param pathOrId
  * @param collections
  */
-export declare function getCollectionByPathOrId(pathOrId: string, collections: EntityCollection[]): EntityCollection | undefined;
+export declare function getCollectionByPathOrId(pathOrId: string, collections: EntityCollection[], pathSegments?: string[]): EntityCollection | undefined;
 /**
  * Get the subcollection combinations from a path:
  * "sites/es/locales" => ["sites/es/locales", "sites"]
  * @param subpaths
  */
 export declare function getCollectionPathsCombinations(subpaths: string[]): string[];
-export declare function navigateToEntity({ openEntityMode, collection, entityId, copy, path, fullIdPath, selectedTab, sideEntityController, onClose, navigation }: {
+export declare function navigateToEntity({ openEntityMode, collection, entityId, copy, path, fullIdPath, pathSegments, selectedTab, sideEntityController, onClose, navigation }: {
     openEntityMode: "side_panel" | "full_screen";
     collection?: EntityCollection;
     entityId?: string;
@@ -26,6 +128,8 @@ export declare function navigateToEntity({ openEntityMode, collection, entityId,
     copy?: boolean;
     path: string;
     fullIdPath?: string;
+    /** `path` split at its real segment boundaries. */
+    pathSegments?: string[];
     sideEntityController: SideEntityController;
     onClose?: () => void;
     navigation: NavigationController;

package/dist/util/parent_references_from_path.d.ts

@@ -1,6 +1,22 @@
 import { EntityCollection, EntityReference } from "../types";
+/**
+ * References to every parent entity in a path.
+ *
+ * NOTE on encoding: `path` is expected ESCAPED, because it comes from the URL — the entity
+ * ids in it are decoded on the way out. Pass `pathSegments` instead whenever the path at
+ * hand is a raw datasource path (`entity.path`), which is not escaped and whose ids may
+ * therefore contain a bare "/": splitting that would silently produce the wrong references.
+ */
 export declare function getParentReferencesFromPath(props: {
     path: string;
     collections: EntityCollection[] | undefined;
     currentFullPath?: string;
+    currentPathSegments?: string[];
+    /** `path` split at its real segment boundaries, with RAW ids. Takes precedence. */
+    pathSegments?: string[];
 }): EntityReference[];
+/**
+ * The segment-wise counterpart: the boundaries are given, so an entity id keeps its
+ * slashes and nothing has to be decoded.
+ */
+export declare function getParentReferencesFromPathSegments(pathSegments: string[], collections: EntityCollection[]): EntityReference[];

package/dist/util/paths.d.ts

@@ -9,6 +9,34 @@ export declare function segmentsToStrippedPath(paths: string[]): string;
 /**
  * Extract the collection path routes
  * `products/B44RG6APH/locales` => [`products`, `locales`]
+ *
+ * Finds the entity ids by position, which only works while no id contains "/" — with one,
+ * every following segment shifts and the wrong elements are kept. Use
+ * {@link collectionSegmentsFrom} when the real boundaries are known.
+ *
  * @param path
  */
 export declare function fullPathToCollectionSegments(path: string): string[];
+/**
+ * The collection chain of an already-segmented path:
+ * `['products', 'B44RG6APH', 'locales']` => [`products`, `locales`]
+ *
+ * The counterpart of {@link fullPathToCollectionSegments} for callers that know the real
+ * segment boundaries. Kept as a separate function rather than an extra parameter on that
+ * one: these helpers are small enough to be passed point-free, and `paths.map(fn)` would
+ * then hand the array index in as the new argument.
+ */
+export declare function collectionSegmentsFrom(pathSegments: string[]): string[];
+/**
+ * The historical, positional reading of a flattened path:
+ * `products/B44RG6APH/locales` => [`products`, `locales`]
+ *
+ * This produces a **collection chain**, not a datasource `pathSegments` value, and must
+ * never be used as one — see `path_segments_no_fabrication.test.ts`. It is only correct
+ * while no entity id contains "/", which is why every caller prefers real segments when
+ * they are available, and why it is named for what it assumes.
+ *
+ * It is still the right reading for a path that came from a URL, where entity ids arrive
+ * escaped and so cannot contain a bare "/".
+ */
+export declare function positionalCollectionSegments(path: string): string[];

package/dist/util/permissions.d.ts

@@ -1,5 +1,11 @@
 import { AuthController, Entity, EntityCollection, Permissions, User } from "../types";
-export declare function resolvePermissions<M extends Record<string, any>, USER extends User>(collection: EntityCollection<M>, authController: AuthController<USER>, path: string, entity: Entity<M> | null): Permissions | undefined;
-export declare function canEditEntity<M extends Record<string, any>, USER extends User>(collection: EntityCollection<M>, authController: AuthController<USER>, path: string, entity: Entity<M> | null): boolean;
-export declare function canCreateEntity<M extends Record<string, any>, USER extends User>(collection: EntityCollection<M>, authController: AuthController<USER>, path: string, entity: Entity<M> | null): boolean;
-export declare function canDeleteEntity<M extends Record<string, any>, USER extends User>(collection: EntityCollection<M>, authController: AuthController<USER>, path: string, entity: Entity<M> | null): boolean;
+/**
+ * `pathSegments` is `path` split at its real segment boundaries. It is forwarded so the
+ * collection chain handed to a permissions builder stays correct when an entity id contains
+ * "/" — splitting `path` positionally would keep the wrong elements. Optional everywhere:
+ * omitted, behaviour is exactly as before.
+ */
+export declare function resolvePermissions<M extends Record<string, any>, USER extends User>(collection: EntityCollection<M>, authController: AuthController<USER>, path: string, entity: Entity<M> | null, pathSegments?: string[]): Permissions | undefined;
+export declare function canEditEntity<M extends Record<string, any>, USER extends User>(collection: EntityCollection<M>, authController: AuthController<USER>, path: string, entity: Entity<M> | null, pathSegments?: string[]): boolean;
+export declare function canCreateEntity<M extends Record<string, any>, USER extends User>(collection: EntityCollection<M>, authController: AuthController<USER>, path: string, entity: Entity<M> | null, pathSegments?: string[]): boolean;
+export declare function canDeleteEntity<M extends Record<string, any>, USER extends User>(collection: EntityCollection<M>, authController: AuthController<USER>, path: string, entity: Entity<M> | null, pathSegments?: string[]): boolean;

package/dist/util/urls.d.ts

@@ -0,0 +1,22 @@
+import type { PreviewType } from "../types";
+/**
+ * Is the given value an absolute `http(s)` URL, as opposed to a relative
+ * storage path such as `images/my_image.png`?
+ *
+ * Values saved in the datasource for storage properties can be either, e.g.
+ * when the property is configured with `storeUrl: true`, or when the value was
+ * written directly pointing to an externally hosted file.
+ */
+export declare function isAbsoluteHttpUrl(value?: string | null): boolean;
+/**
+ * Extract the lowercase file extension of a URL or path, ignoring any query
+ * string or hash fragment. Returns `undefined` when there is no extension.
+ */
+export declare function getFileExtensionFromUrl(urlOrPath?: string | null): string | undefined;
+/**
+ * Best effort guess of the preview type of a URL or path, based on its file
+ * extension. Used when no storage metadata (and therefore no content type) is
+ * available, e.g. for externally hosted files.
+ * Returns `undefined` when the extension is missing or not recognised.
+ */
+export declare function getPreviewTypeFromUrl(urlOrPath?: string | null): PreviewType | undefined;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@firecms/core",
   "type": "module",
-  "version": "3.3.0",
+  "version": "3.4.0-canary.2575a08",
   "description": "Awesome Firebase/Firestore-based headless open-source CMS",
   "funding": {
     "url": "https://github.com/sponsors/firecmsco"
@@ -53,8 +53,8 @@
     "@dnd-kit/core": "^6.3.1",
     "@dnd-kit/modifiers": "^9.0.0",
     "@dnd-kit/sortable": "^10.0.0",
-    "@firecms/formex": "^3.3.0",
-    "@firecms/ui": "^3.3.0",
+    "@firecms/formex": "3.4.0-canary.2575a08",
+    "@firecms/ui": "3.4.0-canary.2575a08",
     "@floating-ui/dom": "^1.7.4",
     "@radix-ui/react-portal": "^1.1.10",
     "@radix-ui/react-slot": "^1.2.4",
@@ -63,9 +63,9 @@
     "date-fns": "^3.6.0",
     "fuse.js": "^7.1.0",
     "history": "^5.3.0",
-    "i18next": "^23.16.4",
+    "i18next": "^26.3.3",
     "json-logic-js": "^2.0.5",
-    "markdown-it": "^14.1.0",
+    "markdown-it": "^14.2.0",
     "markdown-it-ins": "^4.0.0",
     "markdown-it-mark": "^4.0.0",
     "markdown-it-task-lists": "^2.1.1",
@@ -89,14 +89,14 @@
     "prosemirror-view": "^1.33.8",
     "react-dropzone": "^14.3.8",
     "react-fast-compare": "^3.2.2",
-    "react-i18next": "^14.1.3",
+    "react-i18next": "^17.0.11",
     "react-image-crop": "^11.0.10",
     "react-markdown": "^9.1.0",
     "react-moveable": "^0.56.0",
     "react-transition-group": "^4.4.5",
     "react-use-measure": "^2.1.7",
     "react-window": "^1.8.11",
-    "vite-plugin-static-copy": "3.1.4",
+    "vite-plugin-static-copy": "4.1.1",
     "yup": "^1.7.1"
   },
   "peerDependencies": {
@@ -111,7 +111,7 @@
     "@testing-library/user-event": "^14.6.1",
     "@types/jest": "^29.5.14",
     "@types/json-logic-js": "^2.0.8",
-    "@types/node": "^20.19.17",
+    "@types/node": "^26.1.1",
     "@types/object-hash": "^3.0.6",
     "@types/react": "^19.2.3",
     "@types/react-dom": "^19.2.3",
@@ -123,12 +123,12 @@
     "eslint-plugin-react-compiler": "^19.1.0-rc.2",
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^30.2.0",
-    "npm-run-all": "^4.1.5",
+    "npm-run-all2": "^6.2.6",
     "react-router": "^6.30.2",
     "react-router-dom": "^6.30.2",
     "ts-jest": "^29.4.5",
     "ts-node": "^10.9.2",
-    "tsd": "^0.31.2",
+    "tsd": "^0.33.0",
     "typescript": "^5.9.3",
     "vite": "^7.2.4"
   },
@@ -163,6 +163,10 @@
       "^.+\\.tsx?$": "ts-jest"
     },
     "testRegex": "(/__tests__/.*|(\\.|/)(test|spec))\\.tsx?$",
+    "testPathIgnorePatterns": [
+      "/node_modules/",
+      "/dist/"
+    ],
     "moduleFileExtensions": [
       "ts",
       "tsx",
@@ -172,6 +176,9 @@
       "node"
     ],
     "testEnvironment": "node",
+    "setupFiles": [
+      "<rootDir>/test/setup_jsdom.js"
+    ],
     "moduleNameMapper": {
       "\\.(css|less)$": "<rootDir>/test/__mocks__/styleMock.js"
     }

package/src/app/Scaffold.tsx

@@ -1,5 +1,5 @@
 import React, { PropsWithChildren, useCallback } from "react";
-import { ChevronLeftIcon, cls, defaultBorderMixin, IconButton, MenuIcon, Sheet, Tooltip } from "@firecms/ui";
+import { cls, defaultBorderMixin, IconButton, MenuIcon, Sheet } from "@firecms/ui";
 import equal from "react-fast-compare"
 import { useLargeLayout } from "../hooks";
 import { ErrorBoundary } from "../components";
@@ -80,7 +80,11 @@ export const Scaffold = React.memo<PropsWithChildren<ScaffoldProps>>(
         const [onHover, setOnHover] = React.useState(false);
 
         const setOnHoverTrue = useCallback(() => setOnHover(true), []);
-        const setOnHoverFalse = useCallback(() => setOnHover(false), []);
+        const setOnHoverFalse = useCallback(() => {
+            // Don't collapse the drawer while a popover/dropdown is open
+            if (typeof document !== "undefined" && document.querySelector("[data-radix-popper-content-wrapper]")) return;
+            setOnHover(false);
+        }, []);
 
         const handleDrawerOpen = useCallback(() => {
             setDrawerOpen(true);
@@ -96,17 +100,21 @@ export const Scaffold = React.memo<PropsWithChildren<ScaffoldProps>>(
             } catch { /* ignore */ }
         }, []);
 
-        const computedDrawerOpen: boolean = drawerOpen || Boolean(largeLayout && autoOpenDrawer && onHover);
+        // Pinned-open state only; hover is tracked separately so it can *float*
+        // over the content instead of pushing it.
+        const computedDrawerOpen: boolean = drawerOpen;
+        const computedDrawerHovered: boolean = Boolean(largeLayout && onHover);
 
         const hasAppBar = Boolean(appBarChildren.length > 0);
         return (
             <AppContext.Provider value={{
                 logo,
                 hasDrawer: includeDrawer,
-                drawerHovered: onHover,
+                drawerHovered: computedDrawerHovered,
                 drawerOpen: computedDrawerOpen,
                 closeDrawer: handleDrawerClose,
                 openDrawer: handleDrawerOpen,
+                closeHover: setOnHoverFalse,
                 autoOpenDrawer
             }}>
                 <div
@@ -128,7 +136,7 @@ export const Scaffold = React.memo<PropsWithChildren<ScaffoldProps>>(
                         onMouseMove={setOnHoverTrue}
                         onMouseLeave={setOnHoverFalse}
                         open={computedDrawerOpen}
-                        hovered={onHover}
+                        hovered={computedDrawerHovered}
                         setDrawerOpen={setDrawerOpen}>
                         {includeDrawer && drawerChildren}
                     </DrawerWrapper>
@@ -177,49 +185,30 @@ function DrawerWrapper(props: {
 }) {
 
     const { t } = useTranslation();
-    const width = !props.displayed ? 0 : (props.open ? DRAWER_WIDTH : 72);
+
+    // Layout width is the space the drawer occupies in the flex row; the visual
+    // width is how wide the drawer actually renders. When hovered (but not
+    // pinned open) the layout width stays collapsed while the visual width
+    // expands, so the drawer *floats* over the content instead of pushing it.
+    const layoutWidth = !props.displayed ? 0 : (props.open ? DRAWER_WIDTH : 72);
+    const visualWidth = !props.displayed ? 0 : ((props.open || props.hovered) ? DRAWER_WIDTH : 72);
+    const isFloating = props.hovered && !props.open;
+
+    const transition = "left 75ms cubic-bezier(0.4, 0, 0.6, 1) 0ms, opacity 75ms cubic-bezier(0.4, 0, 0.6, 1) 0ms, width 75ms cubic-bezier(0.4, 0, 0.6, 1) 0ms";
+
     const innerDrawer = <div
-        className={"relative h-full no-scrollbar overflow-y-auto overflow-x-hidden"}
+        className={cls("h-full overflow-hidden", defaultBorderMixin,
+            isFloating
+                ? "absolute top-0 left-0 bottom-0 z-30 bg-surface-50 dark:bg-surface-900 shadow-lg border-r"
+                : "relative bg-surface-50 dark:bg-surface-900")}
         style={{
-            width,
-            transition: "left 100ms cubic-bezier(0.4, 0, 0.6, 1) 0ms, opacity 100ms cubic-bezier(0.4, 0, 0.6, 1) 0ms, width 100ms cubic-bezier(0.4, 0, 0.6, 1) 0ms"
+            width: visualWidth,
+            transition
         }}
     >
-
-        {!props.open && props.displayed && (
-            <Tooltip title={t("open_menu")}
-                side="right"
-                sideOffset={12}
-                asChild={true}>
-                <div
-                    className="ml-2 fixed top-1 left-2 sm:top-2 sm:left-2 !bg-surface-50 dark:!bg-surface-900 rounded-full w-fit z-20">
-                    <IconButton
-                        color="inherit"
-                        aria-label={t("open_menu")}
-                        onClick={() => props.setDrawerOpen(true)}
-                        size="large"
-                    >
-                        <MenuIcon size="small" />
-                    </IconButton>
-                </div>
-            </Tooltip>
-        )}
-
-        <div
-            className={`z-20 absolute right-0 top-4 ${props.open ? "opacity-100" : "opacity-0 invisible"
-                } transition-opacity duration-200 ease-in-out`}>
-            <IconButton
-                aria-label={t("close_drawer")}
-                onClick={() => props.setDrawerOpen(false)}
-            >
-                <ChevronLeftIcon />
-            </IconButton>
-        </div>
-
         <div className={"flex flex-col h-full"}>
             {props.children}
         </div>
-
     </div>;
 
     const largeLayout = useLargeLayout();
@@ -250,13 +239,14 @@ function DrawerWrapper(props: {
 
     return (
         <div
-            className="z-20 relative"
+            className="z-20 relative flex-shrink-0 overflow-visible"
             onMouseEnter={props.onMouseEnter}
             onMouseMove={props.onMouseMove}
             onMouseLeave={props.onMouseLeave}
             style={{
-                width,
-                transition: "left 100ms cubic-bezier(0.4, 0, 0.6, 1) 0ms, opacity 100ms cubic-bezier(0.4, 0, 0.6, 1) 0ms, width 100ms cubic-bezier(0.4, 0, 0.6, 1) 0ms"
+                width: layoutWidth,
+                minWidth: layoutWidth,
+                transition
             }}>
 
             {innerDrawer}

package/src/app/useApp.tsx

@@ -10,6 +10,7 @@ export type AppState = {
     drawerOpen: boolean,
     openDrawer: () => void,
     closeDrawer: () => void,
+    closeHover?: () => void,
     autoOpenDrawer?: boolean,
     logo?: string
 }

package/src/components/DeleteEntityDialog.tsx

@@ -96,6 +96,8 @@ export function DeleteEntityDialog<M extends Record<string, any>>({
         deleteEntityWithCallbacks({
             dataSource,
             entity,
+            // The entity is the authority on where it lives; stated rather than left implicit.
+            pathSegments: entity.pathSegments,
             collection: resolvedCollection,
             callbacks,
             onDeleteSuccess,

package/src/components/EntityCollectionTable/EntityCollectionRowActions.tsx

@@ -3,7 +3,7 @@ import React, { MouseEvent, useCallback } from "react";
 import { CollectionSize, Entity, EntityAction, EntityCollection, SelectionController } from "../../types";
 import { Badge, Checkbox, cls, IconButton, Menu, MenuItem, MoreVertIcon, Skeleton, Tooltip } from "@firecms/ui";
 import { useFireCMSContext, useLargeLayout } from "../../hooks";
-import { getEntityFromCache } from "../../util/entity_cache";
+import { entityCacheKey, getEntityFromCache } from "../../util/entity_cache";
 import { getLocalChangesBackup } from "../../util";
 import { getChanges } from "../../form/EntityForm";
 
@@ -82,7 +82,7 @@ export const EntityCollectionRowActions = function EntityCollectionRowActions({
     const collapsedActions = actions.filter(a => a.collapsed || a.collapsed === undefined);
     const uncollapsedActions = actions.filter(a => a.collapsed === false);
     const enableLocalChangesBackup = collection ? getLocalChangesBackup(collection) : false;
-    const cachedData = enableLocalChangesBackup ? getEntityFromCache(fullPath + "/" + entity.id) : undefined;
+    const cachedData = enableLocalChangesBackup ? getEntityFromCache(entityCacheKey(fullPath, entity.id)) : undefined;
     const hasDraft = (() => {
         if (!cachedData || typeof cachedData !== "object" || Object.keys(cachedData).length === 0) return false;
         const realChanges = getChanges(cachedData as any, (entity?.values ?? {}) as any);

package/src/components/EntityCollectionTable/EntityCollectionTable.tsx

@@ -245,7 +245,8 @@ export const EntityCollectionTable = function EntityCollectionTable<M extends Re
         const columnsResult: VirtualTableColumn[] = propertiesToColumns({
             properties,
             sortable,
-            forceFilter,
+            forcedFilters: tableController.forcedFilters,
+            allowedFilters: tableController.allowedFilters,
             AdditionalHeaderWidget
         });
 
@@ -353,6 +354,7 @@ export const EntityCollectionTable = function EntityCollectionTable<M extends Re
                 onTextSearch={textSearchEnabled ? onTextSearch : undefined}
                 textSearchLoading={textSearchLoading}
                 onTextSearchClick={textSearchEnabled ? onTextSearchClick : undefined}
+                initialSearchString={tableController.searchString}
                 title={title}
                 actionsStart={actionsStart}
                 actions={actions}

package/src/components/EntityCollectionTable/column_utils.tsx

@@ -2,7 +2,7 @@ import React from "react";
 import { getTableCellAlignment, getTablePropertyColumnWidth } from "./internal/common";
 import { FilterValues, ResolvedProperties, ResolvedProperty } from "../../types";
 import { VirtualTableColumn } from "../VirtualTable";
-import { getIconForProperty, getResolvedPropertyInPath } from "../../util";
+import { getIconForProperty, getResolvedPropertyInPath, isDataTypeFilterable } from "../../util";
 import { getColumnKeysForProperty } from "../common/useColumnsIds";
 
 export function buildIdColumn(largeLayout?: boolean): VirtualTableColumn {
@@ -20,7 +20,8 @@ export function buildIdColumn(largeLayout?: boolean): VirtualTableColumn {
 export interface PropertiesToColumnsParams<M extends Record<string, any>> {
     properties: ResolvedProperties<M>;
     sortable?: boolean;
-    forceFilter?: FilterValues<keyof M extends string ? keyof M : never>;
+    forcedFilters?: (keyof M)[];
+    allowedFilters?: (keyof M)[];
     AdditionalHeaderWidget?: React.ComponentType<{
         property: ResolvedProperty,
         propertyKey: string,
@@ -28,8 +29,7 @@ export interface PropertiesToColumnsParams<M extends Record<string, any>> {
     }>;
 }
 
-export function propertiesToColumns<M extends Record<string, any>>({ properties, sortable, forceFilter, AdditionalHeaderWidget }: PropertiesToColumnsParams<M>): VirtualTableColumn[] {
-    const disabledFilter = Boolean(forceFilter);
+export function propertiesToColumns<M extends Record<string, any>>({ properties, sortable, forcedFilters, AdditionalHeaderWidget, allowedFilters }: PropertiesToColumnsParams<M>): VirtualTableColumn[] {
     return Object.entries<ResolvedProperty>(properties)
         .flatMap(([key, property]) => getColumnKeysForProperty(property, key))
         .map(({
@@ -39,14 +39,19 @@ export function propertiesToColumns<M extends Record<string, any>>({ properties,
             const property = getResolvedPropertyInPath(properties, key);
             if (!property)
                 throw Error("Internal error: no property found in path " + key);
-            const filterable = filterableProperty(property);
+
+            const filterable = property.dataType === 'array' ? isDataTypeFilterable(property.of?.dataType, true) : isDataTypeFilterable(property.dataType);
+            const isFilterForced = forcedFilters?.includes(key) ?? false;
+            const isFilterAllowed = allowedFilters ? allowedFilters.includes(key) : filterable;
+
+            const filterEnabled = filterable && isFilterAllowed && !isFilterForced;
             return {
                 key: key as string,
                 align: getTableCellAlignment(property),
                 icon: getIconForProperty(property, "small"),
                 title: property.name ?? key as string,
                 sortable: sortable,
-                filter: !disabledFilter && filterable,
+                filter: filterEnabled,
                 width: getTablePropertyColumnWidth(property),
                 resizable: true,
                 custom: {
@@ -59,16 +64,3 @@ export function propertiesToColumns<M extends Record<string, any>>({ properties,
             } satisfies VirtualTableColumn;
         });
 }
-
-function filterableProperty(property: ResolvedProperty, partOfArray = false): boolean {
-    if (partOfArray) {
-        return ["string", "number", "date", "reference"].includes(property.dataType);
-    }
-    if (property.dataType === "array") {
-        if (property.of)
-            return filterableProperty(property.of, true);
-        else
-            return false;
-    }
-    return ["string", "number", "boolean", "date", "reference", "array"].includes(property.dataType);
-}

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

@@ -70,7 +70,7 @@ export const TableReferenceFieldInternal = React.memo(
         }, [updateValue]);
 
         const onMultipleEntitiesSelected = useCallback((entities: Entity<any>[]) => {
-            updateValue(entities.map((e) => getReferenceFrom(e)));
+            updateValue(entities.filter(Boolean).map((e) => getReferenceFrom(e)));
         }, [updateValue]);
 
         const selectedEntityIds = internalValue

package/src/components/EntityCollectionTable/internal/CollectionTableToolbar.tsx

@@ -20,6 +20,11 @@ interface CollectionTableToolbarProps {
     onTextSearchClick?: () => void;
     onTextSearch?: (searchString?: string) => void;
     textSearchLoading?: boolean;
+    /**
+     * Search term the search bar should start with, typically the one restored from the
+     * URL query params by the table controller.
+     */
+    initialSearchString?: string;
 }
 
 export function CollectionTableToolbar({
@@ -29,6 +34,7 @@ export function CollectionTableToolbar({
     onTextSearch,
     onTextSearchClick,
     textSearchLoading,
+    initialSearchString,
     title,
     viewModeToggle
 }: CollectionTableToolbarProps) {
@@ -79,6 +85,7 @@ export function CollectionTableToolbar({
                         disabled={Boolean(onTextSearchClick)}
                         onClick={onTextSearchClick}
                         onTextSearch={onTextSearchClick ? undefined : onTextSearch}
+                        initialValue={initialSearchString}
                         placeholder={t("search")}
                         expandable={true} />}