From b493c78822305da2cbd407090f6bbee5f17e5f3a Mon Sep 17 00:00:00 2001
From: Ruben Vandamme <ruben.vandamme@ugent.be>
Date: Wed, 22 May 2024 21:01:55 +0200
Subject: [PATCH 1/4] submit right bottom

---
 .../src/assets/styles/students_components.css |  9 ++++++
 .../src/assets/styles/teacher_components.css  |  3 +-
 .../components/ProjectStudentComponent.tsx    | 31 ++++++++++++-------
 .../components/ProjectTeacherComponent.tsx    | 12 +++++--
 .../src/pages/teacher/ProjectViewTeacher.tsx  |  2 +-
 frontend/src/utils/ScrollBarWidth.ts          | 12 +++++++
 6 files changed, 53 insertions(+), 16 deletions(-)
 create mode 100644 frontend/src/utils/ScrollBarWidth.ts

diff --git a/frontend/src/assets/styles/students_components.css b/frontend/src/assets/styles/students_components.css
index 9ced25c3..760c84ae 100644
--- a/frontend/src/assets/styles/students_components.css
+++ b/frontend/src/assets/styles/students_components.css
@@ -92,4 +92,13 @@
 .fixated-filler {
     height: 60px;
     background-color: white;
+}
+
+.file-chooser-first {
+    border-top-right-radius: 0px !important;
+    border-bottom-right-radius: 0px !important;
+}
+.file-chooser-second {
+    border-top-left-radius: 0px !important;
+    border-bottom-left-radius: 0px !important;
 }
\ No newline at end of file
diff --git a/frontend/src/assets/styles/teacher_components.css b/frontend/src/assets/styles/teacher_components.css
index 2cb103a2..9818855c 100644
--- a/frontend/src/assets/styles/teacher_components.css
+++ b/frontend/src/assets/styles/teacher_components.css
@@ -6,11 +6,10 @@
 
 .create-project-topbar {
     position: fixed;
-    width: calc(100% - var(--sidebar-width) - 20px);
     z-index: 10;
     background-color: white;
     padding: 10px 20px;
-    display:flex
+    display: flex;
 }
 
 .create-project-content {
diff --git a/frontend/src/components/ProjectStudentComponent.tsx b/frontend/src/components/ProjectStudentComponent.tsx
index b4cabb74..38ac8406 100644
--- a/frontend/src/components/ProjectStudentComponent.tsx
+++ b/frontend/src/components/ProjectStudentComponent.tsx
@@ -291,19 +291,29 @@ export default function ProjectStudentComponent(props: { project: ProjectStudent
                             <ul className="field">
                                 <div className="submission-file-download-upload">
 
-                                    {newSelectedFile &&
-                                        <label className={"mr-3"}>{file?.name}</label>
-                                    }
-                                    <div id="file-js" className="field is-horizontal">
+                                    <div id="file-js" className="field is-horizontal ">
                                         <label className="file-label">
+
                                             <input className="file-input" type="file" name="resume"
                                                    ref={fileInputRef}
-                                                   onChange={selectFile}/>
-                                            <span className="file-cta">
-                                                <span className="file-icon"><FaUpload/></span>
-                                                <span
-                                                    className="file-label">{t('project.submission.choose_file')}</span>
+                                                   onChange={selectFile}
+                                            />
+
+                                            <span className="file-cta file-chooser-first">
+                                                <span className="file-icon">
+                                                    <FaUpload/>
+                                                </span>
+                                                <span className="file-label">
+                                                    {t('project.submission.choose_file')}
+                                                </span>
                                             </span>
+                                            
+                                            {newSelectedFile &&
+                                                <span className={"file-name mr-3 file-chooser-second"}>
+                                                    {file?.name}
+                                                </span>
+                                            }
+
                                         </label>
                                     </div>
                                     {submission != null &&
@@ -320,14 +330,13 @@ export default function ProjectStudentComponent(props: { project: ProjectStudent
                 </>}
             {newSelectedFile && hasGroup &&
             <div>
-                <div className={"fixated is-flex is-justify-content-start"}>
+                <div className={"is-flex is-justify-content-end"}>
                     <RegularButton
                         placeholder={t('project.submit')}
                         add={false}
                         onClick={() => void submitFile()}
                         styling="is-primary"/>
                 </div>
-                <div className="fixated-filler"/>
             </div>}
             <div className="p-5"/>
 
diff --git a/frontend/src/components/ProjectTeacherComponent.tsx b/frontend/src/components/ProjectTeacherComponent.tsx
index eb40d55d..59de9b82 100644
--- a/frontend/src/components/ProjectTeacherComponent.tsx
+++ b/frontend/src/components/ProjectTeacherComponent.tsx
@@ -14,6 +14,7 @@ import {RegularButton} from "./RegularButton.tsx";
 import {FaDownload} from "react-icons/fa6";
 import _ from 'lodash';
 import { FaEraser } from "react-icons/fa";
+import { getScrollbarWidth } from "../utils/ScrollBarWidth.ts";
 
 export function ProjectTeacherComponent(props: { 
     project: ProjectTeacher, 
@@ -148,9 +149,16 @@ export function ProjectTeacherComponent(props: {
         document.body.removeChild(a);
     }
 
+    const [width, setWidth] = useState<string>('100%');
+    useEffect(() => {
+      const scrollbarWidth = getScrollbarWidth();
+      setWidth(`calc(100vw - var(--sidebar-width) - ${scrollbarWidth}px)`);
+      console.log(scrollbarWidth)
+    }, []);
+
     return (
         <div className={"create-project"}>
-            <div className={"create-project-topbar"}>
+            <div className={"create-project-topbar"} style={{width}}>
                 <RegularButton placeholder={t('project.save')} add={false} onClick={() => {}} 
                     disabled={!allowSaveButton()}
                     primary={allowSaveButton()}/> {/* TODO: implement save */}
@@ -172,7 +180,7 @@ export function ProjectTeacherComponent(props: {
                         <span>{t('download.download_all')}</span>
                     </button>
                 }
-            </div>  
+            </div>
             <div className={"create-project-content"}>
                 {/* PROJECT NAME FIELD */}
                 <div className={"field is-horizontal"}>
diff --git a/frontend/src/pages/teacher/ProjectViewTeacher.tsx b/frontend/src/pages/teacher/ProjectViewTeacher.tsx
index 7988174f..72d3ce8f 100644
--- a/frontend/src/pages/teacher/ProjectViewTeacher.tsx
+++ b/frontend/src/pages/teacher/ProjectViewTeacher.tsx
@@ -65,7 +65,7 @@ export default function ProjectViewTeacher() {
                 <div className={"side-bar is-flex is-justify-content-center"}>
                     <Sidebar home={"teacher"}/>
                 </div>
-                <div className={"student-main my-3 is-flex is-flex-direction-column"}>
+                <div className={"student-main is-flex is-flex-direction-column"}>
                     <ProjectTeacherComponent 
                         project={project} 
                         submission_statistics={project_data.submission_statistics} 
diff --git a/frontend/src/utils/ScrollBarWidth.ts b/frontend/src/utils/ScrollBarWidth.ts
new file mode 100644
index 00000000..1fb9485b
--- /dev/null
+++ b/frontend/src/utils/ScrollBarWidth.ts
@@ -0,0 +1,12 @@
+export const getScrollbarWidth = (): number => {
+    const div = document.createElement('div');
+    div.style.overflow = 'scroll';
+    div.style.width = '100px';
+    div.style.height = '100px';
+    div.style.position = 'absolute';
+    div.style.top = '-9999px';
+    document.body.appendChild(div);
+    const scrollbarWidth = div.offsetWidth - div.clientWidth;
+    document.body.removeChild(div);
+    return scrollbarWidth;
+  };
\ No newline at end of file

From 0a61d367bf86d00ef8c200c81e0e2933e25c9d19 Mon Sep 17 00:00:00 2001
From: Ruben Vandamme <ruben.vandamme@ugent.be>
Date: Wed, 22 May 2024 21:53:15 +0200
Subject: [PATCH 2/4] constraints

---
 frontend/public/locales/en/translation.json   | 18 +++++----
 frontend/public/locales/nl/translation.json   | 18 +++++----
 .../assets/styles/SimpleTests/information.css |  2 +-
 .../styles/SimpleTests/simple_checks.css      | 17 ++++++++
 .../src/assets/styles/teacher_components.css  |  6 +++
 .../components/ProjectTeacherComponent.tsx    | 39 ++++++++++---------
 .../components/SimpleTests/SimpleTests.tsx    | 35 ++++++++++++-----
 frontend/src/pages/teacher/CreateProject.tsx  |  2 +-
 8 files changed, 93 insertions(+), 44 deletions(-)

diff --git a/frontend/public/locales/en/translation.json b/frontend/public/locales/en/translation.json
index 0096b8cf..eded2ca0 100644
--- a/frontend/public/locales/en/translation.json
+++ b/frontend/public/locales/en/translation.json
@@ -100,12 +100,15 @@
         },
         "menu": {
             "remove": "remove",
-            "file": "FILE",
-            "directory": "DIRECTORY",
-            "zip": "ZIP",
-            "not_present": "NOT_PRESENT",
-            "extension_not_present": "EXTENSION_NOT_PRESENT",
-            "extension_only_present": "EXTENSION_ONLY_PRESENT"
+            "file": "to 'file'",
+            "directory": "to 'directory'",
+            "zip": "to 'zip'",
+            "not_present": "to 'not present'",
+            "extension_not_present": "to 'extension not present'",
+            "extension_only_present": "to 'extension only present'",
+            "info-not_present": "this name may not appear in the zip/folder in which this constraint is located",
+            "info-extension_not_present": "files with this extension may not appear in the zip/folder in which this constraint is located",
+            "info-extension_only_present": "in the zip/folder in which this constraint is located, only files with this extension are allowed"
         },
         "warning_change_root": {
             "type_switch": "All current file-specifications will be removed. Are you sure you want to change the type of the root?"
@@ -116,6 +119,7 @@
         "information": {
             "title": "Information",
             "constraints": "You can edit the value of a contraint by clicking on it. By hovering over a constraint, more operations will appear.",
+            "global-local": "Global constraints apply to all files in the submission. Local constraints only apply in the zip/folder in which they are located.",
             "extensions": "Please begin extension names with a dot.",
             "color_codes": {
                 "title": "color codes:",
@@ -170,7 +174,7 @@
             "name": "Name",
             "email": "Email",
             "latest_submission": "Latest submission",
-            "amount_of_members": "Amount of members per group"
+            "amount_of_members": "Amount of members per group:"
         },
         "submission": {
             "tag": "Submission",
diff --git a/frontend/public/locales/nl/translation.json b/frontend/public/locales/nl/translation.json
index a06d88f4..0ab47578 100644
--- a/frontend/public/locales/nl/translation.json
+++ b/frontend/public/locales/nl/translation.json
@@ -100,12 +100,15 @@
     },
     "menu": {
       "remove": "verwijderen",
-      "file": "BESTAND",
-      "directory": "FOLDER",
-      "zip": "ZIP",
-      "not_present": "NIET_AANWEZIG",
-      "extension_not_present": "EXTENSIE_NIET_AANWEZIG",
-      "extension_only_present": "EXTENSIE_ENKEL_AANWEZIG"
+      "file": "maak 'bestand'",
+      "directory": "maak 'folder'",
+      "zip": "maak 'zip'",
+      "not_present": "maak 'niet-aanwezig'",
+      "extension_not_present": "maak 'extensie niet aanwezig'",
+      "extension_only_present": "maak 'extensie enkel aanwezig'",
+      "info-not_present": "deze naam mag niet voorkomen in zip/folder waarin deze voorwaarde zich bevindt",
+      "info-extension_not_present": "files met deze extensie mogen niet voorkomen in zip/folder waarin deze voorwaarde zich bevindt",
+      "info-extension_only_present": "in zip/folder waarin deze voorwaarde zich bevindt mogen enkel files met deze extensie komen"
     },
     "warning_change_root": {
       "type_switch": "Alle huidige bestand-specificaties zullen verwijderd worden. Ben je zeker dat je het type van de root wil veranderen"
@@ -113,6 +116,7 @@
     "information": {
       "title": "Informatie",
       "constraints": "Je kan de waarde van een voorwaarde veranderen door er op te klikken. Beweeg je cursor over een voorwaarde om meer opties te krijgen.",
+      "global-local": "Globale voorwaarden worden toegepast op alle bestanden in de indiening. Lokale voorwaarden slechts in de zip/folder waarin ze zich bevinden.",
       "extensions": "Begin extensie-namen telkens met een punt.",
       "color_codes": {
         "title": "kleurencodes:",
@@ -167,7 +171,7 @@
       "name": "Naam",
       "email": "Email",
       "latest_submission": "Laatste indiening",
-      "amount_of_members": "Aantal leden per groep"
+      "amount_of_members": "Aantal leden per groep:"
     },
     "submission": {
       "tag": "Indiening",
diff --git a/frontend/src/assets/styles/SimpleTests/information.css b/frontend/src/assets/styles/SimpleTests/information.css
index 3fc58469..0a2d38f4 100644
--- a/frontend/src/assets/styles/SimpleTests/information.css
+++ b/frontend/src/assets/styles/SimpleTests/information.css
@@ -40,6 +40,6 @@
     word-wrap: break-word;
     white-space: pre-wrap;
     word-break: break-word;
-    max-height: 250px;
+    max-height: 400px;
     overflow-y: auto;
 }
diff --git a/frontend/src/assets/styles/SimpleTests/simple_checks.css b/frontend/src/assets/styles/SimpleTests/simple_checks.css
index b5a4332d..735f4bcf 100644
--- a/frontend/src/assets/styles/SimpleTests/simple_checks.css
+++ b/frontend/src/assets/styles/SimpleTests/simple_checks.css
@@ -127,12 +127,29 @@
 }
 .NOT_PRESENT {
     text-shadow: 2px 2px 4px rgba(0, 4, 255, 0.7);
+    min-width: 130px;
+    margin-right: 20px;
 }
 .EXTENSION_NOT_PRESENT {
     text-shadow: 2px 2px 4px rgba(0, 255, 55, 0.7);
+    min-width: 130px;
+    margin-right: 20px;
 }
 .EXTENSION_ONLY_PRESENT {
     text-shadow: 2px 2px 4px rgba(255, 4, 0, 0.7);
+    min-width: 130px;
+    margin-right: 20px;
+}
+
+.info-colorcodes-row {
+    display: flex;
+    flex-direction: row;
+}
+
+.bullet-list > *::before {
+    content: "• "; /* Unicode bullet character */
+    margin-right: 0.5em; /* Space between bullet and text */
+    color: black; /* Bullet color */
 }
 
 /* =============================================== */
diff --git a/frontend/src/assets/styles/teacher_components.css b/frontend/src/assets/styles/teacher_components.css
index 9818855c..bd660d4d 100644
--- a/frontend/src/assets/styles/teacher_components.css
+++ b/frontend/src/assets/styles/teacher_components.css
@@ -50,4 +50,10 @@
     border: solid !important;
     border-width: 1px !important;
     border-color: hsla(0, 0%, 0%, 0.15) !important;
+}
+
+.teamwork {
+    display: flex;
+    flex-direction: column;
+    gap: 5px;
 }
\ No newline at end of file
diff --git a/frontend/src/components/ProjectTeacherComponent.tsx b/frontend/src/components/ProjectTeacherComponent.tsx
index 59de9b82..4f0f813c 100644
--- a/frontend/src/components/ProjectTeacherComponent.tsx
+++ b/frontend/src/components/ProjectTeacherComponent.tsx
@@ -15,11 +15,13 @@ import {FaDownload} from "react-icons/fa6";
 import _ from 'lodash';
 import { FaEraser } from "react-icons/fa";
 import { getScrollbarWidth } from "../utils/ScrollBarWidth.ts";
+import Switch from "react-switch";
 
 export function ProjectTeacherComponent(props: { 
     project: ProjectTeacher, 
     submission_statistics: {[key: number]: number} | undefined,
     download_all_submissions: (() => Promise<void>) | undefined
+    is_new?: boolean 
 }): JSX.Element {
 
     const {t} = useTranslation();
@@ -84,7 +86,7 @@ export function ProjectTeacherComponent(props: {
         const second_part_2 = (initialValues.value5 as Date).toDateString();
         const second_part = _.isEqual(second_part_1, second_part_2);
         const third_part = groupProject && Number.isNaN(max_students);
-        return !((first_part && second_part) || third_part);
+        return projectName !== "" && (props.is_new === true || !((first_part && second_part) || third_part));
     }
 
     const expandGroup = (checked: boolean) => {
@@ -314,25 +316,26 @@ export function ProjectTeacherComponent(props: {
                     <div className="field-label">
                         <label className="label">{t('create_project.teamwork.tag')}</label>
                     </div>
-                    <div className="field-body is-fullwidth is-align-content-center">
-                        <label>
-                            <input type="checkbox" onChange={e => expandGroup(e.target.checked)}
-                                checked={groupProject}/>
-                        </label>
+                    <div className="field-body is-fullwidth is-align-content-center teamwork">
+
+                        <Switch 
+                            type="checkbox"
+                            onColor="#006edc"
+                            checked={groupProject} 
+                            onChange={e => expandGroup(e)}
+                        />
 
                         {showGroup &&
-                            <div>
-                                <div className="field is-horizontal ml-6">
-                                    <label
-                                        className="label mr-3 is-align-content-center">{t('project.groupmembers.amount_of_members')}</label>
-                                    <input
-                                        style={{width: "30%"}}
-                                        className={"input is-rounded"}
-                                        type="number"
-                                        value={max_students}
-                                        onChange={e => setMaxStudents(parseInt(e.target.value))}
-                                    />
-                                </div>
+                            <div className="field is-horizontal">
+                                <label
+                                    className="mr-3 is-align-content-center">{t('project.groupmembers.amount_of_members')}</label>
+                                <input
+                                    style={{width: "75px"}}
+                                    className={"input is-rounded"}
+                                    type="number"
+                                    value={max_students}
+                                    onChange={e => setMaxStudents(parseInt(e.target.value))}
+                                />
                             </div>
                         }
                     </div>
diff --git a/frontend/src/components/SimpleTests/SimpleTests.tsx b/frontend/src/components/SimpleTests/SimpleTests.tsx
index 2315ad9c..dd76da91 100644
--- a/frontend/src/components/SimpleTests/SimpleTests.tsx
+++ b/frontend/src/components/SimpleTests/SimpleTests.tsx
@@ -251,15 +251,15 @@ export default function SimpleTests(props: {
     const [submission,      setSubmission     ] = useState<Submission>(json_to_submission(init_submission_ref.current));
     const [isZip,           setIsZip          ] = useState<boolean>(submission.type === 'ZIP');
     const [isHovering,      setIsHovering     ] = useState<number | undefined>(undefined);
-    const [isExpanded,      setIsExpanded     ] = useState<Map<number, boolean>>(new Map( get_all_ids(submission).map(id => [id, false])));
-    const [isShown,         setIsShown        ] = useState<Map<number, boolean>>(new Map( get_all_ids(submission).map(id => [id, false])));
+    const [isExpanded,      setIsExpanded     ] = useState<Map<number, boolean>>(new Map( get_all_ids(submission).map(id => [id, true])));
+    const [isShown,         setIsShown        ] = useState<Map<number, boolean>>(new Map( get_all_ids(submission).map(id => [id, true])));
     const [isMenuOpen,      setIsMenuOpen     ] = useState<Map<number, boolean>>(new Map( get_all_ids(submission).map(id => [id, false])));
     const [isGlobalAddOpen, setIsGlobalAddOpen] = useState<boolean>(false);
 
     useEffect(() => {
         if (submission.type === 'ZIP') {
             const zip = submission.submission as Zip;
-            setIsShown(structuredClone(isShown.set(zip.self_constraint.id, true))); /* we laten de root constraint zien */
+            //setIsShown(structuredClone(isShown.set(zip.self_constraint.id, true))); /* we laten de root constraint zien */
             setIsHovering(zip.self_constraint.id);
         }
     }, []);
@@ -574,6 +574,12 @@ export default function SimpleTests(props: {
 
                                             <br/>
 
+                                            <div>
+                                                {t('submission_files.information.global-local')}
+                                            </div>
+
+                                            <br/>
+
                                             <div>
                                                 {t('submission_files.information.extensions')}
                                             </div>
@@ -583,13 +589,22 @@ export default function SimpleTests(props: {
                                     }
                                     
                                     <div>{t('submission_files.information.color_codes.title')}</div>
-                                    <div className="color-codes">
-                                        <li className="FILE">{t('submission_files.information.color_codes.file')}</li>
-                                        <li className="DIRECTORY">{t('submission_files.information.color_codes.directory')}</li>
-                                        <li className="ZIP">{t('submission_files.information.color_codes.zip')}</li>
-                                        <li className="NOT_PRESENT">{t('submission_files.information.color_codes.not_present')}</li>
-                                        <li className="EXTENSION_NOT_PRESENT">{t('submission_files.information.color_codes.extension_not_present')}</li>
-                                        <li className="EXTENSION_ONLY_PRESENT">{t('submission_files.information.color_codes.extension_only_present')}</li>
+                                    <div className="color-codes bullet-list">
+                                        <div className="FILE">{t('submission_files.information.color_codes.file')}</div>
+                                        <div className="DIRECTORY">{t('submission_files.information.color_codes.directory')}</div>
+                                        <div className="ZIP">{t('submission_files.information.color_codes.zip')}</div>
+                                        <div className="info-colorcodes-row">
+                                            <div className="NOT_PRESENT">{t('submission_files.information.color_codes.not_present')}</div>
+                                            <div>({t('submission_files.menu.info-not_present')})</div>
+                                        </div>
+                                        <div className="info-colorcodes-row">
+                                            <div className="EXTENSION_NOT_PRESENT">{t('submission_files.information.color_codes.extension_not_present')}</div>
+                                            <div>({t('submission_files.menu.info-extension_not_present')})</div>
+                                        </div>
+                                        <div className="info-colorcodes-row">
+                                            <div className="EXTENSION_ONLY_PRESENT">{t('submission_files.information.color_codes.extension_only_present')}</div>
+                                            <div>({t('submission_files.menu.info-extension_only_present')})</div>
+                                        </div>
                                     </div>
                                 </div>
                             } 
diff --git a/frontend/src/pages/teacher/CreateProject.tsx b/frontend/src/pages/teacher/CreateProject.tsx
index 8dc95911..ebb7bd8f 100644
--- a/frontend/src/pages/teacher/CreateProject.tsx
+++ b/frontend/src/pages/teacher/CreateProject.tsx
@@ -51,7 +51,7 @@ export function CreateProject(): JSX.Element {
                     <Sidebar home={"teacher"}/>
                 </div>
                 <div className={"student-main is-flex is-flex-direction-column"}>
-                    <ProjectTeacherComponent project={emptyProjectTeacher} submission_statistics={undefined} download_all_submissions={undefined}/>
+                    <ProjectTeacherComponent project={emptyProjectTeacher} submission_statistics={undefined} download_all_submissions={undefined} is_new={true}/>
                 </div>
             </div>
         </>

From 9aa04a7ef0e92e5ac1ddafea6e8df156bcdaf9a1 Mon Sep 17 00:00:00 2001
From: Ruben Vandamme <ruben.vandamme@ugent.be>
Date: Wed, 22 May 2024 23:46:54 +0200
Subject: [PATCH 3/4] re-add submitted translation

---
 frontend/public/locales/en/translation.json | 1 +
 1 file changed, 1 insertion(+)

diff --git a/frontend/public/locales/en/translation.json b/frontend/public/locales/en/translation.json
index eded2ca0..3dee8916 100644
--- a/frontend/public/locales/en/translation.json
+++ b/frontend/public/locales/en/translation.json
@@ -183,6 +183,7 @@
         "confirm": "Confirm",
         "save": "Save",
         "submit": "Submit",
+        "submitted": "The submission has been successful",
         "failed-submission": "The submission failed with error:",
         "download-current": "Download latest submission",
         "failed": "Failed",

From f394d1ff807f2c4162ba4dd06eadba16a9132b3b Mon Sep 17 00:00:00 2001
From: Matthias Seghers <matthias.h.seghers@gmail.com>
Date: Thu, 23 May 2024 10:12:21 +0200
Subject: [PATCH 4/4] re-moved the save button

---
 .../components/ProjectStudentComponent.tsx    | 39 +++++++------------
 1 file changed, 15 insertions(+), 24 deletions(-)

diff --git a/frontend/src/components/ProjectStudentComponent.tsx b/frontend/src/components/ProjectStudentComponent.tsx
index 38ac8406..63cc3331 100644
--- a/frontend/src/components/ProjectStudentComponent.tsx
+++ b/frontend/src/components/ProjectStudentComponent.tsx
@@ -13,7 +13,7 @@ import {make_submission} from "../utils/api/Submission.ts";
 import {joinGroup, leaveGroup} from "../utils/api/Groups.ts";
 import {getGroupInfo, loadGroupMembers} from "../dataloaders/ProjectsStudentLoader.ts";
 import SimpleTests from "./SimpleTests/SimpleTests.tsx";
-import { TeacherOrStudent } from "./SimpleTests/TeacherOrStudentEnum.tsx";
+import {TeacherOrStudent} from "./SimpleTests/TeacherOrStudentEnum.tsx";
 
 function ProjectInfo(props: { project: ProjectStudent }): JSX.Element {
     const {t} = useTranslation();
@@ -290,15 +290,18 @@ export default function ProjectStudentComponent(props: { project: ProjectStudent
                         <div className="field-body">
                             <ul className="field">
                                 <div className="submission-file-download-upload">
-
+                                    {submission != null &&
+                                        <button className="button" onClick={() => void downloadLatestSubmission()}>
+                                            <span className="mr-2"><FaDownload/></span>
+                                            <span>{t('project.download-current')}</span>
+                                        </button>
+                                    }
                                     <div id="file-js" className="field is-horizontal ">
                                         <label className="file-label">
-
                                             <input className="file-input" type="file" name="resume"
                                                    ref={fileInputRef}
                                                    onChange={selectFile}
                                             />
-
                                             <span className="file-cta file-chooser-first">
                                                 <span className="file-icon">
                                                     <FaUpload/>
@@ -307,39 +310,27 @@ export default function ProjectStudentComponent(props: { project: ProjectStudent
                                                     {t('project.submission.choose_file')}
                                                 </span>
                                             </span>
-                                            
                                             {newSelectedFile &&
                                                 <span className={"file-name mr-3 file-chooser-second"}>
                                                     {file?.name}
                                                 </span>
                                             }
-
                                         </label>
                                     </div>
-                                    {submission != null &&
-                                        <button className="button" onClick={() => void downloadLatestSubmission()}>
-                                            <span className="mr-2"><FaDownload/></span>
-                                            <span>{t('project.download-current')}</span>
-                                        </button>
-                                    }
-
+                                    {newSelectedFile && hasGroup &&
+                                        <div className={"is-flex is-justify-content-end"}>
+                                            <RegularButton
+                                                placeholder={t('project.submit')}
+                                                add={false}
+                                                onClick={() => void submitFile()}
+                                                styling="is-primary"/>
+                                        </div>}
                                 </div>
                             </ul>
                         </div>
                     </div>
                 </>}
-            {newSelectedFile && hasGroup &&
-            <div>
-                <div className={"is-flex is-justify-content-end"}>
-                    <RegularButton
-                        placeholder={t('project.submit')}
-                        add={false}
-                        onClick={() => void submitFile()}
-                        styling="is-primary"/>
-                </div>
-            </div>}
             <div className="p-5"/>
-
         </div>
     );
 }