merge fix

src/frontend/src/App.tsx

@@ -141,7 +141,7 @@ export default function App() {
   };
 
   //this function is to get the user logged in when the page is refreshed
-  const { setUserData, getAuthentication, login, setAutoLogin, logout } =
+  const { setUserData, getAuthentication, login, setAutoLogin, logout, setIsAdmin } =
     useContext(AuthContext);
 
   useEffect(() => {
@@ -161,6 +161,8 @@ export default function App() {
             .then((user) => {
               setUserData(user);
               setLoading(false);
+              const isSuperUser = user.is_superuser;
+              setIsAdmin(isSuperUser);
             })
             .catch((error) => {});
         }

src/frontend/src/components/headerComponent/index.tsx

@@ -1,4 +1,4 @@
-import { useContext, useEffect, useState } from "react";
+import { useContext } from "react";
 import { FaDiscord, FaGithub, FaTwitter } from "react-icons/fa";
 import { Link, useLocation, useNavigate } from "react-router-dom";
 import AlertDropdown from "../../alerts/alertDropDown";
@@ -7,7 +7,6 @@ import { alertContext } from "../../contexts/alertContext";
 import { AuthContext } from "../../contexts/authContext";
 import { darkContext } from "../../contexts/darkContext";
 import { TabsContext } from "../../contexts/tabsContext";
-import { getRepoStars } from "../../controllers/API";
 import IconComponent from "../genericIconComponent";
 import { Button } from "../ui/button";
 import { Separator } from "../ui/separator";
@@ -43,22 +42,35 @@ export default function Header(): JSX.Element {
           </Button>
         )}
         {autoLogin === false && (
-          <Button
+          <a
             onClick={() => {
               logout();
               navigate("/login");
             }}
-            variant="outline"
-            className=""
+            className="text-sm font-medium text-muted-foreground transition-colors hover:text-primary cursor-pointer mx-5"
           >
             Sign out
-          </Button>
+          </a>
+        )}
+
+        {location.pathname === "/admin" && (
+          <a
+            onClick={() => {
+              navigate("/");
+            }}
+            className="text-sm font-medium text-muted-foreground transition-colors hover:text-primary cursor-pointer"
+          >
+            Home
+          </a>
         )}
 
         {isAdmin && !autoLogin && location.pathname !== "/admin" && (
-          <Button variant="outline" onClick={() => navigate("/admin")}>
+          <a
+            className="text-sm font-medium text-muted-foreground transition-colors hover:text-primary cursor-pointer"
+            onClick={() => navigate("/admin")}
+          >
             Admin page
-          </Button>
+          </a>
         )}
       </div>
       <div className="round-button-div">

src/frontend/src/contexts/authContext.tsx

@@ -47,14 +47,6 @@ export function AuthProvider({ children }): React.ReactElement {
     fetchStars();
   }, []);
 
-  useEffect(() => {
-    if (accessToken) {
-      getLoggedUser().then((user) => {
-        const isSuperUser = user.is_superuser;
-        setIsAdmin(isSuperUser);
-      });
-    }
-  }, [accessToken, isAdmin]);
 
   function getAuthentication() {
     const storedRefreshToken = cookies.get("refresh_token");

src/frontend/src/controllers/API/api.tsx

@@ -103,9 +103,5 @@ function ApiInterceptor() {
   return null;
 }
 
-// Function to sleep for a given duration in milliseconds
-function sleep(ms: number) {
-  return new Promise((resolve) => setTimeout(resolve, ms));
-}
 
 export { ApiInterceptor, api };

src/frontend/src/pages/AdminPage/index.tsx

@@ -194,7 +194,7 @@ export default function AdminPage() {
                       Welcome back!
                     </h2>
                     <p className="text-muted-foreground">
-                      Here&apos;s a list of all users!
+                    Navigate through this section to efficiently oversee all application users. From here, you can seamlessly manage user accounts.
                     </p>
                   </div>
                   <div className="flex items-center space-x-2"></div>

src/frontend/src/routes.tsx

@@ -88,9 +88,9 @@ const Router = () => {
       <Route
         path="/admin"
         element={
-
+          <ProtectedAdminRoute>
             <AdminPage />
-
+          </ProtectedAdminRoute>
         }
       />
 
@@ -106,9 +106,9 @@ const Router = () => {
         <Route
           path="api-keys"
           element={
-            <ProtectedRoute>
+            <ProtectedAdminRoute>
               <ApiKeysPage />
-            </ProtectedRoute>
+            </ProtectedAdminRoute>
           }
         ></Route>
       </Route>