diff --git a/CHANGELOG.md b/CHANGELOG.md index 51c7fb4..155b1a3 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,6 +1,11 @@ # Change Log +## [0.18.0] - 2020-11-30 +### Changed +- [BREAKING] The deletion hook has been moved from the collection view to the +entity schema. + ## [0.17.2] - 2020-11-26 ### Changed - Fixed error when saving new entities diff --git a/example/src/index.tsx b/example/src/index.tsx index 55d7a4e..ed1297a 100644 --- a/example/src/index.tsx +++ b/example/src/index.tsx @@ -489,8 +489,12 @@ productSchema.onPreSave = ({ return values; }; -productSchema.onSaveSuccess = () => { - console.log("onSaveSuccess"); +productSchema.onSaveSuccess = (props) => { + console.log("onSaveSuccess", props); +}; + +productSchema.onDelete = (props) => { + console.log("onDelete", props); }; const formQuestions: string[] = ["birth_year", @@ -682,9 +686,6 @@ const blogCollection = buildCollection({ filterableProperties: ["name", "status"], initialFilter: { "status": ["==", "published"] - }, - onEntityDelete: (path, entity) => { - console.log("Log from onEntityDelete hook", entity); } }); diff --git a/package.json b/package.json index 7c8bea7..da51d30 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@camberi/firecms", - "version": "0.17.2", + "version": "0.18.0", "description": "Awesome Firestore based CMS", "author": "camberi", "license": "GPL-3.0", diff --git a/src/collection/CollectionTable.tsx b/src/collection/CollectionTable.tsx index bf75abf..6895dd2 100644 --- a/src/collection/CollectionTable.tsx +++ b/src/collection/CollectionTable.tsx @@ -162,6 +162,11 @@ interface CollectionTableProps): void; + /** + * Callback when anywhere on the table is clicked + */ + onEntityDelete?(collectionPath: string, entity: Entity): void; + } interface CMSColumn { @@ -194,6 +199,7 @@ export function CollectionTable, filterableProperties, title, actions, + onEntityDelete, defaultSize = "m" }: CollectionTableProps) { @@ -596,8 +602,10 @@ export function CollectionTable, setDeleteEntityClicked(undefined)}/> { entity?: Entity, + collectionPath: string, schema: S open: boolean; - afterDelete?: () => void; + + onEntityDelete?(collectionPath: string, entity: Entity): void; + onClose: () => void; } -export default function DeleteEntityDialog(props: DeleteEntityDialogProps) { +export default function DeleteEntityDialog({ entity, + schema, + onClose, + open, + onEntityDelete, + collectionPath, + ...other } + : DeleteEntityDialogProps) { const snackbarContext = useSnackbarContext(); - const { entity, schema, onClose, open, ...other } = props; const [loading, setLoading] = useState(false); const handleCancel = () => { @@ -37,11 +46,12 @@ export default function DeleteEntityDialog(props: Delete snackbarContext.open({ type: "success", message: "Deleted" - }) + }); setLoading(true); deleteEntity(entity).then(_ => { setLoading(false); - if(props.afterDelete) props.afterDelete() + if (onEntityDelete && entity) + onEntityDelete(collectionPath, entity); }); onClose(); } diff --git a/src/models.ts b/src/models.ts index 449db35..51e8d8e 100644 --- a/src/models.ts +++ b/src/models.ts @@ -99,13 +99,6 @@ export interface EntityCollectionView; - /** - * Hook called after the entity is deleted in Firestore. - * - * @param collectionPath the Firestore collection path. - * @param entity the entity being deleted. - */ - onEntityDelete?(collectionPath: string, entity: Entity): void; } /** @@ -168,10 +161,17 @@ export interface EntitySchema) : Promise> | EntityValues + + /** + * Hook called after the entity is deleted in Firestore. + * + * @param entityDeleteProps + */ + onDelete?(entityDeleteProps: EntityDeleteProps): void; } /** - * + * Parameters passed to hooks when an entity is saved */ export interface EntitySaveProps, @@ -183,6 +183,17 @@ export interface EntitySaveProps, + P extends Properties = S["properties"]> { + schema: S; + collectionPath: string; + id: string; +} + /** * Identity function we use to defeat the type system of Typescript and build * collection views with all its properties diff --git a/src/routes/CollectionRoute.tsx b/src/routes/CollectionRoute.tsx index 8b17040..3f91e64 100644 --- a/src/routes/CollectionRoute.tsx +++ b/src/routes/CollectionRoute.tsx @@ -116,6 +116,12 @@ export function CollectionRoute({ filterableProperties={view.filterableProperties} properties={view.properties} excludedProperties={view.excludedProperties} + onEntityDelete={(collectionPath: string, entity: Entity) => + view.schema.onDelete && view.schema.onDelete({ + schema: view.schema, + collectionPath, + id: entity.id + })} title={title}/> diff --git a/src/routes/EntityFormRoute.tsx b/src/routes/EntityFormRoute.tsx index d5b7267..daee059 100644 --- a/src/routes/EntityFormRoute.tsx +++ b/src/routes/EntityFormRoute.tsx @@ -162,9 +162,6 @@ function EntityFormRoute({ const location = useLocation(); const { path, url } = useRouteMatch(); - console.log("path", path); - console.log("url", url); - console.log("location", location); const history = useHistory(); @@ -214,7 +211,7 @@ function EntityFormRoute({ }, [entityId, view]); useEffect(() => { - if (view.subcollections && location["subcollection"]){ + if (view.subcollections && location["subcollection"]) { const index = view.subcollections .map((c) => c.relativePath) .findIndex((p) => p === location["subcollection"]); @@ -366,13 +363,24 @@ function EntityFormRoute({ ) => + subcollectionView.schema.onDelete && subcollectionView.schema.onDelete({ + schema: subcollectionView.schema, + collectionPath, + id: entity.id + })} editEnabled={true} onEntityClick={(collectionPath: string, clickedEntity: Entity) => onSubcollectionEntityClick(collectionPath, clickedEntity)} includeToolbar={true} paginationEnabled={false} - defaultSize={subcollectionView.defaultSize} title={ diff --git a/src/side_dialog/EntitySideDialogs.tsx b/src/side_dialog/EntitySideDialogs.tsx index 0657a3f..6e3812d 100644 --- a/src/side_dialog/EntitySideDialogs.tsx +++ b/src/side_dialog/EntitySideDialogs.tsx @@ -59,7 +59,6 @@ export function EntitySideDialogs({ navigation }: { })), { open: false }]; // we add an extra closed drawer, that it is used to maintain the transition when a drawer is removed - console.log("sidePanels", sidePanels); return { sidePanels.map((panel, index) => { diff --git a/src/side_dialog/SelectedEntityContext.tsx b/src/side_dialog/SelectedEntityContext.tsx index 5710589..d9dd7df 100644 --- a/src/side_dialog/SelectedEntityContext.tsx +++ b/src/side_dialog/SelectedEntityContext.tsx @@ -85,7 +85,6 @@ export const SelectedEntityProvider: React.FC = ({ pathname: getEntityPath(entityId, collectionPath), subcollection: subcollection }; - console.log("thisLocation", thisLocation); history.replace( getEntityPath(entityId, collectionPath, subcollection), { diff --git a/src/side_dialog/SideCMSRoute.tsx b/src/side_dialog/SideCMSRoute.tsx index 2e1ffe8..adac191 100644 --- a/src/side_dialog/SideCMSRoute.tsx +++ b/src/side_dialog/SideCMSRoute.tsx @@ -30,8 +30,6 @@ export function SideCMSRoute({ const location = useLocation(); const { path, url } = useRouteMatch(); - console.log("sr", path, url); - return (