refactor: update React, React Router and Material UI

This commit is contained in:
Markus
2026-08-05 13:26:03 +03:00
parent 6b5200d876
commit f160edb68e
79 changed files with 494 additions and 438 deletions
+12 -9
View File
@@ -4,18 +4,21 @@
"private": true,
"type": "module",
"dependencies": {
"@babel/runtime": "^7.24.0",
"@material-ui/core": "^4.12.4",
"@material-ui/icons": "^4.11.3",
"axios": "^0.18.0",
"history": "^4.7.2",
"prop-types": "^15.6.2",
"react": "^16.8.1",
"react-dom": "^16.8.1",
"@babel/runtime": "^8.0.0",
"@emotion/react": "^11.14.0",
"@emotion/styled": "^11.14.1",
"@mui/icons-material": "^9.2.0",
"@mui/material": "^9.2.0",
"@mui/styles": "^6.4.8",
"axios": "^1.19.0",
"history": "^5.3.0",
"prop-types": "^15.8.1",
"react": "^19.2.8",
"react-dom": "^19.2.8",
"react-drag-list": "^1.1.0",
"react-markdown": "^8.0.7",
"react-redux": "^5.1.1",
"react-router-dom": "^4.3.1",
"react-router-dom": "^7.18.2",
"react-select": "^2.4.1",
"recharts": "^2.12.3",
"redux": "^4.0.1",
+105 -92
View File
@@ -1,7 +1,7 @@
import React, { useEffect } from 'react'
import { connect } from 'react-redux'
import { Router, Route, Switch, Link } from 'react-router-dom'
import { createBrowserHistory } from 'history'
import { BrowserRouter, Route, Routes, Link } from 'react-router-dom'
import './App.css'
// Components
@@ -54,8 +54,6 @@ import { AdminRoute, LoginRoute, InstructorRoute } from './utils/protectedRoutes
import loginService from './services/login'
const history = createBrowserHistory({ basename: import.meta.env.BASE_URL })
const NotFound = () => (
<div className="not-found-page">
<h1>Page not found</h1>
@@ -142,156 +140,171 @@ const App = (props) => {
updateIsLoading(false)
}
const renderWithLoadingCheck = (component) =>
isLoading ? () => <LoadingSpinner /> : () => component
const renderWithLoadingCheck = (component) => (isLoading ? <LoadingSpinner /> : component)
return (
<Router history={history}>
<BrowserRouter basename={import.meta.env.BASE_URL}>
<div id="app-wrapper">
<NavigationBar logout={logout} />
<Notification />
<div id="app-content">
<Switch>
<Route path="/login" render={renderWithLoadingCheck(null)} />
<LoginRoute exact path="/" render={renderWithLoadingCheck(<LandingPage />)} />
<AdminRoute exact path="/topics" render={renderWithLoadingCheck(<TopicListPage />)} />
<Route exact path="/topics/create" render={renderWithLoadingCheck(<TopicFormPage />)} />
<Routes>
<Route path="/login" element={renderWithLoadingCheck(null)} />
<Route
path="/"
element={<LoginRoute render={() => renderWithLoadingCheck(<LandingPage />)} />}
/>
<Route
path="/topics"
element={<AdminRoute render={() => renderWithLoadingCheck(<TopicListPage />)} />}
/>
<Route path="/topics/create" element={renderWithLoadingCheck(<TopicFormPage />)} />
<Route
exact
path="/topics/:id"
render={renderWithLoadingCheck(<ViewTopicPage {...props} />)}
element={renderWithLoadingCheck(<ViewTopicPage {...props} />)}
/>
<AdminRoute
exact
<Route
path="/administration/configuration"
render={renderWithLoadingCheck(<ConfigurationPage />)}
element={<AdminRoute render={() => renderWithLoadingCheck(<ConfigurationPage />)} />}
/>
<AdminRoute
exact
<Route
path="/administration/participants"
render={renderWithLoadingCheck(<ParticipantsPage />)}
element={<AdminRoute render={() => renderWithLoadingCheck(<ParticipantsPage />)} />}
/>
<AdminRoute
exact
<Route
path="/administration/users"
render={renderWithLoadingCheck(<ViewUsersPage />)}
element={<AdminRoute render={() => renderWithLoadingCheck(<ViewUsersPage />)} />}
/>
<AdminRoute
exact
<Route
path="/administration/customer-review-questions"
render={renderWithLoadingCheck(<CustomerReviewQuestionsPage />)}
element={
<AdminRoute
render={() => renderWithLoadingCheck(<CustomerReviewQuestionsPage />)}
/>
}
/>
<AdminRoute
exact
<Route
path="/administration/peer-review-questions"
render={renderWithLoadingCheck(<PeerReviewQuestionsPage />)}
element={
<AdminRoute render={() => renderWithLoadingCheck(<PeerReviewQuestionsPage />)} />
}
/>
<AdminRoute
exact
<Route
path="/administration/registration-questions"
render={renderWithLoadingCheck(<RegistrationQuestionsPage />)}
element={
<AdminRoute render={() => renderWithLoadingCheck(<RegistrationQuestionsPage />)} />
}
/>
<AdminRoute
exact
<Route
path="/administration/groups"
render={renderWithLoadingCheck(<GroupManagementPage />)}
element={
<AdminRoute render={() => renderWithLoadingCheck(<GroupManagementPage />)} />
}
/>
<AdminRoute
exact
<Route
path="/administration/email-templates"
render={renderWithLoadingCheck(<EmailTemplatesPage />)}
element={<AdminRoute render={() => renderWithLoadingCheck(<EmailTemplatesPage />)} />}
/>
<AdminRoute
exact
<Route
path="/administration/registrations"
render={renderWithLoadingCheck(<Registrations />)}
element={<AdminRoute render={() => renderWithLoadingCheck(<Registrations />)} />}
/>
<AdminRoute
exact
<Route
path="/administration/reviews"
render={renderWithLoadingCheck(<InstructorReviews />)}
element={<AdminRoute render={() => renderWithLoadingCheck(<InstructorReviews />)} />}
/>
<AdminRoute
exact
<Route
path="/administration/tags"
render={renderWithLoadingCheck(<TagsDashboard />)}
element={<AdminRoute render={() => renderWithLoadingCheck(<TagsDashboard />)} />}
/>
<AdminRoute
exact
<Route
path="/administration/sprints"
render={renderWithLoadingCheck(<AdminSprintsPage />)}
element={<AdminRoute render={() => renderWithLoadingCheck(<AdminSprintsPage />)} />}
/>
<Route
exact
path="/customer-review/:id"
render={renderWithLoadingCheck(<CustomerReviewPage {...props} />)}
element={renderWithLoadingCheck(<CustomerReviewPage {...props} />)}
/>
<LoginRoute
exact
<Route
path="/register"
user={user}
render={renderWithLoadingCheck(<RegistrationPage />)}
element={
<LoginRoute
user={user}
render={() => renderWithLoadingCheck(<RegistrationPage />)}
/>
}
/>
<LoginRoute
exact
<Route
path="/peerreview"
user={user}
render={renderWithLoadingCheck(<PeerReviewPage />)}
element={
<LoginRoute user={user} render={() => renderWithLoadingCheck(<PeerReviewPage />)} />
}
/>
<AdminRoute
exact
<Route
path="/administration/registrationmanagement"
render={renderWithLoadingCheck(<RegistrationManagementPage />)}
element={
<AdminRoute render={() => renderWithLoadingCheck(<RegistrationManagementPage />)} />
}
/>
<InstructorRoute
exact
<Route
path="/instructorpage"
render={renderWithLoadingCheck(<InstructorPage />)}
element={
<InstructorRoute render={() => renderWithLoadingCheck(<InstructorPage />)} />
}
/>
<InstructorRoute
exact
<Route
path="/instructorreviewpage"
render={renderWithLoadingCheck(<InstructorReviewPage />)}
element={
<InstructorRoute render={() => renderWithLoadingCheck(<InstructorReviewPage />)} />
}
/>
<InstructorRoute
<Route
path="/adminstration/customer-reviews"
render={renderWithLoadingCheck(<ViewCustomerReviewsPage />)}
element={
<InstructorRoute
render={() => renderWithLoadingCheck(<ViewCustomerReviewsPage />)}
/>
}
/>
<InstructorRoute
<Route
path="/instructor-timelogs"
render={renderWithLoadingCheck(<InstructorTimeLogsPage />)}
element={
<InstructorRoute
render={() => renderWithLoadingCheck(<InstructorTimeLogsPage />)}
/>
}
/>
<LoginRoute
exact
<Route
path="/registrationdetails"
render={renderWithLoadingCheck(<RegistrationDetailsPage />)}
element={
<LoginRoute render={() => renderWithLoadingCheck(<RegistrationDetailsPage />)} />
}
/>
<LoginRoute exact path="/timelogs" render={renderWithLoadingCheck(<TimeLogsPage />)} />
<LoginRoute
exact
<Route
path="/timelogs"
element={<LoginRoute render={() => renderWithLoadingCheck(<TimeLogsPage />)} />}
/>
<Route
path="/sprints"
render={renderWithLoadingCheck(<SprintsDashboard />)}
element={<LoginRoute render={() => renderWithLoadingCheck(<SprintsDashboard />)} />}
/>
<LoginRoute
exact
<Route
path="/student-tags"
render={renderWithLoadingCheck(<StudentTagPage />)}
element={<LoginRoute render={() => renderWithLoadingCheck(<StudentTagPage />)} />}
/>
<InstructorRoute
exact
<Route
path="/instructor-tags"
render={renderWithLoadingCheck(<StaffTagPage />)}
element={<InstructorRoute render={() => renderWithLoadingCheck(<StaffTagPage />)} />}
/>
<AdminRoute
exact
<Route
path="/administration/tags-statistics"
render={renderWithLoadingCheck(<StaffTagPage />)}
element={<AdminRoute render={() => renderWithLoadingCheck(<StaffTagPage />)} />}
/>
<Route component={NotFound} />
</Switch>
<Route path="*" element={<NotFound />} />
</Routes>
</div>
</div>
</Router>
</BrowserRouter>
)
}
@@ -1,12 +1,13 @@
import { withRouter } from '../../utils/withRouter'
import React, { useEffect, useState } from 'react'
import { withRouter } from 'react-router-dom'
import { connect } from 'react-redux'
import LoadingSpinner from '../common/LoadingSpinner'
import { SprintsSelectForm } from './SprintsSelectForm'
import { SprintListItem } from './SprintListItem'
import { Typography, Table, TableRow, TableBody, TableHead, TableCell } from '@material-ui/core'
import { Typography, Table, TableRow, TableBody, TableHead, TableCell } from '@mui/material'
import sprintService from '../../services/sprints'
import configurationService from '../../services/configuration'
@@ -1,7 +1,7 @@
import React, { useState, useEffect } from 'react'
import Button from '@material-ui/core/Button'
import { TableRow, TableCell } from '@material-ui/core'
import TextField from '@material-ui/core/TextField'
import Button from '@mui/material/Button'
import { TableRow, TableCell } from '@mui/material'
import TextField from '@mui/material/TextField'
import sprintService from '../../services/sprints'
@@ -1,7 +1,7 @@
import React from 'react'
import MenuItem from '@material-ui/core/MenuItem'
import Typography from '@material-ui/core/Typography'
import Select from '@material-ui/core/Select'
import MenuItem from '@mui/material/MenuItem'
import Typography from '@mui/material/Typography'
import Select from '@mui/material/Select'
export const SprintsSelectForm = ({
configurations,
+45 -44
View File
@@ -1,20 +1,21 @@
import { withRouter } from '../utils/withRouter'
import React, { useEffect } from 'react'
import { connect } from 'react-redux'
import { withRouter } from 'react-router-dom'
import './TopicFormPage.css'
// MUI
import Select from '@material-ui/core/Select'
import MenuItem from '@material-ui/core/MenuItem'
import TextField from '@material-ui/core/TextField'
import Button from '@material-ui/core/Button'
import Switch from '@material-ui/core/Switch'
import ExpansionPanel from '@material-ui/core/ExpansionPanel'
import ExpansionPanelSummary from '@material-ui/core/ExpansionPanelSummary'
import ExpansionPanelDetails from '@material-ui/core/ExpansionPanelDetails'
import ExpansionPanelActions from '@material-ui/core/ExpansionPanelActions'
import ExpandMoreIcon from '@material-ui/icons/ExpandMore'
import Divider from '@material-ui/core/Divider'
import Select from '@mui/material/Select'
import MenuItem from '@mui/material/MenuItem'
import TextField from '@mui/material/TextField'
import Button from '@mui/material/Button'
import Switch from '@mui/material/Switch'
import Accordion from '@mui/material/Accordion'
import AccordionSummary from '@mui/material/AccordionSummary'
import AccordionDetails from '@mui/material/AccordionDetails'
import AccordionActions from '@mui/material/AccordionActions'
import ExpandMoreIcon from '@mui/icons-material/ExpandMore'
import Divider from '@mui/material/Divider'
// Service
import configurationService from '../services/configuration'
@@ -167,8 +168,8 @@ const ConfigurationPage = (props) => {
</div>
<h3>Questions</h3>
<div style={{ paddingBottom: 10 }}>
<ExpansionPanel data-cy="expansion-registration-questions">
<ExpansionPanelSummary expandIcon={<ExpandMoreIcon />}>
<Accordion data-cy="expansion-registration-questions">
<AccordionSummary expandIcon={<ExpandMoreIcon />}>
<div
style={{
width: '100%',
@@ -179,16 +180,16 @@ const ConfigurationPage = (props) => {
>
<p>Registration questions</p>
</div>
</ExpansionPanelSummary>
<ExpansionPanelDetails>
</AccordionSummary>
<AccordionDetails>
<div>
<Divider />
{props.selectedRegister && (
<RegistrationQuestionsTable questions={props.selectedRegister.questions} />
)}
</div>
</ExpansionPanelDetails>
<ExpansionPanelActions>
</AccordionDetails>
<AccordionActions>
<Select
name="registration"
value={props.selectedRegister ? props.selectedRegister.id : 'default'}
@@ -211,10 +212,10 @@ const ConfigurationPage = (props) => {
>
Configure
</Button>
</ExpansionPanelActions>
</ExpansionPanel>
<ExpansionPanel data-cy="expansion-review-questions-1">
<ExpansionPanelSummary expandIcon={<ExpandMoreIcon />}>
</AccordionActions>
</Accordion>
<Accordion data-cy="expansion-review-questions-1">
<AccordionSummary expandIcon={<ExpandMoreIcon />}>
<div
style={{
width: '100%',
@@ -225,16 +226,16 @@ const ConfigurationPage = (props) => {
>
<p>Peer review questions 1</p>
</div>
</ExpansionPanelSummary>
<ExpansionPanelDetails>
</AccordionSummary>
<AccordionDetails>
<div>
<Divider />
{props.selectedReview1 && (
<PeerReviewQuestionsTable questions={props.selectedReview1.questions} />
)}
</div>
</ExpansionPanelDetails>
<ExpansionPanelActions>
</AccordionDetails>
<AccordionActions>
<Select
data-cy="select-review-questions-1"
name="review1"
@@ -258,10 +259,10 @@ const ConfigurationPage = (props) => {
>
Configure
</Button>
</ExpansionPanelActions>
</ExpansionPanel>
<ExpansionPanel data-cy="expansion-review-questions-2">
<ExpansionPanelSummary expandIcon={<ExpandMoreIcon />}>
</AccordionActions>
</Accordion>
<Accordion data-cy="expansion-review-questions-2">
<AccordionSummary expandIcon={<ExpandMoreIcon />}>
<div
style={{
width: '100%',
@@ -272,16 +273,16 @@ const ConfigurationPage = (props) => {
>
<p>Peer review questions 2</p>
</div>
</ExpansionPanelSummary>
<ExpansionPanelDetails>
</AccordionSummary>
<AccordionDetails>
<div>
<Divider />
{props.selectedReview2 && (
<PeerReviewQuestionsTable questions={props.selectedReview2.questions} />
)}
</div>
</ExpansionPanelDetails>
<ExpansionPanelActions>
</AccordionDetails>
<AccordionActions>
<Select
name="review2"
value={props.selectedReview2 ? props.selectedReview2.id : 'default'}
@@ -304,10 +305,10 @@ const ConfigurationPage = (props) => {
>
Configure
</Button>
</ExpansionPanelActions>
</ExpansionPanel>
<ExpansionPanel data-cy="expansion-customer-review-questions">
<ExpansionPanelSummary expandIcon={<ExpandMoreIcon />}>
</AccordionActions>
</Accordion>
<Accordion data-cy="expansion-customer-review-questions">
<AccordionSummary expandIcon={<ExpandMoreIcon />}>
<div
style={{
width: '100%',
@@ -318,16 +319,16 @@ const ConfigurationPage = (props) => {
>
<p>Customer review questions</p>
</div>
</ExpansionPanelSummary>
<ExpansionPanelDetails>
</AccordionSummary>
<AccordionDetails>
<div>
<Divider />
{props.selectedCustomerReview && (
<PeerReviewQuestionsTable questions={props.selectedCustomerReview.questions} />
)}
</div>
</ExpansionPanelDetails>
<ExpansionPanelActions>
</AccordionDetails>
<AccordionActions>
<Select
name="customer-review"
value={props.selectedCustomerReview ? props.selectedCustomerReview.id : 'default'}
@@ -350,8 +351,8 @@ const ConfigurationPage = (props) => {
>
Configure
</Button>
</ExpansionPanelActions>
</ExpansionPanel>
</AccordionActions>
</Accordion>
<div style={{ marginTop: '10px' }}>
<Switch
style={{ marginRight: '10px', height: '40px' }}
@@ -1,14 +1,15 @@
import { withRouter } from '../../utils/withRouter'
import React, { useEffect } from 'react'
import { connect } from 'react-redux'
import { withRouter } from 'react-router-dom'
import './CustomerReviewPage.css'
import Typography from '@material-ui/core/Typography'
import TextField from '@material-ui/core/TextField'
import Button from '@material-ui/core/Button'
import Paper from '@material-ui/core/Paper'
import Radio from '@material-ui/core/Radio'
import FormControlLabel from '@material-ui/core/FormControlLabel'
import RadioGroup from '@material-ui/core/RadioGroup'
import Typography from '@mui/material/Typography'
import TextField from '@mui/material/TextField'
import Button from '@mui/material/Button'
import Paper from '@mui/material/Paper'
import Radio from '@mui/material/Radio'
import FormControlLabel from '@mui/material/FormControlLabel'
import RadioGroup from '@mui/material/RadioGroup'
import * as notificationActions from '../../reducers/actions/notificationActions'
import customerReviewPageActions from '../../reducers/actions/customerReviewPageActions'
@@ -1,6 +1,6 @@
import React from 'react'
import { connect } from 'react-redux'
import Button from '@material-ui/core/Button'
import Button from '@mui/material/Button'
import { createCustomerReviewQuestionSet } from '../../reducers/actions/customerReviewQuestionsPageActions'
import { setError, setSuccess } from '../../reducers/actions/notificationActions'
import QuestionSetForm from '../QuestionSetForm'
@@ -1,8 +1,9 @@
import { withRouter } from '../../utils/withRouter'
import React from 'react'
import PropTypes from 'prop-types'
import { connect } from 'react-redux'
import { withRouter } from 'react-router-dom'
import Paper from '@material-ui/core/Paper'
import Paper from '@mui/material/Paper'
import {
fetchCustomerReviewQuestionSets,
@@ -1,7 +1,7 @@
import React from 'react'
import PropTypes from 'prop-types'
import TextField from '@material-ui/core/TextField'
import TextField from '@mui/material/TextField'
import './EmailTemplate.css'
import { templateShape } from './commonPropTypes'
@@ -1,7 +1,7 @@
import React, { useState, useEffect } from 'react'
import PropTypes from 'prop-types'
import Button from '@material-ui/core/Button'
import Button from '@mui/material/Button'
import { templatesShape } from './commonPropTypes'
import EmailTemplate from './EmailTemplate'
@@ -1,9 +1,10 @@
import { withRouter } from '../../utils/withRouter'
import React from 'react'
import { withRouter } from 'react-router-dom'
import { connect } from 'react-redux'
import PropTypes from 'prop-types'
import Paper from '@material-ui/core/Paper'
import Paper from '@mui/material/Paper'
import emailTemplatesActions from '../../reducers/actions/emailTemplatesActions'
import * as notificationActions from '../../reducers/actions/notificationActions'
@@ -1,7 +1,7 @@
import React from 'react'
import PropTypes from 'prop-types'
import AsyncSelect from 'react-select/lib/Async'
import { useTheme } from '@material-ui/core/styles'
import AsyncSelect from 'react-select/async'
import { useTheme } from '@mui/material/styles'
import autocomplete from '../../services/autocomplete'
@@ -1,8 +1,8 @@
import React from 'react'
import { connect } from 'react-redux'
import Select from '@material-ui/core/Select'
import MenuItem from '@material-ui/core/MenuItem'
import Select from '@mui/material/Select'
import MenuItem from '@mui/material/MenuItem'
import groupManagementActions from '../../reducers/actions/groupManagementActions'
@@ -1,13 +1,13 @@
import React from 'react'
import { connect } from 'react-redux'
import TextField from '@material-ui/core/TextField'
import Typography from '@material-ui/core/Typography'
import Button from '@material-ui/core/Button'
import Radio from '@material-ui/core/Radio'
import RadioGroup from '@material-ui/core/RadioGroup'
import FormControlLabel from '@material-ui/core/FormControlLabel'
import { Table, TableBody, TableCell, TableRow } from '@material-ui/core'
import TextField from '@mui/material/TextField'
import Typography from '@mui/material/Typography'
import Button from '@mui/material/Button'
import Radio from '@mui/material/Radio'
import RadioGroup from '@mui/material/RadioGroup'
import FormControlLabel from '@mui/material/FormControlLabel'
import { Table, TableBody, TableCell, TableRow } from '@mui/material'
import groupManagementService from '../../services/groupManagement'
@@ -1,8 +1,8 @@
import React from 'react'
import { connect } from 'react-redux'
import Paper from '@material-ui/core/Paper'
import { Table, TableBody, TableRow, TableCell } from '@material-ui/core'
import Paper from '@mui/material/Paper'
import { Table, TableBody, TableRow, TableCell } from '@mui/material'
import * as notificationActions from '../../reducers/actions/notificationActions'
import groupManagementActions from '../../reducers/actions/groupManagementActions'
@@ -1,8 +1,8 @@
import React, { useEffect } from 'react'
import { connect } from 'react-redux'
import Paper from '@material-ui/core/Paper'
import Typography from '@material-ui/core/Typography'
import Paper from '@mui/material/Paper'
import Typography from '@mui/material/Typography'
import groupManagementService from '../../services/groupManagement'
import userService from '../../services/user'
@@ -1,13 +1,13 @@
import React from 'react'
import { connect } from 'react-redux'
import TextField from '@material-ui/core/TextField'
import Button from '@material-ui/core/Button'
import IconButton from '@material-ui/core/IconButton'
import DeleteIcon from '@material-ui/icons/Delete'
import Radio from '@material-ui/core/Radio'
import RadioGroup from '@material-ui/core/RadioGroup'
import FormControlLabel from '@material-ui/core/FormControlLabel'
import TextField from '@mui/material/TextField'
import Button from '@mui/material/Button'
import IconButton from '@mui/material/IconButton'
import DeleteIcon from '@mui/icons-material/Delete'
import Radio from '@mui/material/Radio'
import RadioGroup from '@mui/material/RadioGroup'
import FormControlLabel from '@mui/material/FormControlLabel'
import groupManagementService from '../../services/groupManagement'
import * as notificationActions from '../../reducers/actions/notificationActions'
@@ -1,9 +1,9 @@
import React from 'react'
import { Link } from 'react-router-dom'
import Button from '@material-ui/core/Button'
import IconButton from '@material-ui/core/IconButton'
import DeleteIcon from '@material-ui/icons/Delete'
import Button from '@mui/material/Button'
import IconButton from '@mui/material/IconButton'
import DeleteIcon from '@mui/icons-material/Delete'
import groupManagementService from '../../services/groupManagement'
@@ -1,8 +1,8 @@
import React from 'react'
import { connect } from 'react-redux'
import Select from '@material-ui/core/Select'
import MenuItem from '@material-ui/core/MenuItem'
import Select from '@mui/material/Select'
import MenuItem from '@mui/material/MenuItem'
const TopicSelect = ({ topics, onTopicSelectChange, groupTopicID, className, groupConfig }) => {
const filteredTopics = topics.filter((topic) => {
@@ -1,14 +1,14 @@
import { withRouter } from '../../utils/withRouter'
import React, { useEffect, useState } from 'react'
import { connect } from 'react-redux'
import { withRouter } from 'react-router-dom'
import { withStyles } from '@material-ui/core/styles'
import Button from '@material-ui/core/Button'
import MenuItem from '@material-ui/core/MenuItem'
import Typography from '@material-ui/core/Typography'
import Select from '@material-ui/core/Select'
import Error from '@material-ui/icons/Error'
import { Table, TableRow, TableCell, TableHead, TableBody } from '@material-ui/core'
import { withStyles } from '@mui/styles'
import Button from '@mui/material/Button'
import MenuItem from '@mui/material/MenuItem'
import Typography from '@mui/material/Typography'
import Select from '@mui/material/Select'
import Error from '@mui/icons-material/Error'
import { Table, TableRow, TableCell, TableHead, TableBody } from '@mui/material'
import * as notificationActions from '../../reducers/actions/notificationActions'
import './InstructorPage.css'
@@ -1,5 +1,5 @@
import React from 'react'
import { Table, TableRow, TableCell, TableHead, TableBody } from '@material-ui/core'
import { Table, TableRow, TableCell, TableHead, TableBody } from '@mui/material'
import './InstructorPage.css'
@@ -1,6 +1,7 @@
import { withRouter } from '../utils/withRouter'
import React, { useState } from 'react'
import { connect } from 'react-redux'
import { withRouter } from 'react-router-dom'
import { getUser } from '../utils/functions'
import questionsJson from './questions/instructor_data'
@@ -10,15 +11,15 @@ import * as notificationActions from '../reducers/actions/notificationActions'
import instructorReviewPageActions from '../reducers/actions/instructorReviewPageActions.js'
//Services
import TextField from '@material-ui/core/TextField'
import TextField from '@mui/material/TextField'
import groupManagementService from '../services/groupManagement'
import Select from '@material-ui/core/Select'
import MenuItem from '@material-ui/core/MenuItem'
import Button from '@material-ui/core/Button'
import Typography from '@material-ui/core/Typography'
import ExpandLess from '@material-ui/icons/ExpandLess'
import ExpandMore from '@material-ui/icons/ExpandMore'
import Select from '@mui/material/Select'
import MenuItem from '@mui/material/MenuItem'
import Button from '@mui/material/Button'
import Typography from '@mui/material/Typography'
import ExpandLess from '@mui/icons-material/ExpandLess'
import ExpandMore from '@mui/icons-material/ExpandMore'
import instructorReviewService from '../services/instructorReview'
class InstructorReviewPage extends React.Component {
+2 -1
View File
@@ -1,6 +1,7 @@
import { withRouter } from '../utils/withRouter'
import React from 'react'
import { connect } from 'react-redux'
import { withRouter, Link } from 'react-router-dom'
import { Link } from 'react-router-dom'
import * as notificationActions from '../reducers/actions/notificationActions'
import './LandingPage.css'
+2 -2
View File
@@ -1,8 +1,8 @@
import React from 'react'
import { connect } from 'react-redux'
import Button from '@material-ui/core/Button'
import TextField from '@material-ui/core/TextField'
import Button from '@mui/material/Button'
import TextField from '@mui/material/TextField'
import appActions from '../reducers/actions/appActions'
import loginPageActions from '../reducers/actions/loginPageActions'
+7 -6
View File
@@ -1,16 +1,17 @@
import { withRouter } from '../utils/withRouter'
import React from 'react'
import { connect } from 'react-redux'
import { withRouter } from 'react-router-dom'
import { withStyles } from '@material-ui/core/styles'
import { Table, TableBody, TableCell, TableHead, TableRow } from '@material-ui/core'
import Paper from '@material-ui/core/Paper'
import Button from '@material-ui/core/Button'
import { withStyles } from '@mui/styles'
import { Table, TableBody, TableCell, TableHead, TableRow } from '@mui/material'
import Paper from '@mui/material/Paper'
import Button from '@mui/material/Button'
import * as notificationActions from '../reducers/actions/notificationActions'
const styles = (theme) => ({
root: {
width: '100%',
marginTop: theme.spacing.unit * 3,
marginTop: theme.spacing(3),
overflowX: 'auto',
},
table: {
+5 -4
View File
@@ -1,6 +1,7 @@
import { withRouter } from '../utils/withRouter'
import React from 'react'
import { connect } from 'react-redux'
import { withRouter } from 'react-router-dom'
import './PeerReviewPage.css'
import { getUser, extractCallingName } from '../utils/functions'
import { NotInGroupPlaceholder, LoadingPlaceholder } from './common/Placeholders'
@@ -14,9 +15,9 @@ import peerReviewService from '../services/peerReview'
import groupManagementService from '../services/groupManagement'
import timeLogService from '../services/timeLogs'
import TextField from '@material-ui/core/TextField'
import Button from '@material-ui/core/Button'
import { Table, TableHead, TableRow, TableBody, TableCell } from '@material-ui/core'
import TextField from '@mui/material/TextField'
import Button from '@mui/material/Button'
import { Table, TableHead, TableRow, TableBody, TableCell } from '@mui/material'
class PeerReview extends React.Component {
async componentDidMount() {
@@ -1,6 +1,6 @@
import React from 'react'
import { connect } from 'react-redux'
import Button from '@material-ui/core/Button'
import Button from '@mui/material/Button'
import { createPeerReviewQuestionSet } from '../../reducers/actions/peerReviewQuestionsPageActions'
import { setError, setSuccess } from '../../reducers/actions/notificationActions'
import QuestionSetForm from '../QuestionSetForm'
@@ -1,8 +1,9 @@
import { withRouter } from '../../utils/withRouter'
import React from 'react'
import PropTypes from 'prop-types'
import { connect } from 'react-redux'
import { withRouter } from 'react-router-dom'
import Paper from '@material-ui/core/Paper'
import Paper from '@mui/material/Paper'
import {
fetchPeerReviewQuestionSets,
@@ -1,6 +1,6 @@
import React from 'react'
import PropTypes from 'prop-types'
import { Table, TableHead, TableRow, TableCell, TableBody } from '@material-ui/core'
import { Table, TableHead, TableRow, TableCell, TableBody } from '@mui/material'
import { peerReviewQuestionShape } from './common/sharedPropTypes'
+1 -1
View File
@@ -1,5 +1,5 @@
import React, { useState } from 'react'
import TextField from '@material-ui/core/TextField'
import TextField from '@mui/material/TextField'
import './QuestionSetForm.css'
const validateQuestionsJson = (str) => {
+9 -9
View File
@@ -1,12 +1,12 @@
import React, { useState } from 'react'
import PropTypes from 'prop-types'
import Menu from '@material-ui/core/Menu'
import MenuItem from '@material-ui/core/MenuItem'
import Paper from '@material-ui/core/Paper'
import { withTheme } from '@material-ui/core/styles'
import IconButton from '@material-ui/core/IconButton'
import MoreVertIcon from '@material-ui/icons/MoreVert'
import Menu from '@mui/material/Menu'
import MenuItem from '@mui/material/MenuItem'
import Paper from '@mui/material/Paper'
import { useTheme } from '@mui/material/styles'
import IconButton from '@mui/material/IconButton'
import MoreVertIcon from '@mui/icons-material/MoreVert'
import './QuestionSetItem.css'
const ItemControls = ({ onEditClicked }) => {
@@ -56,7 +56,8 @@ ItemControls.propTypes = {
onEditClicked: PropTypes.func,
}
const QuestionSetItem = ({ title, children, onEditClicked, theme }) => {
const QuestionSetItem = ({ title, children, onEditClicked }) => {
const theme = useTheme()
const headerStyle = {
borderColor: theme.palette.primary.main,
}
@@ -80,7 +81,6 @@ QuestionSetItem.propTypes = {
title: PropTypes.string,
children: PropTypes.node,
onEditClicked: PropTypes.func,
theme: PropTypes.object,
}
export default withTheme(QuestionSetItem)
export default QuestionSetItem
@@ -1,7 +1,7 @@
import React from 'react'
import PropTypes from 'prop-types'
import Button from '@material-ui/core/Button'
import Paper from '@material-ui/core/Paper'
import Button from '@mui/material/Button'
import Paper from '@mui/material/Paper'
import QuestionSetForm from './QuestionSetForm'
import './QuestionSetItemEditor.css'
+4 -4
View File
@@ -1,8 +1,8 @@
import React from 'react'
import Select from '@material-ui/core/Select'
import MenuItem from '@material-ui/core/MenuItem'
import TextField from '@material-ui/core/TextField'
import Button from '@material-ui/core/Button'
import Select from '@mui/material/Select'
import MenuItem from '@mui/material/MenuItem'
import TextField from '@mui/material/TextField'
import Button from '@mui/material/Button'
const QuestionsFrom = (props) => {
return (
@@ -1,5 +1,6 @@
import { withRouter } from '../utils/withRouter'
import React from 'react'
import { withRouter, Link } from 'react-router-dom'
import { Link } from 'react-router-dom'
import { connect } from 'react-redux'
import ReactDragList from 'react-drag-list'
@@ -8,8 +9,8 @@ import { setError } from '../reducers/actions/notificationActions'
import peerReviewService from '../services/peerReview'
import Typography from '@material-ui/core/Typography'
import { Input, Card, CardContent, Select, MenuItem } from '@material-ui/core'
import Typography from '@mui/material/Typography'
import { Input, Card, CardContent, Select, MenuItem } from '@mui/material'
import TopicDialog from './TopicDialog'
import CourseMaterial from './common/CourseMaterial'
@@ -11,7 +11,7 @@ import {
Switch,
FormControl,
FormHelperText,
} from '@material-ui/core'
} from '@mui/material'
// Actions
import registrationManagementActions from '../../reducers/actions/registrationManagementActions'
@@ -11,7 +11,7 @@ import {
Switch,
FormControl,
FormHelperText,
} from '@material-ui/core'
} from '@mui/material'
// Actions
import registrationManagementActions from '../../reducers/actions/registrationManagementActions'
@@ -1,13 +1,13 @@
import { withRouter } from '../../utils/withRouter'
import React, { useEffect } from 'react'
import { connect } from 'react-redux'
import { withRouter } from 'react-router-dom'
import ProjectRegistrationSettings from './ProjectRegistrationSettings'
import TopicRegistrationSettings from './TopicRegistrationSettings'
import PeerReviewSettings from './PeerReviewSettings'
// MUI
import { MenuItem, Button } from '@material-ui/core'
import { MenuItem, Button } from '@mui/material'
// Actions
import appActions from '../../reducers/actions/appActions'
@@ -11,7 +11,7 @@ import {
Switch,
FormControl,
FormHelperText,
} from '@material-ui/core'
} from '@mui/material'
// Actions
import registrationManagementActions from '../../reducers/actions/registrationManagementActions'
+9 -8
View File
@@ -1,15 +1,16 @@
import { withRouter } from '../utils/withRouter'
import React from 'react'
import { withRouter } from 'react-router-dom'
import { connect } from 'react-redux'
import ReactDragList from 'react-drag-list'
// MUI
import Card from '@material-ui/core/Card'
import CardContent from '@material-ui/core/CardContent'
import Button from '@material-ui/core/Button'
import Input from '@material-ui/core/Input'
import Select from '@material-ui/core/Select'
import MenuItem from '@material-ui/core/MenuItem'
import TextField from '@material-ui/core/TextField'
import Card from '@mui/material/Card'
import CardContent from '@mui/material/CardContent'
import Button from '@mui/material/Button'
import Input from '@mui/material/Input'
import Select from '@mui/material/Select'
import MenuItem from '@mui/material/MenuItem'
import TextField from '@mui/material/TextField'
// services
import topicService from '../services/topic'
import userService from '../services/user'
@@ -1,6 +1,6 @@
import React from 'react'
import { connect } from 'react-redux'
import Button from '@material-ui/core/Button'
import Button from '@mui/material/Button'
import { createRegistrationQuestionSet } from '../../reducers/actions/registrationQuestionsPageActions'
import { setError, setSuccess } from '../../reducers/actions/notificationActions'
import QuestionSetForm from '../QuestionSetForm'
@@ -1,8 +1,9 @@
import { withRouter } from '../../utils/withRouter'
import React from 'react'
import PropTypes from 'prop-types'
import { connect } from 'react-redux'
import { withRouter } from 'react-router-dom'
import Paper from '@material-ui/core/Paper'
import Paper from '@mui/material/Paper'
import {
fetchRegistrationQuestionSets,
@@ -1,7 +1,7 @@
import React from 'react'
import PropTypes from 'prop-types'
import { Table, TableHead, TableRow, TableCell, TableBody } from '@material-ui/core'
import { Table, TableHead, TableRow, TableCell, TableBody } from '@mui/material'
import { registrationQuestionShape } from './common/sharedPropTypes'
+1 -1
View File
@@ -1,5 +1,5 @@
import React, { useEffect, useState } from 'react'
import { Table, TableRow, TableCell } from '@material-ui/core'
import { Table, TableRow, TableCell } from '@mui/material'
import registrationService from '../services/registration'
const Registrations = () => {
@@ -1,13 +1,14 @@
import { withRouter } from '../../utils/withRouter'
import React, { useState, useEffect } from 'react'
import Typography from '@material-ui/core/Typography'
import TextField from '@material-ui/core/TextField'
import Button from '@material-ui/core/Button'
import { Table, TableRow, TableHead, TableBody, TableCell } from '@material-ui/core'
import Typography from '@mui/material/Typography'
import TextField from '@mui/material/TextField'
import Button from '@mui/material/Button'
import { Table, TableRow, TableHead, TableBody, TableCell } from '@mui/material'
import sprintService from '../../services/sprints'
import { NotInGroupPlaceholder } from '../common/Placeholders'
import './SprintsDashboard.css'
import { connect } from 'react-redux'
import { withRouter } from 'react-router-dom'
import * as notificationActions from '../../reducers/actions/notificationActions'
const SprintsPage = (props) => {
@@ -1,12 +1,13 @@
import { withRouter } from '../../utils/withRouter'
import React, { useState, useEffect, useRef } from 'react'
import Typography from '@material-ui/core/Typography'
import TextField from '@material-ui/core/TextField'
import Button from '@material-ui/core/Button'
import Typography from '@mui/material/Typography'
import TextField from '@mui/material/TextField'
import Button from '@mui/material/Button'
import tagService from '../../services/tags'
import './TagsDashboard.css'
import { connect } from 'react-redux'
import { withRouter } from 'react-router-dom'
import { Table, TableBody, TableCell, TableHead, TableRow } from '@material-ui/core'
import { Table, TableBody, TableCell, TableHead, TableRow } from '@mui/material'
import * as notificationActions from '../../reducers/actions/notificationActions'
import ConfirmationDialog from '../common/ConfirmationDialog'
@@ -1,8 +1,9 @@
import { withRouter } from '../../utils/withRouter'
import React, { useEffect, useState } from 'react'
import { connect } from 'react-redux'
import { withRouter } from 'react-router-dom'
import LoadingSpinner from '../common/LoadingSpinner'
import { Typography } from '@material-ui/core'
import { Typography } from '@mui/material'
import CheckboxMultiSelect from '../common/CheckboxMultiSelect'
import { StudentSelectionForm } from '../common/StudentSelectionForm'
import TagUsageLineChart from './TagUsageLineChart'
@@ -1,8 +1,9 @@
import { withRouter } from '../../utils/withRouter'
import React, { useEffect, useState } from 'react'
import { connect } from 'react-redux'
import { withRouter } from 'react-router-dom'
import LoadingSpinner from '../common/LoadingSpinner'
import { Typography } from '@material-ui/core'
import { Typography } from '@mui/material'
import { NotInGroupPlaceholder, NoSprintsPlaceholder } from '../common/Placeholders'
import CheckboxMultiSelect from '../common/CheckboxMultiSelect'
import TagUsageLineChart from './TagUsageLineChart'
@@ -9,7 +9,7 @@ import {
ResponsiveContainer,
Cell,
} from 'recharts'
import { useTheme } from '@material-ui/core/styles'
import { useTheme } from '@mui/material/styles'
const TagUsageBarChart = ({ allTags, selectedTags, tagData, tagColors }) => {
const theme = useTheme()
@@ -9,7 +9,7 @@ import {
XAxis,
YAxis,
} from 'recharts'
import { useTheme } from '@material-ui/core/styles'
import { useTheme } from '@mui/material/styles'
const TagUsageLineChart = ({ allSprints, allTags, selectedTags, tagData, tagColors }) => {
const theme = useTheme()
@@ -1,5 +1,6 @@
import { withRouter } from '../../utils/withRouter'
import React, { useEffect, useState } from 'react'
import { withRouter } from 'react-router-dom'
import { connect } from 'react-redux'
import { StudentSelectionForm } from '../common/StudentSelectionForm'
import { TimeLogRow } from './TimeLogRow'
@@ -8,8 +9,8 @@ import LoadingSpinner from '../common/LoadingSpinner'
import { SprintSelect } from './SprintSelect'
import ConfirmationDialog from '../common/ConfirmationDialog'
import { Typography } from '@material-ui/core'
import Button from '@material-ui/core/Button'
import { Typography } from '@mui/material'
import Button from '@mui/material/Button'
import userService from '../../services/user'
import sprintService from '../../services/sprints'
@@ -1,7 +1,7 @@
import React from 'react'
import { IconButton, Typography } from '@material-ui/core'
import ArrowBackIosIcon from '@material-ui/icons/ArrowBackIos'
import ArrowForwardIosIcon from '@material-ui/icons/ArrowForwardIos'
import { IconButton, Typography } from '@mui/material'
import ArrowBackIosIcon from '@mui/icons-material/ArrowBackIos'
import ArrowForwardIosIcon from '@mui/icons-material/ArrowForwardIos'
import './TimeLogsPage.css'
@@ -1,6 +1,6 @@
import React from 'react'
import { withStyles } from '@material-ui/core/styles'
import { Check } from '@material-ui/icons'
import { withStyles } from '@mui/styles'
import { Check } from '@mui/icons-material'
import {
FormControl,
InputLabel,
@@ -9,7 +9,7 @@ import {
Chip,
OutlinedInput,
ListItemIcon,
} from '@material-ui/core'
} from '@mui/material'
import './TimeLogsPage.css'
@@ -12,8 +12,8 @@ import {
Cell,
} from 'recharts'
import { NoTimeLogsPlaceholderSprint, NoTimeLogsPlaceholderProject } from '../common/Placeholders'
import Error from '@material-ui/icons/Error'
import { useTheme } from '@material-ui/core/styles'
import Error from '@mui/icons-material/Error'
import { useTheme } from '@mui/material/styles'
import './TimeLogsPage.css'
@@ -1,5 +1,5 @@
import React, { useState } from 'react'
import { TextField, Button } from '@material-ui/core'
import { TextField, Button } from '@mui/material'
import TagSelect from './TagSelect'
import './TimeLogsPage.css'
@@ -1,9 +1,9 @@
import React, { useState } from 'react'
import { minutesToFormattedHoursAndMinutes } from '../../utils/functions'
import { DeleteOutlineRounded } from '@material-ui/icons'
import { IconButton, Chip } from '@material-ui/core'
import { DeleteOutlineRounded } from '@mui/icons-material'
import { IconButton, Chip } from '@mui/material'
import ConfirmationDialog from '../common/ConfirmationDialog'
import Checkbox from '@material-ui/core/Checkbox'
import Checkbox from '@mui/material/Checkbox'
import './TimeLogsPage.css'
@@ -1,14 +1,15 @@
import { withRouter } from '../../utils/withRouter'
import React, { useEffect, useState } from 'react'
import { connect } from 'react-redux'
import { withRouter } from 'react-router-dom'
import { TimeLogForm } from './TimeLogForm'
import { TimeLogRow } from './TimeLogRow'
import TimeLogChart from './TimeLogChart'
import { NotInGroupPlaceholder, NoSprintsPlaceholder } from '../common/Placeholders'
import LoadingSpinner from '../common/LoadingSpinner'
import { SprintSelect } from './SprintSelect'
import { Typography } from '@material-ui/core'
import Error from '@material-ui/icons/Error'
import { Typography } from '@mui/material'
import Error from '@mui/icons-material/Error'
// services
import timeLogsService from '../../services/timeLogs'
+5 -5
View File
@@ -1,12 +1,12 @@
import React from 'react'
import Typography from '@material-ui/core/Typography'
import Button from '@material-ui/core/Button'
import Typography from '@mui/material/Typography'
import Button from '@mui/material/Button'
import ReactMarkdown from 'react-markdown'
import { connect } from 'react-redux'
import './Topic.css'
const markdownRenderers = {
link: ({ children, href, ...otherProps }) => {
const markdownComponents = {
a: ({ children, href, ...otherProps }) => {
// add rel and target for external links so we don't leak information :)
const externalLinkProps = /^https?:\/\//i.test(href)
? { rel: 'nofollow noreferrer noopener', target: '_blank' }
@@ -21,7 +21,7 @@ const markdownRenderers = {
}
const Markdown = ({ children }) => (
<ReactMarkdown renderers={markdownRenderers}>{children}</ReactMarkdown>
<ReactMarkdown components={markdownComponents}>{children}</ReactMarkdown>
)
const Topic = ({
+7 -7
View File
@@ -1,12 +1,12 @@
import React from 'react'
import Button from '@material-ui/core/Button'
import Dialog from '@material-ui/core/Dialog'
import DialogContent from '@material-ui/core/DialogContent'
import DialogActions from '@material-ui/core/DialogActions'
import Card from '@material-ui/core/Card'
import CardContent from '@material-ui/core/CardContent'
import Button from '@mui/material/Button'
import Dialog from '@mui/material/Dialog'
import DialogContent from '@mui/material/DialogContent'
import DialogActions from '@mui/material/DialogActions'
import Card from '@mui/material/Card'
import CardContent from '@mui/material/CardContent'
import Topic from './Topic'
import Typography from '@material-ui/core/Typography'
import Typography from '@mui/material/Typography'
class TopicDialog extends React.Component {
constructor(props) {
+1 -1
View File
@@ -1,7 +1,7 @@
import React from 'react'
import { connect } from 'react-redux'
import Button from '@material-ui/core/Button'
import Button from '@mui/material/Button'
import topicFormPageActions from '../reducers/actions/topicFormPageActions'
import * as notificationActions from '../reducers/actions/notificationActions'
+4 -4
View File
@@ -1,10 +1,10 @@
import React, { useState } from 'react'
import { connect } from 'react-redux'
import topicFormPageActions from '../reducers/actions/topicFormPageActions'
import TextField from '@material-ui/core/TextField'
import { Radio, RadioGroup, Checkbox } from '@material-ui/core'
import Button from '@material-ui/core/Button'
import { useTheme } from '@material-ui/core'
import TextField from '@mui/material/TextField'
import { Radio, RadioGroup, Checkbox } from '@mui/material'
import Button from '@mui/material/Button'
import { useTheme } from '@mui/material'
import './TopicForm.css'
const TopicForm = (props) => {
+3 -3
View File
@@ -1,8 +1,8 @@
import React from 'react'
import { connect } from 'react-redux'
import { Redirect } from 'react-router'
import { Navigate } from 'react-router-dom'
import Button from '@material-ui/core/Button'
import Button from '@mui/material/Button'
import topicFormPageActions from '../reducers/actions/topicFormPageActions'
import * as notificationActions from '../reducers/actions/notificationActions'
@@ -35,7 +35,7 @@ class TopicFormPage extends React.Component {
render() {
if (this.props.isSaved === true) {
return <Redirect to={'/topics/' + this.props.secretId} />
return <Navigate to={'/topics/' + this.props.secretId} />
}
if (this.props.showInfo) {
@@ -1,7 +1,7 @@
import React from 'react'
import { connect } from 'react-redux'
import Button from '@material-ui/core/Button'
import { Typography } from '@material-ui/core'
import Button from '@mui/material/Button'
import { Typography } from '@mui/material'
import topicFormPageActions from '../reducers/actions/topicFormPageActions'
import './TopicFormPageInfo.css'
+23 -22
View File
@@ -1,24 +1,25 @@
import { withRouter } from '../utils/withRouter'
import React, { useState, useEffect, Fragment } from 'react'
import { connect } from 'react-redux'
import { Link, withRouter } from 'react-router-dom'
import { Link } from 'react-router-dom'
import PropTypes from 'prop-types'
import Button from '@material-ui/core/Button'
import RadioGroup from '@material-ui/core/RadioGroup'
import Radio from '@material-ui/core/Radio'
import FormControl from '@material-ui/core/FormControl'
import FormControlLabel from '@material-ui/core/FormControlLabel'
import ListItemIcon from '@material-ui/core/ListItemIcon'
import ListItemText from '@material-ui/core/ListItemText'
import Menu from '@material-ui/core/Menu'
import MenuItem from '@material-ui/core/MenuItem'
import Select from '@material-ui/core/Select'
import Switch from '@material-ui/core/Switch'
import { Table, TableBody, TableRow, TableCell, TableHead, useTheme } from '@material-ui/core'
import Icon from '@material-ui/icons/Input'
import Button from '@mui/material/Button'
import RadioGroup from '@mui/material/RadioGroup'
import Radio from '@mui/material/Radio'
import FormControl from '@mui/material/FormControl'
import FormControlLabel from '@mui/material/FormControlLabel'
import ListItemIcon from '@mui/material/ListItemIcon'
import ListItemText from '@mui/material/ListItemText'
import Menu from '@mui/material/Menu'
import MenuItem from '@mui/material/MenuItem'
import Select from '@mui/material/Select'
import Switch from '@mui/material/Switch'
import { Table, TableBody, TableRow, TableCell, TableHead, useTheme } from '@mui/material'
import Icon from '@mui/icons-material/Input'
import { MuiThemeProvider, createMuiTheme } from '@material-ui/core/styles'
import { green, red, orange } from '@material-ui/core/colors'
import { ThemeProvider, createTheme } from '@mui/material/styles'
import { green, red, orange } from '@mui/material/colors'
import emailService from '../services/email'
import { formatDate } from '../utils/functions'
@@ -31,7 +32,7 @@ import './TopicListPage.css'
import { NoneAvailable } from './common/Placeholders'
import configurationMapper from '../utils/configurationMapper'
const redGreenTheme = createMuiTheme({
const redGreenTheme = createTheme({
palette: {
primary: green,
secondary: red,
@@ -41,7 +42,7 @@ const redGreenTheme = createMuiTheme({
},
})
const orangeTheme = createMuiTheme({
const orangeTheme = createTheme({
palette: {
primary: orange,
secondary: orange,
@@ -52,9 +53,9 @@ const orangeTheme = createMuiTheme({
})
const ThemedButton = ({ theme, ...props }) => (
<MuiThemeProvider theme={theme}>
<ThemeProvider theme={theme}>
<Button {...props} />
</MuiThemeProvider>
</ThemeProvider>
)
const GreenButton = (props) => <ThemedButton {...props} theme={redGreenTheme} color="primary" />
@@ -391,7 +392,7 @@ const TopicAcceptanceFilter = (props) => {
return (
<Fragment>
<FormControl sx={{ margin: '0 4rem' }}>
<MuiThemeProvider theme={redGreenTheme}>
<ThemeProvider theme={redGreenTheme}>
<RadioGroup
row
defaultValue="all"
@@ -418,7 +419,7 @@ const TopicAcceptanceFilter = (props) => {
label="Rejected"
/>
</RadioGroup>
</MuiThemeProvider>
</ThemeProvider>
</FormControl>
</Fragment>
)
+1 -1
View File
@@ -1,6 +1,6 @@
import React from 'react'
import { connect } from 'react-redux'
import Typography from '@material-ui/core/Typography'
import Typography from '@mui/material/Typography'
class UserDetails extends React.Component {
render() {
@@ -1,10 +1,10 @@
import { withRouter } from '../../utils/withRouter'
import React, { useEffect } from 'react'
import { connect } from 'react-redux'
import { withRouter } from 'react-router-dom'
import Select from '@material-ui/core/Select'
import MenuItem from '@material-ui/core/MenuItem'
import Button from '@material-ui/core/Button'
import Select from '@mui/material/Select'
import MenuItem from '@mui/material/MenuItem'
import Button from '@mui/material/Button'
import * as notificationActions from '../../reducers/actions/notificationActions'
import configurationPageActions from '../../reducers/actions/configurationPageActions'
+2 -1
View File
@@ -1,6 +1,7 @@
import { withRouter } from '../utils/withRouter'
import React from 'react'
import { connect } from 'react-redux'
import { withRouter } from 'react-router-dom'
import Topic from './Topic'
import TopicEditPage from './TopicEditPage'
import viewTopicPageActions from '../reducers/actions/viewTopicPageActions'
@@ -1,14 +1,15 @@
import { withRouter } from '../../utils/withRouter'
import React, { useEffect } from 'react'
import { connect } from 'react-redux'
import { withRouter, Link } from 'react-router-dom'
import { Link } from 'react-router-dom'
import { Table, TableBody, TableCell, TableHead, TableRow } from '@material-ui/core'
import Typography from '@material-ui/core/Typography'
import { createMuiTheme, MuiThemeProvider } from '@material-ui/core/styles'
import { Table, TableBody, TableCell, TableHead, TableRow } from '@mui/material'
import Typography from '@mui/material/Typography'
import { createTheme, ThemeProvider } from '@mui/material/styles'
import * as userListActions from '../../reducers/actions/userListActions'
const customTheme = createMuiTheme({
const customTheme = createTheme({
typography: {
overline: {
color: 'darkOrange',
@@ -24,9 +25,9 @@ const TopicDetailsLink = ({ topicId, ...props }) => <Link {...props} to={`/topic
const AdminMarker = () => {
return (
<MuiThemeProvider theme={customTheme}>
<ThemeProvider theme={customTheme}>
<Typography variant="overline">Currently admin</Typography>
</MuiThemeProvider>
</ThemeProvider>
)
}
@@ -1,5 +1,5 @@
import React from 'react'
import { Checkbox, FormControlLabel, FormGroup } from '@material-ui/core'
import { Checkbox, FormControlLabel, FormGroup } from '@mui/material'
const CheckboxMultiSelect = ({ allItems, selectedItems, setSelectedItems, isHorizontal }) => {
const allSelected = selectedItems.length === allItems.length
@@ -1,9 +1,9 @@
import React from 'react'
import Button from '@material-ui/core/Button'
import Dialog from '@material-ui/core/Dialog'
import DialogActions from '@material-ui/core/DialogActions'
import DialogContent from '@material-ui/core/DialogContent'
import DialogTitle from '@material-ui/core/DialogTitle'
import Button from '@mui/material/Button'
import Dialog from '@mui/material/Dialog'
import DialogActions from '@mui/material/DialogActions'
import DialogContent from '@mui/material/DialogContent'
import DialogTitle from '@mui/material/DialogTitle'
const ConfirmationDialog = (props) => {
const { title, children, open, setOpen, onConfirm } = props
@@ -1,5 +1,5 @@
import React from 'react'
import LinearProgress from '@material-ui/core/LinearProgress'
import LinearProgress from '@mui/material/LinearProgress'
import { classes } from '../util'
import './LoadingCover.css'
@@ -1,5 +1,5 @@
import React from 'react'
import CircularProgress from '@material-ui/core/CircularProgress'
import CircularProgress from '@mui/material/CircularProgress'
import './LoadingSpinner.css'
const LoadingSpinner = () => {
@@ -1,18 +1,19 @@
import { withRouter } from '../../utils/withRouter'
import React, { Fragment, useContext } from 'react'
import { connect } from 'react-redux'
import { withRouter } from 'react-router-dom'
import { updateRole } from '../../services/dev'
import * as userActions from '../../reducers/actions/userActions'
import myGroupActions from '../../reducers/actions/myGroupActions'
import registrationmanagementActions from '../../reducers/actions/registrationManagementActions'
import AppBar from '@material-ui/core/AppBar'
import Toolbar from '@material-ui/core/Toolbar'
import Button from '@material-ui/core/Button'
import Typography from '@material-ui/core/Typography'
import AccountCircle from '@material-ui/icons/AccountCircle'
import GroupIcon from '@material-ui/icons/Group'
import Brightness4RoundedIcon from '@material-ui/icons/Brightness4Rounded'
import Brightness7RoundedIcon from '@material-ui/icons/Brightness7Rounded'
import AppBar from '@mui/material/AppBar'
import Toolbar from '@mui/material/Toolbar'
import Button from '@mui/material/Button'
import Typography from '@mui/material/Typography'
import AccountCircle from '@mui/icons-material/AccountCircle'
import GroupIcon from '@mui/icons-material/Group'
import Brightness4RoundedIcon from '@mui/icons-material/Brightness4Rounded'
import Brightness7RoundedIcon from '@mui/icons-material/Brightness7Rounded'
import NavigationMenu from './NavigationMenu'
import {
regularItems,
@@ -1,12 +1,12 @@
import React from 'react'
import IconButton from '@material-ui/core/IconButton'
import ClickAwayListener from '@material-ui/core/ClickAwayListener'
import Grow from '@material-ui/core/Grow'
import Paper from '@material-ui/core/Paper'
import Popper from '@material-ui/core/Popper'
import MenuItem from '@material-ui/core/MenuItem'
import MenuList from '@material-ui/core/MenuList'
import MenuIcon from '@material-ui/icons/Menu'
import IconButton from '@mui/material/IconButton'
import ClickAwayListener from '@mui/material/ClickAwayListener'
import Grow from '@mui/material/Grow'
import Paper from '@mui/material/Paper'
import Popper from '@mui/material/Popper'
import MenuItem from '@mui/material/MenuItem'
import MenuList from '@mui/material/MenuList'
import MenuIcon from '@mui/icons-material/Menu'
import './NavigationBar.css'
class NavigationMenu extends React.Component {
@@ -1,7 +1,7 @@
import React from 'react'
import { connect } from 'react-redux'
import Snackbar from '@material-ui/core/Snackbar'
import SnackbarContent from '@material-ui/core/SnackbarContent'
import Snackbar from '@mui/material/Snackbar'
import SnackbarContent from '@mui/material/SnackbarContent'
import { clearNotifications } from '../../reducers/actions/notificationActions'
@@ -1,7 +1,7 @@
import React from 'react'
import MenuItem from '@material-ui/core/MenuItem'
import Typography from '@material-ui/core/Typography'
import Select from '@material-ui/core/Select'
import MenuItem from '@mui/material/MenuItem'
import Typography from '@mui/material/Typography'
import Select from '@mui/material/Select'
export const StudentSelectionForm = ({
configurations,
+29 -20
View File
@@ -1,12 +1,13 @@
import React, { useState } from 'react'
import ReactDOM from 'react-dom'
import { createRoot } from 'react-dom/client'
import './index.css'
import { Provider } from 'react-redux'
import App from './App'
import store from './reducers/store'
import { MuiThemeProvider, createTheme } from '@material-ui/core/styles'
import amber from '@material-ui/core/colors/amber'
import CssBaseline from '@material-ui/core/CssBaseline'
import { ThemeProvider, createTheme } from '@mui/material/styles'
import { amber } from '@mui/material/colors'
import { ThemeProvider as LegacyThemeProvider } from '@mui/styles'
import CssBaseline from '@mui/material/CssBaseline'
import { ColorModeContext } from './context/ColorModeContext'
const getInitialMode = () => {
@@ -20,7 +21,7 @@ const Root = () => {
const theme = createTheme({
palette: {
type: isDark ? 'dark' : 'light',
mode: isDark ? 'dark' : 'light',
primary: {
main: '#fdd835',
},
@@ -30,7 +31,6 @@ const Root = () => {
},
},
typography: {
useNextVariants: true,
h1: {
marginTop: '0.67em',
marginBottom: '0.67em',
@@ -63,9 +63,9 @@ const Root = () => {
stroke: isDark ? '#ffffff' : '#4d4d4d',
},
},
overrides: {
components: {
MuiCssBaseline: {
'@global': {
styleOverrides: {
a: {
color: isDark ? '#78c3ff' : '',
},
@@ -75,16 +75,22 @@ const Root = () => {
},
},
MuiTableCell: {
head: {
backgroundColor: isDark ? 'rgba(255,255,255,0.12)' : 'rgba(0,0,0,0.02)',
},
body: {
backgroundColor: isDark ? 'rgba(255,255,255,0.03)' : 'rgba(0,0,0,0.01)',
styleOverrides: {
head: {
backgroundColor: isDark ? 'rgba(255,255,255,0.12)' : 'rgba(0,0,0,0.02)',
},
body: {
backgroundColor: isDark ? 'rgba(255,255,255,0.03)' : 'rgba(0,0,0,0.01)',
},
},
},
MuiTableRow: {
'&:hover': {
backgroundColor: isDark ? 'rgba(255,255,255,0.08)' : 'rgba(0,0,0,0.04)',
styleOverrides: {
root: {
'&:hover': {
backgroundColor: isDark ? 'rgba(255,255,255,0.08)' : 'rgba(0,0,0,0.04)',
},
},
},
},
},
@@ -93,16 +99,19 @@ const Root = () => {
return (
<Provider store={store}>
<ColorModeContext.Provider value={{ mode: themeMode, setMode: setThemeMode }}>
<MuiThemeProvider theme={theme}>
<CssBaseline />
<App />
</MuiThemeProvider>
<ThemeProvider theme={theme}>
<LegacyThemeProvider theme={theme}>
<CssBaseline />
<App />
</LegacyThemeProvider>
</ThemeProvider>
</ColorModeContext.Provider>
</Provider>
)
}
ReactDOM.render(<Root />, document.getElementById('root'))
const root = createRoot(document.getElementById('root'))
root.render(<Root />)
if (window.Cypress) {
window.store = store
+16 -31
View File
@@ -1,5 +1,5 @@
import React from 'react'
import { Route, Link } from 'react-router-dom'
import { Link } from 'react-router-dom'
import { connect } from 'react-redux'
const mapStateToProps = (state) => {
@@ -17,35 +17,20 @@ const Unauthorized = () => (
</div>
)
export const AdminRoute = connect(mapStateToProps)(({ render: Component, user, ...rest }) => (
<Route
{...rest}
render={(props) => {
if (user) {
return user.user.admin ? <Component {...props} /> : <Unauthorized />
}
return null
}}
/>
))
export const AdminRoute = connect(mapStateToProps)(({ render: Component, user }) => {
if (user) {
return user.user.admin ? <Component /> : <Unauthorized />
}
return null
})
export const InstructorRoute = connect(mapStateToProps)(({ render: Component, user, ...rest }) => (
<Route
{...rest}
render={(props) => {
if (user) {
return user.user.instructor || user.user.admin ? <Component {...props} /> : <Unauthorized />
}
return null
}}
/>
))
export const InstructorRoute = connect(mapStateToProps)(({ render: Component, user }) => {
if (user) {
return user.user.instructor || user.user.admin ? <Component /> : <Unauthorized />
}
return null
})
export const LoginRoute = connect(mapStateToProps)(({ render: Component, user, ...rest }) => (
<Route
{...rest}
render={(props) => {
return user ? <Component {...props} /> : null
}}
/>
))
export const LoginRoute = connect(mapStateToProps)(({ render: Component, user }) => {
return user ? <Component /> : null
})
+23
View File
@@ -0,0 +1,23 @@
import { useLocation, useNavigate, useParams } from 'react-router-dom'
export function withRouter(Component) {
function ComponentWithRouterProp(props) {
let location = useLocation()
let navigate = useNavigate()
let params = useParams()
return (
<Component
{...props}
location={location}
history={{
push: navigate,
replace: (path) => navigate(path, { replace: true }),
location: location,
}}
match={{ params }}
/>
)
}
return ComponentWithRouterProp
}