Merge pull request #913 from roflcoopter/feature/timeline-sidebar

add direct navigation to timeline

Author: roflcoopter

frontend/src/components/camera/CameraCard.tsx

@@ -2,6 +2,7 @@ import Image from "@jy95/material-ui-image";
 import ImageSearchIcon from "@mui/icons-material/ImageSearch";
 import LiveTvIcon from "@mui/icons-material/LiveTv";
 import VideoFileIcon from "@mui/icons-material/VideoFile";
+import ViewTimelineIcon from "@mui/icons-material/ViewTimeline";
 import Card from "@mui/material/Card";
 import CardActionArea from "@mui/material/CardActionArea";
 import CardActions from "@mui/material/CardActions";
@@ -221,6 +222,14 @@ const SuccessCameraCard = ({
                   <ImageSearchIcon />
                 </IconButton>
               </Tooltip>
+              <Tooltip title="Timeline">
+                <IconButton
+                  component={Link}
+                  to={`/events?camera=${camera.identifier}&tab=timeline`}
+                >
+                  <ViewTimelineIcon />
+                </IconButton>
+              </Tooltip>
               <Tooltip title="Recordings">
                 <IconButton
                   component={Link}

frontend/src/components/header/Drawer.tsx

@@ -6,6 +6,7 @@ import SettingsIcon from "@mui/icons-material/Settings";
 import VideoFileIcon from "@mui/icons-material/VideoFile";
 import VideocamIcon from "@mui/icons-material/Videocam";
 import ViewListIcon from "@mui/icons-material/ViewList";
+import ViewTimelineIcon from "@mui/icons-material/ViewTimeline";
 import VolunteerActivismIcon from "@mui/icons-material/VolunteerActivism";
 import Box from "@mui/material/Box";
 import Container from "@mui/material/Container";
@@ -47,7 +48,13 @@ const drawerItems: Array<DrawerItemTypes> = [
     type: "link",
     title: "Events",
     icon: ImageSearchIcon,
-    path: "/events",
+    path: "/events?tab=events",
+  },
+  {
+    type: "link",
+    title: "Timeline",
+    icon: ViewTimelineIcon,
+    path: "/events?tab=timeline",
   },
   { type: "link", title: "Entities", icon: ViewListIcon, path: "/entities" },
   { type: "divider" },