Files
Tempest/imports/ui/App.jsx

132 lines
2.9 KiB
JavaScript

import { Meteor } from 'meteor/meteor';
import {Roles} from 'meteor/alanning:roles';
import React, { useState } from 'react';
import {createTheme, ThemeProvider} from '@mui/material/styles'
import { useTracker } from 'meteor/react-meteor-data';
import _ from 'lodash';
import {BrowserRouter, Routes, Route} from 'react-router-dom';
import {Page} from './Page'
import Assignments from './pages/Assignments'
import Assets from './pages/Assets'
import History from './pages/History'
import Search from './pages/Search'
import Users from './pages/Users'
import Admin from './pages/Admin'
import Home from './pages/Home'
import {StudentPage} from './pages/Student/StudentPage'
import {WorkshopList} from './pages/Student/WorkshopList'
const appTheme = createTheme({
components: {
MuiTableSortLabel: {
styleOverrides: {
root: {
"&.Mui-active": {
color: 'white',
"&:hover": {
color: '#d2d1d1'
},
},
color: 'white',
backgroundColor: '#333447',
"&:hover": {
color: '#d2d1d1',
},
},
icon: {
'& path': {
fill: 'white'
}
}
}
},
MuiTableCell: {
styleOverrides: {
// root: {
// '&:hover': {
// color: 'white !important'
// }
// },
head: {
color: 'white !important',
backgroundColor: '#333447',
'&:hover': {
color: 'white !important'
},
hover: {
color: 'white !important'
}
},
// hover: {
// color: 'white !important',
// '&:hover': {
// color: 'white !important'
// }
// }
}
},
}
})
export const App = (props) => {
const {user, canManageLaptops, isAdmin} = useTracker(() => {
const user = Meteor.user();
const canManageLaptops = user && Roles.userIsInRole(user._id, 'laptop-management', 'global');
const isAdmin = user && Roles.userIsInRole(user._id, 'admin', 'global');
return {
user,
canManageLaptops,
isAdmin
}
})
return (
<ThemeProvider theme={appTheme}>
<BrowserRouter>
<Routes>
<Route path="/" element={
<Page>
<Home/>
</Page>
}/>
<Route path="/student" element={
<StudentPage>
{user && <WorkshopList/>}
</StudentPage>
}/>
<Route path="/assignments/*" element={
<Page>
{canManageLaptops && <Assignments/>}
</Page>
}/>
<Route path="/assets/*" element={
<Page>
{isAdmin && <Assets/>}
</Page>
}/>
<Route path="/admin/*" element={
<Page>
{isAdmin && <Admin/>}
</Page>
}/>
<Route path="/history/*" element={
<Page>
{canManageLaptops && <History/>}
</Page>
}/>
<Route path="/search" element={
<Page>
{canManageLaptops && <Search/>}
</Page>
}/>
<Route path="/users/*" element={
<Page>
{isAdmin && <Users/>}
</Page>
}/>
</Routes>
</BrowserRouter>
</ThemeProvider>
)
}