Clean up selected checkbox on delete.

This commit is contained in:
Paulo Gustavo Veiga 2022-03-31 19:29:39 -03:00
parent 3c9fcbf8e1
commit e6e3bc2655
4 changed files with 30 additions and 24 deletions

View File

@ -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

View File

@ -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}`);
},

View File

@ -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;

View File

@ -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>