diff --git a/src/frontend/src/components/authAdminGuard/index.tsx b/src/frontend/src/components/authAdminGuard/index.tsx index 3b57de8a2..b20cd5815 100644 --- a/src/frontend/src/components/authAdminGuard/index.tsx +++ b/src/frontend/src/components/authAdminGuard/index.tsx @@ -3,25 +3,21 @@ import { Navigate } from "react-router-dom"; import { AuthContext } from "../../contexts/authContext"; export const ProtectedAdminRoute = ({ children }) => { - const { isAuthenticated, logout, getAuthentication, userData } = + const { isAdmin, isAuthenticated, logout, getAuthentication, userData } = useContext(AuthContext); useEffect(() => { if (!isAuthenticated && !getAuthentication()) { window.location.replace("/login"); logout(); } - - if (userData && userData?.is_superuser === false) { - logout(); - } }, [isAuthenticated, getAuthentication, logout, userData]); if (!isAuthenticated && !getAuthentication()) { return ; } - if (userData && userData?.is_superuser === false) { - return ; + if (userData && !isAdmin) { + return ; } return children; diff --git a/src/frontend/src/components/genericIconComponent/index.tsx b/src/frontend/src/components/genericIconComponent/index.tsx index 86c304beb..5cb6bdeca 100644 --- a/src/frontend/src/components/genericIconComponent/index.tsx +++ b/src/frontend/src/components/genericIconComponent/index.tsx @@ -9,7 +9,7 @@ const ForwardedIconComponent = forwardRef( ); diff --git a/src/frontend/src/components/headerComponent/index.tsx b/src/frontend/src/components/headerComponent/index.tsx index 56e7ff16d..274b4bdc3 100644 --- a/src/frontend/src/components/headerComponent/index.tsx +++ b/src/frontend/src/components/headerComponent/index.tsx @@ -7,11 +7,12 @@ 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 { getLoggedUser, getRepoStars } from "../../controllers/API"; import IconComponent from "../genericIconComponent"; import { Button } from "../ui/button"; import { Separator } from "../ui/separator"; import MenuBar from "./components/menuBar"; +import { Users } from "../../types/api"; export default function Header() { const { flows, tabId } = useContext(TabsContext); @@ -23,6 +24,8 @@ export default function Header() { const [stars, setStars] = useState(null); + const { isAdmin, setIsAdmin } = useContext(AuthContext); + // Get and set numbers of stars on header useEffect(() => { async function fetchStars() { @@ -31,6 +34,7 @@ export default function Header() { } fetchStars(); }, []); + return (
@@ -49,6 +53,16 @@ export default function Header() { Sign out )} + + {isAdmin && ( + + )} + {flows.findIndex((f) => tabId === f.id) !== -1 && tabId !== "" && ( @@ -132,6 +146,12 @@ export default function Header() { />
+
diff --git a/src/frontend/src/components/inputComponent/index.tsx b/src/frontend/src/components/inputComponent/index.tsx index 5e3c5543c..48efbc1c1 100644 --- a/src/frontend/src/components/inputComponent/index.tsx +++ b/src/frontend/src/components/inputComponent/index.tsx @@ -74,7 +74,8 @@ export default function InputComponent({ ? "input-component-true-button" : "input-component-false-button" )} - onClick={() => { + onClick={(event) => { + event.preventDefault(); setPwdVisible(!pwdVisible); }} > diff --git a/src/frontend/src/contexts/authContext.tsx b/src/frontend/src/contexts/authContext.tsx index b1f5d31f7..b66606ada 100644 --- a/src/frontend/src/contexts/authContext.tsx +++ b/src/frontend/src/contexts/authContext.tsx @@ -2,8 +2,11 @@ import { createContext, useEffect, useState } from "react"; import Cookies from "universal-cookie"; import { Users } from "../types/api"; import { AuthContextType } from "../types/contexts/auth"; +import { getLoggedUser } from "../controllers/API"; const initialValue: AuthContextType = { + isAdmin: false, + setIsAdmin: () => false, isAuthenticated: false, accessToken: null, refreshToken: null, @@ -24,6 +27,7 @@ export function AuthProvider({ children }): React.ReactElement { const [accessToken, setAccessToken] = useState(null); const [refreshToken, setRefreshToken] = useState(null); const [isAuthenticated, setIsAuthenticated] = useState(false); + const [isAdmin, setIsAdmin] = useState(false); const [userData, setUserData] = useState(null); const [autoLogin, setAutoLogin] = useState(false); const cookies = new Cookies(); @@ -34,6 +38,15 @@ export function AuthProvider({ children }): React.ReactElement { setAccessToken(storedAccessToken); } }, []); + + useEffect(() => { + if (accessToken) { + getLoggedUser().then((user) => { + const isSuperUser = user.is_superuser + setIsAdmin(isSuperUser); + }); + } + }, [accessToken, isAdmin]) function getAuthentication() { const storedRefreshToken = cookies.get("refresh_token"); @@ -72,6 +85,7 @@ export function AuthProvider({ children }): React.ReactElement { if (response.ok) { const data = await response.json(); login(data.accessToken, refreshToken); + getLoggedUser().then((user) => { console.log('oi')}); } else { logout(); } @@ -84,6 +98,8 @@ export function AuthProvider({ children }): React.ReactElement { // !! to convert string to boolean void; isAuthenticated: boolean; accessToken: string | null; refreshToken: string | null;