From 0e9640fcdd4be011674dc23588e35868b4115e71 Mon Sep 17 00:00:00 2001 From: gilles-arnout Date: Thu, 9 May 2024 12:32:47 +0200 Subject: [PATCH 01/10] init commit --- frontend/app/[locale]/layout.tsx | 9 ++------- 1 file changed, 2 insertions(+), 7 deletions(-) diff --git a/frontend/app/[locale]/layout.tsx b/frontend/app/[locale]/layout.tsx index b4e84055..d1b42a85 100644 --- a/frontend/app/[locale]/layout.tsx +++ b/frontend/app/[locale]/layout.tsx @@ -1,23 +1,18 @@ import {AppRouterCacheProvider} from '@mui/material-nextjs/v13-appRouter'; import {ThemeProvider} from '@mui/material/styles'; -import loginTheme from '../../styles/theme'; +import baseTheme from '@styles/theme'; import React from "react"; import '../i18n' import Footer from "@app/[locale]/components/Footer"; -export const metadata = { - title: 'Pigeonhole', - description: 'Groep 1' -} - export default function RootLayout(props: React.PropsWithChildren<{}>) { const {children} = props; return ( - +
{children}
From b8267e94716267cc1abc1db38b01bd75c07bc4e5 Mon Sep 17 00:00:00 2001 From: gilles-arnout Date: Thu, 9 May 2024 14:12:16 +0200 Subject: [PATCH 02/10] fix to layout submit page --- frontend/app/[locale]/components/SubmitDetailsPage.tsx | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/frontend/app/[locale]/components/SubmitDetailsPage.tsx b/frontend/app/[locale]/components/SubmitDetailsPage.tsx index 1bb1a4d1..875b2c0d 100644 --- a/frontend/app/[locale]/components/SubmitDetailsPage.tsx +++ b/frontend/app/[locale]/components/SubmitDetailsPage.tsx @@ -78,12 +78,11 @@ const SubmitDetailsPage: React.FC = ({locale, project_id return ( - - + + - + Date: Thu, 9 May 2024 14:15:18 +0200 Subject: [PATCH 03/10] fix to layout submission page --- .../components/SubmissionDetailsPage.tsx | 17 +++-------------- 1 file changed, 3 insertions(+), 14 deletions(-) diff --git a/frontend/app/[locale]/components/SubmissionDetailsPage.tsx b/frontend/app/[locale]/components/SubmissionDetailsPage.tsx index 1a22b136..ca816e96 100644 --- a/frontend/app/[locale]/components/SubmissionDetailsPage.tsx +++ b/frontend/app/[locale]/components/SubmissionDetailsPage.tsx @@ -48,11 +48,6 @@ const ProjectDetailsPage: React.FC = ({ locale, submiss return ; } - const formatTimestamp = (timestamp) => { - const date = new Date(timestamp); - return `${date.getDate()}/${date.getMonth() + 1} ${date.getHours()}:${date.getMinutes()}`; - }; - function formatDate(isoString: string): string { const options: Intl.DateTimeFormatOptions = { year: 'numeric', @@ -66,19 +61,13 @@ const ProjectDetailsPage: React.FC = ({ locale, submiss return date.toLocaleString(locale, options); } - function checkDeadline(deadline) { - const now = new Date(); - const deadlineDate = new Date(deadline); - return now < deadlineDate ? 'success' : 'failure'; - } - return ( - - + + - + From 8da54330760f966b378561168673130d624bd9f6 Mon Sep 17 00:00:00 2001 From: gilles-arnout Date: Thu, 9 May 2024 14:18:09 +0200 Subject: [PATCH 04/10] margin fixes --- frontend/app/[locale]/components/SubmissionDetailsPage.tsx | 2 +- frontend/app/[locale]/components/SubmitDetailsPage.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/frontend/app/[locale]/components/SubmissionDetailsPage.tsx b/frontend/app/[locale]/components/SubmissionDetailsPage.tsx index ca816e96..35d535b6 100644 --- a/frontend/app/[locale]/components/SubmissionDetailsPage.tsx +++ b/frontend/app/[locale]/components/SubmissionDetailsPage.tsx @@ -64,7 +64,7 @@ const ProjectDetailsPage: React.FC = ({ locale, submiss return ( - + diff --git a/frontend/app/[locale]/components/SubmitDetailsPage.tsx b/frontend/app/[locale]/components/SubmitDetailsPage.tsx index 875b2c0d..ceb430c5 100644 --- a/frontend/app/[locale]/components/SubmitDetailsPage.tsx +++ b/frontend/app/[locale]/components/SubmitDetailsPage.tsx @@ -79,7 +79,7 @@ const SubmitDetailsPage: React.FC = ({locale, project_id return ( - + From 741f705ed819b2d0b02eb92a252b246d5254e93b Mon Sep 17 00:00:00 2001 From: gilles-arnout Date: Thu, 9 May 2024 14:43:00 +0200 Subject: [PATCH 05/10] add text to listviews --- .../components/GroupSubmissionList.tsx | 6 ++++-- .../components/ProjectDetailsPage.tsx | 8 +++++--- .../components/ProjectSubmissionsList.tsx | 6 ++++-- .../project/[project_id]/groups/page.tsx | 19 +++++++++++++------ frontend/locales/en/common.json | 4 +++- frontend/locales/nl/common.json | 4 +++- 6 files changed, 32 insertions(+), 15 deletions(-) diff --git a/frontend/app/[locale]/components/GroupSubmissionList.tsx b/frontend/app/[locale]/components/GroupSubmissionList.tsx index edfb0749..18467f51 100644 --- a/frontend/app/[locale]/components/GroupSubmissionList.tsx +++ b/frontend/app/[locale]/components/GroupSubmissionList.tsx @@ -3,9 +3,10 @@ import ListView from "@app/[locale]/components/ListView"; import React from "react"; -const GroupSubmissionList = ({project_id, page_size = 5}: { +const GroupSubmissionList = ({project_id, page_size = 5, search}: { project_id: number, - page_size: number + page_size: number, + search: string }) => { const headers = ["Group number", "Submission date", "Status", "View"] const headers_backend = ["group_nr", "submission_date", "status", "View"] @@ -21,6 +22,7 @@ const GroupSubmissionList = ({project_id, page_size = 5}: { action_name={'download_submission'} page_size={page_size} headers_backend={headers_backend} + search_text={search} /> ) diff --git a/frontend/app/[locale]/components/ProjectDetailsPage.tsx b/frontend/app/[locale]/components/ProjectDetailsPage.tsx index 4fc837a2..560fb87d 100644 --- a/frontend/app/[locale]/components/ProjectDetailsPage.tsx +++ b/frontend/app/[locale]/components/ProjectDetailsPage.tsx @@ -115,7 +115,7 @@ const ProjectDetailsPage: React.FC = ({locale, project_ diff --git a/frontend/locales/en/common.json b/frontend/locales/en/common.json index 8e425403..0c940c21 100644 --- a/frontend/locales/en/common.json +++ b/frontend/locales/en/common.json @@ -112,5 +112,7 @@ "no_required_files": "No required files", "add": "Add", "conditions_example": "E.g.: The program must to compile.", - "no_conditions": "No conditions" + "no_conditions": "No conditions", + "group_search": "Search group", + "submission_search": "Search submission" } \ No newline at end of file diff --git a/frontend/locales/nl/common.json b/frontend/locales/nl/common.json index 8240bffb..4106dbaf 100644 --- a/frontend/locales/nl/common.json +++ b/frontend/locales/nl/common.json @@ -112,5 +112,7 @@ "no_required_files": "Geen verplichte bestanden", "add": "Toevoegen", "conditions_example": "Bv.: Het programma moet compileren", - "no_conditions": "Geen voorwaarden" + "no_conditions": "Geen voorwaarden", + "group_search": "Zoek groep", + "submission_search": "Zoek indiening" } \ No newline at end of file From 6299beab06fff369ed09a8f54d441af487995dd8 Mon Sep 17 00:00:00 2001 From: gilles-arnout Date: Thu, 9 May 2024 15:03:28 +0200 Subject: [PATCH 06/10] all course page styling --- .../project_components/finishbuttons.tsx | 6 +- .../project_components/uploadButton.tsx | 4 +- frontend/app/[locale]/course/all/page.tsx | 18 ++- .../[project_id]/edit/projectEditForm.tsx | 150 +++++++++--------- frontend/locales/en/common.json | 3 +- frontend/locales/nl/common.json | 3 +- 6 files changed, 94 insertions(+), 90 deletions(-) diff --git a/frontend/app/[locale]/components/project_components/finishbuttons.tsx b/frontend/app/[locale]/components/project_components/finishbuttons.tsx index e68fa1a8..ac9589ad 100644 --- a/frontend/app/[locale]/components/project_components/finishbuttons.tsx +++ b/frontend/app/[locale]/components/project_components/finishbuttons.tsx @@ -11,7 +11,7 @@ interface FinishButtonsProps { setVisible: (value: (((prevState: boolean) => boolean) | boolean)) => void, handleSave: () => Promise, setConfirmRemove: (value: (((prevState: boolean) => boolean) | boolean)) => void, - course_id: number, + project_id: number, setHasDeadline: (value: (((prevState: boolean) => boolean) | boolean)) => void, hasDeadline: boolean, createProject: boolean, @@ -20,7 +20,7 @@ interface FinishButtonsProps { function FinishButtons( { visible, setVisible, handleSave, setConfirmRemove, - course_id, setHasDeadline, hasDeadline, createProject + project_id, setHasDeadline, hasDeadline, createProject }: FinishButtonsProps ) { const {t} = useTranslation(); @@ -78,7 +78,7 @@ function FinishButtons( diff --git a/frontend/app/[locale]/project/[project_id]/edit/projectEditForm.tsx b/frontend/app/[locale]/project/[project_id]/edit/projectEditForm.tsx index 79e0f9ca..e390fc91 100644 --- a/frontend/app/[locale]/project/[project_id]/edit/projectEditForm.tsx +++ b/frontend/app/[locale]/project/[project_id]/edit/projectEditForm.tsx @@ -15,14 +15,12 @@ import FinishButtons from "@app/[locale]/components/project_components/finishbut import Deadline from "@app/[locale]/components/project_components/deadline"; import RemoveDialog from "@app/[locale]/components/project_components/removedialog"; -const i18nNamespaces = ['common'] - interface ProjectEditFormProps { - project_id: number|null; + project_id: number | null; add_course_id: number; } -function ProjectEditForm({project_id, add_course_id}: ProjectEditFormProps){ +function ProjectEditForm({project_id, add_course_id}: ProjectEditFormProps) { const [files, setFiles] = useState([]); const [title, setTitle] = useState(''); const [description, setDescription] = useState(''); @@ -55,7 +53,7 @@ function ProjectEditForm({project_id, add_course_id}: ProjectEditFormProps){ useEffect(() => { const fetchProject = async () => { try { - if (project_id !== null){ + if (project_id !== null) { const project: Project = await getProject(project_id); if (project.deadline !== null) setDeadline(dayjs(project["deadline"])); setDescription(project.description) @@ -74,7 +72,7 @@ function ProjectEditForm({project_id, add_course_id}: ProjectEditFormProps){ if (project.test_files !== null) await setTestFiles(project); setScore(+project["max_score"]); if (project["conditions"] != null) { - let conditions_parsed:string[] = []; + let conditions_parsed: string[] = []; if (project["conditions"] !== "") { conditions_parsed = project["conditions"].split(",").map((item: string) => item.trim().replace(/"/g, '')); } @@ -174,84 +172,80 @@ function ProjectEditForm({project_id, add_course_id}: ProjectEditFormProps){ } const handle_remove = async () => { - if (project_id !== null){ + if (project_id !== null) { await deleteProject(project_id).then((response) => console.log(response)); } window.location.href = "/course/" + course_id + "/" } return ( - (loadingTranslations && loadingProject && loadingUser && course_id !==null) ? ( -
Loading...
- ) : ( - (!isStudent) ? ( -
- - - - <Assignment - isAssignmentEmpty={isAssignmentEmpty} - setDescription={setDescription} - description={description} /> - <RequiredFiles - files={files} - setFiles={setFiles}/> - <Conditions - conditions={conditions} - setConditions={setConditions}/> - <Groups - groupAmount={groupAmount} - isGroupAmountEmpty={isGroupAmountEmpty} - groupSize={groupSize} - isGroupSizeEmpty={isGroupSizeEmpty} - setGroupAmount={setGroupAmount} - setGroupSize={setGroupSize}/> - <TestFiles - testfilesName={testfilesName} - setTestfilesName={setTestfilesName} - testfilesData={testfilesData} - setTestfilesData={setTestfilesData}/> - <UploadTestFile - testfilesName={testfilesName} - setTestfilesName={setTestfilesName} - testfilesData={testfilesData} - setTestfilesData={setTestfilesData}/> - </Box> - <Box className={"pageBoxRight"}> - <FinishButtons - visible={visible} - setVisible={setVisible} - handleSave={handleSave} - setConfirmRemove={setConfirmRemove} - course_id={course_id} - setHasDeadline={setHasDeadline} - hasDeadline={hasDeadline} - createProject={(project_id===null)}/> - <Deadline - deadline={deadline} - setDeadline={setDeadline} - hasDeadline={hasDeadline}/> - </Box> - </Box> - <RemoveDialog - confirmRemove={confirmRemove} - handle_remove={handle_remove} - setConfirmRemove={setConfirmRemove}/> - </div> - ) : ( - <div>Students cannot edit project</div> - ) - ) + (!isStudent) ? ( + <div> + <Box + display="grid" + gridTemplateColumns="65% 35%" + height="fit-content" + > + <Box className={"pageBoxLeft"} height={'fit-content'}> + <Title + isTitleEmpty={isTitleEmpty} + isScoreEmpty={isTitleEmpty} + setTitle={setTitle} + title={title} + score={score} + setScore={setScore}/> + <Assignment + isAssignmentEmpty={isAssignmentEmpty} + setDescription={setDescription} + description={description}/> + <RequiredFiles + files={files} + setFiles={setFiles}/> + <Conditions + conditions={conditions} + setConditions={setConditions}/> + <Groups + groupAmount={groupAmount} + isGroupAmountEmpty={isGroupAmountEmpty} + groupSize={groupSize} + isGroupSizeEmpty={isGroupSizeEmpty} + setGroupAmount={setGroupAmount} + setGroupSize={setGroupSize}/> + <TestFiles + testfilesName={testfilesName} + setTestfilesName={setTestfilesName} + testfilesData={testfilesData} + setTestfilesData={setTestfilesData}/> + <UploadTestFile + testfilesName={testfilesName} + setTestfilesName={setTestfilesName} + testfilesData={testfilesData} + setTestfilesData={setTestfilesData}/> + </Box> + <Box className={"pageBoxRight"}> + <FinishButtons + visible={visible} + setVisible={setVisible} + handleSave={handleSave} + setConfirmRemove={setConfirmRemove} + project_id={project_id} + setHasDeadline={setHasDeadline} + hasDeadline={hasDeadline} + createProject={(project_id === null)}/> + <Deadline + deadline={deadline} + setDeadline={setDeadline} + hasDeadline={hasDeadline}/> + </Box> + </Box> + <RemoveDialog + confirmRemove={confirmRemove} + handle_remove={handle_remove} + setConfirmRemove={setConfirmRemove}/> + </div> + ) : ( + <div>Students cannot edit project</div> + ) ) } diff --git a/frontend/locales/en/common.json b/frontend/locales/en/common.json index 0c940c21..a028f255 100644 --- a/frontend/locales/en/common.json +++ b/frontend/locales/en/common.json @@ -114,5 +114,6 @@ "conditions_example": "E.g.: The program must to compile.", "no_conditions": "No conditions", "group_search": "Search group", - "submission_search": "Search submission" + "submission_search": "Search submission", + "search_course": "Search course" } \ No newline at end of file diff --git a/frontend/locales/nl/common.json b/frontend/locales/nl/common.json index 4106dbaf..0e37e8e6 100644 --- a/frontend/locales/nl/common.json +++ b/frontend/locales/nl/common.json @@ -114,5 +114,6 @@ "conditions_example": "Bv.: Het programma moet compileren", "no_conditions": "Geen voorwaarden", "group_search": "Zoek groep", - "submission_search": "Zoek indiening" + "submission_search": "Zoek indiening", + "search_course": "Zoek cursus" } \ No newline at end of file From f80e597f01c0e4860ebe843aaba9baaeb2b8e822 Mon Sep 17 00:00:00 2001 From: gilles-arnout <gilles.arnout@gmail.com> Date: Thu, 9 May 2024 15:07:17 +0200 Subject: [PATCH 07/10] adding linearProgress to edit project --- .../[locale]/project/[project_id]/edit/projectEditForm.tsx | 5 +++++ frontend/app/[locale]/project/[project_id]/groups/page.tsx | 1 - 2 files changed, 5 insertions(+), 1 deletion(-) diff --git a/frontend/app/[locale]/project/[project_id]/edit/projectEditForm.tsx b/frontend/app/[locale]/project/[project_id]/edit/projectEditForm.tsx index e390fc91..84dd59e3 100644 --- a/frontend/app/[locale]/project/[project_id]/edit/projectEditForm.tsx +++ b/frontend/app/[locale]/project/[project_id]/edit/projectEditForm.tsx @@ -14,6 +14,7 @@ import UploadTestFile from "@app/[locale]/components/project_components/uploadBu import FinishButtons from "@app/[locale]/components/project_components/finishbuttons"; import Deadline from "@app/[locale]/components/project_components/deadline"; import RemoveDialog from "@app/[locale]/components/project_components/removedialog"; +import {LinearProgress} from "@mui/material"; interface ProjectEditFormProps { project_id: number | null; @@ -178,6 +179,10 @@ function ProjectEditForm({project_id, add_course_id}: ProjectEditFormProps) { window.location.href = "/course/" + course_id + "/" } + if(loadingProject || loadingUser){ + return <LinearProgress/>; + } + return ( (!isStudent) ? ( <div> diff --git a/frontend/app/[locale]/project/[project_id]/groups/page.tsx b/frontend/app/[locale]/project/[project_id]/groups/page.tsx index ab51385d..82a7088b 100644 --- a/frontend/app/[locale]/project/[project_id]/groups/page.tsx +++ b/frontend/app/[locale]/project/[project_id]/groups/page.tsx @@ -2,7 +2,6 @@ import initTranslations from "@app/i18n"; import TranslationsProvider from "@app/[locale]/components/TranslationsProvider"; import NavBar from "@app/[locale]/components/NavBar"; import ListView from '@app/[locale]/components/ListView'; -import BackButton from "@app/[locale]/components/BackButton"; import ArrowBackIcon from "@mui/icons-material/ArrowBack"; import Button from "@mui/material/Button"; import React from "react"; From 86004b3e2bb1d9719622c69c5d794f4b06fe13cd Mon Sep 17 00:00:00 2001 From: gilles-arnout <gilles.arnout@gmail.com> Date: Thu, 9 May 2024 15:23:13 +0200 Subject: [PATCH 08/10] fixing infinite loading error in project add page --- .../[locale]/project/[project_id]/edit/projectEditForm.tsx | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/frontend/app/[locale]/project/[project_id]/edit/projectEditForm.tsx b/frontend/app/[locale]/project/[project_id]/edit/projectEditForm.tsx index 84dd59e3..2dd1e9f9 100644 --- a/frontend/app/[locale]/project/[project_id]/edit/projectEditForm.tsx +++ b/frontend/app/[locale]/project/[project_id]/edit/projectEditForm.tsx @@ -48,8 +48,6 @@ function ProjectEditForm({project_id, add_course_id}: ProjectEditFormProps) { const isGroupAmountEmpty = !groupAmount const isGroupSizeEmpty = !groupSize - console.log(add_course_id); - useEffect(() => { const fetchProject = async () => { @@ -179,7 +177,7 @@ function ProjectEditForm({project_id, add_course_id}: ProjectEditFormProps) { window.location.href = "/course/" + course_id + "/" } - if(loadingProject || loadingUser){ + if(loadingProject){ return <LinearProgress/>; } From 60e5f9050b13542cd930d2fe2d0ca5517242ad62 Mon Sep 17 00:00:00 2001 From: gilles-arnout <gilles.arnout@gmail.com> Date: Mon, 13 May 2024 11:25:10 +0200 Subject: [PATCH 09/10] temp push --- Makefile | 3 +- .../[locale]/components/EditCourseForm.tsx | 320 +++++++++--------- .../app/[locale]/course/[course_id]/page.tsx | 98 +++--- .../course/[course_id]/students/page.tsx | 20 +- .../course/[course_id]/teachers/page.tsx | 46 +-- frontend/app/[locale]/course/all/page.tsx | 2 +- .../project/[project_id]/groups/page.tsx | 2 +- frontend/locales/en/common.json | 4 +- frontend/locales/nl/common.json | 4 +- 9 files changed, 269 insertions(+), 230 deletions(-) diff --git a/Makefile b/Makefile index 3c028b35..c7046a1f 100644 --- a/Makefile +++ b/Makefile @@ -9,7 +9,8 @@ lint: docker exec pigeonhole-frontend npm run lint superuser: - docker exec -it pigeonhole-backend python manage.py createsuperuser + + mockdata: docker exec -it pigeonhole-backend python manage.py runscript mockdata diff --git a/frontend/app/[locale]/components/EditCourseForm.tsx b/frontend/app/[locale]/components/EditCourseForm.tsx index 3bdd310f..18883fe3 100644 --- a/frontend/app/[locale]/components/EditCourseForm.tsx +++ b/frontend/app/[locale]/components/EditCourseForm.tsx @@ -3,10 +3,10 @@ import React, {useEffect, useState} from "react"; import {useTranslation} from "react-i18next"; import {getCourse, getImage, postData, updateCourse} from "@lib/api"; import Typography from "@mui/material/Typography"; -import {Box, Button, Input, MenuItem, Select, TextField } from "@mui/material"; +import {Box, Button, Input, LinearProgress, MenuItem, Select, TextField} from "@mui/material"; import {LocalizationProvider} from "@mui/x-date-pickers/LocalizationProvider"; import {AdapterDayjs} from "@mui/x-date-pickers/AdapterDayjs"; -import { DatePicker } from '@mui/x-date-pickers/DatePicker'; +import {DatePicker} from '@mui/x-date-pickers/DatePicker'; import {visuallyHidden} from '@mui/utils'; import UploadFileIcon from '@mui/icons-material/UploadFile'; import dayjs from "dayjs"; @@ -85,178 +85,180 @@ const EditCourseForm = ({courseId}: EditCourseFormProps) => { setSelectedImageURL(imageURL); }; + if (loading) { + return <LinearProgress/>; + } + return ( - loading ? (<div>Loading...</div>) : ( + <Box + component={"form"} + onSubmit={handleSubmit} + sx={{ + display: 'flex', + flexDirection: 'column', + justifyContent: 'space-evenly', + flexWrap: 'no-wrap', + height: 'fit-content', + width: '100%', + }} + > <Box - component={"form"} - onSubmit={handleSubmit} - sx={{ - display: 'flex', - flexDirection: 'column', - justifyContent: 'space-evenly', - flexWrap: 'no-wrap', - height: 'fit-content', - width: '100%', - }} + height={'fit-content'} > - <Box - height={'fit-content'} + <Typography + variant="h3" > - <Typography - variant="h3" - > - {t("course name")} - </Typography> - <TextField - type="text" - id="name" - name="name" - defaultValue={name} - onChange={(event: any) => setName(event.target.value)} - required - style={{ - fontSize: '20px', - fontFamily: 'Quicksand, sans-serif', - borderRadius: '6px', - height: '30px', - width: '400px', - marginBottom: '32px' + {t("course name")} + </Typography> + <TextField + type="text" + id="name" + name="name" + defaultValue={name} + onChange={(event: any) => setName(event.target.value)} + required + style={{ + fontSize: '20px', + fontFamily: 'Quicksand, sans-serif', + borderRadius: '6px', + height: '30px', + width: '400px', + marginBottom: '32px' }}/> - </Box> - <Box - height={'fit-content'} - > - <Typography variant={"h3"}> - {t("year")} - </Typography> - <LocalizationProvider dateAdapter={AdapterDayjs}> - <DatePicker - views={['year']} - value={year !== 0 ? dayjs().year(year) : null} - onChange={(date: any) => setYear(date.year())} - sx={{ - width: 'fit-content', - height: 'fit-content', - }} - /> - </LocalizationProvider> - </Box> - <Box sx={{marginTop: '32px', height: 'fit-content'}}> - <Typography - variant="h3" - > - {t("banner")} - </Typography> - <Box - borderRadius={'16px'} - sx={{position: 'relative', width: '100%', height: 'fit-content', borderRadius: '16px',}} - > - <Box - component={'img'} - alt={t('select image')} - src={selectedImageURL} - sx={{ - borderRadius: '16px', - height: 'fit-content', - maxHeight: '200px', - width: '100%' - }} - /> - </Box> - </Box> - <Box> - <Button variant={"contained"} color={"secondary"} size={'small'} - startIcon={<UploadFileIcon sx={{color: 'secondary.contrastText'}}/>} - component="label" - role={undefined} - tabIndex={-1} - sx={{ - padding: 1, - width: 'fit-content', - color: 'secondary.contrastText', - marginTop: '16px' - }} - > - {t("select image")} - <Input type="file" - id="Image" - name="Image" - onChange={handleImageUpload} - style={visuallyHidden} - /> - </Button> - </Box> - <Box sx={{marginTop: '16px'}}> - <Typography - variant="h3" - > - {t("description")} - </Typography> - <TextField id="description" name="description" defaultValue={description} - label="Description" - multiline - rows={4} - onChange={(event: any) => setDescription(event.target.value)} required - style={{ - width: '100%', - fontFamily: 'Quicksand', - color: 'black', - borderRadius: '6px', - padding: '10px', - boxSizing: 'border-box' - }}/> - </Box> - <Box sx={{marginTop: '16px'}}> - <Typography - variant="h3" - > - {t("access")} - </Typography> - <Select - id="choice" - name="choice" - label={t("access")} - value={open} - onChange={(event: any) => setOpen(event.target.value)} + </Box> + <Box + height={'fit-content'} + > + <Typography variant={"h3"}> + {t("year")} + </Typography> + <LocalizationProvider dateAdapter={AdapterDayjs}> + <DatePicker + views={['year']} + value={year !== 0 ? dayjs().year(year) : null} + onChange={(date: any) => setYear(date.year())} sx={{ - fontSize: '20px', + width: 'fit-content', height: 'fit-content', }} - > - <MenuItem value="false">{t("private")}</MenuItem> - <MenuItem value="true">{t("public")}</MenuItem> - </Select> - </Box> + /> + </LocalizationProvider> + </Box> + <Box sx={{marginTop: '32px', height: 'fit-content'}}> + <Typography + variant="h3" + > + {t("banner")} + </Typography> <Box - display={'flex'} - sx={{marginTop: '16px', gap: 2}} + borderRadius={'16px'} + sx={{position: 'relative', width: '100%', height: 'fit-content', borderRadius: '16px',}} > - <Button - type="submit" - color={'primary'} + <Box + component={'img'} + alt={t('select image')} + src={selectedImageURL} sx={{ - width: 'fit-content', - backgroundColor: 'primary.main', - color: 'primary.contrastText' + borderRadius: '16px', + height: 'fit-content', + maxHeight: '200px', + width: '100%' }} - href={'/course/' + courseId + "/"} - > - {t("save changes")} - </Button> - <Button - href={'/course/' + courseId + "/"} + /> + </Box> + </Box> + <Box> + <Button variant={"contained"} color={"secondary"} size={'small'} + startIcon={<UploadFileIcon sx={{color: 'secondary.contrastText'}}/>} + component="label" + role={undefined} + tabIndex={-1} sx={{ + padding: 1, width: 'fit-content', - backgroundColor: 'secondary.main', - color: 'secondary.contrastText' + color: 'secondary.contrastText', + marginTop: '16px' }} - > - {t("cancel")} - </Button> - </Box> + > + {t("select image")} + <Input type="file" + id="Image" + name="Image" + onChange={handleImageUpload} + style={visuallyHidden} + /> + </Button> </Box> - )); - + <Box sx={{marginTop: '16px'}}> + <Typography + variant="h3" + > + {t("description")} + </Typography> + <TextField id="description" name="description" defaultValue={description} + label="Description" + multiline + rows={4} + onChange={(event: any) => setDescription(event.target.value)} required + style={{ + width: '100%', + fontFamily: 'Quicksand', + color: 'black', + borderRadius: '6px', + padding: '10px', + boxSizing: 'border-box' + }}/> + </Box> + <Box sx={{marginTop: '16px'}}> + <Typography + variant="h3" + > + {t("access")} + </Typography> + <Select + id="choice" + name="choice" + label={t("access")} + value={open} + onChange={(event: any) => setOpen(event.target.value)} + sx={{ + fontSize: '20px', + height: 'fit-content', + }} + > + <MenuItem value="false">{t("private")}</MenuItem> + <MenuItem value="true">{t("public")}</MenuItem> + </Select> + </Box> + <Box + display={'flex'} + sx={{marginTop: '16px', gap: 2}} + > + <Button + type="submit" + color={'primary'} + sx={{ + width: 'fit-content', + backgroundColor: 'primary.main', + color: 'primary.contrastText' + }} + href={'/course/' + courseId + "/"} + > + {t("save changes")} + </Button> + <Button + href={'/course/' + courseId + "/"} + sx={{ + width: 'fit-content', + backgroundColor: 'secondary.main', + color: 'secondary.contrastText' + }} + > + {t("cancel")} + </Button> + </Box> + </Box> + ); } -export default EditCourseForm \ No newline at end of file +export default EditCourseForm diff --git a/frontend/app/[locale]/course/[course_id]/page.tsx b/frontend/app/[locale]/course/[course_id]/page.tsx index 53935d6e..89487bd5 100644 --- a/frontend/app/[locale]/course/[course_id]/page.tsx +++ b/frontend/app/[locale]/course/[course_id]/page.tsx @@ -13,7 +13,10 @@ import React from "react"; const i18nNamespaces = ['common'] export default async function Course({params: {locale, course_id}, searchParams: {token}}: - { params: { locale: any, course_id: number }, searchParams: { token: string } }) { + { + params: { locale: any, course_id: number }, + searchParams: { token: string } + }) { const {t, resources} = await initTranslations(locale, i18nNamespaces) const headers = [t('name'), t('deadline'), t('view')] const headers_backend = ['name', 'deadline', 'view'] @@ -24,52 +27,71 @@ export default async function Course({params: {locale, course_id}, searchParams: locale={locale} namespaces={i18nNamespaces} > - <JoinCourseWithToken token={token} course_id={course_id}></JoinCourseWithToken> - <NavBar/> - <Box - sx={{ - paddingTop: 5, + <div + id={'center_box'} + style={{ width: '100%', + display: 'flex', + justifyContent: 'center', }} > - <CourseBanner course_id={course_id}/> - <CourseDetails course_id={course_id}/> <Box - display={'flex'} - justifyContent={'flex-start'} - width={'fit-content'} - alignItems={'center'} - marginTop={2} + style={{ + height: "fit-content", + minHeight: '100vh', + width: '100%', + maxWidth: '1500px', + display: 'flex', + justifyContent: 'center', + }} > - <Typography - variant="h3" + <JoinCourseWithToken token={token} course_id={course_id}></JoinCourseWithToken> + <NavBar/> + <Box sx={{ - fontWeight: 'medium', - paddingRight: 2, + paddingTop: 5, + width: '100%', }} > - {t('projects')} - </Typography> - <AddProjectButton course_id={course_id}/> - </Box> - <Box - justifyContent={'left'} - width={'100%'} - > - <ListView - search_text={t('search_for_project')} - admin={false} - headers={headers} - headers_backend={headers_backend} - sortable={[true, true, false, true]} - get={'projects'} - get_id={course_id} - /> + <CourseBanner course_id={course_id}/> + <CourseDetails course_id={course_id}/> + <Box + display={'flex'} + justifyContent={'flex-start'} + width={'fit-content'} + alignItems={'center'} + marginTop={2} + > + <Typography + variant="h3" + sx={{ + fontWeight: 'medium', + paddingRight: 2, + }} + > + {t('projects')} + </Typography> + <AddProjectButton course_id={course_id}/> + </Box> + <Box + justifyContent={'left'} + width={'100%'} + > + <ListView + search_text={t('search_for_project')} + admin={false} + headers={headers} + headers_backend={headers_backend} + sortable={[true, true, false, true]} + get={'projects'} + get_id={course_id} + /> + </Box> + <StudentCoTeacherButtons course_id={course_id}/> + </Box> </Box> - <StudentCoTeacherButtons course_id={course_id}/> - </Box> - + </div> </TranslationsProvider> ) -} \ No newline at end of file +} diff --git a/frontend/app/[locale]/course/[course_id]/students/page.tsx b/frontend/app/[locale]/course/[course_id]/students/page.tsx index 7b952eac..77960185 100644 --- a/frontend/app/[locale]/course/[course_id]/students/page.tsx +++ b/frontend/app/[locale]/course/[course_id]/students/page.tsx @@ -2,7 +2,9 @@ import initTranslations from "@app/i18n"; import TranslationsProvider from "@app/[locale]/components/TranslationsProvider"; import NavBar from "@app/[locale]/components/NavBar"; import ListView from '@app/[locale]/components/ListView'; -import BackButton from "@app/[locale]/components/BackButton"; +import Button from "@mui/material/Button"; +import ArrowBackIcon from "@mui/icons-material/ArrowBack"; +import React from "react"; const i18nNamespaces = ['common'] @@ -20,11 +22,15 @@ export default async function StudentsPage({ params }: { params: { locale: any, namespaces={i18nNamespaces} > <NavBar /> - <div style={{marginTop:60, padding:20}}> - <BackButton - destination={`/course/${course_id}`} - text={t('back_to') + ' ' + t('course')} - /> + <div style={{marginTop:20, padding:20}}> + <Button + variant="outlined" + color="primary" + startIcon={<ArrowBackIcon/>} + href={`/course/${course_id}`} + > + {t('back_to') + ' ' + t('course') + ' ' + t('page')} + </Button> <ListView admin={true} headers={headers} @@ -34,7 +40,7 @@ export default async function StudentsPage({ params }: { params: { locale: any, get={'course_students'} action_name={'remove_from_course'} action_text={t('remove_user_from_course')} - search_text={t('search')} + search_text={t('search_student')} /> </div> </TranslationsProvider> diff --git a/frontend/app/[locale]/course/[course_id]/teachers/page.tsx b/frontend/app/[locale]/course/[course_id]/teachers/page.tsx index 004863e2..67698d9a 100644 --- a/frontend/app/[locale]/course/[course_id]/teachers/page.tsx +++ b/frontend/app/[locale]/course/[course_id]/teachers/page.tsx @@ -2,17 +2,19 @@ import initTranslations from "@app/i18n"; import TranslationsProvider from "@app/[locale]/components/TranslationsProvider"; import NavBar from "@app/[locale]/components/NavBar"; import ListView from '@app/[locale]/components/ListView'; -import BackButton from "@app/[locale]/components/BackButton"; +import Button from "@mui/material/Button"; +import ArrowBackIcon from "@mui/icons-material/ArrowBack"; +import React from "react"; const i18nNamespaces = ['common'] -export default async function TeachersPage({ params }: { params: { locale: any, course_id: number } }) { - const { locale, course_id } = params; - const { t, resources } = await initTranslations(locale, i18nNamespaces); +export default async function TeachersPage({params}: { params: { locale: any, course_id: number } }) { + const {locale, course_id} = params; + const {t, resources} = await initTranslations(locale, i18nNamespaces); const headers = [t('email')]; const headers_backend = ['email']; - + return ( <TranslationsProvider resources={resources} @@ -20,23 +22,25 @@ export default async function TeachersPage({ params }: { params: { locale: any, namespaces={i18nNamespaces} > <NavBar/> - <div style={{marginTop: 60, padding: 20}}> - <BackButton - destination={`/course/${course_id}`} - text={t('back_to') + ' ' + t('course')} + <div style={{marginTop: 20, padding: 20}}> + <Button + variant="outlined" + color="primary" + startIcon={<ArrowBackIcon/>} + href={`/course/${course_id}`} + > + {t('back_to') + ' ' + t('course') + ' ' + t('page')} + </Button> + <ListView + admin={true} + headers={headers} + headers_backend={headers_backend} + sortable={[true]} + get_id={course_id} + get={'course_teachers'} + search_text={t('search_teacher')} /> - <div style={{marginBottom: '100px'}}> - <ListView - admin={true} - headers={headers} - headers_backend={headers_backend} - sortable={[true]} - get_id={course_id} - get={'course_teachers'} - search_text={t('search')} - /> - </div> </div> </TranslationsProvider> -); + ); } diff --git a/frontend/app/[locale]/course/all/page.tsx b/frontend/app/[locale]/course/all/page.tsx index 8a01eeb9..9657e7e6 100644 --- a/frontend/app/[locale]/course/all/page.tsx +++ b/frontend/app/[locale]/course/all/page.tsx @@ -22,7 +22,7 @@ export default async function AllCoursesPage({params: {locale}}: { params: { loc namespaces={i18nNamespaces} > <NavBar/> - <div style={{marginTop:20, padding:20}}> + <div style={{padding:20}}> <Button variant="outlined" color="primary" diff --git a/frontend/app/[locale]/project/[project_id]/groups/page.tsx b/frontend/app/[locale]/project/[project_id]/groups/page.tsx index 82a7088b..74cf6626 100644 --- a/frontend/app/[locale]/project/[project_id]/groups/page.tsx +++ b/frontend/app/[locale]/project/[project_id]/groups/page.tsx @@ -22,7 +22,7 @@ export default async function GroupPage({ params }: { params: { locale: any, pro namespaces={i18nNamespaces} > <NavBar /> - <div style={{marginTop:20, padding:20}}> + <div style={{padding:20}}> <Button variant="outlined" color="primary" diff --git a/frontend/locales/en/common.json b/frontend/locales/en/common.json index 35c919e8..85d2288d 100644 --- a/frontend/locales/en/common.json +++ b/frontend/locales/en/common.json @@ -103,7 +103,7 @@ "show_more": "Show more", "show_less": "Show less", "select": "Select", - "search_for_project": "Search for project", + "search_for_project": "Search project", "has_deadline": "Has deadline", "no_test_files_selected": "No test files selected", "create": "Create", @@ -115,6 +115,8 @@ "group_search": "Search group", "submission_search": "Search submission", "search_course": "Search course", + "search_student": "Search student", + "search_teacher": "Search teacher", "year": "Year", "archive_course": "Archive course", "files": "Upload files:" diff --git a/frontend/locales/nl/common.json b/frontend/locales/nl/common.json index 4e241f1d..fbb1c249 100644 --- a/frontend/locales/nl/common.json +++ b/frontend/locales/nl/common.json @@ -103,7 +103,7 @@ "show_more": "Toon meer", "show_less": "Toon minder", "select": "Selecteer", - "search_for_project": "Zoek naar project", + "search_for_project": "Zoek project", "has_deadline": "Heeft deadline", "no_test_files_selected": "Geen testbestanden geselecteerd", "create": "Aanmaken", @@ -115,6 +115,8 @@ "group_search": "Zoek groep", "submission_search": "Zoek indiening", "search_course": "Zoek cursus", + "search_student": "Zoek student", + "search_teacher": "Zoek docent", "year": "Jaargang", "archive_course": "Cursus archiveren", "files": "Upload bestanden:" From a6f6f8093e537980ef149b5d8322df3ce528575d Mon Sep 17 00:00:00 2001 From: gilles-arnout <gilles.arnout@gmail.com> Date: Mon, 13 May 2024 12:00:52 +0200 Subject: [PATCH 10/10] layout fixes after layout.tsx changes --- .../components/SubmissionDetailsPage.tsx | 6 +- .../[locale]/components/SubmitDetailsPage.tsx | 8 +- .../app/[locale]/course/[course_id]/page.tsx | 98 +++++++------------ .../course/[course_id]/students/page.tsx | 6 +- .../course/[course_id]/teachers/page.tsx | 6 +- frontend/app/[locale]/course/all/page.tsx | 6 +- .../project/[project_id]/groups/page.tsx | 8 +- 7 files changed, 58 insertions(+), 80 deletions(-) diff --git a/frontend/app/[locale]/components/SubmissionDetailsPage.tsx b/frontend/app/[locale]/components/SubmissionDetailsPage.tsx index 35d535b6..718b9700 100644 --- a/frontend/app/[locale]/components/SubmissionDetailsPage.tsx +++ b/frontend/app/[locale]/components/SubmissionDetailsPage.tsx @@ -63,11 +63,11 @@ const ProjectDetailsPage: React.FC<ProjectDetailsPageProps> = ({ locale, submiss return ( <ThemeProvider theme={baseTheme}> - <Grid container alignItems="flex-start" style={{ padding: 0 }}> - <Grid item xs="auto" style={{ marginLeft: 20, marginTop: 20, marginRight: 'auto' }}> + <Grid container justifyContent="center" alignItems="flex-start" style={{ width: 'fit-content', maxWidth: '100%' }}> + <Grid item style={{padding: 20}}> <ProjectReturnButton locale={locale} project_id={project?.project_id} /> </Grid> - <Grid item xs={12} style={{display: 'flex', justifyContent: 'center'}}> + <Grid item style={{padding: 20, marginRight: "233px"}}> <Card raised style={{ width: 800 }}> <CardContent> <Typography variant="h4" style={{ fontWeight: 'bold' }}> diff --git a/frontend/app/[locale]/components/SubmitDetailsPage.tsx b/frontend/app/[locale]/components/SubmitDetailsPage.tsx index c2d2502a..e00a243f 100644 --- a/frontend/app/[locale]/components/SubmitDetailsPage.tsx +++ b/frontend/app/[locale]/components/SubmitDetailsPage.tsx @@ -78,11 +78,11 @@ const SubmitDetailsPage: React.FC<SubmitDetailsPageProps> = ({locale, project_id return ( <ThemeProvider theme={baseTheme}> - <Grid container alignItems="flex-start" style={{ padding: 0 }}> - <Grid item xs="auto" style={{ marginLeft: 20, marginTop: 20, marginRight: 'auto' }}> - <ProjectReturnButton locale={locale} project_id={projectData?.project_id}/> + <Grid container justifyContent="center" alignItems="flex-start" style={{ width: 'fit-content', maxWidth: '100%' }}> + <Grid item style={{padding: 20}}> + <ProjectReturnButton locale={locale} project_id={projectData?.project_id} /> </Grid> - <Grid item xs={12} style={{display: 'flex', justifyContent: 'center'}}> + <Grid item style={{padding: 20, marginRight: "233px"}}> <Card raised style={{width: 800}}> <CardContent> <Typography diff --git a/frontend/app/[locale]/course/[course_id]/page.tsx b/frontend/app/[locale]/course/[course_id]/page.tsx index 89487bd5..53935d6e 100644 --- a/frontend/app/[locale]/course/[course_id]/page.tsx +++ b/frontend/app/[locale]/course/[course_id]/page.tsx @@ -13,10 +13,7 @@ import React from "react"; const i18nNamespaces = ['common'] export default async function Course({params: {locale, course_id}, searchParams: {token}}: - { - params: { locale: any, course_id: number }, - searchParams: { token: string } - }) { + { params: { locale: any, course_id: number }, searchParams: { token: string } }) { const {t, resources} = await initTranslations(locale, i18nNamespaces) const headers = [t('name'), t('deadline'), t('view')] const headers_backend = ['name', 'deadline', 'view'] @@ -27,71 +24,52 @@ export default async function Course({params: {locale, course_id}, searchParams: locale={locale} namespaces={i18nNamespaces} > - <div - id={'center_box'} - style={{ + <JoinCourseWithToken token={token} course_id={course_id}></JoinCourseWithToken> + <NavBar/> + <Box + sx={{ + paddingTop: 5, width: '100%', - display: 'flex', - justifyContent: 'center', }} > + <CourseBanner course_id={course_id}/> + <CourseDetails course_id={course_id}/> <Box - style={{ - height: "fit-content", - minHeight: '100vh', - width: '100%', - maxWidth: '1500px', - display: 'flex', - justifyContent: 'center', - }} + display={'flex'} + justifyContent={'flex-start'} + width={'fit-content'} + alignItems={'center'} + marginTop={2} > - <JoinCourseWithToken token={token} course_id={course_id}></JoinCourseWithToken> - <NavBar/> - <Box + <Typography + variant="h3" sx={{ - paddingTop: 5, - width: '100%', + fontWeight: 'medium', + paddingRight: 2, }} > - <CourseBanner course_id={course_id}/> - <CourseDetails course_id={course_id}/> - <Box - display={'flex'} - justifyContent={'flex-start'} - width={'fit-content'} - alignItems={'center'} - marginTop={2} - > - <Typography - variant="h3" - sx={{ - fontWeight: 'medium', - paddingRight: 2, - }} - > - {t('projects')} - </Typography> - <AddProjectButton course_id={course_id}/> - </Box> - <Box - justifyContent={'left'} - width={'100%'} - > - <ListView - search_text={t('search_for_project')} - admin={false} - headers={headers} - headers_backend={headers_backend} - sortable={[true, true, false, true]} - get={'projects'} - get_id={course_id} - /> + {t('projects')} + </Typography> + <AddProjectButton course_id={course_id}/> + </Box> + <Box + justifyContent={'left'} + width={'100%'} + > + <ListView + search_text={t('search_for_project')} + admin={false} + headers={headers} + headers_backend={headers_backend} + sortable={[true, true, false, true]} + get={'projects'} + get_id={course_id} + /> - </Box> - <StudentCoTeacherButtons course_id={course_id}/> - </Box> </Box> - </div> + <StudentCoTeacherButtons course_id={course_id}/> + </Box> + </TranslationsProvider> ) -} +} \ No newline at end of file diff --git a/frontend/app/[locale]/course/[course_id]/students/page.tsx b/frontend/app/[locale]/course/[course_id]/students/page.tsx index 77960185..840ed8e0 100644 --- a/frontend/app/[locale]/course/[course_id]/students/page.tsx +++ b/frontend/app/[locale]/course/[course_id]/students/page.tsx @@ -2,7 +2,7 @@ import initTranslations from "@app/i18n"; import TranslationsProvider from "@app/[locale]/components/TranslationsProvider"; import NavBar from "@app/[locale]/components/NavBar"; import ListView from '@app/[locale]/components/ListView'; -import Button from "@mui/material/Button"; +import {Box, Button} from "@mui/material"; import ArrowBackIcon from "@mui/icons-material/ArrowBack"; import React from "react"; @@ -22,7 +22,7 @@ export default async function StudentsPage({ params }: { params: { locale: any, namespaces={i18nNamespaces} > <NavBar /> - <div style={{marginTop:20, padding:20}}> + <Box width={'100%'} style={{padding:20}}> <Button variant="outlined" color="primary" @@ -42,7 +42,7 @@ export default async function StudentsPage({ params }: { params: { locale: any, action_text={t('remove_user_from_course')} search_text={t('search_student')} /> - </div> + </Box> </TranslationsProvider> ); } diff --git a/frontend/app/[locale]/course/[course_id]/teachers/page.tsx b/frontend/app/[locale]/course/[course_id]/teachers/page.tsx index 67698d9a..7ba9662a 100644 --- a/frontend/app/[locale]/course/[course_id]/teachers/page.tsx +++ b/frontend/app/[locale]/course/[course_id]/teachers/page.tsx @@ -2,7 +2,7 @@ import initTranslations from "@app/i18n"; import TranslationsProvider from "@app/[locale]/components/TranslationsProvider"; import NavBar from "@app/[locale]/components/NavBar"; import ListView from '@app/[locale]/components/ListView'; -import Button from "@mui/material/Button"; +import {Box, Button} from "@mui/material"; import ArrowBackIcon from "@mui/icons-material/ArrowBack"; import React from "react"; @@ -22,7 +22,7 @@ export default async function TeachersPage({params}: { params: { locale: any, co namespaces={i18nNamespaces} > <NavBar/> - <div style={{marginTop: 20, padding: 20}}> + <Box width={'100%'} style={{padding: 20}}> <Button variant="outlined" color="primary" @@ -40,7 +40,7 @@ export default async function TeachersPage({params}: { params: { locale: any, co get={'course_teachers'} search_text={t('search_teacher')} /> - </div> + </Box> </TranslationsProvider> ); } diff --git a/frontend/app/[locale]/course/all/page.tsx b/frontend/app/[locale]/course/all/page.tsx index 9657e7e6..80b95db6 100644 --- a/frontend/app/[locale]/course/all/page.tsx +++ b/frontend/app/[locale]/course/all/page.tsx @@ -4,7 +4,7 @@ import TranslationsProvider from "@app/[locale]/components/TranslationsProvider" import NavBar from "@app/[locale]/components/NavBar"; import ListView from '@app/[locale]/components/ListView'; import ArrowBackIcon from "@mui/icons-material/ArrowBack"; -import Button from "@mui/material/Button"; +import {Box, Button} from "@mui/material"; const i18nNamespaces = ['common'] @@ -22,7 +22,7 @@ export default async function AllCoursesPage({params: {locale}}: { params: { loc namespaces={i18nNamespaces} > <NavBar/> - <div style={{padding:20}}> + <Box width={'100%'} style={{padding: 20}}> <Button variant="outlined" color="primary" @@ -41,7 +41,7 @@ export default async function AllCoursesPage({params: {locale}}: { params: { loc action_text={t('join_course')} search_text={t("search_course")} /> - </div> + </Box> </TranslationsProvider> ) } \ No newline at end of file diff --git a/frontend/app/[locale]/project/[project_id]/groups/page.tsx b/frontend/app/[locale]/project/[project_id]/groups/page.tsx index 74cf6626..0fe06038 100644 --- a/frontend/app/[locale]/project/[project_id]/groups/page.tsx +++ b/frontend/app/[locale]/project/[project_id]/groups/page.tsx @@ -3,7 +3,7 @@ import TranslationsProvider from "@app/[locale]/components/TranslationsProvider" import NavBar from "@app/[locale]/components/NavBar"; import ListView from '@app/[locale]/components/ListView'; import ArrowBackIcon from "@mui/icons-material/ArrowBack"; -import Button from "@mui/material/Button"; +import { Button, Box } from "@mui/material"; import React from "react"; const i18nNamespaces = ['common'] @@ -22,14 +22,14 @@ export default async function GroupPage({ params }: { params: { locale: any, pro namespaces={i18nNamespaces} > <NavBar /> - <div style={{padding:20}}> + <Box width={'100%'} style={{padding:20}}> <Button variant="outlined" color="primary" startIcon={<ArrowBackIcon/>} href={`/${locale}/project/${projectId}`} > - {t("return_course")} + {t("return_project")} </Button> <ListView admin={true} @@ -40,7 +40,7 @@ export default async function GroupPage({ params }: { params: { locale: any, pro get={'groups'} search_text={t("group_search")} /> - </div> + </Box> </TranslationsProvider> ); }