Added LDAP config and auth

client/src/App.jsx

@@ -1,7 +1,13 @@
 import 'leaflet/dist/leaflet.css';
+import { useEffect } from 'react';
 import { Routes, Route, Navigate, Outlet } from 'react-router-dom';
 import { useRecipe, Grid, GridItem, useDialog, Flex, Heading } from "@chakra-ui/react";
-import { createContext } from "react";
+
+// --- NEW AUTH IMPORTS ---
+import useAuthStore from './store/authStore';
+import ProtectedRoute from './components/layout/ProtectedRoute.jsx';
+
+// Pages & Components
 import Login from "@/pages/auth/Login.jsx";
 import Sidebar from "./components/layout/Sidebar.jsx";
 import DialogPopup from "@/components/dashboard/DialogPopup.jsx";
@@ -41,43 +47,52 @@ function AppFoundation() {
   )
 }
 
-// function ProtectedRoute({ user, children }) {
-//   if (user) return children;
-//   else return <Navigate to="/login" replace />;
-// }
 const Placeholder = ({ name }) => (
-    <Flex width="100%" height="100%" align="center" justify="center" bg="gray.50"_dark={{ bg: "gray.900" }}>
+    <Flex width="100%" height="100%" align="center" justify="center" bg="gray.50" _dark={{ bg: "gray.900" }}>
         <Heading color="gray.400" _dark={{ bg: "gray.600" }} size="md">{name} Dashboard - Coming Soon</Heading>
     </Flex>
 );
+
 function App() {
+    // 1. Pull the initialization function from Zustand
+    const checkAuth = useAuthStore((state) => state.checkAuth);
+
+    // 2. Ping Django to verify the HttpOnly cookie the moment the app boots
+    useEffect(() => {
+        checkAuth();
+    }, [checkAuth]);
+
     return (
         <Routes>
-            {/*Public Routes*/}
+            {/* --- Public Routes --- */}
             <Route path="/login" element={<Login />} />
 
-            {/*Non-Public Routes*/}
-            <Route element={<AppFoundation />}>
+            {/* --- SECURE ROUTES --- */}
+            <Route element={<ProtectedRoute />}>
 
-                <Route path="/home" element={<Home />}>
-                    {/* We use our "pass" component to fill the Outlet until the real pages are built */}
-                    <Route index element={<MyDashboard />} />
-                    <Route path="gas" element={<MyDashboard />} />
-                    <Route path="seismic" element={<Placeholder name="Seismic" />} />
-                    <Route path="remote" element={<Placeholder name="Remote Sensing" />} />
-                    <Route path="daily" element={<Placeholder name="Daily Activity" />} />
+                {/* --- Non-Public Routes (Now completely locked down) --- */}
+                <Route element={<AppFoundation />}>
+
+                    <Route path="/home" element={<Home />}>
+                        <Route index element={<MyDashboard />} />
+                        <Route path="gas" element={<MyDashboard />} />
+                        <Route path="seismic" element={<Placeholder name="Seismic" />} />
+                        <Route path="remote" element={<Placeholder name="Remote Sensing" />} />
+                        <Route path="daily" element={<Placeholder name="Daily Activity" />} />
+                    </Route>
+
+                    <Route path="/global-map" element={<GlobalMap />} />
+                    <Route path="/regional-map" element={<RegionalMap />} />
+                    <Route path="/volcano" element={<Volcano />} />
+                    <Route path="/admin" element={<Admin />} />
                 </Route>
 
-                <Route path="/global-map" element={<GlobalMap />} />
-                <Route path="/regional-map" element={<RegionalMap />} />
-                <Route path="/volcano" element={<Volcano />} />
-                <Route path="/admin" element={<Admin />} />
             </Route>
 
-            {/*Redirect Routes*/}
+            {/* --- Redirect Routes --- */}
             <Route path="/" element={<Navigate to="/home" replace />} />
-      </Routes>
-  );
+        </Routes>
+    );
 }
 
-export default App
+export default App;