From bbf277787e9f7c768ab6ddd3116d5e4116919e11 Mon Sep 17 00:00:00 2001
From: Alex Holliday <ajhollid@gmail.com>
Date: Wed, 5 Feb 2025 15:13:14 -0800
Subject: [PATCH] add DU to sidebar

---
 Client/src/Components/Sidebar/index.jsx | 11 ++++++-----
 Client/src/assets/icons/groups.svg      |  1 +
 2 files changed, 7 insertions(+), 5 deletions(-)
 create mode 100644 Client/src/assets/icons/groups.svg

diff --git a/Client/src/Components/Sidebar/index.jsx b/Client/src/Components/Sidebar/index.jsx
index c4c574c8f..03c6b54ba 100644
--- a/Client/src/Components/Sidebar/index.jsx
+++ b/Client/src/Components/Sidebar/index.jsx
@@ -45,6 +45,7 @@ import Docs from "../../assets/icons/docs.svg?react";
 import Folder from "../../assets/icons/folder.svg?react";
 import StatusPages from "../../assets/icons/status-pages.svg?react";
 import ChatBubbleOutlineRoundedIcon from "@mui/icons-material/ChatBubbleOutlineRounded";
+import Groups from "../../assets/icons/groups.svg?react";
 
 import "./index.css";
 
@@ -52,6 +53,7 @@ const menu = [
 	{ name: "Uptime", path: "uptime", icon: <Monitors /> },
 	{ name: "Pagespeed", path: "pagespeed", icon: <PageSpeed /> },
 	{ name: "Infrastructure", path: "infrastructure", icon: <Integrations /> },
+	{ name: "Distributed Uptime", path: "distributed-uptime", icon: <Groups /> },
 	{ name: "Incidents", path: "incidents", icon: <Incidents /> },
 
 	{ name: "Status pages", path: "status", icon: <StatusPages /> },
@@ -99,6 +101,7 @@ const PATH_MAP = {
 	monitors: "Dashboard",
 	pagespeed: "Dashboard",
 	infrastructure: "Dashboard",
+	["distributed-uptime"]: "Dashboard",
 	account: "Account",
 	settings: "Settings",
 };
@@ -337,15 +340,13 @@ function Sidebar() {
 							disableInteractive
 						>
 							<ListItemButton
-								className={location.pathname.includes(item.path) ? "selected-path" : ""}
+								className={location.pathname === `/${item.path}` ? "selected-path" : ""}
 								onClick={() => navigate(`/${item.path}`)}
 								sx={{
-									/* 
-									TODO we do not need this height
-									minHeight: "37px", */
-									p: theme.spacing(5),
+									height: "37px",
 									gap: theme.spacing(4),
 									borderRadius: theme.shape.borderRadius,
+									px: theme.spacing(4),
 								}}
 							>
 								<ListItemIcon sx={{ minWidth: 0 }}>{item.icon}</ListItemIcon>
diff --git a/Client/src/assets/icons/groups.svg b/Client/src/assets/icons/groups.svg
new file mode 100644
index 000000000..fa2cae03c
--- /dev/null
+++ b/Client/src/assets/icons/groups.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#5f6368"><g><rect fill="none" height="24" width="24"/></g><g><g/><g><g><path d="M16.67,13.13C18.04,14.06,19,15.32,19,17v3h4v-3 C23,14.82,19.43,13.53,16.67,13.13z" fill-rule="evenodd"/></g><g><circle cx="9" cy="8" fill-rule="evenodd" r="4"/></g><g><path d="M15,12c2.21,0,4-1.79,4-4c0-2.21-1.79-4-4-4c-0.47,0-0.91,0.1-1.33,0.24 C14.5,5.27,15,6.58,15,8s-0.5,2.73-1.33,3.76C14.09,11.9,14.53,12,15,12z" fill-rule="evenodd"/></g><g><path d="M9,13c-2.67,0-8,1.34-8,4v3h16v-3C17,14.34,11.67,13,9,13z" fill-rule="evenodd"/></g></g></g></svg>
\ No newline at end of file