github.com/quickfeed/quickfeed@v0.0.0-20240507093252-ed8ca812a09c/public/src/pages/AdminPage.tsx (about) 1 import React from "react" 2 import { Redirect, Route, Switch, useHistory } from "react-router" 3 import { useAppState } from "../overmind" 4 import EditCourse from "../components/admin/EditCourse" 5 import Users from "../components/admin/Users" 6 import Card from "../components/Card" 7 import CourseForm from "../components/forms/CourseForm" 8 import RedirectButton from "../components/RedirectButton" 9 import Alerts from "../components/alerts/Alerts" 10 11 12 // AdminPage is the page containing the admin-only components. 13 const AdminPage = (): JSX.Element => { 14 const state = useAppState() 15 const history = useHistory() 16 17 // Objects containing props for the cards in the admin page. 18 // TODO: Perhaps make a Card prop type. 19 const manageUsers = { title: "Manage Users", text: "View and manage all users.", buttonText: "Manage Users", to: "/admin/manage" } 20 const createCourse = { title: "Create Course", text: "Create a new course.", buttonText: "Create Course", to: "/admin/create" } 21 const editCourse = { title: "Edit Course", text: "Edit an existing course.", buttonText: "Edit Course", to: "/admin/edit" } 22 23 // If the user is not an admin, redirect to the home page. 24 if (!state.self.IsAdmin) { 25 return <Redirect to="/" /> 26 } 27 28 const root = "/admin" 29 return ( 30 <div className="box"> 31 <RedirectButton to={root} /> 32 <Alerts /> 33 <div className="row" hidden={history.location.pathname !== root}> 34 <Card {...manageUsers} /> 35 <Card {...createCourse} /> 36 <Card {...editCourse} /> 37 </div> 38 39 <Switch> 40 <Route path="/admin/manage"> 41 <Users /> 42 </Route> 43 <Route path="/admin/create"> 44 <CourseForm /> 45 </Route> 46 <Route path="/admin/edit"> 47 <EditCourse /> 48 </Route> 49 </Switch> 50 </div> 51 ) 52 } 53 54 export default AdminPage