@firecms/core 3.0.0-beta.14 → 3.0.0-beta.15

package/dist/types/analytics.d.ts

@@ -1 +1 @@
-export type CMSAnalyticsEvent = "entity_click" | "entity_click_from_reference" | "reference_selection_clear" | "reference_selection_toggle" | "reference_selected_single" | "reference_selection_new_entity" | "edit_entity_clicked" | "entity_edited" | "new_entity_click" | "new_entity_saved" | "copy_entity_click" | "entity_copied" | "single_delete_dialog_open" | "multiple_delete_dialog_open" | "single_entity_deleted" | "multiple_entities_deleted" | "drawer_navigate_to_home" | "drawer_navigate_to_collection" | "drawer_navigate_to_view" | "home_navigate_to_collection" | "home_favorite_navigate_to_collection" | "home_navigate_to_view" | "home_navigate_to_admin_view" | "home_favorite_navigate_to_view" | "collection_inline_editing" | "unmapped_event";
+export type CMSAnalyticsEvent = "entity_click" | "entity_click_from_reference" | "reference_selection_clear" | "reference_selection_toggle" | "reference_selected_single" | "reference_selection_new_entity" | "edit_entity_clicked" | "entity_edited" | "new_entity_click" | "new_entity_saved" | "copy_entity_click" | "entity_copied" | "single_delete_dialog_open" | "multiple_delete_dialog_open" | "single_entity_deleted" | "multiple_entities_deleted" | "drawer_navigate_to_home" | "drawer_navigate_to_collection" | "drawer_navigate_to_view" | "home_navigate_to_collection" | "home_favorite_navigate_to_collection" | "home_navigate_to_view" | "home_navigate_to_admin_view" | "home_favorite_navigate_to_view" | "home_move_card" | "home_move_group" | "home_drop_new_group" | "collection_inline_editing" | "unmapped_event";

package/dist/types/collections.d.ts

@@ -61,11 +61,14 @@ export interface EntityCollection<M extends Record<string, any> = any, USER exte
      * e.g. 'account_tree' or 'person'.
      * Find all the icons in https://firecms.co/docs/icons
      */
-    icon?: string;
+    icon?: string | React.ReactNode;
     /**
      * Optional field used to group top level navigation entries under a~
      * navigation view. If you set this value in a subcollection it has no
      * effect.
+     * @deprecated This prop is deprecated and will be removed in the future.
+     * You can apply grouping by using the `navigationGroupMappings` prop in the
+     * {@link useBuildNavigationController} hook instead.
      */
     group?: string;
     /**
@@ -170,8 +173,11 @@ export interface EntityCollection<M extends Record<string, any> = any, USER exte
      *     }
      * }
      * ```
+     *
+     * You can also pass the action as a string that represents the `key`, in which case it will
+     * use the action defined in the main configuration under `entityActions`.
      */
-    entityActions?: EntityAction<M, USER>[];
+    entityActions?: (EntityAction<M, USER> | string)[];
     /**
      * Pass your own selection controller if you want to control selected
      * entities externally.

package/dist/types/customization_controller.d.ts

@@ -4,6 +4,7 @@ import { FireCMSPlugin } from "./plugins";
 import { EntityCustomView } from "./collections";
 import { Locale } from "./locales";
 import { PropertyConfig } from "./property_config";
+import { EntityAction } from "./entity_actions";
 export type CustomizationController = {
     /**
      * Builder for generating utility links for entities
@@ -21,6 +22,13 @@ export type CustomizationController = {
      * You can also define an entity view from the UI.
      */
     entityViews?: EntityCustomView[];
+    /**
+     * List of actions that can be performed on entities.
+     * These actions are displayed in the entity view and in the collection view.
+     * You can later reuse these actions in the `entityActions` prop of a collection,
+     * by specifying the `key` of the action.
+     */
+    entityActions?: EntityAction<any, any>[];
     /**
      * Format of the dates in the CMS.
      * Defaults to 'MMMM dd, yyyy, HH:mm:ss'

package/dist/types/entity_actions.d.ts

@@ -4,6 +4,7 @@ import { Entity } from "./entities";
 import { EntityCollection, SelectionController } from "./collections";
 import { User } from "./user";
 import { SideEntityController } from "./side_entity_controller";
+import { FormContext } from "./fields";
 /**
  * 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.
@@ -15,7 +16,10 @@ export type EntityAction<M extends object = any, USER extends User = User> = {
     name: string;
     /**
      * Key of the action. You only need to provide this if you want to
-     * override the default actions.
+     * override the default actions, or if you are not passing the action
+     * directly to the `entityActions` prop of a collection.
+     * You can define your actions at the app level, in which case you
+     * must provide a key.
      * The default actions are:
      * - edit
      * - delete
@@ -31,6 +35,11 @@ export type EntityAction<M extends object = any, USER extends User = User> = {
      * @param props
      */
     onClick: (props: EntityActionClickProps<M, USER>) => Promise<void> | void;
+    /**
+     * Optional callback in case you want to disable the action
+     * @param props
+     */
+    isEnabled?: (props: EntityActionClickProps<M, USER>) => boolean;
     /**
      * Show this action collapsed in the menu of the collection view.
      * Defaults to true
@@ -43,17 +52,48 @@ export type EntityAction<M extends object = any, USER extends User = User> = {
     includeInForm?: boolean;
 };
 export type EntityActionClickProps<M extends object, USER extends User = User> = {
-    entity: Entity<M>;
+    entity?: Entity<M>;
     context: FireCMSContext<USER>;
     fullPath?: string;
+    fullIdPath?: string;
     collection?: EntityCollection<M>;
+    /**
+     * Optional form context, present if the action is being called from a form.
+     * This allows you to access the form state and methods, including modifying the form values.
+     */
+    formContext?: FormContext;
+    /**
+     * Present if this actions is being called from a side dialog only
+     */
+    sideEntityController?: SideEntityController;
+    /**
+     * Is the action being called from the collection view or from the entity form view?
+     */
+    view: "collection" | "form";
+    /**
+     * If the action is rendered in the form, is it open in a side panel or full screen?
+     */
+    openEntityMode: "side_panel" | "full_screen";
+    /**
+     * Optional selection controller, present if the action is being called from a collection view
+     */
     selectionController?: SelectionController;
+    /**
+     * Optional highlight function to highlight the entity in the collection view
+     * @param entity
+     */
     highlightEntity?: (entity: Entity<any>) => void;
+    /**
+     * Optional unhighlight function to remove the highlight from the entity in the collection view
+     * @param entity
+     */
     unhighlightEntity?: (entity: Entity<any>) => void;
-    onCollectionChange?: () => void;
     /**
-     * If this actions is being called from a side dialog
+     * Optional function to navigate back (e.g. when deleting an entity or navigating from a form)
      */
-    sideEntityController?: SideEntityController;
-    openEntityMode: "side_panel" | "full_screen";
+    navigateBack?: () => void;
+    /**
+     * Callback to be called when the collection changes, e.g. after an entity is deleted or created.
+     */
+    onCollectionChange?: () => void;
 };

package/dist/types/firecms.d.ts

@@ -12,6 +12,7 @@ import { EntityLinkBuilder } from "./entity_link_builder";
 import { UserConfigurationPersistence } from "./local_config_persistence";
 import { FireCMSPlugin } from "./plugins";
 import { CMSAnalyticsEvent } from "./analytics";
+import { EntityAction } from "./entity_actions";
 /**
  * Use this callback to build entity collections dynamically.
  * You can use the user to decide which collections to show.
@@ -85,6 +86,13 @@ export type FireCMSProps<USER extends User> = {
      * You can also define an entity view from the UI.
      */
     entityViews?: EntityCustomView[];
+    /**
+     * List of actions that can be performed on entities.
+     * These actions are displayed in the entity view and in the collection view.
+     * You can later reuse these actions in the `entityActions` prop of a collection,
+     * by specifying the `key` of the action.
+     */
+    entityActions?: EntityAction[];
     /**
      * Format of the dates in the CMS.
      * Defaults to 'MMMM dd, yyyy, HH:mm:ss'

package/dist/types/navigation.d.ts

@@ -31,7 +31,7 @@ export type NavigationController<EC extends EntityCollection = EntityCollection<
      * level of the navigation (e.g. in the home page or the navigation
      * drawer)
      */
-    topLevelNavigation?: TopNavigationResult;
+    topLevelNavigation?: NavigationResult;
     /**
      * Is the navigation loading (the configuration persistence has not
      * loaded yet, or a specified navigation builder has not completed)
@@ -172,7 +172,7 @@ export interface CMSView {
      * e.g. 'account_tree' or 'person'
      * Find all the icons in https://firecms.co/docs/icons
      */
-    icon?: string;
+    icon?: string | React.ReactNode;
     /**
      * Should this view be hidden from the main navigation panel.
      * It will still be accessible if you reach the specified path
@@ -190,7 +190,21 @@ export interface CMSView {
      */
     group?: string;
 }
-export interface TopNavigationEntry {
+/**
+ * Used to group navigation entries in the main navigation.
+ */
+export interface NavigationGroupMapping {
+    /**
+     * Name of the group, used to display the group header in the UI
+     */
+    name: string;
+    /**
+     * List of collection ids or view paths that belong to this group.
+     */
+    entries: string[];
+}
+export interface NavigationEntry {
+    id: string;
     url: string;
     name: string;
     path: string;
@@ -200,7 +214,9 @@ export interface TopNavigationEntry {
     description?: string;
     group: string;
 }
-export type TopNavigationResult = {
-    navigationEntries: TopNavigationEntry[];
+export type NavigationResult = {
+    allowDragAndDrop: boolean;
+    navigationEntries: NavigationEntry[];
     groups: string[];
+    onNavigationEntriesUpdate: (entries: NavigationGroupMapping[]) => void;
 };

package/dist/types/plugins.d.ts

@@ -6,6 +6,7 @@ import { FieldProps, FormContext } from "./fields";
 import { CMSType, Property } from "./properties";
 import { EntityStatus } from "./entities";
 import { ResolvedProperty } from "./resolved_entities";
+import { NavigationGroupMapping } from "./navigation";
 /**
  * Interface used to define plugins for FireCMS.
  * NOTE: This is a work in progress and the API is not stable yet.
@@ -70,6 +71,17 @@ export type FireCMSPlugin<PROPS = any, FORM_PROPS = any, EC extends EntityCollec
             title: string;
             children: React.ReactNode;
         };
+        /**
+         * Allow reordering with drag and drop of the collections in the home page.
+         */
+        allowDragAndDrop?: boolean;
+        navigationEntries?: NavigationGroupMapping[];
+        /**
+         * This method will be called when the entries are updated in the home page.
+         * group => navigationEntriesOrder (path)
+         * @param entries
+         */
+        onNavigationEntriesUpdate?: (entries: NavigationGroupMapping[]) => void;
     };
     collectionView?: {
         /**
@@ -127,7 +139,14 @@ export type FireCMSPlugin<PROPS = any, FORM_PROPS = any, EC extends EntityCollec
             Component: React.ComponentType<PropsWithChildren<FORM_PROPS & PluginFormActionProps<any, EC>>>;
             props?: FORM_PROPS;
         };
+        /**
+         * Add custom actions to the default ones ("Save", "Discard"...)
+         */
         Actions?: React.ComponentType<PluginFormActionProps<any, EC>>;
+        /**
+         * Add custom actions to the top of the form
+         */
+        ActionsTop?: React.ComponentType<PluginFormActionProps<any, EC>>;
         fieldBuilder?: <T extends CMSType = CMSType>(props: PluginFieldBuilderParams<T, any, EC>) => React.ComponentType<FieldProps<T>> | null;
         fieldBuilderEnabled?: <T extends CMSType = CMSType>(props: PluginFieldBuilderParams<T>) => boolean;
     };
@@ -169,12 +188,12 @@ export interface PluginHomePageActionsProps<EP extends object = object, M extend
 export interface PluginFormActionProps<USER extends User = User, EC extends EntityCollection = EntityCollection> {
     entityId?: string;
     path: string;
+    parentCollectionIds: string[];
     status: EntityStatus;
     collection: EC;
     disabled: boolean;
     formContext?: FormContext<any>;
     context: FireCMSContext<USER>;
-    currentEntityId?: string;
     openEntityMode: "side_panel" | "full_screen";
 }
 export type PluginFieldBuilderParams<T extends CMSType = CMSType, M extends Record<string, any> = any, EC extends EntityCollection<M> = EntityCollection<M>> = {

package/dist/types/properties.d.ts

@@ -312,6 +312,13 @@ export interface StringProperty extends BaseProperty<string> {
      * Add an icon to clear the value and set it to `null`. Defaults to `false`
      */
     clearable?: boolean;
+    /**
+     * You can use this property (a string) to behave as a reference to another
+     * collection. The stored value is the ID of the entity in the
+     * collection, and the `path` prop is used to
+     * define the collection this reference points to.
+     */
+    reference?: ReferenceProperty;
 }
 /**
  * @group Entity properties

package/dist/types/property_config.d.ts

@@ -37,4 +37,4 @@ export type PropertyConfig<T extends CMSType = any> = {
      */
     description?: string;
 };
-export type PropertyConfigId = "text_field" | "multiline" | "markdown" | "url" | "email" | "select" | "multi_select" | "number_input" | "number_select" | "multi_number_select" | "file_upload" | "multi_file_upload" | "group" | "key_value" | "reference" | "multi_references" | "switch" | "date_time" | "repeat" | "custom_array" | "block";
+export type PropertyConfigId = "text_field" | "multiline" | "markdown" | "url" | "email" | "select" | "multi_select" | "number_input" | "number_select" | "multi_number_select" | "file_upload" | "multi_file_upload" | "group" | "key_value" | "reference" | "reference_as_string" | "multi_references" | "switch" | "date_time" | "repeat" | "custom_array" | "block";

package/dist/types/side_entity_controller.d.ts

@@ -11,6 +11,10 @@ export interface EntitySidePanelProps<M extends Record<string, any> = any> {
      * Absolute path of the entity
      */
     path: string;
+    /**
+     * Full CMS path of the entity, including the collection and sub-collections.
+     */
+    fullIdPath?: string;
     /**
      * ID of the entity, if not set, it means we are creating a new entity
      */

package/dist/util/icons.d.ts

@@ -1,12 +1,12 @@
 import React from "react";
 import { IconColor } from "@firecms/ui";
-export declare function getIcon(iconKey?: string, className?: string, color?: IconColor): React.ReactElement | undefined;
+export declare function getIcon(iconKey?: string | React.ReactNode, className?: string, color?: IconColor, size?: "smallest" | "small" | "medium" | "large" | number): React.ReactElement | undefined;
 export type IconViewProps = {
     path: string;
     name: string;
     singularName?: string;
     group?: string;
-    icon?: string;
+    icon?: string | React.ReactNode;
 };
 export declare const IconForView: React.NamedExoticComponent<{
     collectionOrView?: IconViewProps;

package/dist/util/navigation_from_path.d.ts

@@ -4,6 +4,7 @@ export interface NavigationViewEntityInternal<M extends Record<string, any>> {
     type: "entity";
     entityId: string;
     path: string;
+    fullIdPath: string;
     fullPath: string;
     parentCollection: EntityCollection<M>;
 }
@@ -11,12 +12,14 @@ export interface NavigationViewCollectionInternal<M extends Record<string, any>>
     type: "collection";
     id: string;
     path: string;
+    fullIdPath: string;
     fullPath: string;
     collection: EntityCollection<M>;
 }
 export interface NavigationViewEntityCustomInternal<M extends Record<string, any>> {
     type: "custom_view";
     path: string;
+    fullIdPath: string;
     fullPath: string;
     entityId: string;
     view: EntityCustomView<M>;
@@ -25,5 +28,6 @@ export declare function getNavigationEntriesFromPath(props: {
     path: string;
     collections: EntityCollection[] | undefined;
     currentFullPath?: string;
+    currentFullIdPath?: string;
     contextEntityViews?: EntityCustomView<any>[];
 }): NavigationViewInternal[];

package/dist/util/resolutions.d.ts

@@ -1,4 +1,4 @@
-import { ArrayProperty, AuthController, CMSType, CustomizationController, EntityCollection, EntityCustomView, EntityValues, EnumValueConfig, EnumValues, NumberProperty, PropertiesOrBuilders, PropertyConfig, PropertyOrBuilder, ResolvedArrayProperty, ResolvedEntityCollection, ResolvedNumberProperty, ResolvedProperties, ResolvedProperty, ResolvedStringProperty, StringProperty, UserConfigurationPersistence } from "../types";
+import { ArrayProperty, AuthController, CMSType, CustomizationController, EntityAction, EntityCollection, EntityCustomView, EntityValues, EnumValueConfig, EnumValues, NumberProperty, PropertiesOrBuilders, PropertyConfig, PropertyOrBuilder, ResolvedArrayProperty, ResolvedEntityCollection, ResolvedNumberProperty, ResolvedProperties, ResolvedProperty, ResolvedStringProperty, StringProperty, UserConfigurationPersistence } from "../types";
 export declare const resolveCollection: <M extends Record<string, any>>({ collection, path, entityId, values, previousValues, userConfigPersistence, propertyConfigs, ignoreMissingFields, authController }: {
     collection: EntityCollection<M> | ResolvedEntityCollection<M>;
     path: string;
@@ -81,6 +81,7 @@ export declare function resolveProperties<M extends Record<string, any>>({ prope
 export declare function resolvePropertyEnum(property: StringProperty | NumberProperty, fromBuilder?: boolean): ResolvedStringProperty | ResolvedNumberProperty;
 export declare function resolveEnumValues(input: EnumValues): EnumValueConfig[] | undefined;
 export declare function resolveEntityView(entityView: string | EntityCustomView<any>, contextEntityViews?: EntityCustomView<any>[]): EntityCustomView<any> | undefined;
+export declare function resolveEntityAction<M extends Record<string, any>>(entityAction: string | EntityAction<M>, contextEntityActions?: EntityAction<M>[]): EntityAction<M> | undefined;
 export declare function resolvedSelectedEntityView<M extends Record<string, any>>(customViews: (string | EntityCustomView<M>)[] | undefined, customizationController: CustomizationController, selectedTab?: string, canEdit?: boolean): {
     resolvedEntityViews: EntityCustomView<M>[];
     selectedEntityView: EntityCustomView<M> | undefined;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@firecms/core",
   "type": "module",
-  "version": "3.0.0-beta.14",
+  "version": "3.0.0-beta.15",
   "description": "Awesome Firebase/Firestore-based headless open-source CMS",
   "funding": {
     "url": "https://github.com/sponsors/firecmsco"
@@ -53,9 +53,9 @@
     "@dnd-kit/core": "^6.3.1",
     "@dnd-kit/modifiers": "^9.0.0",
     "@dnd-kit/sortable": "^10.0.0",
-    "@firecms/editor": "^3.0.0-beta.14",
-    "@firecms/formex": "^3.0.0-beta.14",
-    "@firecms/ui": "^3.0.0-beta.14",
+    "@firecms/editor": "^3.0.0-beta.15",
+    "@firecms/formex": "^3.0.0-beta.15",
+    "@firecms/ui": "^3.0.0-beta.15",
     "@radix-ui/react-portal": "^1.1.3",
     "clsx": "^2.1.1",
     "date-fns": "^3.6.0",
@@ -107,7 +107,7 @@
     "dist",
     "src"
   ],
-  "gitHead": "22973ce94cd4ee8ccb4d586ba7f15383dc2cf30b",
+  "gitHead": "0abe2ca034f396e389db595f07ef4b24b439c648",
   "publishConfig": {
     "access": "public"
   },

package/src/components/ConfirmationDialog.tsx

@@ -29,6 +29,7 @@ export function ConfirmationDialog({
 
             <DialogActions>
                 <Button
+                    color={"primary"}
                     variant={"text"}
                     onClick={onCancel}
                     autoFocus>Cancel</Button>

package/src/components/EntityCollectionTable/EntityCollectionRowActions.tsx

@@ -33,6 +33,7 @@ export const EntityCollectionRowActions = function EntityCollectionRowActions({
                                                                                   entity,
                                                                                   collection,
                                                                                   fullPath,
+                                                                                  fullIdPath,
                                                                                   width,
                                                                                   frozen,
                                                                                   isSelected,
@@ -50,6 +51,7 @@ export const EntityCollectionRowActions = function EntityCollectionRowActions({
                                                                                   entity: Entity<any>,
                                                                                   collection?: EntityCollection<any>,
                                                                                   fullPath?: string,
+                                                                                  fullIdPath?: string,
                                                                                   width: number,
                                                                                   frozen?: boolean,
                                                                                   size: CollectionSize,
@@ -105,8 +107,10 @@ export const EntityCollectionRowActions = function EntityCollectionRowActions({
                                 onClick={(event: MouseEvent) => {
                                     event.stopPropagation();
                                     action.onClick({
+                                        view: "collection",
                                         entity,
                                         fullPath,
+                                        fullIdPath,
                                         collection,
                                         context,
                                         selectionController,
@@ -134,8 +138,10 @@ export const EntityCollectionRowActions = function EntityCollectionRowActions({
                                     onClick={(e) => {
                                         e.stopPropagation();
                                         action.onClick({
+                                            view: "collection",
                                             entity,
                                             fullPath,
+                                            fullIdPath,
                                             collection,
                                             context,
                                             selectionController,

package/src/components/EntityCollectionTable/PropertyTableCell.tsx

@@ -4,10 +4,12 @@ import {
     CMSType,
     Entity,
     EntityReference,
+    ReferenceProperty,
     ResolvedArrayProperty,
     ResolvedNumberProperty,
     ResolvedProperty,
-    ResolvedStringProperty
+    ResolvedStringProperty,
+    StringProperty
 } from "../../types";
 
 import { VirtualTableInput } from "../VirtualTable/fields/VirtualTableInput";
@@ -251,7 +253,27 @@ export const PropertyTableCell = React.memo<PropertyTableCellProps<any>>(
 
         if (!customField && (!customPreview || selected)) {
             const isAStorageProperty = isStorageProperty(property);
-            if (isAStorageProperty) {
+            if (property.dataType === "string" && (property as StringProperty).reference?.path) {
+                const stringProperty = property as StringProperty;
+                const path = stringProperty.reference?.path as string;
+                const referenceProperty = stringProperty.reference as ReferenceProperty;
+                const referenceValue = internalValue ? new EntityReference(internalValue, path) : undefined;
+                innerComponent =
+                    <TableReferenceField name={propertyKey as string}
+                                         internalValue={referenceValue}
+                                         updateValue={(v) => updateValue(v ? (v as EntityReference).id : null)}
+                                         disabled={disabled}
+                                         size={size}
+                                         path={path}
+                                         multiselect={false}
+                                         previewProperties={referenceProperty.previewProperties}
+                                         includeId={referenceProperty.includeId}
+                                         includeEntityLink={referenceProperty.includeEntityLink}
+                                         title={stringProperty.name}
+                                         forceFilter={referenceProperty.forceFilter}
+                    />;
+                allowScroll = false;
+            } else if (isAStorageProperty) {
                 innerComponent = <TableStorageUpload error={validationError ?? error}
                                                      disabled={disabled}
                                                      focused={selected}
@@ -310,7 +332,7 @@ export const PropertyTableCell = React.memo<PropertyTableCellProps<any>>(
                                                          updateValue={updateValue}
                     />;
                     fullHeight = true;
-                } else if (stringProperty.markdown || !stringProperty.storage) {
+                } else if (stringProperty.markdown || !stringProperty.storage || !stringProperty.reference) {
                     const multiline = Boolean(stringProperty.multiline) || Boolean(stringProperty.markdown);
                     innerComponent = <VirtualTableInput error={validationError ?? error}
                                                         disabled={disabled}

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

@@ -73,7 +73,7 @@ export function CollectionTableToolbar({
         <div
             className={cls(defaultBorderMixin, "no-scrollbar min-h-[56px] overflow-x-auto px-2 md:px-4 bg-surface-50 dark:bg-surface-900 border-b flex flex-row justify-between items-center w-full")}>
 
-            <div className="flex items-center gap-2 md:mr-4 mr-2">
+            <div className="flex items-center gap-1 md:mr-4 mr-2">
 
                 {title && <div className={"hidden lg:block"}>
                     {title}
@@ -85,7 +85,7 @@ export function CollectionTableToolbar({
 
             </div>
 
-            <div className="flex items-center gap-2">
+            <div className="flex items-center gap-1">
 
                 {largeLayout && <div className="w-[22px] mr-4">
                     {loading &&

package/src/components/EntityCollectionView/EntityCollectionView.tsx

@@ -31,6 +31,7 @@ import {
     mergeEntityActions,
     navigateToEntity,
     resolveCollection,
+    resolveEntityAction,
     resolveProperty
 } from "../../util";
 import { ReferencePreview } from "../../preview";
@@ -151,7 +152,6 @@ export const EntityCollectionView = React.memo(
                                                                  }: EntityCollectionViewProps<M>
     ) {
 
-
         const context = useFireCMSContext();
         const navigation = useNavigationController();
         const fullPath = fullPathProp ?? collectionProp.path;
@@ -256,7 +256,6 @@ export const EntityCollectionView = React.memo(
         }, [unselectNavigatedEntity, sideEntityController]);
 
         const onNewClick = useCallback(() => {
-
             const collection = collectionRef.current;
             analyticsController.onAnalyticsEvent?.("new_entity_click", {
                 path: fullPath
@@ -522,10 +521,13 @@ export const EntityCollectionView = React.memo(
         }) => {
 
             const isSelected = Boolean(usedSelectionController.selectedEntities.find(e => e.id == entity.id && e.path == entity.path));
+            const customEntityActions = (collection.entityActions ?? [])
+                .map(action => resolveEntityAction(action, customizationController.entityActions))
+                .filter(Boolean) as EntityAction[];
 
             const actions = getActionsForEntity({
                 entity,
-                customEntityActions: collection.entityActions
+                customEntityActions
             });
 
             return (
@@ -539,7 +541,8 @@ export const EntityCollectionView = React.memo(
                     highlightEntity={setHighlightedEntity}
                     unhighlightEntity={unselectNavigatedEntity}
                     collection={collection}
-                    fullPath={fullIdPath ?? fullPath}
+                    fullPath={fullPath}
+                    fullIdPath={fullIdPath}
                     actions={actions}
                     hideId={collection?.hideIdFromCollection}
                     onCollectionChange={updateLastDeleteTimestamp}

package/src/components/EntityCollectionView/EntityCollectionViewActions.tsx

@@ -71,7 +71,7 @@ export function EntityCollectionViewActions<M extends Record<string, any>>({
             ? <Button
                 variant={"text"}
                 disabled={!(selectedEntities?.length) || !multipleDeleteEnabled}
-                startIcon={<DeleteIcon/>}
+                startIcon={<DeleteIcon size={"small"}/>}
                 onClick={onMultipleDeleteClick}
                 color={"primary"}
                 className="lg:w-20"
@@ -79,10 +79,11 @@ export function EntityCollectionViewActions<M extends Record<string, any>>({
                 ({selectedEntities?.length})
             </Button>
             : <IconButton
+                size={"small"}
                 color={"primary"}
                 disabled={!(selectedEntities?.length) || !multipleDeleteEnabled}
                 onClick={onMultipleDeleteClick}>
-                <DeleteIcon/>
+                <DeleteIcon size={"small"}/>
             </IconButton>;
         multipleDeleteButton =
             <Tooltip