udpate

src/App.tsx

@@ -1,21 +1,47 @@
-import { useContext } from 'react';
-import { Route, BrowserRouter as Router, Routes } from "react-router-dom";
-import GlobalStateContext from './Contexts/GlobalStateContext';
-import DefaultLayout from './Layouts/DefaultLayout';
-import Login from './Pages/Login';
-import { RouteLink } from './Routes/Routes';
+import { useContext, useEffect } from "react";
+import { BrowserRouter as Router, Routes, Route, Navigate } from "react-router-dom";
+import GlobalStateContext from "./Contexts/GlobalStateContext";
+import DefaultLayout from "./Layouts/DefaultLayout";
+import Login from "./Pages/Login";
+import { RouteLink } from "./Routes/Routes";
 
-function App() { 
+function App() {   
   const context = useContext(GlobalStateContext); 
-  if (!context) throw new Error('App must be used within a GlobalStateProvider'); 
-  const { isAuthenticate } = context; 
+  if (!context) throw new Error("App must be used within a GlobalStateProvider"); 
+  
+  const { isAuthenticate, setIsAuthenticate } = context; 
+
+  useEffect(() => {
+    const token = localStorage.getItem("token");
+    setIsAuthenticate(!!token); // Converts token to boolean
+  }, [setIsAuthenticate]);
+
+  console.log("Auth Status:", isAuthenticate);
 
   return ( 
     <Router> 
       <Routes> 
-        <Route path="/login" element={<Login />} /> 
-        <Route path="/*" element={localStorage.getItem("token")? (<DefaultLayout><Routes>{RouteLink.map(({ path, Component }, index) => (<Route key={index} path={path} element={<Component />} />))}</Routes></DefaultLayout>) : (<Login />)} /> 
-        <Route path="*" element={<Login />} /> 
+        {/* Redirect logged-in users away from login */}
+        <Route path="/login" element={isAuthenticate && localStorage.getItem("token") ? <Navigate to="/" /> : <Login />} /> 
+
+        {/* Protected Routes */}
+        <Route 
+          path="/*" 
+          element={isAuthenticate && localStorage.getItem("token")  ? (
+            <DefaultLayout>
+              <Routes>
+                {RouteLink.map(({ path, Component }, index) => (
+                  <Route key={index} path={path} element={<Component />} />
+                ))}
+              </Routes>
+            </DefaultLayout>
+          ) : (
+            <Navigate to="/login" />
+          )} 
+        /> 
+
+        {/* Catch-all route to prevent unauthorized access */}
+        <Route path="*" element={<Navigate to="/login" />} /> 
       </Routes> 
     </Router> 
   );