From e6e3bc2655bacfcd2c91417ba0b0cdaaa125f580 Mon Sep 17 00:00:00 2001
From: Paulo Gustavo Veiga <pveiga@wisemapping.com>
Date: Thu, 31 Mar 2022 19:29:39 -0300
Subject: [PATCH] Clean up selected checkbox on delete.

---
 .../action-dispatcher/delete-dialog/index.tsx |  4 +-
 .../delete-multiselect-dialog/index.tsx       |  2 +-
 .../maps-page/action-dispatcher/index.tsx     |  6 +--
 .../components/maps-page/maps-list/index.tsx  | 42 +++++++++++--------
 4 files changed, 30 insertions(+), 24 deletions(-)

diff --git a/packages/webapp/src/components/maps-page/action-dispatcher/delete-dialog/index.tsx b/packages/webapp/src/components/maps-page/action-dispatcher/delete-dialog/index.tsx
index fffa9647..1ad34ba0 100644
--- a/packages/webapp/src/components/maps-page/action-dispatcher/delete-dialog/index.tsx
+++ b/packages/webapp/src/components/maps-page/action-dispatcher/delete-dialog/index.tsx
@@ -16,7 +16,7 @@ const DeleteDialog = ({ mapId, onClose }: SimpleDialogProps): React.ReactElement
     const [error, setError] = React.useState<ErrorInfo>();
 
     const mutation = useMutation((id: number) => client.deleteMap(id), {
-        onSuccess: () => handleOnMutationSuccess(onClose, queryClient),
+        onSuccess: () => handleOnMutationSuccess(() => onClose(true), queryClient),
         onError: (error: ErrorInfo) => {
             setError(error);
         },
@@ -31,7 +31,7 @@ const DeleteDialog = ({ mapId, onClose }: SimpleDialogProps): React.ReactElement
     };
 
     const { map } = fetchMapById(mapId)
-    const alertTitle=`${intl.formatMessage({ id: 'action.delete-title', defaultMessage: 'Delete' })} ${map?.title}`;
+    const alertTitle = `${intl.formatMessage({ id: 'action.delete-title', defaultMessage: 'Delete' })} ${map?.title}`;
     return (
         <div>
             <BaseDialog
diff --git a/packages/webapp/src/components/maps-page/action-dispatcher/delete-multiselect-dialog/index.tsx b/packages/webapp/src/components/maps-page/action-dispatcher/delete-multiselect-dialog/index.tsx
index e2dd6493..bc154b5e 100644
--- a/packages/webapp/src/components/maps-page/action-dispatcher/delete-multiselect-dialog/index.tsx
+++ b/packages/webapp/src/components/maps-page/action-dispatcher/delete-multiselect-dialog/index.tsx
@@ -18,7 +18,7 @@ const DeleteMultiselectDialog = ({
     const queryClient = useQueryClient();
 
     const mutation = useMutation((ids: number[]) => client.deleteMaps(ids), {
-        onSuccess: () => handleOnMutationSuccess(onClose, queryClient),
+        onSuccess: () => handleOnMutationSuccess(() => onClose(true), queryClient),
         onError: (error) => {
             console.error(`Unexpected error ${error}`);
         },
diff --git a/packages/webapp/src/components/maps-page/action-dispatcher/index.tsx b/packages/webapp/src/components/maps-page/action-dispatcher/index.tsx
index 02a5960e..c379dbd0 100644
--- a/packages/webapp/src/components/maps-page/action-dispatcher/index.tsx
+++ b/packages/webapp/src/components/maps-page/action-dispatcher/index.tsx
@@ -22,7 +22,7 @@ export type BasicMapInfo = {
 type ActionDialogProps = {
     action?: ActionType;
     mapsId: number[];
-    onClose: () => void;
+    onClose: (success?: boolean) => void;
     fromEditor: boolean;
 };
 
@@ -78,12 +78,12 @@ export const handleOnMutationSuccess = (onClose: () => void, queryClient: QueryC
 
 export type SimpleDialogProps = {
     mapId: number;
-    onClose: () => void;
+    onClose: (success?: boolean) => void;
 };
 
 export type MultiDialogProps = {
     mapsId: number[];
-    onClose: () => void;
+    onClose: (success?: boolean) => void;
 };
 
 export default ActionDispatcher;
diff --git a/packages/webapp/src/components/maps-page/maps-list/index.tsx b/packages/webapp/src/components/maps-page/maps-list/index.tsx
index 086ac045..53695d05 100644
--- a/packages/webapp/src/components/maps-page/maps-list/index.tsx
+++ b/packages/webapp/src/components/maps-page/maps-list/index.tsx
@@ -59,9 +59,9 @@ function getComparator<Key extends keyof any>(
     order: Order,
     orderBy: Key
 ): (
-    a: { [key in Key]: number | string | boolean | Label[] | undefined },
-    b: { [key in Key]: number | string | Label[] | boolean }
-) => number {
+        a: { [key in Key]: number | string | boolean | Label[] | undefined },
+        b: { [key in Key]: number | string | Label[] | boolean }
+    ) => number {
     return order === 'desc'
         ? (a, b) => descendingComparator(a, b, orderBy)
         : (a, b) => -descendingComparator(a, b, orderBy);
@@ -240,19 +240,19 @@ export type ChangeLabelMutationFunctionParam = { maps: MapInfo[]; label: Label;
 
 export const getChangeLabelMutationFunction =
     (client: Client) =>
-    async ({ maps, label, checked }: ChangeLabelMutationFunctionParam): Promise<void> => {
-        if (!label.id) {
-            label.id = await client.createLabel(label.title, label.color);
-        }
-        if (checked) {
-            const toAdd = maps.filter((m) => !m.labels.find((l) => l.id === label.id));
-            await Promise.all(toAdd.map((m) => client.addLabelToMap(label.id, m.id)));
-        } else {
-            const toRemove = maps.filter((m) => m.labels.find((l) => l.id === label.id));
-            await Promise.all(toRemove.map((m) => client.deleteLabelFromMap(label.id, m.id)));
-        }
-        return Promise.resolve();
-    };
+        async ({ maps, label, checked }: ChangeLabelMutationFunctionParam): Promise<void> => {
+            if (!label.id) {
+                label.id = await client.createLabel(label.title, label.color);
+            }
+            if (checked) {
+                const toAdd = maps.filter((m) => !m.labels.find((l) => l.id === label.id));
+                await Promise.all(toAdd.map((m) => client.addLabelToMap(label.id, m.id)));
+            } else {
+                const toRemove = maps.filter((m) => m.labels.find((l) => l.id === label.id));
+                await Promise.all(toRemove.map((m) => client.deleteLabelFromMap(label.id, m.id)));
+            }
+            return Promise.resolve();
+        };
 
 export const MapsList = (props: MapsListProps): React.ReactElement => {
     const classes = useStyles();
@@ -400,7 +400,6 @@ export const MapsList = (props: MapsListProps): React.ReactElement => {
             actionType: 'delete',
             mapsId: selected,
         });
-        setSelected([]);
     };
 
     const handleAddLabelClick = () => {
@@ -699,7 +698,14 @@ export const MapsList = (props: MapsListProps): React.ReactElement => {
 
             <ActionDispatcher
                 action={activeDialog?.actionType}
-                onClose={() => setActiveDialog(undefined)}
+                onClose={(success) => {
+                    setActiveDialog(undefined);
+
+                    // If it was a success action, reset the selection list ...
+                    if (success) {
+                        setSelected([]);
+                    }
+                }}
                 mapsId={activeDialog ? activeDialog.mapsId : []}
             />
         </div>