From eb7d429ec8a1a5c781569af47db56394215edd8f Mon Sep 17 00:00:00 2001
From: Claire Dagan <clairedagan@gmail.com>
Date: Thu, 19 Sep 2024 11:32:55 +0200
Subject: [PATCH] [Tech] add NavBar Props

---
 frontend/src/components/NavBar.tsx                     | 10 ++++++++--
 .../features/Dashboard/components/DashboardsNavBar.tsx |  2 +-
 frontend/src/features/missions/MissionsNavBar.tsx      |  2 +-
 3 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/frontend/src/components/NavBar.tsx b/frontend/src/components/NavBar.tsx
index 9455a6f21..8e941dda9 100644
--- a/frontend/src/components/NavBar.tsx
+++ b/frontend/src/components/NavBar.tsx
@@ -3,14 +3,20 @@ import { Accent, Icon, IconButton } from '@mtes-mct/monitor-ui'
 import ResponsiveNav from '@rsuite/responsive-nav'
 import styled from 'styled-components'
 
-export function NavBar({ children, onClose, onSelect }) {
+type NavBarProps = {
+  children: React.ReactNode[]
+  name: string
+  onClose: (eventKey: string | number | undefined) => void
+  onSelect: (eventKey: string | number | undefined) => void
+}
+export function NavBar({ children, name, onClose, onSelect }: NavBarProps) {
   const currentPath = useAppSelector(state => state.sideWindow.currentPath)
 
   return (
     <StyledResponsiveNav
       activeKey={currentPath}
       appearance="tabs"
-      data-cy="dashboards-nav"
+      data-cy={`${name}-nav`}
       moreProps={{ placement: 'bottomEnd' }}
       moreText={<IconButton accent={Accent.TERTIARY} Icon={Icon.More} />}
       onItemRemove={onClose}
diff --git a/frontend/src/features/Dashboard/components/DashboardsNavBar.tsx b/frontend/src/features/Dashboard/components/DashboardsNavBar.tsx
index 9453626b2..edf1418ce 100644
--- a/frontend/src/features/Dashboard/components/DashboardsNavBar.tsx
+++ b/frontend/src/features/Dashboard/components/DashboardsNavBar.tsx
@@ -28,7 +28,7 @@ export function DashboardsNavBar() {
   const closeDashboard = () => {}
 
   return (
-    <NavBar onClose={closeDashboard} onSelect={selectDashboard}>
+    <NavBar name="dashboards" onClose={closeDashboard} onSelect={selectDashboard}>
       {tabs.map((item, index) => (
         <ResponsiveNav.Item
           key={item.nextPath}
diff --git a/frontend/src/features/missions/MissionsNavBar.tsx b/frontend/src/features/missions/MissionsNavBar.tsx
index b23a6a86f..108ce0653 100644
--- a/frontend/src/features/missions/MissionsNavBar.tsx
+++ b/frontend/src/features/missions/MissionsNavBar.tsx
@@ -65,7 +65,7 @@ export function MissionsNavBar() {
   }
 
   return (
-    <NavBar onClose={removeTab} onSelect={selectTab}>
+    <NavBar name="missions" onClose={removeTab} onSelect={selectTab}>
       {tabs.map((item, index) => (
         <ResponsiveNav.Item key={item.nextPath} data-cy={`mission-${index}`} eventKey={item.nextPath} icon={item.icon}>
           {item.label}