@firecms/core 3.0.0-canary.289 → 3.0.0-canary.290

package/dist/types/fields.d.ts

@@ -67,6 +67,10 @@ export interface FieldProps<T extends CMSType = any, CustomProps = any, M extend
      * Is this field part of an array
      */
     partOfArray?: boolean;
+    /**
+     * Is this field part of a block
+     */
+    partOfBlock?: boolean;
     /**
      * Display the child properties directly, without being wrapped in an
      * extendable panel. Note that this will also hide the title of this property.
@@ -178,6 +182,10 @@ export interface PropertyFieldBindingProps<T extends CMSType, M extends Record<s
      * Is this field part of an array
      */
     partOfArray?: boolean;
+    /**
+     * Is this field part of a block
+     */
+    partOfBlock?: boolean;
     /**
      * Display the child properties directly, without being wrapped in an
      * extendable panel. Note that this will also hide the title of this property.

package/dist/types/properties.d.ts

@@ -102,6 +102,10 @@ export interface BaseProperty<T extends CMSType, CustomProps = any> {
     /**
      * Should this property be editable. If set to true, the user will be able to modify the property and
      * save the new config. The saved config will then become the source of truth.
+     * Defaults to `true.
+     * This props is only useful when you are using the collection editor to modify collection
+     * configurations from the CMS itself. You can also use the `editable` prop in the
+     * `EntityCollection` interface to disable the edition of all properties in a collection.
      */
     editable?: boolean;
     /**
@@ -617,8 +621,15 @@ export type StorageConfig = {
     /**
      * Use client side image compression and resizing
      * Will only be applied to these MIME types: image/jpeg, image/png and image/webp
+     * @deprecated Use `imageResize` instead
      */
-    imageCompression?: ImageCompression;
+    imageCompression?: ImageResize;
+    /**
+     * Advanced image resizing and cropping configuration.
+     * Applied before upload to optimize storage and bandwidth.
+     * Only applies to image MIME types: image/jpeg, image/png, image/webp
+     */
+    imageResize?: ImageResize;
     /**
      * Specific metadata set in your uploaded file.
      * For the default Firebase implementation, the values passed here are of type
@@ -730,17 +741,32 @@ export type PreviewType = "image" | "video" | "audio" | "file";
  * @group Entity properties
  */
 export type FileType = "image/*" | "video/*" | "audio/*" | "application/*" | "text/*" | "font/*" | string;
-export interface ImageCompression {
+export interface ImageResize {
+    /**
+     * Maximum width in pixels. Image will be scaled down proportionally if wider.
+     */
+    maxWidth?: number;
     /**
-     * New image max height (ratio is preserved)
+     * Maximum height in pixels. Image will be scaled down proportionally if taller.
      */
     maxHeight?: number;
     /**
-     * New image max width (ratio is preserved)
+     * Resize mode determines how the image fits within maxWidth/maxHeight bounds.
+     * - `contain`: Scale down to fit within bounds, preserving aspect ratio (default)
+     * - `cover`: Scale to fill bounds, preserving aspect ratio (may crop)
      */
-    maxWidth?: number;
+    mode?: 'contain' | 'cover';
+    /**
+     * Output format for the resized image.
+     * - `original`: Keep the original format (default)
+     * - `jpeg`: Convert to JPEG
+     * - `png`: Convert to PNG
+     * - `webp`: Convert to WebP
+     */
+    format?: 'original' | 'jpeg' | 'png' | 'webp';
     /**
-     * A number between 0 and 100. Used for the JPEG compression.(if no compress is needed, just set it to 100)
+     * Quality for lossy formats (JPEG, WebP). Number between 0 and 100.
+     * Higher is better quality but larger file size. Defaults to 80.
      */
     quality?: number;
 }

package/dist/util/make_properties_editable.d.ts

@@ -1,3 +1,2 @@
-import { Properties, PropertiesOrBuilders } from "../types";
+import { Properties } from "../types";
 export declare function makePropertiesEditable(properties: Properties): Properties<any>;
-export declare function makePropertiesNonEditable(properties: PropertiesOrBuilders): PropertiesOrBuilders;

package/dist/util/useStorageUploadController.d.ts

@@ -31,6 +31,7 @@ export declare function useStorageUploadController<M extends object>({ entityId,
     fileNameBuilder: (file: File) => Promise<string>;
     storagePathBuilder: (file: File) => string;
     onFileUploadComplete: (uploadedPath: string, entry: StorageFieldItem, metadata?: any) => Promise<void>;
+    onFileUploadError: (entry: StorageFieldItem) => void;
     onFilesAdded: (acceptedFiles: File[]) => Promise<void>;
     multipleFilesSupported: boolean;
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@firecms/core",
   "type": "module",
-  "version": "3.0.0-canary.289",
+  "version": "3.0.0-canary.290",
   "description": "Awesome Firebase/Firestore-based headless open-source CMS",
   "funding": {
     "url": "https://github.com/sponsors/firecmsco"
@@ -53,11 +53,12 @@
     "@dnd-kit/core": "^6.3.1",
     "@dnd-kit/modifiers": "^9.0.0",
     "@dnd-kit/sortable": "^10.0.0",
-    "@firecms/editor": "^3.0.0-canary.289",
-    "@firecms/formex": "^3.0.0-canary.289",
-    "@firecms/ui": "^3.0.0-canary.289",
-    "@radix-ui/react-portal": "^1.1.9",
+    "@firecms/editor": "^3.0.0-canary.290",
+    "@firecms/formex": "^3.0.0-canary.290",
+    "@firecms/ui": "^3.0.0-canary.290",
+    "@radix-ui/react-portal": "^1.1.10",
     "clsx": "^2.1.1",
+    "compressorjs": "^1.2.1",
     "date-fns": "^3.6.0",
     "fuse.js": "^7.1.0",
     "history": "^5.3.0",
@@ -67,11 +68,10 @@
     "prism-react-renderer": "^2.4.1",
     "react-dropzone": "^14.3.8",
     "react-fast-compare": "^3.2.2",
-    "react-image-file-resizer": "^0.4.8",
     "react-transition-group": "^4.4.5",
     "react-use-measure": "^2.1.7",
     "react-window": "^1.8.11",
-    "vite-plugin-static-copy": "3.1.2",
+    "vite-plugin-static-copy": "3.1.4",
     "yup": "^0.32.11"
   },
   "peerDependencies": {
@@ -81,7 +81,7 @@
     "react-router-dom": "^6.28.0"
   },
   "devDependencies": {
-    "@jest/globals": "^30.1.2",
+    "@jest/globals": "^30.2.0",
     "@testing-library/react": "^16.3.0",
     "@testing-library/user-event": "^14.6.1",
     "@types/jest": "^29.5.14",
@@ -93,22 +93,22 @@
     "@vitejs/plugin-react": "^4.7.0",
     "babel-plugin-react-compiler": "^19.0.0-beta-af1b7da-20250417",
     "cross-env": "^7.0.3",
-    "eslint-plugin-react-compiler": "^19.0.0-beta-af1b7da-20250417",
+    "eslint-plugin-react-compiler": "^19.1.0-rc.2",
     "jest": "^29.7.0",
     "npm-run-all": "^4.1.5",
-    "react-router": "^6.30.1",
-    "react-router-dom": "^6.30.1",
-    "ts-jest": "^29.4.3",
+    "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",
-    "typescript": "^5.9.2",
-    "vite": "^7.1.6"
+    "typescript": "^5.9.3",
+    "vite": "^7.2.4"
   },
   "files": [
     "dist",
     "src"
   ],
-  "gitHead": "ca236e0e8d9a91d1106bc7836b5f8945cdba35e9",
+  "gitHead": "80538231810a133e5b3cba8a8d4b47ec6e5619f8",
   "publishConfig": {
     "access": "public"
   },

package/src/components/EntityCollectionView/EntityCollectionView.tsx

@@ -376,6 +376,11 @@ export const EntityCollectionView = React.memo(
                     console.error("Save failure");
                     console.error(e);
                     setError(e);
+                },
+                onPreSaveHookError: (e: Error) => {
+                    console.error("Pre-save hook error");
+                    console.error(e);
+                    setError(e);
                 }
             });
 

package/src/components/HomePage/DefaultHomePage.tsx

@@ -1,8 +1,12 @@
 import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import Fuse from "fuse.js";
 import { Container, SearchBar } from "@firecms/ui";
-import { useCustomizationController, useFireCMSContext, useNavigationController } from "../../hooks";
-import { useCollapsedGroups } from "../../hooks/useCollapsedGroups";
+import {
+    useCollapsedGroups,
+    useCustomizationController,
+    useFireCMSContext,
+    useNavigationController
+} from "../../hooks";
 import {
     CMSAnalyticsEvent,
     NavigationEntry,
@@ -143,7 +147,6 @@ export function DefaultHomePage({
             allProcessed = allProcessed.filter(
                 (g) =>
                     g.entries.length ||
-                    groupOrderFromNavController.includes(g.name) ||
                     (g.name === DEFAULT_GROUP_NAME && hasPluginAdditionalCards)
             );
         }
@@ -177,6 +180,7 @@ export function DefaultHomePage({
     const persistNavigationGroups = (
         latest: { name: string; entries: NavigationEntry[] }[]
     ) => {
+        // Map ALL groups including "Views"
         const draggable: NavigationGroupMapping[] = latest.map((g) => ({
             name: g.name,
             entries: g.entries.map((e) => e.path)
@@ -221,13 +225,14 @@ export function DefaultHomePage({
         dialogOpenForGroup,
         setDialogOpenForGroup,
         handleRenameGroup,
+        handleDialogClose,
         isHoveringNewGroupDropZone,
         setIsHoveringNewGroupDropZone
     } = useHomePageDnd({
         items,
         setItems: updateItems,
         disabled: !allowDragAndDrop || performingSearch,
-        onPersist: persistNavigationGroups, // ——► persistence here
+        onPersist: persistNavigationGroups,
         onGroupMoved: (g) =>
             context.analyticsController?.onAnalyticsEvent?.("home_move_group", {
                 name: g
@@ -355,7 +360,7 @@ export function DefaultHomePage({
                         items={containers}
                         strategy={verticalListSortingStrategy}
                     >
-                        {items.map((groupData) => {
+                        {items.map((groupData, groupIndex) => {
                             const groupKey = groupData.name;
                             const entriesInGroup = groupData.entries;
 
@@ -378,14 +383,13 @@ export function DefaultHomePage({
 
                             if (
                                 entriesInGroup.length === 0 &&
-                                (AdditionalCards.length === 0 || performingSearch) &&
-                                !groupOrderFromNavController.includes(groupKey)
+                                (AdditionalCards.length === 0 || performingSearch)
                             )
                                 return null;
 
                             return (
                                 <SortableNavigationGroup
-                                    key={groupKey}
+                                    key={`group-${groupIndex}`}
                                     groupName={groupKey}
                                     disabled={dndDisabled}
                                 >
@@ -557,7 +561,7 @@ export function DefaultHomePage({
                     existingGroupNames={items
                         .map((g) => g.name)
                         .filter((n) => n !== dialogOpenForGroup)}
-                    onClose={() => setDialogOpenForGroup(null)}
+                    onClose={handleDialogClose}
                     onRename={(newName) => {
                         handleRenameGroup(dialogOpenForGroup, newName);
                     }}

package/src/components/HomePage/HomePageDnD.tsx

@@ -163,13 +163,9 @@ export function SortableNavigationGroup({
     );
 }
 
-/* ─────────────────────────────────────────────────────────── */
-/* Main DnD hook                                               */
-
-/* ─────────────────────────────────────────────────────────── */
 export function useHomePageDnd({
-                                   items: dndItems,
-                                   setItems: setDndItems,
+                                   items,
+                                   setItems,
                                    disabled,
                                    onCardMovedBetweenGroups,
                                    onGroupMoved,
@@ -191,6 +187,9 @@ export function useHomePageDnd({
     onPersist?: (latest: { name: string; entries: NavigationEntry[] }[]) => void;
 }) {
     /* ---------------- local state ---------------- */
+    const dndItems = items;
+    const setDndItems = setItems;
+
     const [activeId, setActiveId] = useState<UniqueIdentifier | null>(null);
     const [activeIsGroup, setActiveIsGroup] = useState(false);
     const [currentDraggingGroupId, setCurrentDraggingGroupId] =
@@ -200,6 +199,15 @@ export function useHomePageDnd({
     const [dialogOpenForGroup, setDialogOpenForGroup] = useState<string | null>(null);
     const [isHoveringNewGroupDropZone, setIsHoveringNewGroupDropZone] =
         useState(false);
+    const [pendingNewGroupName, setPendingNewGroupName] = useState<string | null>(null);
+    const [stateBeforeNewGroup, setStateBeforeNewGroup] = useState<
+        { name: string; entries: NavigationEntry[] }[] | null
+    >(null);
+
+    /* store the original state before any drag modifications */
+    const preDragItemsRef = useRef<
+        { name: string; entries: NavigationEntry[] }[] | null
+    >(null);
 
     /* store interim state for cross-group moves */
     const interimItemsRef = useRef<
@@ -321,6 +329,9 @@ export function useHomePageDnd({
         setDndKitActiveNode(active);
         if (disabled) return;
 
+        // Capture the original state before any drag modifications
+        preDragItemsRef.current = cloneItemsForDnd(dndItems);
+
         const isGroup = dndItems.some((g) => g.name === active.id);
         if (!active.data.current) active.data.current = {};
         active.data.current.type = isGroup ? "group" : "item";
@@ -349,18 +360,35 @@ export function useHomePageDnd({
 
         if (overCont && activeCont !== overCont) {
             recentlyMovedToNewContainer.current = true;
-            const newState = cloneItemsForDnd(dndItems);
-            const srcIdx = newState.findIndex((g) => g.name === activeCont);
-            const tgtIdx = newState.findIndex((g) => g.name === overCont);
-            if (srcIdx === -1 || tgtIdx === -1) return;
-            const src = newState[srcIdx];
-            const tgt = newState[tgtIdx];
-            const idxInSrc = src.entries.findIndex((e) => e.url === activeIdNow);
-            if (idxInSrc === -1) return;
-            const [moved] = src.entries.splice(idxInSrc, 1);
-            tgt.entries.push(moved);
-            interimItemsRef.current = newState;
-            setDndItems(newState);
+            lastOverId.current = overIdNow;
+
+            // Update state for visual feedback during drag
+            setDndItems((current) => {
+                const newState = cloneItemsForDnd(current);
+                const srcIdx = newState.findIndex((g) => g.name === activeCont);
+                const tgtIdx = newState.findIndex((g) => g.name === overCont);
+                if (srcIdx === -1 || tgtIdx === -1) return current;
+                const src = newState[srcIdx];
+                const tgt = newState[tgtIdx];
+                const idxInSrc = src.entries.findIndex((e) => e.url === activeIdNow);
+                if (idxInSrc === -1) return current;
+                const [moved] = src.entries.splice(idxInSrc, 1);
+
+                // Calculate insertion position - SAME logic as handleDragEnd
+                const overIsContainer = overIdNow === overCont;
+                if (overIsContainer) {
+                    tgt.entries.push(moved);
+                } else {
+                    const overIdx = tgt.entries.findIndex((e) => e.url === overIdNow);
+                    if (overIdx !== -1) {
+                        tgt.entries.splice(overIdx, 0, moved);
+                    } else {
+                        tgt.entries.push(moved);
+                    }
+                }
+
+                return newState;
+            });
         } else if (activeCont === overCont) {
             recentlyMovedToNewContainer.current = false;
         }
@@ -396,11 +424,26 @@ export function useHomePageDnd({
         }
         /* ─── card move ─── */
         else {
-            const activeCont = findDndContainer(activeIdNow);
+            // CRITICAL: Find source container from ORIGINAL pre-drag state, not current (potentially stale) dndItems
+            const findContainerInState = (id: string, state: { name: string; entries: NavigationEntry[] }[]): string | undefined => {
+                const group = state.find((g) => g.name === id);
+                if (group) return group.name;
+                for (const g of state) {
+                    if (g.entries.some((e) => e.url === id)) return g.name;
+                }
+                return undefined;
+            };
+
+            const sourceState = preDragItemsRef.current || dndItems;
+            const activeCont = findContainerInState(activeIdNow as string, sourceState);
+            const overCont = findDndContainer(overIdNow);
 
             /* drop on new-group zone */
             if (overIdNow === "new-group-drop-zone") {
                 if (activeCont) {
+                    // Save current state before making changes
+                    setStateBeforeNewGroup(cloneItemsForDnd(dndItems));
+
                     const newState = cloneItemsForDnd(dndItems);
                     const srcIdx = newState.findIndex((g) => g.name === activeCont);
                     if (srcIdx !== -1) {
@@ -421,8 +464,10 @@ export function useHomePageDnd({
                                 name: tentative,
                                 entries: [dragged]
                             });
+
+                            // Update local state but DON'T persist yet
                             setDndItems(newState);
-                            onPersist?.(newState);
+                            setPendingNewGroupName(tentative);
                             setDialogOpenForGroup(tentative);
                             onNewGroupDrop?.();
                         }
@@ -459,18 +504,59 @@ export function useHomePageDnd({
                             onPersist?.(newState);
                         }
                     }
-                } else if (
-                    recentlyMovedToNewContainer.current &&
-                    interimItemsRef.current
-                ) {
-                    onPersist?.(interimItemsRef.current);
-                }
+                } else if (overCont && activeCont !== overCont) {
+                    // Card moved between different groups - use CLEAN pre-drag state
+                    const finalState = cloneItemsForDnd(sourceState);
 
-                onCardMovedBetweenGroups?.(
-                    dndItems
-                        .flatMap((g) => g.entries)
-                        .find((e) => e.url === activeIdNow)!
-                );
+                    // Find target container from clean state too
+                    const finalOverId = lastOverId.current || overIdNow;
+                    const cleanOverCont = findContainerInState(finalOverId as string, sourceState) || overCont;
+
+                    const srcIdx = finalState.findIndex((g) => g.name === activeCont);
+                    const tgtIdx = finalState.findIndex((g) => g.name === cleanOverCont);
+
+                    if (srcIdx !== -1 && tgtIdx !== -1) {
+                        const src = finalState[srcIdx];
+                        const tgt = finalState[tgtIdx];
+                        const idxInSrc = src.entries.findIndex((e) => e.url === activeIdNow);
+
+                        if (idxInSrc !== -1) {
+                            // Remove from source
+                            const [moved] = src.entries.splice(idxInSrc, 1);
+
+                            // Calculate insertion position in target
+                            const overIsContainer = finalOverId === cleanOverCont;
+                            if (overIsContainer) {
+                                tgt.entries.push(moved);
+                            } else {
+                                const overIdx = tgt.entries.findIndex((e) => e.url === finalOverId);
+                                if (overIdx !== -1) {
+                                    tgt.entries.splice(overIdx, 0, moved);
+                                } else {
+                                    tgt.entries.push(moved);
+                                }
+                            }
+
+                            // Remove empty source group if needed
+                            if (src.entries.length === 0) {
+                                finalState.splice(srcIdx, 1);
+                            }
+
+                            setDndItems(finalState);
+                            onPersist?.(finalState);
+
+                            onCardMovedBetweenGroups?.(moved);
+                        }
+                    }
+                } else if (recentlyMovedToNewContainer.current) {
+                    // This shouldn't happen but log it for debugging
+                    console.error("Move between containers detected but conditions not met", {
+                        activeCont,
+                        overCont,
+                        activeIdNow,
+                        overIdNow
+                    });
+                }
             }
         }
 
@@ -501,9 +587,29 @@ export function useHomePageDnd({
                 ...updated[idx],
                 name: newName
             };
-            onPersist?.(updated); // <- ensure rename is saved
+
+            // Persist after successful rename
+            onPersist?.(updated);
             return updated;
         });
+
+        // Clear all pending state
+        setPendingNewGroupName(null);
+        setStateBeforeNewGroup(null);
+        setDialogOpenForGroup(null);
+    };
+
+    /* Handle dialog close without renaming */
+    const handleDialogClose = () => {
+        // If there's a pending new group that wasn't renamed, restore previous state
+        if (pendingNewGroupName && dialogOpenForGroup === pendingNewGroupName && stateBeforeNewGroup) {
+            // Restore the state from before the new group was created
+            setDndItems(stateBeforeNewGroup);
+        }
+
+        // Clear all pending state
+        setPendingNewGroupName(null);
+        setStateBeforeNewGroup(null);
         setDialogOpenForGroup(null);
     };
 
@@ -535,15 +641,12 @@ export function useHomePageDnd({
         dialogOpenForGroup,
         setDialogOpenForGroup,
         handleRenameGroup,
+        handleDialogClose,
         isHoveringNewGroupDropZone,
         setIsHoveringNewGroupDropZone
     };
 }
 
-/* ─────────────────────────────────────────────────────────── */
-/* New-group drop-zone component                               */
-
-/* ─────────────────────────────────────────────────────────── */
 export function NewGroupDropZone({
                                      disabled,
                                      setIsHovering
@@ -588,8 +691,7 @@ export function NewGroupDropZone({
                 isOver
                     ? "bg-surface-accent-100 dark:bg-surface-accent-800 border-surface-300 dark:border-surface-600"
                     : "bg-surface-50 dark:bg-surface-900 border-surface-200 dark:border-surface-700"
-            )}
-        >
+            )}>
             <div className="text-center p-4">
                 <span className="block font-medium text-sm">
                     Drop here to create a new group

package/src/components/PropertyCollectionView.tsx

@@ -131,7 +131,7 @@ export const PropertyCollectionView = ({
         if (baseKey && property && isArrayOfPrimitives) {
             return (
                 <div
-                    className={`grid grid-cols-12 gap-x-4 ${isTopLevel ? "py-4" : "py-2"} items-start ${isTopLevel ? `border-b ${defaultBorderMixin}` : ""}`}>
+                    className={`grid grid-cols-12 gap-x-4 ${isTopLevel ? "py-4" : "py-2"} items-start ${isTopLevel ? `border-b ${defaultBorderMixin} last:border-b-0` : ""}`}>
                     <div className="col-span-4 pr-2">
                         <Typography variant="caption"
                                     color={"secondary"}
@@ -152,7 +152,7 @@ export const PropertyCollectionView = ({
 
         // Array of maps or unknown -> array header + combined item header (MapName [index]) then content
         return (
-            <div className={`${isTopLevel ? "py-4" : "py-1"} ${isTopLevel ? `border-b ${defaultBorderMixin}` : ""}`}>
+            <div className={`${isTopLevel ? "py-4" : "py-1"} ${isTopLevel ? `border-b ${defaultBorderMixin} last:border-b-0` : ""}`}>
                 {baseKey && arrayLabel && !suppressHeader && (
                     <Typography variant="caption"
                                 color={"secondary"}
@@ -211,7 +211,7 @@ export const PropertyCollectionView = ({
             if (!property) return null;
             return (
                 <div
-                    className={`grid grid-cols-12 gap-x-4 ${isTopLevel ? "py-4" : "py-2"} items-start ${isTopLevel ? `border-b ${defaultBorderMixin}` : ""}`}>
+                    className={`grid grid-cols-12 gap-x-4 ${isTopLevel ? "py-4" : "py-2"} items-start ${isTopLevel ? `border-b ${defaultBorderMixin} last:border-b-0` : ""}`}>
                     <div className="col-span-4 pr-2">
                         <Typography variant="caption"
                                     color={"secondary"}
@@ -240,7 +240,7 @@ export const PropertyCollectionView = ({
         const headerText = property?.name || label;
 
         return (
-            <div className={`${isTopLevel ? "py-4" : "py-1"} ${isTopLevel ? `border-b ${defaultBorderMixin}` : ""}`}>
+            <div className={`${isTopLevel ? "py-4" : "py-1"} ${isTopLevel ? `border-b ${defaultBorderMixin} last:border-b-0` : ""}`}>
                 {showMapHeader && (
                     <Typography variant="caption"
                                 color={"secondary"}
@@ -277,7 +277,7 @@ export const PropertyCollectionView = ({
         if (!property) return null;
         return (
             <div
-                className={`grid grid-cols-12 gap-x-4 ${isTopLevel ? "py-4" : "py-2"} items-start ${isTopLevel ? `border-b ${defaultBorderMixin}` : ""}`}>
+                className={`grid grid-cols-12 gap-x-4 ${isTopLevel ? "py-4" : "py-2"} items-start ${isTopLevel ? `border-b ${defaultBorderMixin} last:border-b-0` : ""}`}>
                 <div className="col-span-4 pr-2">
                     <Typography variant="caption"
                                 color={"secondary"}

package/src/components/SelectableTable/SelectableTable.tsx

@@ -327,15 +327,3 @@ function createFilterField({
     );
 }
 
-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/SelectableTable/filters/DateTimeFilterField.tsx

@@ -55,7 +55,7 @@ export function DateTimeFilterField({
         }
 
         setOperation(op);
-        setInternalValue(newValue === null ? undefined : newValue);
+        setInternalValue(newValue);
 
         const hasNewValue = newValue !== null && Array.isArray(newValue)
             ? newValue.length > 0
@@ -96,6 +96,7 @@ export function DateTimeFilterField({
                     mode={mode}
                     size={"large"}
                     locale={locale}
+                    disabled={internalValue === null}
                     value={internalValue ?? undefined}
                     onChange={(dateValue: Date | null) => {
                         updateFilter(operation, dateValue === null ? undefined : dateValue);

package/src/components/SelectableTable/filters/StringNumberFilterField.tsx

@@ -139,7 +139,6 @@ export function StringNumberFilterField({
                                 updateFilter(operation, dataType === "number" ? parseInt(value as string) : value as string)
                         }}
                         endAdornment={internalValue && <IconButton
-                            className="absolute right-2 top-3"
                             onClick={(e) => updateFilter(operation, undefined)}>
                             <CloseIcon/>
                         </IconButton>}

package/src/form/EntityForm.tsx

@@ -857,13 +857,13 @@ export function EntityForm<M extends Record<string, any>>({
                                 />}
 
                             {formex.dirty
-                                ? <Tooltip title={"There are local unsaved changes"}>
-                                    <Chip size={"small"} colorScheme={"orangeDarker"}>
+                                ? <Tooltip title={"This form has been modified"}>
+                                    <Chip size={"small"} className={"py-1"} colorScheme={"orangeDarker"}>
                                         <EditIcon size={"smallest"}/>
                                     </Chip>
                                 </Tooltip>
                                 : <Tooltip title={"The current form is in sync with the database"}>
-                                    <Chip size={"small"}>
+                                    <Chip size={"small"} className={"py-1"} >
                                         <CheckIcon size={"smallest"}/>
                                     </Chip>
                                 </Tooltip>}