From 23846411d2c322cb139510b118dfd0fe4ad3a878 Mon Sep 17 00:00:00 2001
From: "jari.tenhunen" <jari.tenhunen@outlook.com>
Date: Tue, 19 Aug 2025 10:34:10 +0200
Subject: [PATCH] global state for username and logged added

---
 src/components/Login.jsx      | 4 ++++
 src/components/NavbarComp.jsx | 9 ++++++---
 src/components/Register.jsx   | 4 ++++
 src/components/context.jsx    | 8 +++++++-
 4 files changed, 21 insertions(+), 4 deletions(-)

diff --git a/src/components/Login.jsx b/src/components/Login.jsx
index 1e2153b..7be47cc 100644
--- a/src/components/Login.jsx
+++ b/src/components/Login.jsx
@@ -10,6 +10,8 @@ const Login = () => {
   const [cookies, setCookie] = useCookies(["jwtToken"]);
   const { dark, setDark } = useGlobalContext();
   const navigate = useNavigate();
+  const {logged, setLogged} = useGlobalContext();
+  const {userName, setUserName} = useGlobalContext();
 
   function login(event) {
     event.preventDefault();
@@ -28,6 +30,8 @@ const Login = () => {
         )
         .then((response) => {
           setCookie("jwtToken", response.data.jwtToken, { path: "/" });
+          setLogged(true);
+          setUserName(userData.username);
           navigate("/");
         });
     } catch (error) {
diff --git a/src/components/NavbarComp.jsx b/src/components/NavbarComp.jsx
index 01f6354..1be6e2b 100644
--- a/src/components/NavbarComp.jsx
+++ b/src/components/NavbarComp.jsx
@@ -10,6 +10,8 @@ const NavbarComp = () => {
   const { dark, setDark } = useGlobalContext();
   const [cookies, setCookie] = useCookies(["jwtToken"]);
   const navigate = useNavigate();
+  const {logged, setLogged} = useGlobalContext();
+  const {userName, setUserName} = useGlobalContext();
 
   function toggleColorMode() {
     if (dark === "dark") {
@@ -23,6 +25,7 @@ const NavbarComp = () => {
 
   function logout(){
     setCookie("jwtToken", "", { path: "/" });
+    setLogged(false);
     navigate("/");
   }
 
@@ -41,20 +44,20 @@ const NavbarComp = () => {
             <Nav.Link style={{ marginRight: "40px" }} as={Link} to="/gamepage">
               GamePage
             </Nav.Link>
-            {cookies.jwtToken == "" || cookies.jwtToken == null ? (
+            {!logged ? (
               <Nav.Link as={Link} to="/register">
                 Register
               </Nav.Link>
             ) : (
               ""
             )}
-            {cookies.jwtToken == "" || cookies.jwtToken == null ? (
+            {!logged ? (
               <Nav.Link as={Link} to="/login">
                 Login
               </Nav.Link>
             ) : (
               <Nav.Link onClick={() => logout()}>
-                Logout
+                {userName} Logout
               </Nav.Link>
             )}
           </Nav>
diff --git a/src/components/Register.jsx b/src/components/Register.jsx
index 3c9d526..4c997c8 100644
--- a/src/components/Register.jsx
+++ b/src/components/Register.jsx
@@ -10,6 +10,8 @@ const Register = () => {
   const [cookies, setCookie] = useCookies(["jwtToken"]);
   const { dark, setDark } = useGlobalContext();
   const navigate = useNavigate();
+  const {logged, setLogged} = useGlobalContext();
+  const {userName, setUserName} = useGlobalContext();
 
 
   function register(event) {
@@ -38,6 +40,8 @@ const Register = () => {
             )
             .then((response) => {
               setCookie("jwtToken", response.data.jwtToken, { path: "/" });
+              setLogged(true);
+              setUserName(userData.username);
               navigate("/");
             });
         })
diff --git a/src/components/context.jsx b/src/components/context.jsx
index dba391e..da77b57 100644
--- a/src/components/context.jsx
+++ b/src/components/context.jsx
@@ -7,6 +7,8 @@ export const GlobalProvider = ({ children }) => {
     "linear-gradient(to bottom, #121212, #333 60%, #eee 85%)"
   );
   const [dark, setDark] = useState("dark")
+  const [logged, setLogged] = useState(false)
+  const [userName, setUserName] = useState("")
 
   return (
     <GlobalContext.Provider
@@ -14,7 +16,11 @@ export const GlobalProvider = ({ children }) => {
         bgColor,
         setBgColor,
         dark,
-        setDark
+        setDark,
+        logged,
+        setLogged,
+        userName,
+        setUserName
       }}
     >
       {children}