diff --git a/packages/webapp/src/components/maps-page/dialogs/DeleteDialog.tsx b/packages/webapp/src/components/maps-page/dialogs/DeleteDialog.tsx index d5e8d6bd..08ac1203 100644 --- a/packages/webapp/src/components/maps-page/dialogs/DeleteDialog.tsx +++ b/packages/webapp/src/components/maps-page/dialogs/DeleteDialog.tsx @@ -1,4 +1,4 @@ -import { Button, Dialog, DialogActions, DialogContent, DialogTitle } from "@material-ui/core"; +import { Button, DialogActions, DialogContent, DialogTitle } from "@material-ui/core"; import { Alert, AlertTitle } from "@material-ui/lab"; import React from "react"; import { FormattedMessage } from "react-intl"; @@ -7,52 +7,44 @@ import { useSelector } from "react-redux"; import { Service } from "../../../services/Service"; import { activeInstance } from '../../../reducers/serviceSlice'; import { DialogProps, fetchMapById, handleOnMutationSuccess } from "./DialogCommon"; +import Dialog from "./Dialog"; const DeleteDialog = (props: DialogProps) => { - const service: Service = useSelector(activeInstance); - const queryClient = useQueryClient(); - const mutation = useMutation((id: number) => service.deleteMap(id), - { - onSuccess: () => handleOnMutationSuccess(props.onClose, queryClient) - } - ); - - const mapId = props.mapId; - const handleOnClose = (action: 'accept' | undefined): void => { - if (action == 'accept') { - mutation.mutate(mapId); - } else { - props.onClose(); - } - }; - - // Fetch map model to be rendered ... - const { map } = fetchMapById(mapId); - return ( -
- handleOnClose(undefined)} > - - - - Delete '{map?.name}' - - - - - - - - -
- ); + const service: Service = useSelector(activeInstance); + const queryClient = useQueryClient(); + const mutation = useMutation((id: number) => service.deleteMap(id), + { + onSuccess: () => handleOnMutationSuccess(props.onClose, queryClient) + } + ); + + const mapId = props.mapId; + const handleOnClose = (): void => { + props.onClose(); + }; + + const handleOnSubmit = (): void => { + mutation.mutate(mapId); } - - - export default DeleteDialog; \ No newline at end of file + + // Fetch map model to be rendered ... + const { map } = fetchMapById(mapId); + return ( +
+ + + + Delete '{map?.name}' + + + +
+ ); +} + + +export default DeleteDialog; \ No newline at end of file diff --git a/packages/webapp/src/components/maps-page/dialogs/Dialog.tsx b/packages/webapp/src/components/maps-page/dialogs/Dialog.tsx index 0e275441..b6ae1536 100644 --- a/packages/webapp/src/components/maps-page/dialogs/Dialog.tsx +++ b/packages/webapp/src/components/maps-page/dialogs/Dialog.tsx @@ -10,10 +10,10 @@ export type DialogProps = { open: boolean; children: any; error?: ErrorInfo; - + title: MessageDescriptor; - description:MessageDescriptor; - submitButton: MessageDescriptor; + description?: MessageDescriptor; + submitButton: MessageDescriptor; } const Dialog = (props: DialogProps) => { @@ -22,6 +22,8 @@ const Dialog = (props: DialogProps) => { const isOpen = props.open; const handleOnSubmit = props.onSubmit; + const description = props.description ? ({intl.formatMessage(props.description)}) : null; + return (
{ - {intl.formatMessage(props.description)} + {description} - {props.children}