Handle list refresh

1 files changed, 9 insertions, 1 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) => (