@firecms/core 3.0.0-canary.45 → 3.0.0-canary.46

package/dist/types/collections.d.ts

@@ -257,7 +257,14 @@ export interface EntityCollection<M extends Record<string, any> = any, UserType
      * are writing custom code
      */
     ownerId?: string;
+    /**
+     * Overrides for the entity view, like the data source or the storage source.
+     */
     overrides?: EntityOverrides;
+    /**
+     * Width of the side dialog (in pixels) when opening an entity in this collection.
+     */
+    sideDialogWidth?: number | string;
 }
 /**
  * Parameter passed to the `Actions` prop in the collection configuration.

package/dist/types/entity_actions.d.ts

@@ -4,9 +4,23 @@ import { Entity } from "./entities";
 import { EntityCollection, SelectionController } from "./collections";
 import { User } from "./user";
 import { SideEntityController } from "./side_entity_controller";
+/**
+ * An entity action is a custom action that can be performed on an entity.
+ * They are displayed in the entity view and in the collection view.
+ */
 export type EntityAction<M extends object = any, UserType extends User = User> = {
+    /**
+     * Title of the action
+     */
     name: string;
+    /**
+     * Icon of the action
+     */
     icon?: React.ReactElement;
+    /**
+     * Callback when the action is clicked
+     * @param props
+     */
     onClick: (props: EntityActionClickProps<M, UserType>) => Promise<void> | void;
     /**
      * Show this action collapsed in the menu of the collection view.

package/dist/util/icon_synonyms.d.ts

@@ -1,4 +1,4 @@
-export declare const icon_synonyms: {
+export declare const iconSynonyms: {
     abc: string;
     access_alarm: string;
     access_alarms: string;
@@ -84,7 +84,6 @@ export declare const icon_synonyms: {
     apartment: string;
     api: string;
     app_blocking: string;
-    apple: string;
     app_registration: string;
     approval: string;
     apps: string;
@@ -527,7 +526,6 @@ export declare const icon_synonyms: {
     egg_alt: string;
     eighteen_mp: string;
     eight_k: string;
-    eight_k_plus: string;
     eight_mp: string;
     eightteen_mp: string;
     eject: string;
@@ -722,7 +720,6 @@ export declare const icon_synonyms: {
     four_g_mobiledata: string;
     four_g_plus_mobiledata: string;
     four_k: string;
-    four_k_plus: string;
     four_mp: string;
     fourteen_mp: string;
     free_breakfast: string;

package/dist/util/resolutions.d.ts

@@ -14,10 +14,9 @@ export declare const resolveCollection: <M extends Record<string, any>>({ collec
  * @param propertyValue
  * @param values
  */
-export declare function resolveProperty<T extends CMSType = CMSType, M extends Record<string, any> = any>({ propertyOrBuilder, propertyValue, fromBuilder, ...props }: {
+export declare function resolveProperty<T extends CMSType = CMSType, M extends Record<string, any> = any>({ propertyOrBuilder, fromBuilder, ...props }: {
     propertyKey?: string;
     propertyOrBuilder: PropertyOrBuilder<T, M> | ResolvedProperty<T>;
-    propertyValue?: unknown;
     values?: Partial<M>;
     previousValues?: Partial<M>;
     path?: string;
@@ -26,10 +25,9 @@ export declare function resolveProperty<T extends CMSType = CMSType, M extends R
     fromBuilder?: boolean;
     fields?: Record<string, PropertyConfig<any>>;
 }): ResolvedProperty<T> | null;
-export declare function resolveArrayProperty<T extends any[], M>({ propertyKey, property, propertyValue, ...props }: {
+export declare function resolveArrayProperty<T extends any[], M>({ propertyKey, property, ...props }: {
     propertyKey?: string;
     property: ArrayProperty<T> | ResolvedArrayProperty<T>;
-    propertyValue: any;
     values?: Partial<M>;
     previousValues?: Partial<M>;
     path?: string;
@@ -43,9 +41,8 @@ export declare function resolveArrayProperty<T extends any[], M>({ propertyKey,
  * @param properties
  * @param value
  */
-export declare function resolveProperties<M extends Record<string, any>>({ properties, propertyValue, ...props }: {
+export declare function resolveProperties<M extends Record<string, any>>({ properties, ...props }: {
     properties: PropertiesOrBuilders<M>;
-    propertyValue: unknown;
     values?: Partial<M>;
     previousValues?: Partial<M>;
     path?: string;

package/package.json

@@ -1,125 +1,142 @@
 {
-  "name": "@firecms/core",
-  "type": "module",
-  "version": "3.0.0-canary.45",
-  "description": "Awesome Firebase/Firestore-based headless open-source CMS",
-  "funding": {
-    "url": "https://github.com/sponsors/firecmsco"
-  },
-  "author": "FireCMS",
-  "license": "MIT",
-  "repository": "git@github.com:FireCMSco/firecms.git",
-  "main": "./dist/index.umd.js",
-  "module": "./dist/index.es.js",
-  "types": "./dist/index.d.ts",
-  "source": "src/index.ts",
-  "engines": {
-    "node": ">=14"
-  },
-  "keywords": [
-    "firebase",
-    "cms",
-    "admin",
-    "admin panel",
-    "firebase panel",
-    "firestore",
-    "headless",
-    "headless cms",
-    "content manager"
-  ],
-  "scripts": {
-    "watch": "vite build --watch",
-    "build": "vite build && tsc --emitDeclarationOnly -p tsconfig.prod.json",
-    "prepublishOnly": "run-s build",
-    "createTag": "PACKAGE_VERSION=$(cat package.json | grep version | head -1 | awk -F: '{ print $2 }' | sed 's/[\",]//g' | tr -d '[[:space:]]') && git tag v$PACKAGE_VERSION && git push --tags",
-    "test:lint": "eslint \"src/**\" --quiet",
-    "test": "jest",
-    "clean": "rm -rf dist && find ./src -name '*.js' -type f | xargs rm -f",
-    "generateIcons": "ts-node --esm src/icons/generateIcons.ts"
-  },
-  "exports": {
-    ".": {
-      "import": "./dist/index.es.js",
-      "require": "./dist/index.umd.js",
-      "types": "./dist/index.d.ts"
+    "name": "@firecms/core",
+    "type": "module",
+    "version": "3.0.0-canary.46",
+    "description": "Awesome Firebase/Firestore-based headless open-source CMS",
+    "funding": {
+        "url": "https://github.com/sponsors/firecmsco"
     },
-    "./package.json": "./package.json"
-  },
-  "dependencies": {
-    "@firecms/formex": "^3.0.0-canary.45",
-    "@firecms/ui": "^3.0.0-canary.45",
-    "@fontsource/jetbrains-mono": "^5.0.19",
-    "@hello-pangea/dnd": "^16.6.0",
-    "@radix-ui/react-portal": "^1.0.4",
-    "clsx": "^2.1.0",
-    "date-fns": "^3.6.0",
-    "history": "^5.3.0",
-    "js-search": "^2.0.1",
-    "markdown-it": "^14.1.0",
-    "notistack": "^3.0.1",
-    "object-hash": "^3.0.0",
-    "react-dropzone": "^14.2.3",
-    "react-fast-compare": "^3.2.2",
-    "react-image-file-resizer": "^0.4.8",
-    "react-markdown-editor-lite": "^1.3.4",
-    "react-transition-group": "^4.4.5",
-    "react-use-measure": "^2.1.1",
-    "react-window": "^1.8.10",
-    "typeface-rubik": "^1.1.13",
-    "yup": "^0.32.11"
-  },
-  "peerDependencies": {
-    "firebase": "^10.5.2",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "react-router": "^6.22.0",
-    "react-router-dom": "^6.22.0"
-  },
-  "eslintConfig": {
-    "extends": [
-      "react-app",
-      "react-app/jest"
-    ]
-  },
-  "devDependencies": {
-    "@jest/globals": "^29.7.0",
-    "@testing-library/jest-dom": "^6.4.2",
-    "@testing-library/react": "^14.3.1",
-    "@testing-library/user-event": "^14.5.2",
-    "@types/jest": "^29.5.12",
-    "@types/node": "^20.12.7",
-    "@types/object-hash": "^3.0.6",
-    "@types/react": "^18.2.79",
-    "@types/react-dom": "^18.2.25",
-    "@types/react-measure": "^2.0.12",
-    "@typescript-eslint/eslint-plugin": "^7.7.0",
-    "@typescript-eslint/parser": "^7.7.0",
-    "@vitejs/plugin-react": "^4.2.1",
-    "cross-env": "^7.0.3",
-    "eslint": "^8.57.0",
-    "eslint-config-standard": "^17.1.0",
-    "eslint-plugin-import": "^2.29.1",
-    "eslint-plugin-n": "^16.6.2",
-    "eslint-plugin-promise": "^6.1.1",
-    "eslint-plugin-react": "^7.34.1",
-    "eslint-plugin-react-hooks": "^4.6.0",
-    "firebase": "^10.11.0",
-    "jest": "^29.7.0",
-    "npm-run-all": "^4.1.5",
-    "react-router": "^6.22.3",
-    "react-router-dom": "^6.22.3",
-    "ts-jest": "^29.1.2",
-    "ts-node": "^10.9.2",
-    "tsd": "^0.31.0",
-    "typescript": "^5.4.5",
-    "vite": "^5.2.9"
-  },
-  "files": [
-    "dist",
-    "src"
-  ],
-  "gitHead": "7f22bfa3bb20479ad23becd9c10f78cac1a3bc32",
-  "publishConfig": {
-    "access": "public"
-  }
+    "author": "FireCMS",
+    "license": "MIT",
+    "repository": "git@github.com:FireCMSco/firecms.git",
+    "main": "./dist/index.umd.js",
+    "module": "./dist/index.es.js",
+    "types": "./dist/index.d.ts",
+    "source": "src/index.ts",
+    "engines": {
+        "node": ">=14"
+    },
+    "keywords": [
+        "firebase",
+        "cms",
+        "admin",
+        "admin panel",
+        "firebase panel",
+        "firestore",
+        "headless",
+        "headless cms",
+        "content manager"
+    ],
+    "scripts": {
+        "watch": "vite build --watch",
+        "build": "vite build && tsc --emitDeclarationOnly -p tsconfig.prod.json",
+        "prepublishOnly": "run-s build",
+        "createTag": "PACKAGE_VERSION=$(cat package.json | grep version | head -1 | awk -F: '{ print $2 }' | sed 's/[\",]//g' | tr -d '[[:space:]]') && git tag v$PACKAGE_VERSION && git push --tags",
+        "test:lint": "eslint \"src/**\" --quiet",
+        "test": "jest",
+        "clean": "rm -rf dist && find ./src -name '*.js' -type f | xargs rm -f",
+        "generateIcons": "ts-node --esm src/icons/generateIcons.ts"
+    },
+    "exports": {
+        ".": {
+            "import": "./dist/index.es.js",
+            "require": "./dist/index.umd.js",
+            "types": "./dist/index.d.ts"
+        },
+        "./package.json": "./package.json"
+    },
+    "dependencies": {
+        "@firecms/formex": "^3.0.0-canary.46",
+        "@firecms/ui": "^3.0.0-canary.46",
+        "@fontsource/jetbrains-mono": "^5.0.19",
+        "@hello-pangea/dnd": "^16.6.0",
+        "@radix-ui/react-portal": "^1.0.4",
+        "clsx": "^2.1.0",
+        "date-fns": "^3.6.0",
+        "history": "^5.3.0",
+        "js-search": "^2.0.1",
+        "markdown-it": "^14.1.0",
+        "notistack": "^3.0.1",
+        "object-hash": "^3.0.0",
+        "react-dropzone": "^14.2.3",
+        "react-fast-compare": "^3.2.2",
+        "react-image-file-resizer": "^0.4.8",
+        "react-markdown-editor-lite": "^1.3.4",
+        "react-transition-group": "^4.4.5",
+        "react-use-measure": "^2.1.1",
+        "react-window": "^1.8.10",
+        "typeface-rubik": "^1.1.13",
+        "yup": "^0.32.11"
+    },
+    "peerDependencies": {
+        "firebase": "^10.5.2",
+        "react": "^18.2.0",
+        "react-dom": "^18.2.0",
+        "react-router": "^6.22.0",
+        "react-router-dom": "^6.22.0"
+    },
+    "devDependencies": {
+        "@jest/globals": "^29.7.0",
+        "@testing-library/react": "^14.3.1",
+        "@testing-library/user-event": "^14.5.2",
+        "@types/jest": "^29.5.12",
+        "@types/node": "^20.12.7",
+        "@types/object-hash": "^3.0.6",
+        "@types/react": "^18.2.79",
+        "@types/react-dom": "^18.2.25",
+        "@types/react-measure": "^2.0.12",
+        "@typescript-eslint/eslint-plugin": "^7.7.0",
+        "@typescript-eslint/parser": "^7.7.0",
+        "@vitejs/plugin-react": "^4.2.1",
+        "cross-env": "^7.0.3",
+        "eslint": "^8.57.0",
+        "eslint-config-standard": "^17.1.0",
+        "eslint-plugin-import": "^2.29.1",
+        "eslint-plugin-n": "^16.6.2",
+        "eslint-plugin-promise": "^6.1.1",
+        "eslint-plugin-react": "^7.34.1",
+        "eslint-plugin-react-hooks": "^4.6.0",
+        "firebase": "^10.11.0",
+        "jest": "^29.7.0",
+        "npm-run-all": "^4.1.5",
+        "react-router": "^6.22.3",
+        "react-router-dom": "^6.22.3",
+        "ts-jest": "^29.1.2",
+        "ts-node": "^10.9.2",
+        "tsd": "^0.31.0",
+        "typescript": "^5.4.5",
+        "vite": "^5.2.9"
+    },
+    "files": [
+        "dist",
+        "src"
+    ],
+    "gitHead": "7af477c065bf21042e06cb957803665ee504a712",
+    "publishConfig": {
+        "access": "public"
+    },
+    "eslintConfig": {
+        "extends": [
+            "react-app",
+            "react-app/jest"
+        ]
+    },
+    "jest": {
+        "transform": {
+            "^.+\\.tsx?$": "ts-jest"
+        },
+        "testRegex": "(/__tests__/.*|(\\.|/)(test|spec))\\.tsx?$",
+        "moduleFileExtensions": [
+            "ts",
+            "tsx",
+            "js",
+            "jsx",
+            "json",
+            "node"
+        ],
+        "testEnvironment": "node",
+        "moduleNameMapper": {
+            "\\.(css|less)$": "<rootDir>/test/__mocks__/styleMock.js"
+        }
+    }
 }

package/src/components/EntityCollectionTable/EntityCollectionTable.tsx

@@ -44,6 +44,7 @@ import { cn } from "@firecms/ui";
 export const EntityCollectionTable = function EntityCollectionTable<M extends Record<string, any>, UserType extends User>
 ({
      className,
+     style,
      forceFilter,
      actionsStart,
      actions,
@@ -81,7 +82,6 @@ export const EntityCollectionTable = function EntityCollectionTable<M extends Re
     const ref = useRef<HTMLDivElement>(null);
 
     const largeLayout = useLargeLayout();
-    const disabledFilterChange = Boolean(forceFilter);
     const selectedEntities = (selectionController?.selectedEntities?.length > 0 ? selectionController?.selectedEntities : highlightedEntities)?.filter(Boolean);
 
     const context: FireCMSContext<UserType> = useFireCMSContext();
@@ -120,10 +120,8 @@ export const EntityCollectionTable = function EntityCollectionTable<M extends Re
         const propertyKey = column.key;
 
         let disabled = column.custom?.disabled;
-        const propertyValue = entity.values ? getValueInPath(entity.values, propertyKey) : undefined;
         const property = getPropertyFor?.({
             propertyKey,
-            propertyValue,
             entity
         }) ?? column.custom.resolvedProperty;
         if (!property?.disabled) {
@@ -211,7 +209,6 @@ export const EntityCollectionTable = function EntityCollectionTable<M extends Re
             properties,
             sortable,
             forceFilter,
-            disabledFilter: disabledFilterChange,
             AdditionalHeaderWidget
         });
 
@@ -294,6 +291,7 @@ export const EntityCollectionTable = function EntityCollectionTable<M extends Re
     return (
 
         <div ref={ref}
+             style={style}
              className={cn("h-full w-full flex flex-col bg-white dark:bg-gray-950", className)}>
 
             <CollectionTableToolbar

package/src/components/EntityCollectionTable/EntityCollectionTableProps.tsx

@@ -2,7 +2,7 @@ import React from "react";
 import {
     AdditionalFieldDelegate,
     CollectionSize,
-    Entity, EntityCollection,
+    Entity,
     EntityTableController,
     FilterValues,
     ResolvedProperties,
@@ -19,6 +19,9 @@ export type EntityCollectionTableProps<M extends Record<string, any>,
     UserType extends User = User> = {
 
     className?: string;
+
+    style?: React.CSSProperties;
+
     /**
      * Display these entities as selected
      */
@@ -137,7 +140,6 @@ export type EntityCollectionTableProps<M extends Record<string, any>,
 
 export type GetPropertyForProps<M extends Record<string, any>> = {
     propertyKey: string,
-    propertyValue: any,
     entity: Entity<M>
 };
 

package/src/components/EntityCollectionTable/column_utils.tsx

@@ -21,7 +21,6 @@ export interface PropertiesToColumnsParams<M extends Record<string, any>> {
     properties: ResolvedProperties<M>;
     sortable?: boolean;
     forceFilter?: FilterValues<keyof M extends string ? keyof M : never>;
-    disabledFilter?: boolean;
     AdditionalHeaderWidget?: React.ComponentType<{
         property: ResolvedProperty,
         propertyKey: string,
@@ -29,7 +28,8 @@ export interface PropertiesToColumnsParams<M extends Record<string, any>> {
     }>;
 }
 
-export function propertiesToColumns<M extends Record<string, any>>({ properties, sortable, forceFilter, disabledFilter, AdditionalHeaderWidget }: PropertiesToColumnsParams<M>): VirtualTableColumn[] {
+export function propertiesToColumns<M extends Record<string, any>>({ properties, sortable, forceFilter, AdditionalHeaderWidget }: PropertiesToColumnsParams<M>): VirtualTableColumn[] {
+    const disabledFilter = Boolean(forceFilter);
     return Object.entries<ResolvedProperty>(properties)
         .flatMap(([key, property]) => getColumnKeysForProperty(property, key))
         .map(({
@@ -45,7 +45,7 @@ export function propertiesToColumns<M extends Record<string, any>>({ properties,
                 align: getTableCellAlignment(property),
                 icon: getIconForProperty(property, "small"),
                 title: property.name ?? key as string,
-                sortable: sortable && (forceFilter ? Object.keys(forceFilter).includes(key) : true),
+                sortable: sortable,
                 filter: !disabledFilter && filterable,
                 width: getTablePropertyColumnWidth(property),
                 resizable: true,

package/src/components/EntityCollectionView/EntityCollectionView.tsx

@@ -34,7 +34,8 @@ import {
     saveEntityWithCallbacks,
     useAuthController,
     useCustomizationController,
-    useDataSource, useFireCMSContext,
+    useDataSource,
+    useFireCMSContext,
     useLargeLayout,
     useNavigationController,
     useSideEntityController
@@ -199,8 +200,7 @@ export const EntityCollectionView = React.memo(
 
         const tableController = useDataSourceEntityCollectionTableController<M>({
             fullPath,
-            collection: collectionRef.current,
-            entitiesDisplayedFirst: [],
+            collection,
             lastDeleteTimestamp
         });
 
@@ -359,7 +359,6 @@ export const EntityCollectionView = React.memo(
 
         const getPropertyFor = useCallback(({
                                                 propertyKey,
-                                                propertyValue,
                                                 entity
                                             }: GetPropertyForProps<M>) => {
             let propertyOrBuilder: PropertyOrBuilder<any, M> | undefined = getPropertyInPath<M>(collection.properties, propertyKey);
@@ -374,7 +373,6 @@ export const EntityCollectionView = React.memo(
                 propertyKey,
                 propertyOrBuilder,
                 path: fullPath,
-                propertyValue,
                 values: entity.values,
                 entityId: entity.id,
                 fields: customizationController.propertyConfigs
@@ -709,6 +707,7 @@ export const EntityCollectionView = React.memo(
             equal(a.initialSort, b.initialSort) &&
             equal(a.textSearchEnabled, b.textSearchEnabled) &&
             equal(a.additionalFields, b.additionalFields) &&
+            equal(a.sideDialogWidth, b.sideDialogWidth) &&
             equal(a.forceFilter, b.forceFilter);
     }) as React.FunctionComponent<EntityCollectionViewProps<any>>
 
@@ -748,6 +747,7 @@ function EntitiesCount({
 
     useEffect(() => {
         if (onCountChange) {
+            setError(undefined);
             onCountChange(count ?? 0);
         }
     }, [onCountChange, count]);

package/src/components/FireCMSAppBar.tsx

@@ -96,7 +96,7 @@ export const FireCMSAppBar = function FireCMSAppBar({
             className={cn("pr-2",
                 {
                     "ml-[17rem]": drawerOpen && largeLayout,
-                    "ml-16": includeDrawer && !(drawerOpen && largeLayout) && !startAdornment,
+                    "ml-16": includeDrawer && !(drawerOpen && largeLayout),
                     "h-16": true,
                     "z-10": largeLayout,
                     "transition-all": true,
@@ -112,9 +112,6 @@ export const FireCMSAppBar = function FireCMSAppBar({
 
             <div className="flex flex-row gap-2 px-4 h-full items-center">
 
-                {startAdornment}
-
-
                 {navigation && <div className="mr-8 hidden lg:block">
                     <ReactLink
                         className="visited:text-inherit visited:dark:text-inherit"
@@ -138,6 +135,8 @@ export const FireCMSAppBar = function FireCMSAppBar({
                     </ReactLink>
                 </div>}
 
+                {startAdornment}
+
                 <div className={"flex-grow"}/>
 
                 {endAdornment &&

package/src/components/HomePage/SmallNavigationCard.tsx

@@ -1,6 +1,6 @@
 import { ArrowForwardIcon, cardClickableMixin, cardMixin, cn, focusedMixin, Typography, } from "@firecms/ui";
 
-import { Link as ReactLink } from "react-router-dom";
+import { Link } from "react-router-dom";
 
 export type SmallNavigationCardProps = {
     name: string,
@@ -17,7 +17,7 @@ export function SmallNavigationCard({
     return (
         <>
 
-            <ReactLink
+            <Link
                 tabIndex={0}
                 className={cn(cardMixin,
                     cardClickableMixin,
@@ -39,7 +39,7 @@ export function SmallNavigationCard({
                 <div className={"p-4"}>
                     <ArrowForwardIcon color="primary"/>
                 </div>
-            </ReactLink>
+            </Link>
 
         </>);
 }

package/src/components/SearchIconsView.tsx

@@ -1,14 +1,14 @@
 import React from "react";
 
 import { coolIconKeys, debounce, Icon, IconButton, iconKeys, SearchBar, Tooltip } from "@firecms/ui";
-import { icon_synonyms, iconsSearch } from "../util";
+import { iconSynonyms, iconsSearch } from "../util";
 
 const UPDATE_SEARCH_INDEX_WAIT_MS = 220;
 
-if (process.env.NODE_ENV !== "production") {
-    Object.keys(icon_synonyms).forEach((icon: string) => {
+if (iconSynonyms && process.env.NODE_ENV !== "production") {
+    Object.keys(iconSynonyms).forEach((icon: string) => {
         if (!iconKeys.includes(icon)) {
-            console.warn(`The icon ${icon} no longer exists. Remove it from \`icon_synonyms\``);
+            console.warn(`The icon ${icon} no longer exists. Remove it from \`iconSynonyms\``);
         }
     });
 }

package/src/components/common/useDataSourceEntityCollectionTableController.tsx

@@ -12,6 +12,7 @@ import {
     User
 } from "../../types";
 import { useDebouncedData } from "./useDebouncedData";
+import equal from "react-fast-compare"
 
 const DEFAULT_PAGE_SIZE = 50;
 
@@ -31,6 +32,10 @@ export type DataSourceEntityCollectionTableControllerProps<M extends Record<stri
     entitiesDisplayedFirst?: Entity<M>[];
 
     lastDeleteTimestamp?: number;
+
+    /**
+     * Force filter to be applied to the table.
+     */
     forceFilter?: FilterValues<string>;
 }
 
@@ -83,6 +88,12 @@ export function useDataSourceEntityCollectionTableController<M extends Record<st
         return initialSort;
     }, [initialSort, forceFilter]);
 
+    useEffect(() => {
+        if (!equal(forceFilter, filterValues)) {
+            setFilterValues(forceFilter)
+        }
+    }, [forceFilter]);
+
     const [filterValues, setFilterValues] = React.useState<FilterValues<Extract<keyof M, string>> | undefined>(forceFilter ?? initialFilter ?? undefined);
     const [sortBy, setSortBy] = React.useState<[Extract<keyof M, string>, "asc" | "desc"] | undefined>(initialSortInternal);
 

package/src/core/EntityEditView.tsx

@@ -31,7 +31,6 @@ import {
 import { EntityForm } from "../form";
 import { CircularProgress, CloseIcon, cn, defaultBorderMixin, IconButton, Tab, Tabs, Typography } from "@firecms/ui";
 import { EntityFormSaveParams } from "../form/EntityForm";
-import { FORM_CONTAINER_WIDTH } from "../internal/common";
 import { useSideDialogContext } from "./index";
 
 const MAIN_TAB_VALUE = "main_##Q$SC^#S6";
@@ -91,8 +90,7 @@ export function EntityEditView<M extends Record<string, any>, UserType extends U
 
     // const largeLayout = useLargeLayout();
     // const largeLayoutTabSelected = useRef(!largeLayout);
-
-    const resolvedFormWidth: string = typeof formWidth === "number" ? `${formWidth}px` : formWidth ?? FORM_CONTAINER_WIDTH;
+    // const resolvedFormWidth: string = typeof formWidth === "number" ? `${formWidth}px` : formWidth ?? FORM_CONTAINER_WIDTH;
 
     const dataSource = useDataSource(collection);
     const sideDialogContext = useSideDialogContext();
@@ -395,6 +393,7 @@ export function EntityEditView<M extends Record<string, any>, UserType extends U
             onValuesAreModified(dirty);
     }
 
+    console.log("eeee", collection);
     function buildForm() {
         const plugins = customizationController.plugins;
         let form = <EntityForm