Add useEffect hook to handle authority navigation and log response in YourProjectsPage

frontend/src/Pages/App.tsx

@@ -1,4 +1,4 @@
-import { useState } from "react";
+import { useState, useEffect } from "react";
 
 import LoginPage from "./LoginPage";
 import { useNavigate } from "react-router-dom";
@@ -6,13 +6,16 @@ import { useNavigate } from "react-router-dom";
 function App(): JSX.Element {
   const navigate = useNavigate();
   const [authority, setAuthority] = useState(0);
-  if (authority === 1) {
-    navigate("/admin");
-  } else if (authority === 2) {
-    navigate("/pm");
-  } else if (authority === 3) {
-    navigate("/user");
-  }
+
+  useEffect(() => {
+    if (authority === 1) {
+      navigate("/admin");
+    } else if (authority === 2) {
+      navigate("/pm");
+    } else if (authority === 3) {
+      navigate("/user");
+    }
+  }, [authority, navigate]);
 
   return <LoginPage setAuthority={setAuthority} />;
 }

frontend/src/Pages/YourProjectsPage.tsx

@@ -11,6 +11,7 @@ function UserProjectPage(): JSX.Element {
     const username = localStorage.getItem("username") ?? ""; // replace with actual username
     const token = localStorage.getItem("accessToken") ?? ""; // replace with actual token
     const response = await api.getUserProjects(username, token);
+    console.log(response);
     if (response.success) {
       setProjects(response.data ?? []);
     } else {