diff options
| -rw-r--r-- | modern/package.json | 4 | ||||
| -rw-r--r-- | modern/src/common/components/RemoveDialog.js | 37 | ||||
| -rw-r--r-- | modern/src/settings/components/EditCollectionView.js | 6 |
3 files changed, 28 insertions, 19 deletions
diff --git a/modern/package.json b/modern/package.json index b7a53e44..771a786b 100644 --- a/modern/package.json +++ b/modern/package.json @@ -5,8 +5,8 @@ "dependencies": { "@craco/craco": "^5.9.0", "@mapbox/mapbox-gl-draw": "^1.3.0", - "@material-ui/core": "^4.11.4", - "@material-ui/icons": "^4.11.2", + "@material-ui/core": "^4.12.4", + "@material-ui/icons": "^4.11.3", "@material-ui/lab": "^4.0.0-alpha.58", "@reduxjs/toolkit": "^1.6.0", "@tmcw/togeojson": "^4.5.0", diff --git a/modern/src/common/components/RemoveDialog.js b/modern/src/common/components/RemoveDialog.js index cbdbb05d..a11af4c2 100644 --- a/modern/src/common/components/RemoveDialog.js +++ b/modern/src/common/components/RemoveDialog.js @@ -1,15 +1,23 @@ 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 { Snackbar, makeStyles } from '@material-ui/core'; import { useTranslation } from './LocalizationProvider'; import { useCatch } from '../../reactHelper'; +import { snackBarDurationLongMs } from '../util/duration'; + +const useStyles = makeStyles((theme) => ({ + button: { + height: 'auto', + marginTop: 0, + marginBottom: 0, + color: theme.palette.colors.negative, + }, +})); const RemoveDialog = ({ open, endpoint, itemId, onResult, }) => { + const classes = useStyles(); const t = useTranslation(); const handleRemove = useCatch(async () => { @@ -22,18 +30,17 @@ const RemoveDialog = ({ }); return ( - <Dialog + <Snackbar 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> + autoHideDuration={snackBarDurationLongMs} + onClose={() => onResult(false)} + message={t('sharedRemoveConfirm')} + action={( + <Button size="small" className={classes.button} onClick={handleRemove}> + {t('sharedRemove')} + </Button> + )} + /> ); }; diff --git a/modern/src/settings/components/EditCollectionView.js b/modern/src/settings/components/EditCollectionView.js index ed92c838..b0bf3ea0 100644 --- a/modern/src/settings/components/EditCollectionView.js +++ b/modern/src/settings/components/EditCollectionView.js @@ -60,9 +60,11 @@ const EditCollectionView = ({ menuHide(); }; - const handleRemoveResult = () => { + const handleRemoveResult = (removed) => { setRemoveDialogShown(false); - setUpdateTimestamp(Date.now()); + if (removed) { + setUpdateTimestamp(Date.now()); + } }; const Content = content; |