aboutsummaryrefslogtreecommitdiff
path: root/modern/src/settings/components/CollectionFab.js
diff options
context:
space:
mode:
authorBoubrid Ihab <boubrid.ihab@gmail.com>2022-05-23 17:15:39 +0100
committerBoubrid Ihab <boubrid.ihab@gmail.com>2022-05-23 17:15:39 +0100
commit0b9209f877c42d9eb69d4b94cfa9c7f16a81967e (patch)
tree72286ee879bea52fa2dad73f36d1e2b36a35bc15 /modern/src/settings/components/CollectionFab.js
parentc30e57579868b8f3d21e6e6083e37cba8bcfa408 (diff)
parent0ed610e71b28461d6c9cc996764b00db5ac0b2ba (diff)
downloadtrackermap-web-0b9209f877c42d9eb69d4b94cfa9c7f16a81967e.tar.gz
trackermap-web-0b9209f877c42d9eb69d4b94cfa9c7f16a81967e.tar.bz2
trackermap-web-0b9209f877c42d9eb69d4b94cfa9c7f16a81967e.zip
Merge branch 'master' of github.com:traccar/traccar-web into fix-key-issue
Diffstat (limited to 'modern/src/settings/components/CollectionFab.js')
-rw-r--r--modern/src/settings/components/CollectionFab.js36
1 files changed, 36 insertions, 0 deletions
diff --git a/modern/src/settings/components/CollectionFab.js b/modern/src/settings/components/CollectionFab.js
new file mode 100644
index 00000000..2fb5b5c9
--- /dev/null
+++ b/modern/src/settings/components/CollectionFab.js
@@ -0,0 +1,36 @@
+import React from 'react';
+import { Fab } from '@mui/material';
+import makeStyles from '@mui/styles/makeStyles';
+import AddIcon from '@mui/icons-material/Add';
+import { useNavigate } from 'react-router-dom';
+import { useReadonly } from '../../common/util/permissions';
+import dimensions from '../../common/theme/dimensions';
+
+const useStyles = makeStyles((theme) => ({
+ fab: {
+ position: 'fixed',
+ bottom: theme.spacing(2),
+ right: theme.spacing(2),
+ [theme.breakpoints.down('md')]: {
+ bottom: dimensions.bottomBarHeight + theme.spacing(2),
+ },
+ },
+}));
+
+const CollectionFab = ({ editPath, disabled }) => {
+ const classes = useStyles();
+ const navigate = useNavigate();
+
+ const readonly = useReadonly();
+
+ if (!readonly && !disabled) {
+ return (
+ <Fab size="medium" color="primary" className={classes.fab} onClick={() => navigate(editPath)}>
+ <AddIcon />
+ </Fab>
+ );
+ }
+ return '';
+};
+
+export default CollectionFab;