Function ProgramButton

src/Components/ProgramPage/SideBar/SideBar.jsx:157–186

({program, selectProgram, setSelectProgram})

}

export function ProgramButton({program, selectProgram, setSelectProgram}) {
    const theme = useTheme();
    const darkMode = theme.palette.mode === 'dark';
    const metadata = React.useContext(MetadataContext);
    return (
        <ListItemButton
            className='ProgramItem'
            selected={program.ProgramID === selectProgram}
            component={Link}
            onClick={() => setSelectProgram(program.ProgramID)}
            to={`${programsProgramPath(program.ProgramID)}${window.location.search}`}
            sx={{
                pl: "3rem",
                "&::before": {
                    background: darkMode ? grey[700] : grey[300],
                },
                "&.Mui-selected": {
                    "&::before": {
                        background: (theme) => theme.palette.primary.main,
                    }
                }
            }}
            key={program.ProgramID}
        >
            <ListItemText primary={program.Program}
                          secondary={program.TargetApplicantMajor.join('/')}/>
            <StarButton programID={program.ProgramID} metadata={metadata}/>
        </ListItemButton>
    )
}

export function getQuery(loaderData) {
    return {