1  import {PropsWithChildren} from 'react';
 2  import {useTranslation} from 'react-i18next';
 3  import Dialog from '@mui/material/Dialog';
 4  import DialogContent from '@mui/material/DialogContent';
 5  import DialogActions from '@mui/material/DialogActions';
 6  import DialogTitle from '@mui/material/DialogTitle';
 7  import Button from '@mui/material/Button';
 8  import Transition from './Transition';
 9  
10  interface Props {
11    open: boolean;
12    cancel: () => void;
13    onSubmit: () => Promise<void>;
14    disabled?: boolean;
15    title: string;
16    action?: string;
17  }
18  
19  const 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  
59  export default FormDialog;