import React, { useEffect } from "react"; import { useIntl } from "react-intl"; import { useMutation, useQueryClient } from "react-query"; import { FormControl } from "@material-ui/core"; import { useSelector } from "react-redux"; import Client, { BasicMapInfo, ErrorInfo } from "../../../../classes/client"; import { activeInstance } from '../../../../redux/clientSlice'; import Input from "../../../form/input"; import { SimpleDialogProps, fetchMapById } from ".."; import BaseDialog from "../base-dialog"; export type DuplicateModel = { id: number; title: string; description?: string; } const defaultModel: DuplicateModel = { title: '', description: '', id: -1 }; const DuplicateDialog = (props: SimpleDialogProps) => { const service: Client = useSelector(activeInstance); const [model, setModel] = React.useState(defaultModel); const [error, setError] = React.useState(); const { mapId, onClose } = props; const intl = useIntl(); const mutation = useMutation((model: DuplicateModel) => { const { id, ...rest } = model; return service.duplicateMap(id, rest); }, { onSuccess: (mapId) => { window.location.href = `/c/maps/${mapId}/edit`; }, onError: (error) => { setError(error); } } ); const handleOnClose = (): void => { onClose(); }; 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;