import React, { useEffect } from "react"; import { useIntl } from "react-intl"; import { useMutation, useQueryClient } from "react-query"; import { useSelector } from "react-redux"; import { BasicMapInfo, ErrorInfo, Service } from "../../../../services/Service"; import { activeInstance } from '../../../../reducers/serviceSlice'; import Input from "../../../form/input"; import { FormControl } from "@material-ui/core"; import { DialogProps, fetchMapById, handleOnMutationSuccess } from ".."; import BaseDialog from "../action-dialog"; export type DuplicateModel = { id: number; name: string; description?: string; } const defaultModel: DuplicateModel = { name: '', description: '', id: -1 }; const DuplicateDialog = (props: DialogProps) => { const service: Service = useSelector(activeInstance); const [model, setModel] = React.useState(defaultModel); const [error, setError] = React.useState(); const { mapId, open } = props; const intl = useIntl(); const queryClient = useQueryClient(); const mutation = useMutation((model: DuplicateModel) => { const { id, ...rest } = model; return service.duplicateMap(id, rest).then(() => model); }, { onSuccess: () => { handleOnMutationSuccess(props.onClose, queryClient); }, onError: (error) => { setError(error); } } ); const handleOnClose = (): void => { props.onClose(); setModel(defaultModel); setError(undefined); }; const handleOnSubmit = (event: React.FormEvent): void => { event.preventDefault(); mutation.mutate(model); }; const handleOnChange = (event: React.ChangeEvent): void => { event.preventDefault(); const name = event.target.name; const value = event.target.value; setModel({ ...model, [name as keyof BasicMapInfo]: value }); } const { map } = fetchMapById(mapId); useEffect(() => { if (open && map) { setModel(map); } else { setModel(defaultModel); setError(undefined); } }, [mapId]) return (
); } export default DuplicateDialog;