Allow admins to access the report pages

compendium-frontend/src/App.tsx

-import React, { ReactElement } from "react";
+import React, { ReactElement, useEffect } from "react";
 import { createBrowserRouter, RouterProvider } from "react-router-dom";
 import Landing from "./pages/Landing";
 import ExternalPageNavBar from "./shared/ExternalPageNavBar";
@@ -44,9 +44,25 @@ const router = createBrowserRouter([
 
 
 function App(): ReactElement {
-  if (process.env.NODE_ENV === 'production') {
+  const [isAdmin, setIsAdmin] = React.useState(false);
+
+  useEffect(() => {
+    // we have to do this because the user provider is not available before rendering other parts of the app
+    // so fetch the user and redirect if not admin as a temporary measure, until it's "generally available"
+    fetch('/api/user/').then(data => data.json()).then(user => {
+      setIsAdmin(user.permissions.admin)
+      if (!user.permissions.admin) {
         window.location.replace('/survey')
-    return <></>;
+      } else {
+        console.log('Admin user, not redirecting')
+      }
+    }).catch(() => {
+      window.location.replace('/survey')
+    })
+  }, [])
+
+  if (!isAdmin) {
+    return <></>
   }
   return (
     <div className="app">
@@ -55,7 +71,6 @@ function App(): ReactElement {
         <RouterProvider router={router} />
       </Providers>
       <GeantFooter />
-
     </div>
   );
 }

compendium-frontend/src/shared/UserProvider.tsx

@@ -14,7 +14,7 @@ interface User {
 }
 
 async function fetchUser(): Promise<User> {
-    const response = await fetch('/api/user');
+    const response = await fetch('/api/user/');
     const user = await response.json();
     return user
 }

survey-frontend/src/ShowUser.tsx

@@ -8,7 +8,7 @@ interface User {
 
 async function fetchUser(): Promise<User> {
     try {
-        const response = await fetch('/api/user');
+        const response = await fetch('/api/user/');
         const user = await response.json();
         return user
     } catch (error) {

survey-frontend/src/providers/UserProvider.tsx

@@ -7,7 +7,7 @@ interface Props {
 
 
 async function fetchUser(): Promise<User> {
-    const response = await fetch('/api/user');
+    const response = await fetch('/api/user/');
     const user = await response.json();
     return user
 }