merge with dev

SELab-2 · May 22, 2024 · 0e4d81a · 0e4d81a
2 parents 008e2ae + a1647d9
commit 0e4d81a
Show file tree

Hide file tree

Showing 14 changed files with 219 additions and 54 deletions.
diff --git a/backend/pigeonhole/apps/submissions/admin.py b/backend/pigeonhole/apps/submissions/admin.py
@@ -39,15 +39,7 @@ class SubmissionAdmin(admin.ModelAdmin):
             'Files',
             {
                 'fields': (
-                    'file',
-                )
-            }
-        ),
-        (
-            'Tests',
-            {
-                'fields': (
-                    'output_test',
+                    'file_urls',
                 )
             }
         ),

diff --git a/frontend/app/[locale]/components/EditCourseForm.tsx b/frontend/app/[locale]/components/EditCourseForm.tsx
@@ -3,7 +3,7 @@ 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, LinearProgress, MenuItem, Select, TextField} from "@mui/material";
+import {Box, Button, Input, LinearProgress, MenuItem, Select, TextField, Dialog, DialogActions, DialogTitle} 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';
@@ -24,6 +24,8 @@ const EditCourseForm = ({courseId}: EditCourseFormProps) => {
     const [selectedImage, setSelectedImage] = useState<File | null>(null);
     const [selectedImageURL, setSelectedImageURL] = useState<string>("");
     const [loading, setLoading] = useState(true);
+    const [openConfirmation, setOpenConfirmation] = useState(false); // State for confirmation dialog
+
 
     useEffect(() => {
         const fetchCourseData = async () => {
@@ -57,6 +59,15 @@ const EditCourseForm = ({courseId}: EditCourseFormProps) => {
 
     const handleSubmit = async (event: any) => {
         event.preventDefault();
+        setOpenConfirmation(true); // Open confirmation dialog
+    };
+
+    const handleConfirmationClose = () => {
+        setOpenConfirmation(false);
+    };
+
+    const handleConfirmationYes = async () => {
+        setOpenConfirmation(false);
         const formData = new FormData();
         formData.append('name', name);
         formData.append('description', description);
@@ -66,13 +77,16 @@ const EditCourseForm = ({courseId}: EditCourseFormProps) => {
         fileReader.onload = async function () {
             const arrayBuffer = this.result;
             if (arrayBuffer !== null) {
-                formData.append('banner', new Blob([arrayBuffer], {type: 'image/png'}));
+                formData.append('banner', new Blob([arrayBuffer], { type: 'image/png' }));
+                await updateCourse(courseId, formData).then((response) => {
+                    window.location.href = `/course/${courseId}/`;
+                });
             }
-            await updateCourse(courseId, formData);
-            window.location.href = `/course/${courseId}/`;
         }
+        if (selectedImage) fileReader.readAsArrayBuffer(selectedImage);
     };
 
+
     const handleImageUpload = (event: any) => {
         const imageFile = event.target.files[0];
         setSelectedImage(imageFile);
@@ -253,6 +267,22 @@ const EditCourseForm = ({courseId}: EditCourseFormProps) => {
                     {t("cancel")}
                 </Button>
             </Box>
+            <Dialog
+                open={openConfirmation}
+                onClose={handleConfirmationClose}
+                aria-labelledby="alert-dialog-title"
+                aria-describedby="alert-dialog-description"
+            >
+                <DialogTitle id="alert-dialog-title">{t("Are you sure you want to submit this course?")}</DialogTitle>
+                <DialogActions>
+                    <Button onClick={handleConfirmationClose} color="primary">
+                        {t("cancel")}
+                    </Button>
+                    <Button onClick={handleConfirmationYes} color="primary" autoFocus>
+                        {t("edit course")}
+                    </Button>
+                </DialogActions>
+            </Dialog>
         </Box>
     );
 }

diff --git a/frontend/app/[locale]/components/ListView.tsx b/frontend/app/[locale]/components/ListView.tsx
@@ -97,7 +97,10 @@ interface ListViewProps {
     search: boolean;
 }
 
-const convertDate = (date_str: string) => {
+const convertDate = (t, date_str) => {
+    if (date_str === null) {
+        return t('no_deadline');
+    }
     let date = new Date(date_str);
     date = new Date(date.getTime());
     let date_local = date.toLocaleString('en-US', {
@@ -172,7 +175,7 @@ const ListView: NextPage<ListViewProps> = ({
                     'course_students': (data) => [data.id, data.email],
                     'course_teachers': (data) => [data.id, data.email],
                     'courses': (data) => [data.course_id, data.name, data.description, data.open_course],
-                    'projects': (data) => [data.project_id, data.name, convertDate(data.deadline)],
+                    'projects': (data) => [data.project_id, data.name, convertDate(t, data.deadline)],
                     'groups': async (data) => {
                         let l = [];
                         // Iterate over the values of the object
@@ -186,8 +189,8 @@ const ListView: NextPage<ListViewProps> = ({
                         setGroupSize((await getProject(data.project_id)).group_size);
                         return [data.group_id, data.user, data.group_nr, l.join(', ')];
                     },
-                    'submissions': (data) => [data.submission_id, data.group_id, convertDate(data.timestamp), data.output_simple_test],
-                    'submissions_group': (data) => [data.submission_id, data.group_id, convertDate(data.timestamp), data.output_simple_test],
+                    'submissions': (data) => [data.submission_id, data.group_id, convertDate(t, data.timestamp), data.output_simple_test],
+                    'submissions_group': (data) => [data.submission_id, data.group_id, convertDate(t, data.timestamp), data.output_simple_test],
                     'archived_courses': (data) => [data.course_id, data.name, data.description, data.open_course],
                 };
 
@@ -499,7 +502,7 @@ const ListView: NextPage<ListViewProps> = ({
                             {rows.map((row, index) => (
                                 <StyledTableRow key={index}>
                                     {((get !== 'groups' && get !== 'projects' && get !== 'courses' && !(get === 'submissions' && !action_name) && get != 'users') &&
-                                        get !== 'course_teachers' && !(action_name && user?.role === 3 && get !== 'archived_courses') &&
+                                        get !== 'course_teachers' && !(action_name && user?.role === 3) && get !== 'archived_courses' &&
                                         <StyledTableCell>
                                             {<CheckBoxWithCustomCheck checked={false}/>}
                                         </StyledTableCell>)}

diff --git a/frontend/app/[locale]/components/ProjectDetailsPage.tsx b/frontend/app/[locale]/components/ProjectDetailsPage.tsx
@@ -1,6 +1,6 @@
 'use client'
 import React, { useEffect, useState } from "react";
-import {checkGroup, getGroup, getProject, fetchUserData, Project, UserData} from "@lib/api";
+import {checkGroup, getGroup, getProject, getUserData, Project, UserData} from "@lib/api";
 import { useTranslation } from "react-i18next";
 import Box from "@mui/material/Box";
 import Typography from "@mui/material/Typography";
@@ -154,22 +154,37 @@ const ProjectDetailsPage: React.FC<ProjectDetailsPageProps> = ({
                         />
                     ))) : (
                   <>
-                    {user?.role !== 3 && (
-                        <Button
-                            variant="contained"
-                            color="secondary"
-                            startIcon={<EditIcon />}
-                            href={`/${locale}/project/${project_id}/edit`}
-                            sx={{
-                              fontSize: "0.75rem",
-                              py: 1,
-                              marginRight: 1,
-                              marginY: 1,
-                            }}
-                        >
-                          {t("edit_project")}
-                        </Button>
-                    )}
+                      {user?.role !== 3 && (
+                          <>
+                              <Button
+                                  variant="contained"
+                                  color="secondary"
+                                  href={`/${locale}/project/${project_id}/submissions`}
+                                  sx={{
+                                      fontSize: "0.75rem",
+                                      py: 1,
+                                      marginRight: 1,
+                                      marginY: 1,
+                                  }}
+                              >
+                                  {t("submissions")}
+                              </Button>
+                              <Button
+                                  variant="contained"
+                                  color="secondary"
+                                  startIcon={<EditIcon />}
+                                  href={`/${locale}/project/${project_id}/edit`}
+                                  sx={{
+                                      fontSize: "0.75rem",
+                                      py: 1,
+                                      marginRight: 1,
+                                      marginY: 1,
+                                  }}
+                              >
+                                  {t("edit_project")}
+                              </Button>
+                          </>
+                      )}
                     <Button
                         variant="contained"
                         color="secondary"
@@ -287,6 +302,10 @@ const ProjectDetailsPage: React.FC<ProjectDetailsPageProps> = ({
 
 function buildTree(paths) {
     const tree = {};
+    if (!paths) {
+        return tree;
+    }
+
     const paths_list = paths.split(',');
     paths_list.forEach(path => {
         const parts = path.split('/');

diff --git a/frontend/app/[locale]/components/SubmissionDetailsPage.tsx b/frontend/app/[locale]/components/SubmissionDetailsPage.tsx
@@ -12,12 +12,12 @@ import DownloadIcon from "@mui/icons-material/CloudDownload";
 
 const backend_url = process.env['NEXT_PUBLIC_BACKEND_URL'];
 
-interface ProjectDetailsPageProps {
+interface SubmissionDetailsPageProps {
     locale: any,
     submission_id: number;
 }
 
-const ProjectDetailsPage: React.FC<ProjectDetailsPageProps> = ({ locale, submission_id }) => {
+const SubmissionDetailsPage: React.FC<SubmissionDetailsPageProps> = ({ locale, submission_id }) => {
     const { t } = useTranslation();
 
     const [submission, setSubmission] = useState<Submission>();
@@ -27,9 +27,7 @@ const ProjectDetailsPage: React.FC<ProjectDetailsPageProps> = ({ locale, submiss
     useEffect(() => {
         const fetchSubmission = async () => {
             try {
-                const async_submission = await getSubmission(submission_id);
-                setSubmission(async_submission);
-                console.log(async_submission);
+                setSubmission(await getSubmission(submission_id));
             } catch (error) {
                 console.error("There was an error fetching the submission data:", error);
             }
@@ -109,7 +107,7 @@ const ProjectDetailsPage: React.FC<ProjectDetailsPageProps> = ({ locale, submiss
                                         startIcon={<DownloadIcon />}
                                         href={`${backend_url}/submissions/${submission_id}/download`}
                                         download
-                                        size="small" // Adjust button size
+                                        size="small"
                                     >
                                         {t("download_file")}
                                     </Button>
@@ -157,4 +155,4 @@ const ProjectDetailsPage: React.FC<ProjectDetailsPageProps> = ({ locale, submiss
     );
 };
 
-export default ProjectDetailsPage;
+export default SubmissionDetailsPage;
diff --git a/frontend/app/[locale]/course/[course_id]/students/page.tsx b/frontend/app/[locale]/course/[course_id]/students/page.tsx
@@ -8,6 +8,7 @@ import ArrowBackIcon from "@mui/icons-material/ArrowBack";
 import React, {useEffect, useState} from "react";
 import EmailIcon from '@mui/icons-material/Email';
 import {fetchUserData, UserData} from "@lib/api";
+import Typography from "@mui/material/Typography";
 
 const i18nNamespaces = ['common']
 
@@ -69,6 +70,16 @@ export default function StudentsPage({params: {locale, course_id}}: { params: {
                     >
                         {translations.t('back_to') + ' ' + translations.t('course') + ' ' + translations.t('page')}
                     </Button>
+                    <Typography
+                        variant="h3"
+                        sx={{
+                            fontWeight: 'medium',
+                            marginTop: 2,
+                            marginBottom: 2
+                        }}
+                    >
+                        {translations.t('students')}
+                    </Typography>
                     <Box marginTop={{ xs: 2, md: 4 }}>
                         <ListView
                             admin={true}

diff --git a/frontend/app/[locale]/course/[course_id]/teachers/page.tsx b/frontend/app/[locale]/course/[course_id]/teachers/page.tsx
@@ -8,6 +8,7 @@ import ArrowBackIcon from "@mui/icons-material/ArrowBack";
 import React, {useEffect, useState} from "react";
 import EmailIcon from '@mui/icons-material/Email';
 import {fetchUserData, UserData} from "@lib/api";
+import Typography from "@mui/material/Typography";
 
 const i18nNamespaces = ['common']
 
@@ -68,6 +69,16 @@ export default function TeachersPage({params: {locale, course_id}}: { params: {
                     >
                         {translations.t('back_to') + ' ' + translations.t('course') + ' ' + translations.t('page')}
                     </Button>
+                    <Typography
+                        variant="h3"
+                        sx={{
+                            fontWeight: 'medium',
+                            marginTop: 2,
+                            marginBottom: 2
+                        }}
+                    >
+                        {translations.t('teachers')}
+                    </Typography>
                     <Box marginTop={{ xs: 2, md: 4 }}>
                     <ListView
                         admin={true}

diff --git a/frontend/app/[locale]/course/all/page.tsx b/frontend/app/[locale]/course/all/page.tsx
@@ -7,6 +7,7 @@ import ArrowBackIcon from "@mui/icons-material/ArrowBack";
 import {Box, Button} from "@mui/material";
 import NotesIcon from '@mui/icons-material/Notes';
 import MeetingRoomIcon from '@mui/icons-material/MeetingRoom';
+import Typography from "@mui/material/Typography";
 
 
 const i18nNamespaces = ['common']
@@ -36,6 +37,16 @@ export default async function AllCoursesPage({params: {locale}}: { params: { loc
                 >
                     {t('back_to') + ' ' + t('home') + ' ' + t('page')}
                 </Button>
+                <Typography
+                        variant="h3"
+                        sx={{
+                            fontWeight: 'medium',
+                            marginTop: 2,
+                            marginBottom: 2
+                        }}
+                    >
+                        {t('courses_all')}
+                    </Typography>
                 <ListView
                     admin={true}
                     headers={headers}

diff --git a/frontend/app/[locale]/course/archived/page.tsx b/frontend/app/[locale]/course/archived/page.tsx
@@ -5,14 +5,15 @@ import initTranslations from "@app/i18n";
 import TranslationsProvider from "@app/[locale]/components/TranslationsProvider";
 import BackButton from "@app/[locale]/components/BackButton";
 import NotesIcon from '@mui/icons-material/Notes';
+import Typography from "@mui/material/Typography";
 
 const i18nNamespaces = ['common'];
 
 const ArchivePage = async ({params: {locale}}) => {
     const {t, resources} = await initTranslations(locale, i18nNamespaces);
     const headers = [t('name'), 
     <React.Fragment key="description"><NotesIcon style={{ fontSize: '20px', verticalAlign: 'middle', marginBottom: '3px' }}/>{" " + t('description')}</React.Fragment>,
-    , t('open'), ''];
+    , t('open')];
     const headers_backend = ['name', 'description', 'open'];
 
     return (
@@ -32,6 +33,16 @@ const ArchivePage = async ({params: {locale}}) => {
                     destination={'/home'}
                     text={t('back_to') + ' ' + t('home') + ' ' + t('page')}
                 />
+                <Typography
+                    variant="h3"
+                    sx={{
+                        fontWeight: 'medium',
+                        marginTop: 2,
+                        marginBottom: 2
+                    }}
+                >
+                    {t('courses_archive')}
+                </Typography>
                 <ListView
                     admin={true}
                     headers={headers}

diff --git a/frontend/app/[locale]/project/[project_id]/groups/page.tsx b/frontend/app/[locale]/project/[project_id]/groups/page.tsx
@@ -7,6 +7,8 @@ import { Button, Box } from "@mui/material";
 import React from "react";
 import GroupsIcon from '@mui/icons-material/Groups';
 import MeetingRoomIcon from '@mui/icons-material/MeetingRoom';
+import Typography from "@mui/material/Typography";
+
 
 const i18nNamespaces = ['common']
 
@@ -36,6 +38,16 @@ export default async function GroupPage({ params }: { params: { locale: any, pro
                 >
                     {t("return_project")}
                 </Button>
+                <Typography
+                    variant="h3"
+                    sx={{
+                        fontWeight: 'medium',
+                        marginTop: 2,
+                        marginBottom: 2
+                    }}
+                >
+                    {t('groups')}
+                </Typography>
                 <ListView
                     admin={true}
                     headers={headers}