Merge branch 'bluewave-labs:master' into register-page

Client/src/App.jsx

@@ -6,12 +6,23 @@ import Register from "./Pages/Register";
 import HomeLayout from "./Layouts/HomeLayout";
 import Demo from "./Pages/Demo/Demo";
 import PlayGround from "./Pages/PlayGround/PlayGround";
+import Monitors from "./Pages/Monitors"
+import Incidents from "./Pages/Incidents";
+import Status from "./Pages/Status";
+import Integrations from "./Pages/Integrations";
+import Settings from "./Pages/Settings";
 
 function App() {
   return (
     <>
       <Routes>
-        <Route exact path="/" element={<HomeLayout />} />
+        <Route exact path="/" element={<HomeLayout />} >
+          <Route path="monitors" element={<Monitors />} />
+          <Route path="incidents" element={<Incidents />} />
+          <Route path="status" element={<Status />} />
+          <Route path="integrations" element={<Integrations />} />
+          <Route path="settings" element={<Settings />} />
+        </Route>
         <Route exact path="/register" element={<Register />} />
         <Route exact path="/login" element={<Login />} />
         <Route exact path="/demo" element={<Demo />} />

Client/src/Components/NavBar/index.jsx

@@ -1,10 +1,48 @@
-import React from 'react'
-import './index.css'
+import { useState } from 'react';
+import './index.css';
+import Button from '@mui/material/Button';
+import Menu from '@mui/material/Menu';
+import MenuItem from '@mui/material/MenuItem';
 
 const NavBar = () => {
-    return (
-        <div>NavBar Component</div>
-    )
-}
+    const [anchorEl, setAnchorEl] = useState(null);
+    const open = Boolean(anchorEl);
 
-export default NavBar
+    const handleClick = (event) => {
+        setAnchorEl(event.currentTarget);
+    };
+
+    const handleClose = () => {
+        setAnchorEl(null);
+    };
+
+    return (
+        <div>
+            <Button
+                id="basic-button"
+                aria-controls={open ? 'basic-menu' : undefined}
+                aria-haspopup="true"
+                aria-expanded={open ? 'true' : undefined}
+                onClick={handleClick}
+            >
+                Jackie Dawn
+            </Button>
+            <Menu
+                id="basic-menu"
+                anchorEl={anchorEl}
+                open={open}
+                onClose={handleClose}
+                MenuListProps={{
+                    'aria-labelledby': 'basic-button',
+                }}
+            >
+                <MenuItem onClick={handleClose}>Profile</MenuItem>
+                <MenuItem onClick={handleClose}>Team</MenuItem>
+                <MenuItem onClick={handleClose}>Invite Colleagues</MenuItem>
+                <MenuItem onClick={handleClose}>Log Out</MenuItem>
+            </Menu>
+        </div>
+    );
+};
+
+export default NavBar;

Client/src/Pages/Home/index.jsx

@@ -8,10 +8,6 @@ const Home = () => {
   return (
     <>
       <div>Home</div>
-      <DropdownTeamMember />
-      <Search />
-      <DashboardMenu />
-      <Integrations />
     </>
   );
 };

Client/src/Pages/Incidents/index.jsx

@@ -0,0 +1,9 @@
+import React from 'react'
+
+const Incidents = () => {
+    return (
+        <div>Incidents</div>
+    )
+}
+
+export default Incidents

Client/src/Pages/Integrations/index.jsx

@@ -0,0 +1,9 @@
+import React from 'react'
+
+const Integrations = () => {
+    return (
+        <div>Integrations</div>
+    )
+}
+
+export default Integrations

Client/src/Pages/Monitors/index.jsx

@@ -0,0 +1,9 @@
+import React from 'react'
+
+const Monitors = () => {
+    return (
+        <div>Monitors</div>
+    )
+}
+
+export default Monitors

Client/src/Pages/Settings/index.jsx

@@ -0,0 +1,9 @@
+import React from 'react'
+
+const Settings = () => {
+    return (
+        <div>Settings</div>
+    )
+}
+
+export default Settings

Client/src/Pages/Status/index.jsx

@@ -0,0 +1,9 @@
+import React from 'react'
+
+const Status = () => {
+    return (
+        <div>Status</div>
+    )
+}
+
+export default Status