aboutsummaryrefslogtreecommitdiff
path: root/modern/src/settings
diff options
context:
space:
mode:
authorAnton Tananaev <anton@traccar.org>2022-05-04 18:02:01 -0700
committerAnton Tananaev <anton@traccar.org>2022-05-04 18:02:01 -0700
commit05623d59c14896da5ac1b2527e93d4af50ec87b6 (patch)
tree6e9dfb5d6f969b3b46b2725ca8bb264a86685111 /modern/src/settings
parent53fd7f27b8a84b49ef7e4dafbc9e8ac985d7f3af (diff)
downloadtrackermap-web-05623d59c14896da5ac1b2527e93d4af50ec87b6.tar.gz
trackermap-web-05623d59c14896da5ac1b2527e93d4af50ec87b6.tar.bz2
trackermap-web-05623d59c14896da5ac1b2527e93d4af50ec87b6.zip
Handle user permissions
Diffstat (limited to 'modern/src/settings')
-rw-r--r--modern/src/settings/ComputedAttributesPage.js19
-rw-r--r--modern/src/settings/OptionsLayout.js23
2 files changed, 24 insertions, 18 deletions
diff --git a/modern/src/settings/ComputedAttributesPage.js b/modern/src/settings/ComputedAttributesPage.js
index b989b43e..78842e33 100644
--- a/modern/src/settings/ComputedAttributesPage.js
+++ b/modern/src/settings/ComputedAttributesPage.js
@@ -3,11 +3,11 @@ import {
TableContainer, Table, TableRow, TableCell, TableHead, TableBody, makeStyles, IconButton,
} from '@material-ui/core';
import MoreVertIcon from '@material-ui/icons/MoreVert';
-import { useSelector } from 'react-redux';
import { useEffectAsync } from '../reactHelper';
import EditCollectionView from '../EditCollectionView';
import OptionsLayout from './OptionsLayout';
import { useTranslation } from '../LocalizationProvider';
+import { useAdministrator } from '../common/permissions';
const useStyles = makeStyles((theme) => ({
columnAction: {
@@ -21,7 +21,7 @@ const ComputedAttributeView = ({ updateTimestamp, onMenuClick }) => {
const t = useTranslation();
const [items, setItems] = useState([]);
- const adminEnabled = useSelector((state) => state.session.user && state.session.user.administrator);
+ const administrator = useAdministrator();
useEffectAsync(async () => {
const response = await fetch('/api/attributes/computed');
@@ -35,7 +35,7 @@ const ComputedAttributeView = ({ updateTimestamp, onMenuClick }) => {
<Table>
<TableHead>
<TableRow>
- {adminEnabled && <TableCell className={classes.columnAction} />}
+ {administrator && <TableCell className={classes.columnAction} />}
<TableCell>{t('sharedDescription')}</TableCell>
<TableCell>{t('sharedAttribute')}</TableCell>
<TableCell>{t('sharedExpression')}</TableCell>
@@ -45,13 +45,12 @@ const ComputedAttributeView = ({ updateTimestamp, onMenuClick }) => {
<TableBody>
{items.map((item) => (
<TableRow key={item.id}>
- {adminEnabled
- && (
- <TableCell className={classes.columnAction} padding="none">
- <IconButton onClick={(event) => onMenuClick(event.currentTarget, item.id)}>
- <MoreVertIcon />
- </IconButton>
- </TableCell>
+ {administrator && (
+ <TableCell className={classes.columnAction} padding="none">
+ <IconButton onClick={(event) => onMenuClick(event.currentTarget, item.id)}>
+ <MoreVertIcon />
+ </IconButton>
+ </TableCell>
)}
<TableCell>{item.description}</TableCell>
<TableCell>{item.attribute}</TableCell>
diff --git a/modern/src/settings/OptionsLayout.js b/modern/src/settings/OptionsLayout.js
index 6ba636c2..3a78929b 100644
--- a/modern/src/settings/OptionsLayout.js
+++ b/modern/src/settings/OptionsLayout.js
@@ -26,6 +26,7 @@ import ExitToAppIcon from '@material-ui/icons/ExitToApp';
import SideNav from '../components/SideNav';
import NavBar from '../components/NavBar';
import { useTranslation } from '../LocalizationProvider';
+import { useAdministrator, useReadonly } from '../common/permissions';
const useStyles = makeStyles((theme) => ({
root: {
@@ -70,18 +71,15 @@ const OptionsLayout = ({ children }) => {
const [openDrawer, setOpenDrawer] = useState(false);
const [optionTitle, setOptionTitle] = useState();
- const admin = useSelector((state) => state.session.user?.administrator);
+ const readonly = useReadonly();
+ const admin = useAdministrator();
const userId = useSelector((state) => state.session.user?.id);
- const adminRoutes = useMemo(() => [
- { subheader: t('userAdmin') },
- { name: t('settingsServer'), href: '/admin/server', icon: <StorageIcon /> },
- { name: t('settingsUsers'), href: '/admin/users', icon: <PeopleIcon /> },
- { name: t('statisticsTitle'), href: '/admin/statistics', icon: <BarChartIcon /> },
+ const readonlyRoutes = useMemo(() => [
+ { name: t('sharedPreferences'), href: '/settings/preferences', icon: <SettingsIcon /> },
], [t]);
const mainRoutes = useMemo(() => [
- { name: t('sharedPreferences'), href: '/settings/preferences', icon: <SettingsIcon /> },
{ name: t('sharedNotifications'), href: '/settings/notifications', icon: <NotificationsIcon /> },
{ name: t('settingsUser'), href: `/user/${userId}`, icon: <PersonIcon /> },
{ name: t('sharedGeofences'), href: '/geofences', icon: <CreateIcon /> },
@@ -93,7 +91,16 @@ const OptionsLayout = ({ children }) => {
{ name: t('sharedSavedCommands'), href: '/settings/commands', icon: <ExitToAppIcon /> },
], [t, userId]);
- const routes = useMemo(() => [...mainRoutes, ...(admin ? adminRoutes : [])], [mainRoutes, admin, adminRoutes]);
+ const adminRoutes = useMemo(() => [
+ { subheader: t('userAdmin') },
+ { name: t('settingsServer'), href: '/admin/server', icon: <StorageIcon /> },
+ { name: t('settingsUsers'), href: '/admin/users', icon: <PeopleIcon /> },
+ { name: t('statisticsTitle'), href: '/admin/statistics', icon: <BarChartIcon /> },
+ ], [t]);
+
+ const routes = useMemo(() => (
+ [ ...readonlyRoutes, ...(!readonly ? mainRoutes : []), ...(admin ? adminRoutes : [])]
+ ), [readonlyRoutes, readonly, mainRoutes, admin, adminRoutes]);
useEffect(() => {
const activeRoute = routes.find((route) => route.href && location.pathname.includes(route.href));