aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--modern/src/main/EventsDrawer.js12
1 files changed, 9 insertions, 3 deletions
diff --git a/modern/src/main/EventsDrawer.js b/modern/src/main/EventsDrawer.js
index 69b7e1b8..46664f87 100644
--- a/modern/src/main/EventsDrawer.js
+++ b/modern/src/main/EventsDrawer.js
@@ -1,7 +1,8 @@
import React from 'react';
import { useDispatch, useSelector } from 'react-redux';
+import { useNavigate } from 'react-router-dom';
import {
- Drawer, IconButton, List, ListItem, ListItemText, Toolbar, Typography,
+ Drawer, IconButton, List, ListItemButton, ListItemText, Toolbar, Typography,
} from '@mui/material';
import { makeStyles } from '@mui/styles';
import DeleteIcon from '@mui/icons-material/Delete';
@@ -24,6 +25,7 @@ const useStyles = makeStyles((theme) => ({
const EventsDrawer = ({ open, onClose }) => {
const classes = useStyles();
+ const navigate = useNavigate();
const dispatch = useDispatch();
const t = useTranslation();
@@ -54,12 +56,16 @@ const EventsDrawer = ({ open, onClose }) => {
</Toolbar>
<List className={classes.drawer} dense>
{events.map((event) => (
- <ListItem key={event.id}>
+ <ListItemButton
+ key={event.id}
+ onClick={() => navigate(`/event/${event.id}`)}
+ disabled={!event.id}
+ >
<ListItemText primary={`${devices[event.deviceId]?.name} • ${formatType(event)}`} secondary={formatTime(event.eventTime)} />
<IconButton size="small" onClick={() => dispatch(eventsActions.delete(event))}>
<DeleteIcon fontSize="small" className={classes.negative} />
</IconButton>
- </ListItem>
+ </ListItemButton>
))}
</List>
</Drawer>