diff --git a/src/App.tsx b/src/App.tsx index 37e82093d9712781ef1407b68ea0066e3bc90130..2522f562ae100b1cf5b9e2f6f918049d74521a97 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -17,6 +17,7 @@ import { useEffect, useState } from "react" import { OrganizationDashboard } from "./components/Dashboard/OrganizationDashboard" import { UniversityDashboard } from "./components/Dashboard/UniversityDashboard" import { handleGetInfo } from "./utils/auth" +import UniversityHome from "./components/Home/UniversityHome" const ROLES = { Organization: "organization", @@ -73,7 +74,11 @@ function App() { path="/" element={ <Sidebar> - <Home /> + {userInfo.role === "organization" ? ( + <Home /> + ) : ( + <UniversityHome /> + )} </Sidebar> } /> diff --git a/src/components/Dashboard/UniversityDashboard.tsx b/src/components/Dashboard/UniversityDashboard.tsx index ed848b124360a990b72bcb9f87d54c36db6273d7..177225de00cf045cf5dd7183970a5a57993db3f2 100644 --- a/src/components/Dashboard/UniversityDashboard.tsx +++ b/src/components/Dashboard/UniversityDashboard.tsx @@ -1,4 +1,4 @@ -import { EmailIcon } from "@chakra-ui/icons" +import { InfoIcon } from "@chakra-ui/icons" import { Heading, Grid, @@ -59,11 +59,11 @@ export const UniversityDashboard = () => { <GridItem w={["80%", "50%"]}> <Card> <CardHeader> - <EmailIcon w="8" h="8" /> + <InfoIcon w="8" h="8" /> <Heading size={"lg"}>{studentCount}</Heading> Students </CardHeader> <CardBody> - <Link to={`/scholarships`}> + <Link to={`/report`}> <Button colorScheme="blue" size={["sm", "lg"]}> View Here </Button> diff --git a/src/components/Home/UniversityHome.tsx b/src/components/Home/UniversityHome.tsx new file mode 100644 index 0000000000000000000000000000000000000000..42037f3cb11e4db9f58af634e6b6fffc6b741723 --- /dev/null +++ b/src/components/Home/UniversityHome.tsx @@ -0,0 +1,62 @@ +import { Flex, Box, SimpleGrid, Heading, Text, useColorModeValue, useColorMode } from "@chakra-ui/react" +import { ArrowForwardIcon } from "@chakra-ui/icons" +import { Link } from "react-router-dom" + +const UniversityHome = () => { + const { colorMode, toggleColorMode } = useColorMode() + const boxColor = useColorModeValue("green.200", "green.800") + + return ( + <Flex direction="column" alignItems="center" justifyContent="center"> + <Heading as="h1" size="2xl"> + Home + </Heading> + + <Text + as="h5" + fontSize="lg" + fontWeight="normal" + fontStyle="italic" + textAlign="center" + mt={4} + > + What do you want to do? + </Text> + + <SimpleGrid columns={2} spacing={10} mt={8}> + <Box + bg={boxColor} + height="80px" + borderRadius="md" + p={4} + display="flex" + alignItems="center" + justifyContent="center" + > + <Link + to = {`/report`} + > + <ArrowForwardIcon w={6} h={6} mr={2} /> View Students + </Link> + </Box> + <Box + bg={boxColor} + height="80px" + borderRadius="md" + p={4} + display="flex" + alignItems="center" + justifyContent="center" + > + <Link + to = {`/dashboard`} + > + <ArrowForwardIcon w={6} h={6} mr={2} /> View Dashboard + </Link> + </Box> + </SimpleGrid> + </Flex> + ) +} + +export default UniversityHome