diff --git a/FrontendV2/src/App.tsx b/FrontendV2/src/App.tsx index f4f5a62..af62ddd 100644 --- a/FrontendV2/src/App.tsx +++ b/FrontendV2/src/App.tsx @@ -3,10 +3,11 @@ 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 { useEffect, useState } from "react"; import Cookies from "js-cookie"; import { useAtom } from "jotai"; import { setIsLoggedInAtom } from "@/states/Atoms"; +import { UserContext, type User } from "./states/Context"; const API_BASE = (import.meta as any).env?.VITE_BACKEND_URL || @@ -14,6 +15,8 @@ const API_BASE = "http://localhost:8002"; function App() { + const [user, setUser] = useState(undefined); + const [, setIsLoggedIn] = useAtom(setIsLoggedInAtom); useEffect(() => { if (Cookies.get("token")) { @@ -25,6 +28,8 @@ function App() { }, }); if (response.ok) { + const data = await response.json(); + setUser({ username: data.user.username, role: data.user.role }); setIsLoggedIn(true); } else { Cookies.remove("token"); @@ -38,15 +43,17 @@ function App() { return ( <> - - - }> - } /> - + + + + }> + } /> + - } /> - - + } /> + + + ); } diff --git a/FrontendV2/src/pages/HomePage.tsx b/FrontendV2/src/pages/HomePage.tsx index b0bbf98..ed0454b 100644 --- a/FrontendV2/src/pages/HomePage.tsx +++ b/FrontendV2/src/pages/HomePage.tsx @@ -1,13 +1,18 @@ -import { setIsLoggedInAtom } from "@/states/Atoms"; -import { useAtom } from "jotai"; +import { useUserContext } from "@/states/Context"; + +export interface User { + username: string; + role: number; +} export const HomePage = () => { - const [isLoggedIn] = useAtom(setIsLoggedInAtom); - console.log(isLoggedIn); + const userData = useUserContext(); return (

Home Page

+

Welcome, {userData.username}!

+

Your role is: {userData.role}

); }; diff --git a/FrontendV2/src/pages/LoginPage.tsx b/FrontendV2/src/pages/LoginPage.tsx index e70306a..fc4a866 100644 --- a/FrontendV2/src/pages/LoginPage.tsx +++ b/FrontendV2/src/pages/LoginPage.tsx @@ -14,7 +14,6 @@ const API_BASE = export const LoginPage = () => { const [isLoggedIn, setIsLoggedIn] = useAtom(setIsLoggedInAtom); const navigate = useNavigate(); - console.log(isLoggedIn); useEffect(() => { if (isLoggedIn) { diff --git a/FrontendV2/src/states/Context.ts b/FrontendV2/src/states/Context.ts new file mode 100644 index 0000000..4e00baa --- /dev/null +++ b/FrontendV2/src/states/Context.ts @@ -0,0 +1,19 @@ +import { createContext } from "react"; +import { useContext } from "react"; + +export interface User { + username: string; + role: number; +} + +export const UserContext = createContext(undefined); + +export function useUserContext() { + const user = useContext(UserContext); + + if (user === undefined) { + throw new Error("useUserContext must be used with a UserContext") + } + + return user; +} \ No newline at end of file diff --git a/backend/routes/api.js b/backend/routes/api.js index 4126aa7..8a97c0a 100644 --- a/backend/routes/api.js +++ b/backend/routes/api.js @@ -432,7 +432,7 @@ router.delete("/deleteUser/:id", authenticate, async (req, res) => { }); router.get("/verifyToken", authenticate, async (req, res) => { - res.status(200).json({ message: "Token is valid" }); + res.status(200).json({ message: "Token is valid", user: req.user }); }); router.post("/editUser/:id", authenticate, async (req, res) => {