diff --git a/frontend/src/components/common/NavBarAdmin.tsx b/frontend/src/components/common/NavBarAdmin.tsx index 65a5015..2c16e88 100644 --- a/frontend/src/components/common/NavBarAdmin.tsx +++ b/frontend/src/components/common/NavBarAdmin.tsx @@ -10,7 +10,17 @@ import { Image, Spacer, Avatar, + Button, Icon, + Popover, + PopoverTrigger, + PopoverContent, + PopoverHeader, + PopoverBody, + PopoverFooter, + PopoverArrow, + PopoverCloseButton, + PopoverAnchor } from '@chakra-ui/react'; import { Link as ReactRouterLink, useLocation } from 'react-router-dom'; import { BsPerson } from 'react-icons/bs'; @@ -19,7 +29,13 @@ import { PiBell } from "react-icons/pi"; import { GoHome } from "react-icons/go"; import abtc_logo from '../../images/abtc_logo.png'; -const NavBarAdmin: React.FC = () => { +interface NavBarAdminProps { + firstName: string; + lastName: string; + role: string; +} + +const NavBarAdmin: React.FC = ({firstName, lastName, role}) => { const location = useLocation(); return ( @@ -96,50 +112,21 @@ const NavBarAdmin: React.FC = () => { color="#444750" fontWeight="500" _hover={{ color: "black", textDecoration: "none" }} + paddingRight={4} > - - - - - + - - - - - Name-First-Last - - - - - - - Placeholder - - - Placeholder 2 - - - + + + + + + {firstName} {lastName} + Role: {role} + + ); diff --git a/frontend/src/components/pages/PlatformSignupRequests.tsx b/frontend/src/components/pages/PlatformSignupRequests.tsx index 474f4b7..881b785 100644 --- a/frontend/src/components/pages/PlatformSignupRequests.tsx +++ b/frontend/src/components/pages/PlatformSignupRequests.tsx @@ -15,11 +15,12 @@ import { Icon, } from '@chakra-ui/react'; import { FaCheck, FaXmark, FaSistrix, FaArrowsRotate, FaBars, FaAngleRight, FaAngleLeft } from "react-icons/fa6"; +import AUTHENTICATED_USER_KEY from "../../constants/AuthConstants"; import NavBarAdmin from "../common/NavBarAdmin"; import ServiceRequestAPIClient from "../../APIClients/ServiceRequestAPIClient"; -interface UserInfo { +interface PlatformSignupRequestsUser { id: string; email: string; firstName: string; @@ -29,13 +30,27 @@ interface UserInfo { } const PlatformSignupRequests = (): React.ReactElement => { - const [userInfo, setUserInfo] = useState([]); + const [platformSignupRequestUsers, setPlatformSignupRequestUsers] = useState([]); + const [userInfo, setUserInfo] = useState({ + firstName: "", + lastName: "", + role: "", + }); useEffect(() => { + const userData = localStorage.getItem(AUTHENTICATED_USER_KEY); + + if (userData) { + const parsedUserData = JSON.parse(userData); + console.log(parsedUserData); // Remove this later + + setUserInfo(parsedUserData); + } + const fetchData = async () => { try { const response = await ServiceRequestAPIClient.getPlatformSignups(); - setUserInfo(response); + setPlatformSignupRequestUsers(response); } catch (error) { console.error("Error fetching platform signups:", error); } @@ -49,13 +64,13 @@ const PlatformSignupRequests = (): React.ReactElement => { const itemsPerPage = 999; useEffect(() => { - setCheckedItems(new Array(userInfo.length).fill(false)); - }, [userInfo]); + setCheckedItems(new Array(platformSignupRequestUsers.length).fill(false)); + }, [platformSignupRequestUsers]); const handleSelectAllChange = () => { const newSelectAll = !selectAll; setSelectAll(newSelectAll); - setCheckedItems(new Array(userInfo.length).fill(newSelectAll)); + setCheckedItems(new Array(platformSignupRequestUsers.length).fill(newSelectAll)); }; const handleCheckboxChange = (index: number) => { @@ -99,14 +114,14 @@ const PlatformSignupRequests = (): React.ReactElement => { setCurrentPage(page); }; - const totalPages = Math.ceil(userInfo.length / itemsPerPage); - const currentItems = userInfo.slice((currentPage - 1) * itemsPerPage, currentPage * itemsPerPage); + const totalPages = Math.ceil(platformSignupRequestUsers.length / itemsPerPage); + const currentItems = platformSignupRequestUsers.slice((currentPage - 1) * itemsPerPage, currentPage * itemsPerPage); const itemCountStart = (currentPage - 1) * itemsPerPage + 1; - const itemCountEnd = Math.min(currentPage * itemsPerPage, userInfo.length); + const itemCountEnd = Math.min(currentPage * itemsPerPage, platformSignupRequestUsers.length); return ( - + Manage Accounts @@ -157,7 +172,7 @@ const PlatformSignupRequests = (): React.ReactElement => { - {itemCountStart}-{itemCountEnd} of {userInfo.length} + {itemCountStart}-{itemCountEnd} of {platformSignupRequestUsers.length}