Skip to content

Commit

Permalink
Merge pull request #306 from SELab-2/deadlines_color
Browse files Browse the repository at this point in the history
kleuren deadlines aangepast in subjectspage
  • Loading branch information
Bendemeurichy authored May 22, 2024
2 parents 87884d7 + 5da636a commit 10e022e
Show file tree
Hide file tree
Showing 4 changed files with 106 additions and 40 deletions.
16 changes: 6 additions & 10 deletions frontend/frontend/src/pages/assignmentPage/AssignmentPage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -450,7 +450,7 @@ export function AssignmentPage() {
)
) &&
!assignment.extra_deadline
? 'red'
? 'error.main'
: 'text.primary'
}
>
Expand Down Expand Up @@ -531,7 +531,7 @@ export function AssignmentPage() {
assignment.extra_deadline
)
)
? 'red'
? 'error.main'
: 'text.primary'
}
>
Expand Down Expand Up @@ -578,7 +578,7 @@ export function AssignmentPage() {
It shows metadata about the submissions and allows the teacher to download them.
The metadata includes group number, submission time, score, and status.
*/}
<Card sx={{ width: '97%' }}>
<Card sx={{ width: '95%' }}>
<Box
aria-label={'courseHeader'}
sx={{
Expand Down Expand Up @@ -821,7 +821,7 @@ export function AssignmentPage() {
)
) &&
!assignment.extra_deadline
? 'red'
? 'error.main'
: 'text.primary'
}
>
Expand Down Expand Up @@ -945,7 +945,7 @@ export function AssignmentPage() {
assignment.extra_deadline
)
)
? 'red'
? 'error.main'
: 'text.primary'
}
>
Expand Down Expand Up @@ -1256,11 +1256,7 @@ export function AssignmentPage() {
onFileChange={
handleFileChange
}
fileTypes={[
'.zip',
'.pdf',
'.txt',
]}
fileTypes={['*']}
tooltip={t('uploadToolTip')}
/>
</Grid>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import {
ListItemButton,
ListItemText,
Tooltip,
Typography,
} from '@mui/material'
import { useNavigate } from 'react-router-dom'
import { t } from 'i18next'
Expand All @@ -15,12 +16,14 @@ import React, { useState } from 'react'
import dayjs, { Dayjs } from 'dayjs'
import { Score } from '../../components/SubmissionListItemTeacherPage.tsx'
import { EvenlySpacedRow } from '../../components/CustomComponents.tsx'
import { Submission } from '../submissionPage/SubmissionPage.tsx'

/**
* This component is used to display a single assignment in the list of assignments.
* @param projectName: string - the name of the project
* @param dueDate: Date - the due date of the project
* @param submissions: number - number of submissions for the project
* @param lastSubmission: Submission - last submission for the project
* @param score: number - assigned score on the project
* @param isStudent: boolean - wether the user is a student or a teacher
* @param archived: boolean - wether the assignment is archived
Expand All @@ -34,6 +37,7 @@ interface AssignmentListItemSubjectsPageProps {
projectName: string
dueDate: Dayjs | undefined
submissions: number
lastSubmission?: Submission
score: Score | undefined
maxScore: number
isStudent: boolean
Expand All @@ -50,6 +54,7 @@ export function AssignmentListItemSubjectsPage({
projectName,
dueDate,
submissions,
lastSubmission,
score,
maxScore,
isStudent,
Expand Down Expand Up @@ -87,15 +92,33 @@ export function AssignmentListItemSubjectsPage({
<EvenlySpacedRow
items={[
<ListItemText primary={projectName} />,
<ListItemText
primary={
dueDate
<ListItemText>
<Typography
color={
dueDate
? dayjs(dueDate).isBefore(
dayjs()
)
? lastSubmission
? dayjs(
lastSubmission.tijdstip
).isBefore(
dayjs(dueDate)
)
? 'success.main'
: 'error.main'
: 'error.main'
: 'text.primary'
: 'text.primary'
}
>
{dueDate
? dayjs(dueDate).format(
'DD/MM/YYYY HH:mm'
)
: t('no_deadline')
}
/>,
: t('no_deadline')}
</Typography>
</ListItemText>,
<ListItemText
primary={
submissions > 0
Expand Down Expand Up @@ -132,15 +155,25 @@ export function AssignmentListItemSubjectsPage({
<EvenlySpacedRow
items={[
<ListItemText primary={projectName} />,
<ListItemText
primary={
dueDate
<ListItemText>
<Typography
color={
dueDate
? dayjs(dueDate).isBefore(
dayjs()
)
? 'error'
: 'text.primary'
: 'text.primary'
}
>
{dueDate
? dayjs(dueDate).format(
'DD/MM/YYYY HH:mm'
)
: t('no_deadline')
}
/>,
: t('no_deadline')}
</Typography>
</ListItemText>,
<ButtonActions
archived={archived}
startVisible={visible}
Expand Down
52 changes: 40 additions & 12 deletions frontend/frontend/src/pages/subjectsPage/ProjectsView.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -51,6 +51,7 @@ export function ProjectsView({
courseId,
}: ProjectsViewProps) {
const [projects, setProjects] = useState<ProjectStudent[]>([])
const [lastSubmission, setLastSubmission] = useState<Submission>()

// state to keep track of the loading state
const [loading, setLoading] = useState(true)
Expand Down Expand Up @@ -90,10 +91,11 @@ export function ProjectsView({
const submissionsResponse = await instance.get(
`/indieningen/?groep=${projectstudent.group.groep_id?.toString()}&project=${projectstudent.assignment.project_id.toString()}`
)
const lastSubmission =
submissionsResponse.data[
submissionsResponse.data.length - 1
]
const lastSubmission = submissionsResponse.data.sort(
(a: Submission, b: Submission) =>
dayjs(a.tijdstip).isAfter(dayjs(b.tijdstip)) ? 1 : -1
)[0]
setLastSubmission(lastSubmission)
return {
...projectstudent,
lastSubmission: lastSubmission,
Expand Down Expand Up @@ -142,7 +144,30 @@ export function ProjectsView({
)
const scoreArray = await Promise.all(scorePromises)

setProjects(scoreArray)
scoreArray.sort((a, b) => {
return dayjs(a.assignment.deadline).isAfter(
dayjs(b.assignment.deadline)
)
? 1
: -1
})

const pastAndTodayDeadlines: ProjectStudent[] = []
const futureDeadlines: ProjectStudent[] = []
const today = dayjs()
// Separate the items based on their deadline
scoreArray.forEach((item) => {
if (
dayjs(item.assignment.deadline).isBefore() ||
dayjs(item.assignment.deadline).isSame(today)
) {
pastAndTodayDeadlines.push(item)
} else {
futureDeadlines.push(item)
}
})

setProjects(futureDeadlines.concat(pastAndTodayDeadlines))
} catch (e) {
console.error('Error fetching all data:', e)
} finally {
Expand All @@ -154,7 +179,7 @@ export function ProjectsView({

return (
<>
<Card>
<Card sx={{ width: '95%' }}>
<Box
aria-label={'courseHeader'}
sx={{
Expand Down Expand Up @@ -264,6 +289,9 @@ export function ProjectsView({
<>
<Divider />
<AssignmentListItemSubjectsPage
lastSubmission={
lastSubmission
}
key={
project.assignment
.project_id
Expand All @@ -272,10 +300,12 @@ export function ProjectsView({
project.assignment.titel
}
dueDate={
project.assignment.deadline
project.assignment
.deadline
? dayjs(
project.assignment
.deadline
project
.assignment
.deadline
)
: undefined
}
Expand All @@ -284,9 +314,7 @@ export function ProjectsView({
? project.submissions
: 0
}
score={
project.score
}
score={project.score}
maxScore={Number(
project.assignment
.max_score
Expand Down
21 changes: 15 additions & 6 deletions frontend/frontend/src/pages/subjectsPage/SubjectsPage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -329,21 +329,30 @@ export function SubjectsPage() {
alignItems="center"
sx={{ width: '100%', height: '30%' }}
>
<Box sx={{ paddingLeft: '20px', display: 'flex', alignItems: 'center', gap: 2 }}>
<Box
sx={{
paddingLeft: '20px',
display: 'flex',
alignItems: 'center',
gap: 2,
}}
>
<StudentPopUp
students={studentsLoading ? [] : students}
students={
studentsLoading ? [] : students
}
text="students"
noGroup={false}
/>
<CopyToClipboard
invitationLink={`${window.location.href}/accept_invitation`}
/>
</Box>
<Box>
</Box>
<Tooltip
<Box></Box>
<Tooltip
title={t('add_project')}
placement={'top'}>
placement={'top'}
>
<IconButton
onClick={addProject}
color="primary"
Expand Down

0 comments on commit 10e022e

Please sign in to comment.