From b786c588cd652829b2538c42fc97c31ecf1260d4 Mon Sep 17 00:00:00 2001 From: warre Date: Thu, 23 May 2024 17:47:51 +0200 Subject: [PATCH 1/5] student overview --- frontend/src/App.tsx | 4 +- .../Courses/CourseDetailStudent.tsx | 100 ++++++++++++++++++ .../Courses/CourseDetailTeacher.tsx | 7 +- .../src/components/Courses/CourseUtils.tsx | 3 +- .../src/components/Courses/CoursesDetail.tsx | 20 ++++ 5 files changed, 128 insertions(+), 6 deletions(-) create mode 100644 frontend/src/components/Courses/CourseDetailStudent.tsx create mode 100644 frontend/src/components/Courses/CoursesDetail.tsx diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index c3a967a0..53c4d5ec 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -6,7 +6,6 @@ import { } from "react-router-dom"; import Layout from "./components/Header/Layout"; import { AllCoursesTeacher } from "./components/Courses/AllCoursesTeacher"; -import { CourseDetailTeacher } from "./components/Courses/CourseDetailTeacher"; import { dataLoaderCourseDetail, dataLoaderCourses, @@ -23,6 +22,7 @@ import { synchronizeJoinCode } from "./loaders/join-code.ts"; import { fetchMe } from "./utils/fetches/FetchMe.ts"; import {fetchProjectForm} from "./components/ProjectForm/project-form.ts"; import loadSubmissionOverview from "./loaders/submission-overview-loader.ts"; +import CoursesDetail from "./components/Courses/CoursesDetail.tsx"; const router = createBrowserRouter( createRoutesFromElements( @@ -38,7 +38,7 @@ const router = createBrowserRouter( } loader={dataLoaderCourses}/> - } loader={dataLoaderCourseDetail} /> + } loader={dataLoaderCourseDetail} /> + + + + +
+ {t("projects")}: + +
+ + + + + + + {t("admins")}: + + {adminMes.map((admin: Me) => ( + + + + {admin.display_name} + + + + + ))} + + + + + + + + ); + } + + \ No newline at end of file diff --git a/frontend/src/components/Courses/CourseDetailTeacher.tsx b/frontend/src/components/Courses/CourseDetailTeacher.tsx index 80142e00..a05247bb 100644 --- a/frontend/src/components/Courses/CourseDetailTeacher.tsx +++ b/frontend/src/components/Courses/CourseDetailTeacher.tsx @@ -113,7 +113,7 @@ function handleDeleteCourse( * * @returns A jsx component representing the course detail page for a teacher */ -export function CourseDetailTeacher(): JSX.Element { +export default function CourseDetailTeacher() { const [selectedStudents, setSelectedStudents] = useState([]); const [anchorEl, setAnchorElStudent] = useState(null); const openCodes = Boolean(anchorEl); @@ -129,8 +129,9 @@ export function CourseDetailTeacher(): JSX.Element { projects: ProjectDetail[]; adminMes: Me[]; studentMes: Me[]; + me:Me; }; - const { course, projects, adminMes, studentMes } = courseDetail; + const { course, projects, adminMes, studentMes,me } = courseDetail; const { t } = useTranslation("translation", { keyPrefix: "courseDetailTeacher", }); @@ -276,7 +277,7 @@ export function CourseDetailTeacher(): JSX.Element { * @param projects - The array of projects. * @returns Either a place holder for no projects or a grid of cards describing the projects. */ -function EmptyOrNotProjects({ +export function EmptyOrNotProjects({ projects, }: { projects: ProjectDetail[]; diff --git a/frontend/src/components/Courses/CourseUtils.tsx b/frontend/src/components/Courses/CourseUtils.tsx index 118f8b88..8525f930 100644 --- a/frontend/src/components/Courses/CourseUtils.tsx +++ b/frontend/src/components/Courses/CourseUtils.tsx @@ -247,5 +247,6 @@ export const dataLoaderCourseDetail = async ({ const student_uids = students.map((student: {uid: string}) => getIdFromLink(student.uid)); const adminMes = await fetchMes([course.teacher, ...admin_uids]); const studentMes = await fetchMes(student_uids); - return { course, projects, adminMes, studentMes }; + const me = await fetchMe(); + return { course, projects, adminMes, studentMes, me}; }; diff --git a/frontend/src/components/Courses/CoursesDetail.tsx b/frontend/src/components/Courses/CoursesDetail.tsx new file mode 100644 index 00000000..5047d388 --- /dev/null +++ b/frontend/src/components/Courses/CoursesDetail.tsx @@ -0,0 +1,20 @@ +import {useLoaderData} from "react-router-dom"; +import {Me} from "../../types/me.ts"; +import {Course, ProjectDetail} from "./CourseUtils.tsx"; +import CourseDetailTeacher from "./CourseDetailTeacher.tsx"; +import CourseDetailStudent from "./CourseDetailStudent.tsx"; + +export default function CoursesDetail() :JSX.Element { + const loader = useLoaderData() as { + course: Course; + projects: ProjectDetail[]; + adminMes: Me[]; + studentMes: Me[]; + me:Me; + }; + if (loader.me.role == "TEACHER") { + return ; + } else { + return ; + } +} \ No newline at end of file From 1fee165a417c188231a40e6583470558b3fd2e37 Mon Sep 17 00:00:00 2001 From: warre Date: Thu, 23 May 2024 17:50:59 +0200 Subject: [PATCH 2/5] linter --- frontend/src/components/Courses/CourseDetailTeacher.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/src/components/Courses/CourseDetailTeacher.tsx b/frontend/src/components/Courses/CourseDetailTeacher.tsx index a05247bb..4b512ccc 100644 --- a/frontend/src/components/Courses/CourseDetailTeacher.tsx +++ b/frontend/src/components/Courses/CourseDetailTeacher.tsx @@ -131,7 +131,7 @@ export default function CourseDetailTeacher() { studentMes: Me[]; me:Me; }; - const { course, projects, adminMes, studentMes,me } = courseDetail; + const { course, projects, adminMes, studentMes } = courseDetail; const { t } = useTranslation("translation", { keyPrefix: "courseDetailTeacher", }); From 3164bb8cdbd9023aa26ef3fb304b5a632a64ec88 Mon Sep 17 00:00:00 2001 From: warre Date: Thu, 23 May 2024 17:54:03 +0200 Subject: [PATCH 3/5] linter --- .../Courses/CourseDetailStudent.tsx | 158 +++++++++--------- 1 file changed, 76 insertions(+), 82 deletions(-) diff --git a/frontend/src/components/Courses/CourseDetailStudent.tsx b/frontend/src/components/Courses/CourseDetailStudent.tsx index b17f9ee5..9a211db2 100644 --- a/frontend/src/components/Courses/CourseDetailStudent.tsx +++ b/frontend/src/components/Courses/CourseDetailStudent.tsx @@ -1,100 +1,94 @@ import { - Grid, - Paper, - Typography, - } from "@mui/material"; - import { useTranslation } from "react-i18next"; - import { - Course, ProjectDetail, - } from "./CourseUtils"; - import { - useLoaderData, - } from "react-router-dom"; - import { Title } from "../Header/Title"; - import { Me } from "../../types/me"; - import {EmptyOrNotProjects} from "./CourseDetailTeacher" - - + Grid, + Paper, + Typography, +} from "@mui/material"; +import { useTranslation } from "react-i18next"; +import { + Course, ProjectDetail, +} from "./CourseUtils"; +import { + useLoaderData, +} from "react-router-dom"; +import { Title } from "../Header/Title"; +import { Me } from "../../types/me"; +import {EmptyOrNotProjects} from "./CourseDetailTeacher" - /** - * - * @returns A jsx component representing the course detail page for a teacher - */ - export default function CourseDetailStudent() { - - +/** + * + * @returns A jsx component representing the course detail page for a teacher + */ +export default function CourseDetailStudent() { - const courseDetail = useLoaderData() as { + const courseDetail = useLoaderData() as { course: Course; projects: ProjectDetail[]; adminMes: Me[]; studentMes: Me[]; me:Me; }; - const { course, projects, adminMes } = courseDetail; - const { t } = useTranslation("translation", { - keyPrefix: "courseDetailTeacher", - }); + const { course, projects, adminMes } = courseDetail; + const { t } = useTranslation("translation", { + keyPrefix: "courseDetailTeacher", + }); - return ( - <> - - - - + + + + +
+ {t("projects")}: + +
+ + + + + -
- {t("projects")}: - -
- - - - - - - {t("admins")}: - - {adminMes.map((admin: Me) => ( - - - - {admin.display_name} - - - + {t("admins")}: + + {adminMes.map((admin: Me) => ( + + + + {admin.display_name} + - ))} - - - + + + ))} + + - - ); - } - - \ No newline at end of file + + + ); +} From 5f80da2f1f83d91b3988e46acc8951b989ea9581 Mon Sep 17 00:00:00 2001 From: warre Date: Thu, 23 May 2024 17:55:45 +0200 Subject: [PATCH 4/5] linter --- frontend/src/components/Courses/CoursesDetail.tsx | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/frontend/src/components/Courses/CoursesDetail.tsx b/frontend/src/components/Courses/CoursesDetail.tsx index 5047d388..805e1680 100644 --- a/frontend/src/components/Courses/CoursesDetail.tsx +++ b/frontend/src/components/Courses/CoursesDetail.tsx @@ -4,6 +4,10 @@ import {Course, ProjectDetail} from "./CourseUtils.tsx"; import CourseDetailTeacher from "./CourseDetailTeacher.tsx"; import CourseDetailStudent from "./CourseDetailStudent.tsx"; +/** + * gives the right detail page + * @returns - detail page + */ export default function CoursesDetail() :JSX.Element { const loader = useLoaderData() as { course: Course; From d611c18f7f5d7093d6a785a2519a029921ec8882 Mon Sep 17 00:00:00 2001 From: warre Date: Thu, 23 May 2024 19:09:11 +0200 Subject: [PATCH 5/5] check if teacher --- frontend/src/components/Courses/CoursesDetail.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/src/components/Courses/CoursesDetail.tsx b/frontend/src/components/Courses/CoursesDetail.tsx index 805e1680..a697f58b 100644 --- a/frontend/src/components/Courses/CoursesDetail.tsx +++ b/frontend/src/components/Courses/CoursesDetail.tsx @@ -16,7 +16,7 @@ export default function CoursesDetail() :JSX.Element { studentMes: Me[]; me:Me; }; - if (loader.me.role == "TEACHER") { + if (loader.course.teacher === loader.me.uid) { return ; } else { return ;