diff options
Diffstat (limited to 'modern')
-rw-r--r-- | modern/src/common/components/SideNav.js | 7 | ||||
-rw-r--r-- | modern/src/main/DevicesList.js | 21 | ||||
-rw-r--r-- | modern/src/other/GeofencesList.js | 11 | ||||
-rw-r--r-- | modern/src/reports/components/ReportsMenu.js | 6 | ||||
-rw-r--r-- | modern/src/settings/components/EditItemView.js | 1 | ||||
-rw-r--r-- | modern/src/settings/components/SettingsMenu.js | 6 |
6 files changed, 27 insertions, 25 deletions
diff --git a/modern/src/common/components/SideNav.js b/modern/src/common/components/SideNav.js index 648059d1..97968bd1 100644 --- a/modern/src/common/components/SideNav.js +++ b/modern/src/common/components/SideNav.js @@ -1,6 +1,6 @@ import React, { Fragment } from 'react'; import { - List, ListItem, ListItemText, ListItemIcon, Divider, ListSubheader, + List, ListItemText, ListItemIcon, Divider, ListSubheader, ListItemButton, } from '@mui/material'; import { Link, useLocation } from 'react-router-dom'; @@ -15,17 +15,16 @@ const SideNav = ({ routes }) => { <ListSubheader>{route.subheader}</ListSubheader> </Fragment> ) : ( - <ListItem + <ListItemButton disableRipple component={Link} key={route.href} - button to={route.href} selected={location.pathname.match(route.match || route.href) !== null} > <ListItemIcon>{route.icon}</ListItemIcon> <ListItemText primary={route.name} /> - </ListItem> + </ListItemButton> )))} </List> ); diff --git a/modern/src/main/DevicesList.js b/modern/src/main/DevicesList.js index baf18dd8..e1db7853 100644 --- a/modern/src/main/DevicesList.js +++ b/modern/src/main/DevicesList.js @@ -1,12 +1,9 @@ import React, { useRef } from 'react'; import { useDispatch, useSelector } from 'react-redux'; import makeStyles from '@mui/styles/makeStyles'; -import { IconButton, Tooltip } from '@mui/material'; -import Avatar from '@mui/material/Avatar'; -import List from '@mui/material/List'; -import ListItem from '@mui/material/ListItem'; -import ListItemAvatar from '@mui/material/ListItemAvatar'; -import ListItemText from '@mui/material/ListItemText'; +import { + IconButton, Tooltip, Avatar, List, ListItemAvatar, ListItemText, ListItemButton, +} from '@mui/material'; import { FixedSizeList } from 'react-window'; import AutoSizer from 'react-virtualized-auto-sizer'; import BatteryFullIcon from '@mui/icons-material/BatteryFull'; @@ -26,6 +23,7 @@ import { } from '../common/util/formatter'; import { useTranslation } from '../common/components/LocalizationProvider'; import { mapIcons } from '../map/core/preloadImages'; +import { useAdministrator } from '../common/util/permissions'; const useStyles = makeStyles((theme) => ({ list: { @@ -70,6 +68,8 @@ const DeviceRow = ({ data, index, style }) => { const dispatch = useDispatch(); const t = useTranslation(); + const admin = useAdministrator(); + const { items } = data; const item = items[index]; const position = useSelector((state) => state.positions.items[item.id]); @@ -83,7 +83,12 @@ const DeviceRow = ({ data, index, style }) => { return ( <div style={style}> - <ListItem button key={item.id} className={classes.listItem} onClick={() => dispatch(devicesActions.select(item.id))}> + <ListItemButton + key={item.id} + className={classes.listItem} + onClick={() => dispatch(devicesActions.select(item.id))} + disabled={!admin && item.disabled} + > <ListItemAvatar> <Avatar> <img className={classes.icon} src={mapIcons[item.category || 'default']} alt="" /> @@ -137,7 +142,7 @@ const DeviceRow = ({ data, index, style }) => { )} </> )} - </ListItem> + </ListItemButton> </div> ); }; diff --git a/modern/src/other/GeofencesList.js b/modern/src/other/GeofencesList.js index 7521de80..88db0654 100644 --- a/modern/src/other/GeofencesList.js +++ b/modern/src/other/GeofencesList.js @@ -1,10 +1,9 @@ import React, { Fragment } from 'react'; import { useDispatch, useSelector } from 'react-redux'; import makeStyles from '@mui/styles/makeStyles'; -import Divider from '@mui/material/Divider'; -import List from '@mui/material/List'; -import ListItem from '@mui/material/ListItem'; -import ListItemText from '@mui/material/ListItemText'; +import { + Divider, List, ListItemButton, ListItemText, +} from '@mui/material'; import { devicesActions, geofencesActions } from '../store'; import CollectionActions from '../settings/components/CollectionActions'; @@ -41,10 +40,10 @@ const GeofencesList = () => { <List className={classes.list}> {Object.values(items).map((item, index, list) => ( <Fragment key={item.id}> - <ListItem button key={item.id} onClick={() => dispatch(devicesActions.select(item.id))}> + <ListItemButton button key={item.id} onClick={() => dispatch(devicesActions.select(item.id))}> <ListItemText primary={item.name} /> <CollectionActions itemId={item.id} editPath="/settings/geofence" endpoint="geofences" setTimestamp={refreshGeofences} /> - </ListItem> + </ListItemButton> {index < list.length - 1 ? <Divider /> : null} </Fragment> ))} diff --git a/modern/src/reports/components/ReportsMenu.js b/modern/src/reports/components/ReportsMenu.js index 09e287bf..dc0da4b9 100644 --- a/modern/src/reports/components/ReportsMenu.js +++ b/modern/src/reports/components/ReportsMenu.js @@ -1,6 +1,6 @@ import React from 'react'; import { - Divider, List, ListItem, ListItemIcon, ListItemText, + Divider, List, ListItemButton, ListItemIcon, ListItemText, } from '@mui/material'; import TimelineIcon from '@mui/icons-material/Timeline'; import PauseCircleFilledIcon from '@mui/icons-material/PauseCircleFilled'; @@ -17,10 +17,10 @@ import { useAdministrator } from '../../common/util/permissions'; const MenuItem = ({ title, link, icon, selected, }) => ( - <ListItem button key={link} component={Link} to={link} selected={selected}> + <ListItemButton button key={link} component={Link} to={link} selected={selected}> <ListItemIcon>{icon}</ListItemIcon> <ListItemText primary={title} /> - </ListItem> + </ListItemButton> ); const ReportsMenu = () => { diff --git a/modern/src/settings/components/EditItemView.js b/modern/src/settings/components/EditItemView.js index a5ac31b1..a646f629 100644 --- a/modern/src/settings/components/EditItemView.js +++ b/modern/src/settings/components/EditItemView.js @@ -37,7 +37,6 @@ const EditItemView = ({ const { id } = useParams(); useEffectAsync(async () => { - console.log(item); if (!item) { if (id) { const response = await fetch(`/api/${endpoint}/${id}`); diff --git a/modern/src/settings/components/SettingsMenu.js b/modern/src/settings/components/SettingsMenu.js index ef5b07d7..a37d5d1a 100644 --- a/modern/src/settings/components/SettingsMenu.js +++ b/modern/src/settings/components/SettingsMenu.js @@ -1,6 +1,6 @@ import React from 'react'; import { - Divider, List, ListItem, ListItemIcon, ListItemText, + Divider, List, ListItemButton, ListItemIcon, ListItemText, } from '@mui/material'; import SettingsIcon from '@mui/icons-material/Settings'; import CreateIcon from '@mui/icons-material/Create'; @@ -21,10 +21,10 @@ import useFeatures from '../../common/util/useFeatures'; const MenuItem = ({ title, link, icon, selected, }) => ( - <ListItem button key={link} component={Link} to={link} selected={selected}> + <ListItemButton key={link} component={Link} to={link} selected={selected}> <ListItemIcon>{icon}</ListItemIcon> <ListItemText primary={title} /> - </ListItem> + </ListItemButton> ); const SettingsMenu = () => { |