Organize common code

1 files changed, 37 insertions, 0 deletions

diff --git a/modern/src/common/components/RemoveDialog.js b/modern/src/common/components/RemoveDialog.js
new file mode 100644
index 00000000..1b75e926
--- /dev/null
+++ b/modern/src/common/components/RemoveDialog.js
@@ -0,0 +1,37 @@
+import React from 'react';
+import Button from '@material-ui/core/Button';
+import Dialog from '@material-ui/core/Dialog';
+import DialogActions from '@material-ui/core/DialogActions';
+import DialogContent from '@material-ui/core/DialogContent';
+import DialogContentText from '@material-ui/core/DialogContentText';
+import { useTranslation } from '../../LocalizationProvider';
+
+const RemoveDialog = ({
+  open, endpoint, itemId, onResult,
+}) => {
+  const t = useTranslation();
+
+  const handleRemove = async () => {
+    const response = await fetch(`/api/${endpoint}/${itemId}`, { method: 'DELETE' });
+    if (response.ok) {
+      onResult(true);
+    }
+  };
+
+  return (
+    <Dialog
+      open={open}
+      onClose={() => { onResult(false); }}
+    >
+      <DialogContent>
+        <DialogContentText>{t('sharedRemoveConfirm')}</DialogContentText>
+      </DialogContent>
+      <DialogActions>
+        <Button color="primary" onClick={handleRemove}>{t('sharedRemove')}</Button>
+        <Button autoFocus onClick={() => onResult(false)}>{t('sharedCancel')}</Button>
+      </DialogActions>
+    </Dialog>
+  );
+};
+
+export default RemoveDialog;