feat: Implement authentication flow with token verification and protected routes

FrontendV2/src/App.tsx

@@ -3,6 +3,10 @@ import { LoginPage } from "@/pages/LoginPage";
 import { BrowserRouter, Route, Routes } from "react-router-dom";
 import { HomePage } from "@/pages/HomePage";
 import { ProtectedRoutes } from "./utils/ProtectedRoutes";
+import { useEffect } from "react";
+import Cookies from "js-cookie";
+import { useAtom } from "jotai";
+import { setIsLoggedInAtom } from "@/states/Atoms";
 
 const API_BASE =
   (import.meta as any).env?.VITE_BACKEND_URL ||
@@ -10,9 +14,30 @@ const API_BASE =
   "http://localhost:8002";
 
 function App() {
+  const [, setIsLoggedIn] = useAtom(setIsLoggedInAtom);
+  useEffect(() => {
+    if (Cookies.get("token")) {
+      const verifyToken = async () => {
+        const response = await fetch(`${API_BASE}/api/verifyToken`, {
+          method: "GET",
+          headers: {
+            Authorization: `Bearer ${Cookies.get("token")}`,
+          },
+        });
+        if (response.ok) {
+          setIsLoggedIn(true);
+        } else {
+          Cookies.remove("token");
+          setIsLoggedIn(false);
+          window.location.reload();
+        }
+      };
+      verifyToken();
+    }
+  }, []);
+
   return (
     <>
-      <div>Layout Component</div>
       <BrowserRouter>
         <Routes>
           <Route element={<ProtectedRoutes />}>