github.com/quickfeed/quickfeed@v0.0.0-20240507093252-ed8ca812a09c/public/src/components/CourseBanner.tsx (about) 1 import React from "react" 2 import { getCourseID } from "../Helpers" 3 import { useAppState } from "../overmind" 4 import CourseFavoriteButton from "./CourseFavoriteButton" 5 import RoleSwitch from "./teacher/RoleSwitch" 6 7 8 // TODO: Maybe add route specific information, ex. if user is viewing a lab, show that in the banner. Could use state in components to display. 9 // TODO(jostein): This information could possibly be shown in the navbar. 10 const CourseBanner = (): JSX.Element => { 11 const state = useAppState() 12 const enrollment = state.enrollmentsByCourseID[getCourseID().toString()] 13 14 return ( 15 <div className="jumbotron"> 16 <div className="centerblock container"> 17 <h1> 18 {enrollment.course?.name} 19 <CourseFavoriteButton enrollment={enrollment} style={{ "padding": "20px" }} /> 20 </h1> 21 <RoleSwitch enrollment={enrollment} /> 22 </div> 23 </div> 24 ) 25 } 26 27 export default CourseBanner