aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--modern/src/DevicePage.js4
-rw-r--r--modern/src/DevicesList.js (renamed from modern/src/DeviceList.js)4
-rw-r--r--modern/src/MainPage.js4
-rw-r--r--modern/src/UserPage.js6
-rw-r--r--modern/src/admin/UsersPage.js114
5 files changed, 51 insertions, 81 deletions
diff --git a/modern/src/DevicePage.js b/modern/src/DevicePage.js
index 7c963b0..48c6afd 100644
--- a/modern/src/DevicePage.js
+++ b/modern/src/DevicePage.js
@@ -12,8 +12,8 @@ const DevicePage = () => {
const getItem = () => {
const updatedItem = item;
- updatedItem.name = name;
- updatedItem.uniqueId = uniqueId;
+ updatedItem.name = name || item.name;
+ updatedItem.uniqueId = uniqueId || item.uniqueId;
return updatedItem;
};
diff --git a/modern/src/DeviceList.js b/modern/src/DevicesList.js
index c9abce3..28ead78 100644
--- a/modern/src/DeviceList.js
+++ b/modern/src/DevicesList.js
@@ -60,10 +60,10 @@ const DeviceView = ({ updateTimestamp, onMenuClick }) => {
);
}
-const DeviceList = () => {
+const DevicesList = () => {
return (
<EditCollectionView content={DeviceView} editPath="/device" endpoint="devices" />
);
}
-export default DeviceList;
+export default DevicesList;
diff --git a/modern/src/MainPage.js b/modern/src/MainPage.js
index b13a263..3032f93 100644
--- a/modern/src/MainPage.js
+++ b/modern/src/MainPage.js
@@ -4,7 +4,7 @@ import { isWidthUp, makeStyles, withWidth } from '@material-ui/core';
import Drawer from '@material-ui/core/Drawer';
import ContainerDimensions from 'react-container-dimensions';
import LinearProgress from '@material-ui/core/LinearProgress';
-import DeviceList from './DeviceList';
+import DevicesList from './DevicesList';
import MainMap from './MainMap';
import MainToobar from './MainToolbar';
@@ -49,7 +49,7 @@ const MainPage = ({ width }) => {
anchor={isWidthUp('sm', width) ? 'left' : 'bottom'}
variant='permanent'
classes={{ paper: classes.drawerPaper }}>
- <DeviceList />
+ <DevicesList />
</Drawer>
<div className={classes.mapContainer}>
<ContainerDimensions>
diff --git a/modern/src/UserPage.js b/modern/src/UserPage.js
index 4b58ba8..a05cace 100644
--- a/modern/src/UserPage.js
+++ b/modern/src/UserPage.js
@@ -13,9 +13,9 @@ const UserPage = () => {
const getItem = () => {
const updatedItem = item;
- updatedItem.name = name;
- updatedItem.email = email;
- updatedItem.password = password;
+ updatedItem.name = name || item.name;
+ updatedItem.email = email || item.email;
+ updatedItem.password = password || item.password;
return updatedItem;
};
diff --git a/modern/src/admin/UsersPage.js b/modern/src/admin/UsersPage.js
index 85ee248..529cdc6 100644
--- a/modern/src/admin/UsersPage.js
+++ b/modern/src/admin/UsersPage.js
@@ -1,12 +1,12 @@
import React, { useState } from 'react';
import MainToobar from '../MainToolbar';
import { useHistory } from 'react-router-dom';
-import { Fab, TableContainer, Table, TableRow, TableCell, TableHead, TableBody, makeStyles, IconButton, Menu, MenuItem } from '@material-ui/core';
-import AddIcon from '@material-ui/icons/Add';
+import { TableContainer, Table, TableRow, TableCell, TableHead, TableBody, makeStyles, IconButton } from '@material-ui/core';
import MoreVertIcon from '@material-ui/icons/MoreVert';
import t from '../common/localization';
import formatter from '../common/formatter';
import { useEffectAsync } from '../reactHelper';
+import EditCollectionView from '../EditCollectionView';
const useStyles = makeStyles(theme => ({
root: {
@@ -16,90 +16,60 @@ const useStyles = makeStyles(theme => ({
width: theme.spacing(1),
padding: theme.spacing(0, 1),
},
- fab: {
- position: 'absolute',
- bottom: theme.spacing(2),
- right: theme.spacing(2),
- },
}));
-const UsersPage = () => {
- const history = useHistory();
+const UsersView = ({ updateTimestamp, onMenuClick }) => {
const classes = useStyles();
- const [data, setData] = useState([]);
- const [menuItemId, setMenuItemId] = useState(null);
- const [menuAnchorEl, setMenuAnchorEl] = useState(null);
+
+ const [items, setItems] = useState([]);
useEffectAsync(async () => {
const response = await fetch('/api/users');
if (response.ok) {
- setData(await response.json());
+ setItems(await response.json());
}
- }, []);
-
- const handleMenuOpen = (event, itemId) => {
- setMenuItemId(itemId);
- setMenuAnchorEl(event.currentTarget);
- }
-
- const handleMenuClose = () => {
- setMenuItemId(null);
- setMenuAnchorEl(null);
- }
-
- const handleMenuEdit = () => {
- history.push(`/user/${menuItemId}`);
- handleMenuClose();
- }
+ }, [updateTimestamp]);
- const handleMenuRemove = () => {
- //setRemoveDialogOpen(true);
- handleMenuClose();
- }
+ return (
+ <TableContainer>
+ <Table>
+ <TableHead>
+ <TableRow>
+ <TableCell className={classes.columnAction} />
+ <TableCell>{t('sharedName')}</TableCell>
+ <TableCell>{t('userEmail')}</TableCell>
+ <TableCell>{t('userAdmin')}</TableCell>
+ <TableCell>{t('sharedDisabled')}</TableCell>
+ </TableRow>
+ </TableHead>
+ <TableBody>
+ {items.map((item) => (
+ <TableRow key={item.id}>
+ <TableCell className={classes.columnAction} padding="none">
+ <IconButton onClick={(event) => onMenuClick(event.currentTarget, item.id)}>
+ <MoreVertIcon />
+ </IconButton>
+ </TableCell>
+ <TableCell>{formatter(item, 'name')}</TableCell>
+ <TableCell>{formatter(item, 'email')}</TableCell>
+ <TableCell>{formatter(item, 'administrator')}</TableCell>
+ <TableCell>{formatter(item, 'disabled')}</TableCell>
+ </TableRow>
+ ))}
+ </TableBody>
+ </Table>
+ </TableContainer>
+ );
+}
- const handleAdd = () => {
- history.push('/user');
- //handleMenuClose();
- }
+const UsersPage = () => {
+ const history = useHistory();
+ const classes = useStyles();
return (
<div className={classes.root}>
<MainToobar history={history} />
- <TableContainer>
- <Table>
- <TableHead>
- <TableRow>
- <TableCell className={classes.columnAction} />
- <TableCell>{t('sharedName')}</TableCell>
- <TableCell>{t('userEmail')}</TableCell>
- <TableCell>{t('userAdmin')}</TableCell>
- <TableCell>{t('sharedDisabled')}</TableCell>
- </TableRow>
- </TableHead>
- <TableBody>
- {data.map((item) => (
- <TableRow key={item.id}>
- <TableCell className={classes.columnAction} padding="none">
- <IconButton onClick={(event) => handleMenuOpen(event, item.id)}>
- <MoreVertIcon />
- </IconButton>
- </TableCell>
- <TableCell>{formatter(item, 'name')}</TableCell>
- <TableCell>{formatter(item, 'email')}</TableCell>
- <TableCell>{formatter(item, 'administrator')}</TableCell>
- <TableCell>{formatter(item, 'disabled')}</TableCell>
- </TableRow>
- ))}
- </TableBody>
- </Table>
- </TableContainer>
- <Fab size="medium" color="primary" className={classes.fab} onClick={handleAdd}>
- <AddIcon />
- </Fab>
- <Menu id="context-menu" anchorEl={menuAnchorEl} keepMounted open={Boolean(menuAnchorEl)} onClose={handleMenuClose}>
- <MenuItem onClick={handleMenuEdit}>{t('sharedEdit')}</MenuItem>
- <MenuItem onClick={handleMenuRemove}>{t('sharedRemove')}</MenuItem>
- </Menu>
+ <EditCollectionView content={UsersView} editPath="/user" endpoint="users" />
</div>
);
}