1import {PropsWithChildren} from 'react';
 2import {useTranslation} from 'react-i18next';
 3import Dialog from '@mui/material/Dialog';
 4import DialogContent from '@mui/material/DialogContent';
 5import DialogActions from '@mui/material/DialogActions';
 6import DialogTitle from '@mui/material/DialogTitle';
 7import Button from '@mui/material/Button';
 8import Transition from './Transition';
 9
10interface Props {
11  open: boolean;
12  cancel: () => void;
13  onSubmit: () => Promise<void>;
14  disabled?: boolean;
15  title: string;
16  action?: string;
17}
18
19const FormDialog = ({
20  open,
21  cancel,
22  onSubmit,
23  disabled,
24  title,
25  action,
26  children,
27}: PropsWithChildren<Props>) => {
28  const {t} = useTranslation();
29
30  return (
31    <Dialog
32      fullWidth
33      maxWidth="xs"
34      open={open}
35      onClose={cancel}
36      TransitionComponent={Transition}
37    >
38      <form
39        onSubmit={e => {
40          e.preventDefault();
41          onSubmit();
42        }}
43      >
44        <DialogTitle>{title}</DialogTitle>
45        <DialogContent>{children}</DialogContent>
46        <DialogActions>
47          <Button variant="text" onClick={cancel}>
48            {t('generic.cancel')}
49          </Button>
50          <Button type="submit" variant="contained" disabled={disabled}>
51            {action || t('generic.add')}
52          </Button>
53        </DialogActions>
54      </form>
55    </Dialog>
56  );
57};
58
59export default FormDialog;