Skip to content

Commit

Permalink
feat: rename app (#16)
Browse files Browse the repository at this point in the history
  • Loading branch information
@Connor-Bernard
Connor-Bernard authored Nov 2, 2024
1 parent b71f842 commit 7e51b42
Show file tree
Hide file tree
Showing 2 changed files with 166 additions and 115 deletions.
46 changes: 23 additions & 23 deletions website/public/manifest.json
View file
Original file line number Diff line number Diff line change
@@ -1,25 +1,25 @@
{
"short_name": "Grade Viewer",
"name": "Grade Viewer",
"icons": [
{
"src": "favicon.ico",
"sizes": "64x64 32x32 24x24 16x16",
"type": "image/x-icon"
},
{
"src": "logo192.png",
"type": "image/png",
"sizes": "192x192"
},
{
"src": "logo512.png",
"type": "image/png",
"sizes": "512x512"
}
],
"start_url": ".",
"display": "standalone",
"theme_color": "#00284e",
"background_color": "#ffffff"
"short_name": "GradeView",
"name": "GradeView",
"icons": [
{
"src": "favicon.ico",
"sizes": "64x64 32x32 24x24 16x16",
"type": "image/x-icon"
},
{
"src": "logo192.png",
"type": "image/png",
"sizes": "192x192"
},
{
"src": "logo512.png",
"type": "image/png",
"sizes": "512x512"
}
],
"start_url": ".",
"display": "standalone",
"theme_color": "#00284e",
"background_color": "#ffffff"
}
235 changes: 143 additions & 92 deletions website/src/components/NavBar.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ import {
FormControl,
InputLabel,
Select,
} from '@mui/material'
} from '@mui/material';
import {
LoginOutlined,
StorageOutlined,
Expand All @@ -27,12 +27,16 @@ import MenuIcon from '@mui/icons-material/Menu';
import apiv2 from '../utils/apiv2';
import NavBarItem from './NavBarItem';
import NavMenuItem from './NavMenuItem';
import { StudentSelectionContext } from "./StudentSelectionWrapper";
import { StudentSelectionContext } from './StudentSelectionWrapper';

export default function ButtonAppBar() {
const mobileView = useMediaQuery('(max-width:600px)');
const [loggedIn, setLoginStatus] = useState(!!localStorage.getItem('token'));
const { selectedStudent, setSelectedStudent } = useContext(StudentSelectionContext);
const [loggedIn, setLoginStatus] = useState(
!!localStorage.getItem('token'),
);
const { selectedStudent, setSelectedStudent } = useContext(
StudentSelectionContext,
);
const [isAdmin, setAdminStatus] = useState(false);
const [profilePicture, updateProfilePicture] = useState('');
const tabList = [
Expand Down Expand Up @@ -61,15 +65,17 @@ export default function ButtonAppBar() {
updateTabs(() => tabList);
updateProfilePicture(localStorage.getItem('profilepicture'));
}
return () => mounted = false;
return () => (mounted = false);
}, [loggedIn]);

function renderMenuItems() {
return tabs.map((tab) => (
<NavMenuItem
icon={tab.icon}
text={tab.name}
onClick={() => { window.location.href = tab.href }}
onClick={() => {
window.location.href = tab.href;
}}
/>
));
}
Expand Down Expand Up @@ -104,7 +110,7 @@ export default function ButtonAppBar() {
}
});
}
return () => mounted = false;
return () => (mounted = false);
}, [isAdmin]);

useEffect(() => {
Expand All @@ -115,7 +121,7 @@ export default function ButtonAppBar() {
if (mounted) {
setAdminStatus(res.data.isAdmin);
}
return () => mounted = false;
return () => (mounted = false);
});
}
}, [loggedIn]);
Expand All @@ -125,97 +131,142 @@ export default function ButtonAppBar() {
<AppBar position='static'>
<Toolbar>
<Box sx={{ flexGrow: 1, gap: '20px' }} display='flex'>
<Typography variant='h6' component='div' display='inline-block'>
<a href='/' style={{ textDecoration: 'none', color: 'inherit' }}>Grade Viewer</a>
<Typography
variant='h6'
component='div'
display='inline-block'
>
<a
href='/'
style={{
textDecoration: 'none',
color: 'inherit',
}}
>
GradeView
</a>
</Typography>
{!mobileView &&
{!mobileView && (
<>
{loggedIn &&
{loggedIn && (
<NavBarItem href='/'>My Grades</NavBarItem>
}
)}
<NavBarItem href='/buckets'>Buckets</NavBarItem>
<NavBarItem href='/conceptmap'>Concept Map</NavBarItem>
<NavBarItem href='/conceptmap'>
Concept Map
</NavBarItem>
</>
}
)}
</Box>
{loggedIn ?
(
<>
{isAdmin &&
<Box>
<FormControl size='small' sx={{ m: 1, minWidth: 100 }} variant={"filled"}>
<InputLabel id='student-dropdown-label'>Student</InputLabel>
<Select
labelId='student-dropdown-label'
id='student-dropdown'
label='student'
onChange={loadStudentData}
style={{ backgroundColor: "white" }}
defaultValue={selectedStudent}
>
{
students.map((student) => (
<MenuItem key={student[1]} value={student[1]}>{student[0]}</MenuItem>
))
}
</Select>
</FormControl>
</Box>
}
<IconButton onClick={handleMenu} >
<Avatar src={profilePicture} imgProps={{ referrerPolicy: 'no-referrer' }} />
</IconButton>
<Menu
id='loggedInMenu'
anchorEl={anchorEl}
anchorOrigin={{ vertical: 'top', horizontal: 'right' }}
keepMounted
transformOrigin={{ vertical: 'top', horizontal: 'right' }}
open={Boolean(anchorEl)}
onClose={handleClose}
>
{mobileView &&
renderMenuItems()
}
<NavMenuItem
icon={<Logout />}
text={"Logout"}
onClick={doLogout}
/>
</Menu>
</>
) : (
<>
{mobileView ?
<>
<IconButton onClick={handleMenu} color="inherit">
<MenuIcon />
</IconButton>
<Menu
id='loggedInMenuMobile'
anchorEl={anchorEl}
anchorOrigin={{ vertical: 'top', horizontal: 'right' }}
keepMounted
transformOrigin={{ vertical: 'top', horizontal: 'right' }}
open={Boolean(anchorEl)}
onClose={handleClose}
{loggedIn ? (
<>
{isAdmin && (
<Box>
<FormControl
size='small'
sx={{ m: 1, minWidth: 100 }}
variant={'filled'}
>
<InputLabel id='student-dropdown-label'>
Student
</InputLabel>
<Select
labelId='student-dropdown-label'
id='student-dropdown'
label='student'
onChange={loadStudentData}
style={{ backgroundColor: 'white' }}
defaultValue={selectedStudent}
>
<NavMenuItem
icon={<LoginOutlined />}
text={"Login"}
onClick={() => { window.location.href = '/login' }}
/>
{renderMenuItems()}
</Menu>
</>
:
<Link href='/login' color='inherit' underline='none'>
<Button variant='outlined' color='inherit'>Login</Button>
</Link>
}
</>
)
}
{students.map((student) => (
<MenuItem
key={student[1]}
value={student[1]}
>
{student[0]}
</MenuItem>
))}
</Select>
</FormControl>
</Box>
)}
<IconButton onClick={handleMenu}>
<Avatar
src={profilePicture}
imgProps={{ referrerPolicy: 'no-referrer' }}
/>
</IconButton>
<Menu
id='loggedInMenu'
anchorEl={anchorEl}
anchorOrigin={{
vertical: 'top',
horizontal: 'right',
}}
keepMounted
transformOrigin={{
vertical: 'top',
horizontal: 'right',
}}
open={Boolean(anchorEl)}
onClose={handleClose}
>
{mobileView && renderMenuItems()}
<NavMenuItem
icon={<Logout />}
text={'Logout'}
onClick={doLogout}
/>
</Menu>
</>
) : (
<>
{mobileView ? (
<>
<IconButton
onClick={handleMenu}
color='inherit'
>
<MenuIcon />
</IconButton>
<Menu
id='loggedInMenuMobile'
anchorEl={anchorEl}
anchorOrigin={{
vertical: 'top',
horizontal: 'right',
}}
keepMounted
transformOrigin={{
vertical: 'top',
horizontal: 'right',
}}
open={Boolean(anchorEl)}
onClose={handleClose}
>
<NavMenuItem
icon={<LoginOutlined />}
text={'Login'}
onClick={() => {
window.location.href = '/login';
}}
/>
{renderMenuItems()}
</Menu>
</>
) : (
<Link
href='/login'
color='inherit'
underline='none'
>
<Button variant='outlined' color='inherit'>
Login
</Button>
</Link>
)}
</>
)}
</Toolbar>
</AppBar>
</Box>
Expand Down

0 comments on commit 7e51b42

Please sign in to comment.