From 2ab22821164f287932c2177c928355719ee45b34 Mon Sep 17 00:00:00 2001
From: "Arslan, Erdem" <erdem.arslan@valtech.com>
Date: Wed, 24 Jan 2024 22:12:00 +0100
Subject: [PATCH 1/3] implement dynamic routing within the sidebar

---
 pkgs/ui/src/components/sidebar/index.tsx | 47 +++++++++---------------
 1 file changed, 17 insertions(+), 30 deletions(-)

diff --git a/pkgs/ui/src/components/sidebar/index.tsx b/pkgs/ui/src/components/sidebar/index.tsx
index 55bb214..341b183 100644
--- a/pkgs/ui/src/components/sidebar/index.tsx
+++ b/pkgs/ui/src/components/sidebar/index.tsx
@@ -9,10 +9,11 @@ import {
   Tooltip,
   useMediaQuery,
 } from "@mui/material";
+import {useGetAllEntities} from "@/api/entities/entities";
 import Image from "next/image";
-import React, { ReactNode } from "react";
+import React, {ReactNode} from "react";
 
-import { tw } from "@/utils/tailwind";
+import {tw} from "@/utils/tailwind";
 import Collapse from "@mui/material/Collapse";
 import Link from "next/link";
 import ChevronLeftIcon from "@mui/icons-material/ChevronLeft";
@@ -33,32 +34,7 @@ type MenuEntry = {
   subMenuEntries?: MenuEntry[];
 };
 
-export const menuEntityEntries: MenuEntry[] = [
-  {
-    icon: <PersonIcon />,
-    label: "C1",
-    to: "/client/C1",
-    disabled: false,
-  },
-  {
-    icon: <PersonIcon />,
-    label: "C2",
-    to: "/client/C2",
-    disabled: false,
-  },
-  {
-    icon: <PersonIcon />,
-    label: "C3",
-    to: "/client/C3",
-    disabled: false,
-  },
-  {
-    icon: <PersonIcon />,
-    label: "C4",
-    to: "/client/C4",
-    disabled: false,
-  },
-];
+export let menuEntityEntries: MenuEntry[] = [];
 
 export const menuEntries: MenuEntry[] = [
   {
@@ -96,6 +72,7 @@ interface SidebarProps {
 }
 
 export function Sidebar(props: SidebarProps) {
+  const { data: entityData } = useGetAllEntities();
   const { show, onClose } = props;
   const [activeMenuItem, setActiveMenuItem] = React.useState(
     typeof window !== "undefined" ? window.location.pathname : "",
@@ -113,12 +90,22 @@ export function Sidebar(props: SidebarProps) {
   };
 
   React.useEffect(() => {
+    if (entityData) {
+      menuEntityEntries=Array.isArray(entityData.data)
+          ? entityData.data.map((entity, index) => ({
+            icon: <PersonIcon/>,
+            label: entity.name,
+            to: `/client/${entity.name}`,
+            disabled: false,
+          }))
+          : [];
+    }
     if (isSmallerScreen) {
       setCollapseMenuOpen(false);
     } else {
       setCollapseMenuOpen(true);
     }
-  }, [isSmallerScreen]);
+  }, [isSmallerScreen, entityData]);
 
   return (
     <aside
@@ -213,7 +200,7 @@ export function Sidebar(props: SidebarProps) {
                       unmountOnExit
                     >
                       <List component="div" disablePadding>
-                        {menuEntityEntries.map((menuEntry, idx) => (
+                        {menuEntityEntries?.map((menuEntry, idx) => (
                           <ListItemButton
                             key={idx}
                             sx={{ pl: 4 }}
-- 
2.51.0


From 22bcbf681929f5ee52a5ac539f960f6a1580989f Mon Sep 17 00:00:00 2001
From: "Arslan, Erdem" <erdem.arslan@valtech.com>
Date: Wed, 24 Jan 2024 22:14:19 +0100
Subject: [PATCH 2/3] fix formatting

---
 pkgs/ui/src/components/sidebar/index.tsx | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/pkgs/ui/src/components/sidebar/index.tsx b/pkgs/ui/src/components/sidebar/index.tsx
index 341b183..1cbf1c2 100644
--- a/pkgs/ui/src/components/sidebar/index.tsx
+++ b/pkgs/ui/src/components/sidebar/index.tsx
@@ -9,11 +9,11 @@ import {
   Tooltip,
   useMediaQuery,
 } from "@mui/material";
-import {useGetAllEntities} from "@/api/entities/entities";
+import { useGetAllEntities } from "@/api/entities/entities";
 import Image from "next/image";
-import React, {ReactNode} from "react";
+import React, { ReactNode } from "react";
 
-import {tw} from "@/utils/tailwind";
+import { tw } from "@/utils/tailwind";
 import Collapse from "@mui/material/Collapse";
 import Link from "next/link";
 import ChevronLeftIcon from "@mui/icons-material/ChevronLeft";
@@ -91,14 +91,14 @@ export function Sidebar(props: SidebarProps) {
 
   React.useEffect(() => {
     if (entityData) {
-      menuEntityEntries=Array.isArray(entityData.data)
-          ? entityData.data.map((entity, index) => ({
-            icon: <PersonIcon/>,
+      menuEntityEntries = Array.isArray(entityData.data)
+        ? entityData.data.map((entity, index) => ({
+            icon: <PersonIcon />,
             label: entity.name,
             to: `/client/${entity.name}`,
             disabled: false,
           }))
-          : [];
+        : [];
     }
     if (isSmallerScreen) {
       setCollapseMenuOpen(false);
-- 
2.51.0


From c5c4ab7178e514cd43e97655e628cd9333d77a6a Mon Sep 17 00:00:00 2001
From: "Arslan, Erdem" <erdem.arslan@valtech.com>
Date: Wed, 24 Jan 2024 22:19:46 +0100
Subject: [PATCH 3/3] remove variable index within mapping

---
 pkgs/ui/src/components/sidebar/index.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/pkgs/ui/src/components/sidebar/index.tsx b/pkgs/ui/src/components/sidebar/index.tsx
index 1cbf1c2..227bd24 100644
--- a/pkgs/ui/src/components/sidebar/index.tsx
+++ b/pkgs/ui/src/components/sidebar/index.tsx
@@ -92,7 +92,7 @@ export function Sidebar(props: SidebarProps) {
   React.useEffect(() => {
     if (entityData) {
       menuEntityEntries = Array.isArray(entityData.data)
-        ? entityData.data.map((entity, index) => ({
+        ? entityData.data.map((entity) => ({
             icon: <PersonIcon />,
             label: entity.name,
             to: `/client/${entity.name}`,
-- 
2.51.0