From 853d5f602608a46fb80cb603908f275f2bc7154e Mon Sep 17 00:00:00 2001 From: gerwoud Date: Mon, 13 May 2024 13:22:16 +0200 Subject: [PATCH 1/5] score patch is working --- backend/project/endpoints/submissions/submission_detail.py | 1 - 1 file changed, 1 deletion(-) diff --git a/backend/project/endpoints/submissions/submission_detail.py b/backend/project/endpoints/submissions/submission_detail.py index 81b9c783..8574cfb3 100644 --- a/backend/project/endpoints/submissions/submission_detail.py +++ b/backend/project/endpoints/submissions/submission_detail.py @@ -107,7 +107,6 @@ def patch(self, submission_id:int) -> dict[str, any]: # Save the submission session.commit() - data["message"] = f"Submission (submission_id={submission_id}) patched" data["url"] = urljoin(f"{BASE_URL}/", str(submission.submission_id)) data["data"] = submission_response(submission, API_HOST) From 9e5339190a0eb63327b94d94157c8a3436e9b3fb Mon Sep 17 00:00:00 2001 From: gerwoud Date: Mon, 13 May 2024 13:25:53 +0200 Subject: [PATCH 2/5] changes --- .../ProjectSubmissionOverviewDatagrid.tsx | 31 ++++++++++++++++--- frontend/src/types/submission.ts | 1 + 2 files changed, 28 insertions(+), 4 deletions(-) diff --git a/frontend/src/components/ProjectSubmissionOverview/ProjectSubmissionOverviewDatagrid.tsx b/frontend/src/components/ProjectSubmissionOverview/ProjectSubmissionOverviewDatagrid.tsx index 171c7976..b80be6d1 100644 --- a/frontend/src/components/ProjectSubmissionOverview/ProjectSubmissionOverviewDatagrid.tsx +++ b/frontend/src/components/ProjectSubmissionOverview/ProjectSubmissionOverviewDatagrid.tsx @@ -1,4 +1,4 @@ -import { DataGrid, GridColDef, GridRenderCellParams } from "@mui/x-data-grid"; +import {DataGrid, GridColDef, GridRenderCellParams} from "@mui/x-data-grid"; import { Box, IconButton } from "@mui/material"; import CheckCircleIcon from "@mui/icons-material/CheckCircle"; import { green, red } from "@mui/material/colors"; @@ -27,9 +27,28 @@ const fetchSubmissionsFromUser = async (submission_id: string) => { }); }; +const editGrade = (submission: Submission, oldSubmission: Submission) => { + const submission_id = submission.submission_id; + const newGrade = submission.grading; + + if (newGrade < 0 || newGrade > 20) { + return oldSubmission; + } + + const formData = new FormData(); + formData.append('grading', newGrade.toString()); + + authenticatedFetch(`${APIURL}/submissions/${submission_id}`, { + method: "PATCH", + body: formData + }) + + return submission +}; + const columns: GridColDef[] = [ - { field: "submission_id", headerName: "Submission ID", flex: 0.4 }, - { field: "display_name", headerName: "Student", width: 160, flex: 0.4 }, + { field: "submission_id", headerName: "Submission ID", flex: 0.4, editable: false }, + { field: "display_name", headerName: "Student", width: 160, flex: 0.4, editable: false }, { field: "grading", headerName: "Grading", @@ -39,6 +58,7 @@ const columns: GridColDef[] = [ { field: "submission_status", headerName: "Status", + editable: false, renderCell: (params: GridRenderCellParams) => ( <> {params.row.submission_status === "SUCCESS" ? ( @@ -63,7 +83,7 @@ const columns: GridColDef[] = [ ]; /** - * @returns the datagrid for displaying submissiosn + * @returns the datagrid for displaying submissions */ export default function ProjectSubmissionsOverviewDatagrid({ submissions, @@ -78,6 +98,9 @@ export default function ProjectSubmissionsOverviewDatagrid({ columns={columns} pageSizeOptions={[20]} disableRowSelectionOnClick + processRowUpdate={(updatedRow, oldRow) => + editGrade(updatedRow, oldRow) + } /> ); diff --git a/frontend/src/types/submission.ts b/frontend/src/types/submission.ts index 4eab356f..173970d6 100644 --- a/frontend/src/types/submission.ts +++ b/frontend/src/types/submission.ts @@ -3,4 +3,5 @@ export interface Submission { submission_time: string; submission_status: string; uid: string; + grading: number; } From a2fbc0dfcc1d19f6a79fc5f4a38c995acacd98b0 Mon Sep 17 00:00:00 2001 From: gerwoud Date: Fri, 17 May 2024 10:01:13 +0200 Subject: [PATCH 3/5] added error message and i18n support --- .../public/locales/en/submissionOverview.json | 8 +- .../public/locales/nl/submissionOverview.json | 12 +++ .../locales/nl/submissionsOverview.json | 6 -- .../ProjectSubmissionOverviewDatagrid.tsx | 88 +++++++++++-------- 4 files changed, 68 insertions(+), 46 deletions(-) create mode 100644 frontend/public/locales/nl/submissionOverview.json delete mode 100644 frontend/public/locales/nl/submissionsOverview.json diff --git a/frontend/public/locales/en/submissionOverview.json b/frontend/public/locales/en/submissionOverview.json index 44ad27d3..97e1fc19 100644 --- a/frontend/public/locales/en/submissionOverview.json +++ b/frontend/public/locales/en/submissionOverview.json @@ -1,6 +1,12 @@ { "submissionOverview": { "submissionOverviewHeader": "Project status overview", - "downloadButton": "DOWNLOAD ALL PROJECTS" + "downloadButton": "DOWNLOAD ALL PROJECTS", + "scoreError": "Grade must be between 0 and 20", + "submissionID": "Submission ID", + "student": "Student", + "grading": "Grading", + "status": "Status", + "download": "Download" } } \ No newline at end of file diff --git a/frontend/public/locales/nl/submissionOverview.json b/frontend/public/locales/nl/submissionOverview.json new file mode 100644 index 00000000..e2b0cf35 --- /dev/null +++ b/frontend/public/locales/nl/submissionOverview.json @@ -0,0 +1,12 @@ +{ + "submissionOverview": { + "submissionOverviewHeader": "Project status overzicht", + "downloadButton": "DOWNLOAD ALLE PROJECTEN", + "scoreError": "Score moeten tussen 0 en 20 liggen", + "submissionID": "Indiening ID", + "student": "Student", + "grading": "Score", + "status": "Status", + "download": "Download" + } +} \ No newline at end of file diff --git a/frontend/public/locales/nl/submissionsOverview.json b/frontend/public/locales/nl/submissionsOverview.json deleted file mode 100644 index 1a2e172b..00000000 --- a/frontend/public/locales/nl/submissionsOverview.json +++ /dev/null @@ -1,6 +0,0 @@ -{ - "submissionOverview": { - "submissionOverviewHeader": "Project status overzicht", - "downloadButton": "DOWNLOAD ALLE PROJECTEN" - } -} \ No newline at end of file diff --git a/frontend/src/components/ProjectSubmissionOverview/ProjectSubmissionOverviewDatagrid.tsx b/frontend/src/components/ProjectSubmissionOverview/ProjectSubmissionOverviewDatagrid.tsx index b80be6d1..dba82126 100644 --- a/frontend/src/components/ProjectSubmissionOverview/ProjectSubmissionOverviewDatagrid.tsx +++ b/frontend/src/components/ProjectSubmissionOverview/ProjectSubmissionOverviewDatagrid.tsx @@ -1,4 +1,4 @@ -import {DataGrid, GridColDef, GridRenderCellParams} from "@mui/x-data-grid"; +import {DataGrid, GridRenderCellParams} from "@mui/x-data-grid"; import { Box, IconButton } from "@mui/material"; import CheckCircleIcon from "@mui/icons-material/CheckCircle"; import { green, red } from "@mui/material/colors"; @@ -7,6 +7,8 @@ import DownloadIcon from "@mui/icons-material/Download"; import download from "downloadjs"; import { authenticatedFetch } from "../../utils/authenticated-fetch"; import { Submission } from "../../types/submission"; +import {useTranslation} from "react-i18next"; +import {TFunction} from "i18next"; const APIURL = import.meta.env.VITE_APP_API_HOST; @@ -27,11 +29,12 @@ const fetchSubmissionsFromUser = async (submission_id: string) => { }); }; -const editGrade = (submission: Submission, oldSubmission: Submission) => { +const editGrade = (submission: Submission, oldSubmission: Submission, errorMessage: string) => { const submission_id = submission.submission_id; const newGrade = submission.grading; if (newGrade < 0 || newGrade > 20) { + alert(errorMessage); return oldSubmission; } @@ -46,41 +49,43 @@ const editGrade = (submission: Submission, oldSubmission: Submission) => { return submission }; -const columns: GridColDef[] = [ - { field: "submission_id", headerName: "Submission ID", flex: 0.4, editable: false }, - { field: "display_name", headerName: "Student", width: 160, flex: 0.4, editable: false }, - { - field: "grading", - headerName: "Grading", - editable: true, - flex: 0.2, - }, - { - field: "submission_status", - headerName: "Status", - editable: false, - renderCell: (params: GridRenderCellParams) => ( - <> - {params.row.submission_status === "SUCCESS" ? ( - - ) : ( - - )} - - ), - }, - { - field: "submission_path", - headerName: "Download", - renderCell: (params: GridRenderCellParams) => ( - fetchSubmissionsFromUser(params.row.submission_id)} - > - - - ), - }, -]; +const getTranslatedRows = (t: TFunction) => { + return [ + { field: "submission_id", headerName: t("submissionID"), flex: 0.4, editable: false }, + { field: "display_name", headerName: t("student"), width: 160, flex: 0.4, editable: false }, + { + field: "grading", + headerName: t("grading"), + editable: true, + flex: 0.2, + }, + { + field: "submission_status", + headerName: t("status"), + editable: false, + renderCell: (params: GridRenderCellParams) => ( + <> + {params.row.submission_status === "SUCCESS" ? ( + + ) : ( + + )} + + ), + }, + { + field: "submission_path", + headerName: t("download"), + renderCell: (params: GridRenderCellParams) => ( + fetchSubmissionsFromUser(params.row.submission_id)} + > + + + ), + }, + ]; +} /** * @returns the datagrid for displaying submissions @@ -90,16 +95,21 @@ export default function ProjectSubmissionsOverviewDatagrid({ }: { submissions: Submission[]; }) { + + const { t } = useTranslation('submissionOverview', { keyPrefix: 'submissionOverview' }); + + const errorMsg = t("scoreError"); + return ( - editGrade(updatedRow, oldRow) + editGrade(updatedRow, oldRow, errorMsg) } /> From f74ea45daaf697b134a0b9ccc2390f81d0e529dd Mon Sep 17 00:00:00 2001 From: gerwoud Date: Sat, 18 May 2024 22:34:06 +0200 Subject: [PATCH 4/5] added tooltip instead of alert :) --- .../ProjectSubmissionOverviewDatagrid.tsx | 54 ++++++++++++++++--- 1 file changed, 46 insertions(+), 8 deletions(-) diff --git a/frontend/src/components/ProjectSubmissionOverview/ProjectSubmissionOverviewDatagrid.tsx b/frontend/src/components/ProjectSubmissionOverview/ProjectSubmissionOverviewDatagrid.tsx index dba82126..ba1ce5e7 100644 --- a/frontend/src/components/ProjectSubmissionOverview/ProjectSubmissionOverviewDatagrid.tsx +++ b/frontend/src/components/ProjectSubmissionOverview/ProjectSubmissionOverviewDatagrid.tsx @@ -1,5 +1,11 @@ -import {DataGrid, GridRenderCellParams} from "@mui/x-data-grid"; -import { Box, IconButton } from "@mui/material"; +import { + DataGrid, + GridEditInputCell, + GridPreProcessEditCellProps, + GridRenderCellParams, + GridRenderEditCellParams +} from "@mui/x-data-grid"; +import {Box, IconButton, styled, Tooltip, tooltipClasses, TooltipProps} from "@mui/material"; import CheckCircleIcon from "@mui/icons-material/CheckCircle"; import { green, red } from "@mui/material/colors"; import CancelIcon from "@mui/icons-material/Cancel"; @@ -9,7 +15,6 @@ import { authenticatedFetch } from "../../utils/authenticated-fetch"; import { Submission } from "../../types/submission"; import {useTranslation} from "react-i18next"; import {TFunction} from "i18next"; - const APIURL = import.meta.env.VITE_APP_API_HOST; /** @@ -29,13 +34,12 @@ const fetchSubmissionsFromUser = async (submission_id: string) => { }); }; -const editGrade = (submission: Submission, oldSubmission: Submission, errorMessage: string) => { +const editGrade = (submission: Submission, errorMessage: string) => { const submission_id = submission.submission_id; const newGrade = submission.grading; if (newGrade < 0 || newGrade > 20) { - alert(errorMessage); - return oldSubmission; + throw new Error(errorMessage); } const formData = new FormData(); @@ -49,6 +53,35 @@ const editGrade = (submission: Submission, oldSubmission: Submission, errorMessa return submission }; +const StyledTooltip = styled(({ className, ...props }: TooltipProps) => ( + +))(({ theme }) => ({ + [`& .${tooltipClasses.tooltip}`]: { + backgroundColor: theme.palette.error.main, + color: theme.palette.error.contrastText, + }, +})); + +/** + * + */ +function NameEditInputCell(props: GridRenderEditCellParams) { + const { error, msg } = props; + + return ( + + + + ); +} + +/** + * + */ +function renderEditScore(params: GridRenderEditCellParams) { + return ; +} + const getTranslatedRows = (t: TFunction) => { return [ { field: "submission_id", headerName: t("submissionID"), flex: 0.4, editable: false }, @@ -58,6 +91,11 @@ const getTranslatedRows = (t: TFunction) => { headerName: t("grading"), editable: true, flex: 0.2, + preProcessEditCellProps: (params: GridPreProcessEditCellProps) => { + const hasError = params.props.value > 20 || params.props.value < 0; + return { ...params.props, error: hasError, msg: t("scoreError") }; + }, + renderEditCell: renderEditScore }, { field: "submission_status", @@ -108,8 +146,8 @@ export default function ProjectSubmissionsOverviewDatagrid({ columns={getTranslatedRows(t)} pageSizeOptions={[20]} disableRowSelectionOnClick - processRowUpdate={(updatedRow, oldRow) => - editGrade(updatedRow, oldRow, errorMsg) + processRowUpdate={(updatedRow) => + editGrade(updatedRow, errorMsg) } /> From a41ace81fc5403a8d38f18df0112ad3d74e9d816 Mon Sep 17 00:00:00 2001 From: gerwoud Date: Sat, 18 May 2024 22:39:31 +0200 Subject: [PATCH 5/5] linter --- .../ProjectSubmissionOverviewDatagrid.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/frontend/src/components/ProjectSubmissionOverview/ProjectSubmissionOverviewDatagrid.tsx b/frontend/src/components/ProjectSubmissionOverview/ProjectSubmissionOverviewDatagrid.tsx index ba1ce5e7..1dd22b0c 100644 --- a/frontend/src/components/ProjectSubmissionOverview/ProjectSubmissionOverviewDatagrid.tsx +++ b/frontend/src/components/ProjectSubmissionOverview/ProjectSubmissionOverviewDatagrid.tsx @@ -63,7 +63,7 @@ const StyledTooltip = styled(({ className, ...props }: TooltipProps) => ( })); /** - * + * @returns Component for input edit cell */ function NameEditInputCell(props: GridRenderEditCellParams) { const { error, msg } = props; @@ -76,7 +76,7 @@ function NameEditInputCell(props: GridRenderEditCellParams) { } /** - * + * @returns component for passing params */ function renderEditScore(params: GridRenderEditCellParams) { return ;