@firecms/core 3.0.0-alpha.82 → 3.0.0-alpha.83

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@firecms/core",
   "type": "module",
-  "version": "3.0.0-alpha.82",
+  "version": "3.0.0-alpha.83",
   "description": "Awesome Firebase/Firestore-based headless open-source CMS",
   "funding": {
     "url": "https://github.com/sponsors/firecmsco"
@@ -38,7 +38,7 @@
     "generateIcons": "ts-node --esm src/icons/generateIcons.ts"
   },
   "dependencies": {
-    "@firecms/ui": "^3.0.0-alpha.82",
+    "@firecms/ui": "^3.0.0-alpha.83",
     "@fontsource/ibm-plex-mono": "^5.0.8",
     "@fontsource/roboto": "^5.0.8",
     "@hello-pangea/dnd": "^16.5.0",
@@ -107,7 +107,7 @@
     "dist",
     "src"
   ],
-  "gitHead": "46f5a2edf8418d2c209af9e059617d39213decb8",
+  "gitHead": "96d21eb290969ee8e2cc56ca13a47834bae0ee57",
   "publishConfig": {
     "access": "public"
   }

package/src/components/EntityCollectionTable/EntityCollectionRowActions.tsx

@@ -36,7 +36,7 @@ export const EntityCollectionRowActions = React.memo(function EntityCollectionRo
                                                                                              unhighlightEntity,
                                                                                              actions = [],
                                                                                              hideId,
-                                                                                             selectionController
+                                                                                             selectionController,
                                                                                          }:
                                                                                              {
                                                                                                  entity: Entity<any>,

package/src/components/EntityCollectionTable/EntityCollectionTable.tsx

@@ -64,6 +64,7 @@ export const useEntityCollectionTableController = () => useContext<EntityCollect
 export const EntityCollectionTable = React.memo<EntityCollectionTableProps<any>>(
     function EntityCollectionTable<M extends Record<string, any>, UserType extends User>
     ({
+         debugKey,
          forceFilter,
          actionsStart,
          actions,
@@ -150,10 +151,9 @@ export const EntityCollectionTable = React.memo<EntityCollectionTableProps<any>>
             setItemCount?.(pageSize);
         }, [pageSize]);
 
-        const onRowClick = useCallback(({ rowData }: {
+        const onRowClickCallback = useCallback(({ rowData }: {
             rowData: Entity<M>
         }) => {
-            console.debug("EntityCollectionTable click");
             if (inlineEditing)
                 return;
             return onEntityClick && onEntityClick(rowData);
@@ -388,6 +388,8 @@ export const EntityCollectionTable = React.memo<EntityCollectionTableProps<any>>
         //     createFilterField,
         // });
 
+        const onRowClick = inlineEditing ? undefined : (onEntityClick ? onRowClickCallback : undefined);
+
         return (
 
             <EntityCollectionTableContext.Provider
@@ -421,7 +423,7 @@ export const EntityCollectionTable = React.memo<EntityCollectionTableProps<any>>
                         data={data}
                         columns={columns}
                         cellRenderer={cellRenderer}
-                        onRowClick={inlineEditing ? undefined : (onEntityClick ? onRowClick : undefined)}
+                        onRowClick={onRowClick}
                         onEndReached={loadNextPage}
                         onResetPagination={resetPagination}
                         error={dataLoadingError}

package/src/components/EntityCollectionTable/EntityCollectionTableProps.tsx

@@ -23,6 +23,7 @@ export type OnColumnResizeParams = { width: number, key: string };
 export type EntityCollectionTableProps<M extends Record<string, any>,
     UserType extends User = User> = {
 
+    debugKey?: string;
     /**
      * Display these entities as selected
      */

package/src/components/EntityCollectionTable/PropertyTableCell.tsx

@@ -387,7 +387,7 @@ export const PropertyTableCell = React.memo<PropertyTableCellProps<any, any>>(
                                     multiselect={true}
                                     path={arrayProperty.of.path}
                                     previewProperties={arrayProperty.of.previewProperties}
-                                    title={arrayProperty.of.name}
+                                    title={arrayProperty.name}
                                     forceFilter={arrayProperty.of.forceFilter}
                                 />;
                         }

package/src/components/EntityCollectionTable/SimpleEntityCollectionTable.tsx

@@ -196,7 +196,6 @@ export const SimpleEntityCollectionTable = React.memo<SimpleEntityCollectionTabl
         const onRowClick = useCallback(({ rowData }: {
             rowData: Entity<M>
         }) => {
-            console.debug("EntityCollectionTable click");
             if (inlineEditing)
                 return;
             return onEntityClick && onEntityClick(rowData);
@@ -231,7 +230,6 @@ export const SimpleEntityCollectionTable = React.memo<SimpleEntityCollectionTabl
             setSelectedCell(undefined);
         }, []);
 
-
         const onFilterUpdate = useCallback((updatedFilterValues?: FilterValues<any>) => {
             setFilterValues?.({ ...updatedFilterValues, ...forceFilter } as FilterValues<any>);
         }, [forceFilter]);

package/src/components/EntityCollectionView/EntityCollectionView.tsx

@@ -39,7 +39,8 @@ import {
     saveEntityWithCallbacks,
     useAuthController,
     useCustomizationController,
-    useDataSource, useFireCMSContext,
+    useDataSource,
+    useFireCMSContext,
     useLargeLayout,
     useNavigationController,
     useSideEntityController
@@ -701,15 +702,19 @@ export const EntityCollectionView = React.memo(
             equal(a.forceFilter, b.forceFilter);
     }) as React.FunctionComponent<EntityCollectionViewProps<any>>
 
-export function useSelectionController<M extends Record<string, any> = any>(): SelectionController<M> {
+export function useSelectionController<M extends Record<string, any> = any>(
+    onSelectionChange?: (entity: Entity<M>, selected: boolean) => void
+): SelectionController<M> {
 
     const [selectedEntities, setSelectedEntities] = useState<Entity<M>[]>([]);
 
     const toggleEntitySelection = useCallback((entity: Entity<M>) => {
         let newValue;
         if (selectedEntities.map(e => e.id).includes(entity.id)) {
+            onSelectionChange?.(entity, false);
             newValue = selectedEntities.filter((item: Entity<M>) => item.id !== entity.id);
         } else {
+            onSelectionChange?.(entity, true);
             newValue = [...selectedEntities, entity];
         }
         setSelectedEntities(newValue);

package/src/components/EntityPreview.tsx

@@ -25,7 +25,7 @@ export function EntityPreview<M extends Record<string, any>>(
         className
     }: EntityPreviewProps<M>) {
 
-    const context = useFireCMSContext();
+    const customizationController: CustomizationController = useCustomizationController();
     const resolvedCollection: ResolvedEntityCollection<M> = useMemo(() => resolveCollection<M>({
         collection,
         path,
@@ -34,8 +34,6 @@ export function EntityPreview<M extends Record<string, any>>(
         fields: customizationController.propertyConfigs
     }), [collection, path, entity]);
 
-    const customizationController: CustomizationController = useCustomizationController();
-
     const properties: ResolvedProperties = resolvedCollection.properties;
 
     return (

package/src/components/ReferenceSelectionInner.tsx

@@ -113,7 +113,31 @@ export function ReferenceSelectionInner<M extends Record<string, any>>(
 
     const [entitiesDisplayedFirst, setEntitiesDisplayedFirst] = useState<Entity<any>[]>([]);
 
-    const selectionController = useSelectionController();
+    const toggleEntitySelection = (entity: Entity<any>) => {
+        let newValue;
+        const selectedEntities = selectionController.selectedEntities;
+
+        analyticsController.onAnalyticsEvent?.("reference_selection_toggle", {
+            path: fullPath,
+            entityId: entity.id
+        });
+        if (selectedEntities) {
+
+            if (selectedEntities.map((e) => e.id).indexOf(entity.id) > -1) {
+                newValue = selectedEntities.filter((item: Entity<any>) => item.id !== entity.id);
+            } else {
+                if (maxSelection && selectedEntities.length >= maxSelection)
+                    return;
+                newValue = [...selectedEntities, entity];
+            }
+            selectionController.setSelectedEntities(newValue);
+
+            if (onMultipleEntitiesSelected)
+                onMultipleEntitiesSelected(newValue);
+        }
+    };
+
+    const selectionController = useSelectionController(toggleEntitySelection);
 
     /**
      * Fetch initially selected ids
@@ -157,34 +181,7 @@ export function ReferenceSelectionInner<M extends Record<string, any>>(
         }
     };
 
-    const toggleEntitySelection = (entity: Entity<any>) => {
-        console.debug("ReferenceSelectionInner toggleEntitySelection", entity);
-        let newValue;
-        const selectedEntities = selectionController.selectedEntities;
-
-        analyticsController.onAnalyticsEvent?.("reference_selection_toggle", {
-            path: fullPath,
-            entityId: entity.id
-        });
-        if (selectedEntities) {
-
-            if (selectedEntities.map((e) => e.id).indexOf(entity.id) > -1) {
-                newValue = selectedEntities.filter((item: Entity<any>) => item.id !== entity.id);
-            } else {
-                if (maxSelection && selectedEntities.length >= maxSelection)
-                    return;
-                newValue = [...selectedEntities, entity];
-            }
-            selectionController.setSelectedEntities(newValue);
-
-            if (onMultipleEntitiesSelected)
-                onMultipleEntitiesSelected(newValue);
-        }
-    };
-
     const onEntityClick = (entity: Entity<any>) => {
-        console.debug("ReferenceSelectionInner onEntityClick", entity);
-
         if (!multiselect && onSingleEntitySelected) {
             analyticsController.onAnalyticsEvent?.("reference_selected_single", {
                 path: fullPath,
@@ -276,6 +273,7 @@ export function ReferenceSelectionInner<M extends Record<string, any>>(
             <div className="flex-grow">
                 {entitiesDisplayedFirst &&
                     <EntityCollectionTable
+                        debugKey={"reference_selection_table"}
                         displayedColumnIds={displayedColumnIds}
                         onEntityClick={onEntityClick}
                         tableController={tableController}

package/src/preview/PropertyPreview.tsx

@@ -211,7 +211,9 @@ export const PropertyPreview = React.memo(function PropertyPreview<T extends CMS
         content = JSON.stringify(value);
     }
 
-    return content === undefined || content === null ? <EmptyValue/> : content;
+    return content === undefined || content === null || (Array.isArray(content) && content.length === 0)
+        ? <EmptyValue/>
+        : content;
 }, equal);
 
 function buildWrongValueType(name: string | undefined, dataType: string, value: any) {