aboutsummaryrefslogtreecommitdiff
path: root/modern
diff options
context:
space:
mode:
authorAnton Tananaev <anton.tananaev@gmail.com>2020-09-20 23:03:05 -0700
committerAnton Tananaev <anton.tananaev@gmail.com>2020-09-20 23:03:05 -0700
commit9238895c99c30c442ce8dae41b61f898a79dd89b (patch)
tree9488fa21fbcf6a78eefcf015ed73cd44e7415b97 /modern
parent37dd8129f8e07d00eb93262210bf1ecd4ce95532 (diff)
downloadtrackermap-web-9238895c99c30c442ce8dae41b61f898a79dd89b.tar.gz
trackermap-web-9238895c99c30c442ce8dae41b61f898a79dd89b.tar.bz2
trackermap-web-9238895c99c30c442ce8dae41b61f898a79dd89b.zip
Handle list refresh
Diffstat (limited to 'modern')
-rw-r--r--modern/src/DeviceList.js10
-rw-r--r--modern/src/EditCollectionView.js4
-rw-r--r--modern/src/RemoveDialog.js2
-rw-r--r--modern/src/SocketController.js6
-rw-r--r--modern/src/store/devices.js4
5 files changed, 19 insertions, 7 deletions
diff --git a/modern/src/DeviceList.js b/modern/src/DeviceList.js
index b7c15dc4..c9abce3c 100644
--- a/modern/src/DeviceList.js
+++ b/modern/src/DeviceList.js
@@ -14,6 +14,7 @@ import MoreVertIcon from '@material-ui/icons/MoreVert';
import { devicesActions } from './store';
import EditCollectionView from './EditCollectionView';
+import { useEffectAsync } from './reactHelper';
const useStyles = makeStyles(() => ({
list: {
@@ -22,12 +23,19 @@ const useStyles = makeStyles(() => ({
},
}));
-const DeviceView = ({ onMenuClick }) => {
+const DeviceView = ({ updateTimestamp, onMenuClick }) => {
const classes = useStyles();
const dispatch = useDispatch();
const items = useSelector(state => Object.values(state.devices.items));
+ useEffectAsync(async () => {
+ const response = await fetch('/api/devices');
+ if (response.ok) {
+ dispatch(devicesActions.refresh(await response.json()));
+ }
+ }, [updateTimestamp]);
+
return (
<List className={classes.list}>
{items.map((item, index, list) => (
diff --git a/modern/src/EditCollectionView.js b/modern/src/EditCollectionView.js
index 59ea2db0..bec10562 100644
--- a/modern/src/EditCollectionView.js
+++ b/modern/src/EditCollectionView.js
@@ -24,6 +24,7 @@ const EditCollectionView = ({ content, editPath, endpoint }) => {
const [selectedId, setSelectedId] = useState(null);
const [selectedAnchorEl, setSelectedAnchorEl] = useState(null);
const [removeDialogShown, setRemoveDialogShown] = useState(false);
+ const [updateTimestamp, setUpdateTimestamp] = useState(Date.now());
const menuShow = (anchorId, itemId) => {
setSelectedAnchorEl(anchorId);
@@ -51,13 +52,14 @@ const EditCollectionView = ({ content, editPath, endpoint }) => {
const handleRemoveResult = () => {
setRemoveDialogShown(false);
+ setUpdateTimestamp(Date.now());
}
const Content = content;
return (
<>
- <Content onMenuClick={menuShow} />
+ <Content updateTimestamp={updateTimestamp} onMenuClick={menuShow} />
<Fab size="medium" color="primary" className={classes.fab} onClick={handleAdd}>
<AddIcon />
</Fab>
diff --git a/modern/src/RemoveDialog.js b/modern/src/RemoveDialog.js
index 57be7871..a8107357 100644
--- a/modern/src/RemoveDialog.js
+++ b/modern/src/RemoveDialog.js
@@ -8,7 +8,7 @@ import DialogContentText from '@material-ui/core/DialogContentText';
const RemoveDialog = ({ open, endpoint, itemId, onResult }) => {
const handleRemove = async () => {
- const response = fetch(`/api/${endpoint}/${itemId}`, { method: 'DELETE' })
+ const response = await fetch(`/api/${endpoint}/${itemId}`, { method: 'DELETE' })
if (response.ok) {
onResult(true);
}
diff --git a/modern/src/SocketController.js b/modern/src/SocketController.js
index 3d9748bd..73df6d0a 100644
--- a/modern/src/SocketController.js
+++ b/modern/src/SocketController.js
@@ -60,15 +60,13 @@ const SocketController = () => {
if (authenticated) {
const response = await fetch('/api/devices');
if (response.ok) {
- const devices = await response.json();
- dispatch(devicesActions.update(devices));
+ dispatch(devicesActions.refresh(await response.json()));
}
connectSocket();
} else {
const response = await fetch('/api/session');
if (response.ok) {
- const user = await response.json();
- dispatch(sessionActions.updateUser(user));
+ dispatch(sessionActions.updateUser(await response.json()));
} else {
history.push('/login');
}
diff --git a/modern/src/store/devices.js b/modern/src/store/devices.js
index 3d7be3e6..66c1607f 100644
--- a/modern/src/store/devices.js
+++ b/modern/src/store/devices.js
@@ -7,6 +7,10 @@ const { reducer, actions } = createSlice({
selectedId: null
},
reducers: {
+ refresh(state, action) {
+ state.items = {};
+ action.payload.forEach(item => state.items[item['id']] = item);
+ },
update(state, action) {
action.payload.forEach(item => state.items[item['id']] = item);
},