From ada752309a1e16c43ea260e33f6ebe085abeb23c Mon Sep 17 00:00:00 2001
From: Cristhian Zanforlin Lousa <cristhian.lousa@gmail.com>
Date: Tue, 22 Aug 2023 21:49:37 -0300
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20fix(App.tsx):=20add=20setIsAdmin?=
 =?UTF-8?q?=20function=20to=20AuthContext=20to=20update=20isAdmin=20state?=
 =?UTF-8?q?=20when=20user=20data=20is=20fetched=20=E2=9C=A8=20feat(App.tsx?=
 =?UTF-8?q?):=20set=20isAdmin=20state=20based=20on=20user's=20is=5Fsuperus?=
 =?UTF-8?q?er=20value=20to=20conditionally=20render=20admin-related=20comp?=
 =?UTF-8?q?onents=20=F0=9F=90=9B=20fix(headerComponent/index.tsx):=20fix?=
 =?UTF-8?q?=20conditional=20rendering=20of=20Sign=20out,=20Home,=20and=20A?=
 =?UTF-8?q?dmin=20page=20buttons=20based=20on=20autoLogin=20and=20isAdmin?=
 =?UTF-8?q?=20values=20=F0=9F=90=9B=20fix(authContext.tsx):=20remove=20unn?=
 =?UTF-8?q?ecessary=20useEffect=20to=20update=20isAdmin=20state=20when=20a?=
 =?UTF-8?q?ccessToken=20or=20isAdmin=20changes=20=F0=9F=94=A5=20chore(api.?=
 =?UTF-8?q?tsx):=20remove=20unused=20sleep=20function=20=E2=9C=A8=20feat(A?=
 =?UTF-8?q?dminPage/index.tsx):=20update=20text=20in=20AdminPage=20to=20pr?=
 =?UTF-8?q?ovide=20a=20better=20description=20of=20the=20page's=20purpose?=
 =?UTF-8?q?=20=F0=9F=90=9B=20fix(routes.tsx):=20wrap=20AdminPage=20and=20A?=
 =?UTF-8?q?piKeysPage=20components=20with=20ProtectedAdminRoute=20componen?=
 =?UTF-8?q?t=20to=20restrict=20access=20to=20admin-only=20routes?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/frontend/src/App.tsx                      |  4 +-
 .../src/components/headerComponent/index.tsx  | 60 ++++++++++---------
 src/frontend/src/contexts/authContext.tsx     |  8 ---
 src/frontend/src/controllers/API/api.tsx      |  4 --
 src/frontend/src/pages/AdminPage/index.tsx    |  2 +-
 src/frontend/src/routes.tsx                   |  8 +--
 6 files changed, 40 insertions(+), 46 deletions(-)

diff --git a/src/frontend/src/App.tsx b/src/frontend/src/App.tsx
index 057a16fff..e9c58934f 100644
--- a/src/frontend/src/App.tsx
+++ b/src/frontend/src/App.tsx
@@ -134,7 +134,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(() => {
@@ -154,6 +154,8 @@ export default function App() {
             .then((user) => {
               setUserData(user);
               setLoading(false);
+              const isSuperUser = user.is_superuser;
+              setIsAdmin(isSuperUser);
             })
             .catch((error) => {});
         }
diff --git a/src/frontend/src/components/headerComponent/index.tsx b/src/frontend/src/components/headerComponent/index.tsx
index 11c1507a3..25e4dc34f 100644
--- a/src/frontend/src/components/headerComponent/index.tsx
+++ b/src/frontend/src/components/headerComponent/index.tsx
@@ -26,34 +26,37 @@ export default function Header(): JSX.Element {
         <Link to="/">
           <span className="ml-4 text-2xl">⛓️</span>
         </Link>
-        {location.pathname === "/admin" && (
-          <Button
-            onClick={() => {
-              navigate("/");
-            }}
-            variant="outline"
-            className=""
-          >
-            Main page
-          </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>
         )}
 
         {flows.findIndex((f) => tabId === f.id) !== -1 && tabId !== "" && (
@@ -138,17 +141,18 @@ export default function Header(): JSX.Element {
               />
             </div>
           </AlertDropdown>
-
-          <button
-            onClick={() => {
-              navigate("/account/api-keys");
-            }}
-          >
-            <IconComponent
-              name="Key"
-              className="side-bar-button-size text-muted-foreground hover:text-accent-foreground"
-            />
-          </button>
+          {!autoLogin && (
+            <button
+              onClick={() => {
+                navigate("/account/api-keys");
+              }}
+            >
+              <IconComponent
+                name="Key"
+                className="side-bar-button-size text-muted-foreground hover:text-accent-foreground"
+              />
+            </button>
+          )}
         </div>
       </div>
     </div>
diff --git a/src/frontend/src/contexts/authContext.tsx b/src/frontend/src/contexts/authContext.tsx
index 1fcfef58e..4fdca3ad0 100644
--- a/src/frontend/src/contexts/authContext.tsx
+++ b/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");
diff --git a/src/frontend/src/controllers/API/api.tsx b/src/frontend/src/controllers/API/api.tsx
index 2d05228cc..fc4358ed0 100644
--- a/src/frontend/src/controllers/API/api.tsx
+++ b/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 };
diff --git a/src/frontend/src/pages/AdminPage/index.tsx b/src/frontend/src/pages/AdminPage/index.tsx
index 64b766416..83f79a25e 100644
--- a/src/frontend/src/pages/AdminPage/index.tsx
+++ b/src/frontend/src/pages/AdminPage/index.tsx
@@ -196,7 +196,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>
diff --git a/src/frontend/src/routes.tsx b/src/frontend/src/routes.tsx
index 04e2f80f4..9b1d35b55 100644
--- a/src/frontend/src/routes.tsx
+++ b/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>