From 0753ac71b57a43b23e5d6f1ca5aa6e9c092f2013 Mon Sep 17 00:00:00 2001
From: Alex Holliday <ajhollid@gmail.com>
Date: Fri, 13 Sep 2024 11:23:03 +0800
Subject: [PATCH] Enabled incident in actions menu, set selected monitor in
 Incidents page

---
 Client/src/App.jsx                             | 2 +-
 Client/src/Pages/Incidents/index.jsx           | 4 ++++
 Client/src/Pages/Monitors/Home/actionsMenu.jsx | 9 ++++++++-
 3 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/Client/src/App.jsx b/Client/src/App.jsx
index 8fb4bf932..d6fca146f 100644
--- a/Client/src/App.jsx
+++ b/Client/src/App.jsx
@@ -71,7 +71,7 @@ function App() {
             element={<ProtectedRoute Component={Configure} />}
           />
           <Route
-            path="incidents"
+            path="incidents/:monitorId?"
             element={<ProtectedRoute Component={Incidents} />}
           />
 
diff --git a/Client/src/Pages/Incidents/index.jsx b/Client/src/Pages/Incidents/index.jsx
index 1fd91c10a..afaea43eb 100644
--- a/Client/src/Pages/Incidents/index.jsx
+++ b/Client/src/Pages/Incidents/index.jsx
@@ -1,6 +1,8 @@
 import { useState, useEffect } from "react";
 import { useSelector } from "react-redux";
 import { ButtonGroup, Stack, Typography, Button } from "@mui/material";
+import { useParams } from "react-router-dom";
+
 import { networkService } from "../../main";
 import { useTheme } from "@emotion/react";
 import Select from "../../Components/Inputs/Select";
@@ -11,6 +13,7 @@ import SkeletonLayout from "./skeleton";
 const Incidents = () => {
   const theme = useTheme();
   const authState = useSelector((state) => state.auth);
+  const { monitorId } = useParams();
 
   const [monitors, setMonitors] = useState({});
   const [selectedMonitor, setSelectedMonitor] = useState("0");
@@ -40,6 +43,7 @@ const Incidents = () => {
           return acc;
         }, {});
         setMonitors(monitorLookup);
+        monitorId !== undefined && setSelectedMonitor(monitorId);
       }
       setLoading(false);
     };
diff --git a/Client/src/Pages/Monitors/Home/actionsMenu.jsx b/Client/src/Pages/Monitors/Home/actionsMenu.jsx
index a271a8a9a..45c358a6c 100644
--- a/Client/src/Pages/Monitors/Home/actionsMenu.jsx
+++ b/Client/src/Pages/Monitors/Home/actionsMenu.jsx
@@ -125,7 +125,14 @@ const ActionsMenu = ({ monitor, isAdmin, updateCallback }) => {
           Details
         </MenuItem>
         {/* TODO - pass monitor id to Incidents page */}
-        <MenuItem disabled>Incidents</MenuItem>
+        <MenuItem
+          onClick={(e) => {
+            e.stopPropagation();
+            navigate(`/incidents/${actions.id}`);
+          }}
+        >
+          Incidents
+        </MenuItem>
         {isAdmin && (
           <MenuItem
             onClick={(e) => {