3 files changed, 54 insertions, 15 deletions
diff --git a/panel/src/components/Navbar.css b/panel/src/components/Navbar.css
new file mode 100644
index 0000000..ee38707
--- /dev/null
+++ b/panel/src/components/Navbar.css
@@ -0,0 +1,27 @@
+.navbar {
+  background-color: #343a40;
+  padding: 1rem;
+  display: flex;
+  justify-content: center;
+}
+
+.navbar-list {
+  list-style: none;
+  padding: 0;
+  margin: 0;
+  display: flex;
+}
+
+.navbar-item {
+  margin: 0 1rem;
+}
+
+.navbar-item a {
+  color: white;
+  text-decoration: none;
+  font-weight: bold;
+}
+
+.navbar-item a:hover {
+  text-decoration: underline;
+}
diff --git a/panel/src/components/Navbar.jsx b/panel/src/components/Navbar.jsx
new file mode 100644
index 0000000..b287e97
--- /dev/null
+++ b/panel/src/components/Navbar.jsx
@@ -0,0 +1,18 @@
+import React from 'react';
+import { Link } from 'react-router-dom';
+import './Navbar.css';
+
+const Navbar = () => {
+  return (
+    <nav className="navbar">
+      <ul className="navbar-list">
+        <li className="navbar-item"><Link to="/dashboard">Dashboard</Link></li>
+        <li className="navbar-item"><Link to="/manage-ads">Manage Ads</Link></li>
+        <li className="navbar-item"><Link to="/roles">Roles</Link></li>
+        <li className="navbar-item"><Link to="/logout">Logout</Link></li>
+      </ul>
+    </nav>
+  );
+};
+
+export default Navbar;
diff --git a/panel/src/components/PrivateRoute.jsx b/panel/src/components/PrivateRoute.jsx
index 2160f74..e2c502d 100644
--- a/panel/src/components/PrivateRoute.jsx
+++ b/panel/src/components/PrivateRoute.jsx
@@ -1,17 +1,11 @@
-import { BrowserRouter as Router, Route, Routes } from 'react-router-dom';
-import LoginPage from '../pages/LoginPage';
-import Dashboard from '../pages/Dashboard'; // Assuming you have a Dashboard component
+import React from 'react';
+import { Navigate, Outlet } from 'react-router-dom';
+import { useAuth } from '../contexts/AuthContext';
 
-function App() {
-  return (
-    <Router>
-      <Routes>
-        <Route path="/login" element={<LoginPage />} />
-        <Route path="/dashboard" element={<Dashboard />} />
-        {/* Other routes */}
-      </Routes>
-    </Router>
-  );
-}
+const PrivateRoute = () => {
+  const { currentUser } = useAuth();
 
-export default App;
+  return currentUser ? <Outlet /> : <Navigate to="/login" />;
+};
+
+export default PrivateRoute;