From b3e363f39163f6add1a4bacc9a3a097b6829b0be Mon Sep 17 00:00:00 2001 From: Mattias Date: Tue, 2 Apr 2024 15:43:05 +0200 Subject: [PATCH 01/14] Add updateWeeklyReport function to API.ts --- frontend/src/API/API.ts | 43 +++++++++++++++++++++++++++++++++++++++++ 1 file changed, 43 insertions(+) diff --git a/frontend/src/API/API.ts b/frontend/src/API/API.ts index 748c64b..6b5e3fa 100644 --- a/frontend/src/API/API.ts +++ b/frontend/src/API/API.ts @@ -2,6 +2,7 @@ import { NewProjMember } from "../Components/AddMember"; import { ProjectRoleChange } from "../Components/ChangeRole"; import { ProjectMember } from "../Components/GetUsersInProject"; import { + UpdateWeeklyReport, NewWeeklyReport, NewUser, User, @@ -86,6 +87,17 @@ interface API { token: string, ): Promise>; + /** + * Updates a weekly report. + * @param {UpdateWeeklyReport} weeklyReport The updated weekly report object. + * @param {string} token The authentication token. + * @returns {Promise>} A promise containing the API response with the updated report. + */ + updateWeeklyReport( + weeklyReport: UpdateWeeklyReport, + token: string, + ): Promise>; + /** Gets a weekly report for a specific user, project and week * @param {string} projectName The name of the project. * @param {string} week The week number. @@ -416,6 +428,37 @@ export const api: API = { } }, + async updateWeeklyReport( + weeklyReport: UpdateWeeklyReport, + token: string, + ): Promise> { + try { + const response = await fetch("/api/updateWeeklyReport", { + method: "PUT", + headers: { + "Content-Type": "application/json", + Authorization: "Bearer " + token, + }, + body: JSON.stringify(weeklyReport), + }); + + if (!response.ok) { + return { + success: false, + message: "Failed to update weekly report", + }; + } + + const data = await response.text(); + return { success: true, message: data }; + } catch (e) { + return { + success: false, + message: "Failed to update weekly report", + }; + } + }, + async getWeeklyReport( projectName: string, week: string, From 6c2213b48876603c2ba5b800ca132bea661d93e1 Mon Sep 17 00:00:00 2001 From: Mattias Date: Tue, 2 Apr 2024 15:43:12 +0200 Subject: [PATCH 02/14] Update handleUpdateWeeklyReport function and fix input validation --- frontend/src/Components/EditWeeklyReport.tsx | 54 ++++++++++++++++---- 1 file changed, 43 insertions(+), 11 deletions(-) diff --git a/frontend/src/Components/EditWeeklyReport.tsx b/frontend/src/Components/EditWeeklyReport.tsx index 384359e..7f907af 100644 --- a/frontend/src/Components/EditWeeklyReport.tsx +++ b/frontend/src/Components/EditWeeklyReport.tsx @@ -1,5 +1,5 @@ import { useState, useEffect } from "react"; -import { WeeklyReport, NewWeeklyReport } from "../Types/goTypes"; +import { WeeklyReport, UpdateWeeklyReport } from "../Types/goTypes"; import { api } from "../API/API"; import { useNavigate, useParams } from "react-router-dom"; import Button from "./Button"; @@ -60,8 +60,9 @@ export default function GetWeeklyReport(): JSX.Element { void fetchWeeklyReport(); }, [projectName, fetchedWeek, token]); - const handleNewWeeklyReport = async (): Promise => { - const newWeeklyReport: NewWeeklyReport = { + const handleUpdateWeeklyReport = async (): Promise => { + const updateWeeklyReport: UpdateWeeklyReport = { + userName: "user2", projectName: projectName ?? "", week, developmentTime, @@ -72,7 +73,7 @@ export default function GetWeeklyReport(): JSX.Element { testingTime, }; - await api.submitWeeklyReport(newWeeklyReport, token); + await api.updateWeeklyReport(updateWeeklyReport, token); }; const navigate = useNavigate(); @@ -89,7 +90,8 @@ export default function GetWeeklyReport(): JSX.Element { return; } e.preventDefault(); - void handleNewWeeklyReport(); + void handleUpdateWeeklyReport(); + alert("Changes submitted"); navigate(-1); }} > @@ -128,7 +130,12 @@ export default function GetWeeklyReport(): JSX.Element { }} onKeyDown={(event) => { const keyValue = event.key; - if (!/\d/.test(keyValue) && keyValue !== "Backspace") + if ( + !/\d/.test(keyValue) && + keyValue !== "Backspace" && + keyValue !== "ArrowLeft" && + keyValue !== "ArrowRight" + ) event.preventDefault(); }} /> @@ -152,7 +159,12 @@ export default function GetWeeklyReport(): JSX.Element { }} onKeyDown={(event) => { const keyValue = event.key; - if (!/\d/.test(keyValue) && keyValue !== "Backspace") + if ( + !/\d/.test(keyValue) && + keyValue !== "Backspace" && + keyValue !== "ArrowLeft" && + keyValue !== "ArrowRight" + ) event.preventDefault(); }} /> @@ -176,7 +188,12 @@ export default function GetWeeklyReport(): JSX.Element { }} onKeyDown={(event) => { const keyValue = event.key; - if (!/\d/.test(keyValue) && keyValue !== "Backspace") + if ( + !/\d/.test(keyValue) && + keyValue !== "Backspace" && + keyValue !== "ArrowLeft" && + keyValue !== "ArrowRight" + ) event.preventDefault(); }} /> @@ -200,7 +217,12 @@ export default function GetWeeklyReport(): JSX.Element { }} onKeyDown={(event) => { const keyValue = event.key; - if (!/\d/.test(keyValue) && keyValue !== "Backspace") + if ( + !/\d/.test(keyValue) && + keyValue !== "Backspace" && + keyValue !== "ArrowLeft" && + keyValue !== "ArrowRight" + ) event.preventDefault(); }} /> @@ -224,7 +246,12 @@ export default function GetWeeklyReport(): JSX.Element { }} onKeyDown={(event) => { const keyValue = event.key; - if (!/\d/.test(keyValue) && keyValue !== "Backspace") + if ( + !/\d/.test(keyValue) && + keyValue !== "Backspace" && + keyValue !== "ArrowLeft" && + keyValue !== "ArrowRight" + ) event.preventDefault(); }} /> @@ -248,7 +275,12 @@ export default function GetWeeklyReport(): JSX.Element { }} onKeyDown={(event) => { const keyValue = event.key; - if (!/\d/.test(keyValue) && keyValue !== "Backspace") + if ( + !/\d/.test(keyValue) && + keyValue !== "Backspace" && + keyValue !== "ArrowLeft" && + keyValue !== "ArrowRight" + ) event.preventDefault(); }} /> From 398305d3ede4f65c7d505e87dbc7ca89800f08f9 Mon Sep 17 00:00:00 2001 From: Mattias Date: Tue, 2 Apr 2024 15:43:18 +0200 Subject: [PATCH 03/14] Fix input validation in NewWeeklyReport component --- frontend/src/Components/NewWeeklyReport.tsx | 42 ++++++++++++++++++--- 1 file changed, 36 insertions(+), 6 deletions(-) diff --git a/frontend/src/Components/NewWeeklyReport.tsx b/frontend/src/Components/NewWeeklyReport.tsx index f684b0c..1bb5cd4 100644 --- a/frontend/src/Components/NewWeeklyReport.tsx +++ b/frontend/src/Components/NewWeeklyReport.tsx @@ -139,7 +139,12 @@ export default function NewWeeklyReport(): JSX.Element { }} onKeyDown={(event) => { const keyValue = event.key; - if (!/\d/.test(keyValue) && keyValue !== "Backspace") + if ( + !/\d/.test(keyValue) && + keyValue !== "Backspace" && + keyValue !== "ArrowLeft" && + keyValue !== "ArrowRight" + ) event.preventDefault(); }} /> @@ -163,7 +168,12 @@ export default function NewWeeklyReport(): JSX.Element { }} onKeyDown={(event) => { const keyValue = event.key; - if (!/\d/.test(keyValue) && keyValue !== "Backspace") + if ( + !/\d/.test(keyValue) && + keyValue !== "Backspace" && + keyValue !== "ArrowLeft" && + keyValue !== "ArrowRight" + ) event.preventDefault(); }} /> @@ -187,7 +197,12 @@ export default function NewWeeklyReport(): JSX.Element { }} onKeyDown={(event) => { const keyValue = event.key; - if (!/\d/.test(keyValue) && keyValue !== "Backspace") + if ( + !/\d/.test(keyValue) && + keyValue !== "Backspace" && + keyValue !== "ArrowLeft" && + keyValue !== "ArrowRight" + ) event.preventDefault(); }} /> @@ -211,7 +226,12 @@ export default function NewWeeklyReport(): JSX.Element { }} onKeyDown={(event) => { const keyValue = event.key; - if (!/\d/.test(keyValue) && keyValue !== "Backspace") + if ( + !/\d/.test(keyValue) && + keyValue !== "Backspace" && + keyValue !== "ArrowLeft" && + keyValue !== "ArrowRight" + ) event.preventDefault(); }} /> @@ -235,7 +255,12 @@ export default function NewWeeklyReport(): JSX.Element { }} onKeyDown={(event) => { const keyValue = event.key; - if (!/\d/.test(keyValue) && keyValue !== "Backspace") + if ( + !/\d/.test(keyValue) && + keyValue !== "Backspace" && + keyValue !== "ArrowLeft" && + keyValue !== "ArrowRight" + ) event.preventDefault(); }} /> @@ -259,7 +284,12 @@ export default function NewWeeklyReport(): JSX.Element { }} onKeyDown={(event) => { const keyValue = event.key; - if (!/\d/.test(keyValue) && keyValue !== "Backspace") + if ( + !/\d/.test(keyValue) && + keyValue !== "Backspace" && + keyValue !== "ArrowLeft" && + keyValue !== "ArrowRight" + ) event.preventDefault(); }} /> From 8d6da684bfb9e69d2c0cb5a0888f448c8f08234a Mon Sep 17 00:00:00 2001 From: Mattias Date: Tue, 2 Apr 2024 16:21:23 +0200 Subject: [PATCH 04/14] Add username retrieval from local storage --- frontend/src/Components/EditWeeklyReport.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/frontend/src/Components/EditWeeklyReport.tsx b/frontend/src/Components/EditWeeklyReport.tsx index 7f907af..d56ee42 100644 --- a/frontend/src/Components/EditWeeklyReport.tsx +++ b/frontend/src/Components/EditWeeklyReport.tsx @@ -22,6 +22,7 @@ export default function GetWeeklyReport(): JSX.Element { projectName: string; fetchedWeek: string; }>(); + const username = localStorage.getItem("userName") ?? ""; console.log(projectName, fetchedWeek); useEffect(() => { @@ -62,7 +63,7 @@ export default function GetWeeklyReport(): JSX.Element { const handleUpdateWeeklyReport = async (): Promise => { const updateWeeklyReport: UpdateWeeklyReport = { - userName: "user2", + userName: username, projectName: projectName ?? "", week, developmentTime, From 93659a72dc1d708ca7d1624c0882cc9239ca7413 Mon Sep 17 00:00:00 2001 From: Mattias Date: Tue, 2 Apr 2024 17:05:46 +0200 Subject: [PATCH 05/14] Add getUnsignedReportsInProject API method --- frontend/src/API/API.ts | 38 ++++++++++++++++++++++++++++++++++++++ 1 file changed, 38 insertions(+) diff --git a/frontend/src/API/API.ts b/frontend/src/API/API.ts index 553f943..aa14183 100644 --- a/frontend/src/API/API.ts +++ b/frontend/src/API/API.ts @@ -159,6 +159,12 @@ interface API { projectName: string, token: string, ): Promise>; + + getUnsignedReportsInProject( + projectName: string, + token: string, + ): Promise>; + /** * Changes the username of a user in the database. * @param {StrNameChange} data The object containing the previous and new username. @@ -664,6 +670,38 @@ export const api: API = { } }, + async getUnsignedReportsInProject( + projectName: string, + token: string, + ): Promise> { + try { + const response = await fetch(`/api/getUnsignedReports/${projectName}`, { + method: "GET", + headers: { + "Content-Type": "application/json", + Authorization: "Bearer " + token, + }, + }); + + if (!response.ok) { + return { + success: false, + message: + "Failed to get unsigned reports for project: Response code " + + response.status, + }; + } else { + const data = (await response.json()) as WeeklyReport[]; + return { success: true, data }; + } + } catch (e) { + return { + success: false, + message: "Failed to get unsigned reports for project, unknown error", + }; + } + }, + async changeUserName( data: StrNameChange, token: string, From 0b8b430f38ea2f659d7d9445221dcd3249b27ccc Mon Sep 17 00:00:00 2001 From: Mattias Date: Tue, 2 Apr 2024 17:05:55 +0200 Subject: [PATCH 06/14] Refactor DisplayUnsignedReports component to use API and WeeklyReport type --- .../src/Components/DisplayUnsignedReports.tsx | 133 +++++------------- 1 file changed, 37 insertions(+), 96 deletions(-) diff --git a/frontend/src/Components/DisplayUnsignedReports.tsx b/frontend/src/Components/DisplayUnsignedReports.tsx index 780f20c..13adc4b 100644 --- a/frontend/src/Components/DisplayUnsignedReports.tsx +++ b/frontend/src/Components/DisplayUnsignedReports.tsx @@ -1,12 +1,7 @@ import { useState, useEffect } from "react"; import { Link, useParams } from "react-router-dom"; - -interface UnsignedReports { - projectName: string; - username: string; - week: number; - signed: boolean; -} +import { api } from "../API/API"; +import { WeeklyReport } from "../Types/goTypes"; /** * Renders a component that displays the projects a user is a part of and links to the projects start-page. @@ -14,74 +9,21 @@ interface UnsignedReports { */ function DisplayUserProject(): JSX.Element { const { projectName } = useParams(); - const [unsignedReports, setUnsignedReports] = useState([]); + const [unsignedReports, setUnsignedReports] = useState([]); //const navigate = useNavigate(); - // const getUnsignedReports = async (): Promise => { - // const token = localStorage.getItem("accessToken") ?? ""; - // const response = await api.getUserProjects(token); - // console.log(response); - // if (response.success) { - // setUnsignedReports(response.data ?? []); - // } else { - // console.error(response.message); - // } - // }; - - // const handleReportClick = async (projectName: string): Promise => { - // const username = localStorage.getItem("username") ?? ""; - // const token = localStorage.getItem("accessToken") ?? ""; - // const response = await api.checkIfProjectManager( - // username, - // projectName, - // token, - // ); - // if (response.success) { - // if (response.data) { - // navigate(`/PMProjectPage/${projectName}`); - // } else { - // navigate(`/project/${projectName}`); - // } - // } else { - // // handle error - // console.error(response.message); - // } - // }; - const getUnsignedReports = async (): Promise => { - // Simulate a delay - await Promise.resolve(); - - // Use mock data - const reports: UnsignedReports[] = [ - { - projectName: "projecttest", - username: "user1", - week: 2, - signed: false, - }, - { - projectName: "projecttest", - username: "user2", - week: 2, - signed: false, - }, - { - projectName: "projecttest", - username: "user3", - week: 2, - signed: false, - }, - { - projectName: "projecttest", - username: "user4", - week: 2, - signed: false, - }, - ]; - - // Set the state with the mock data - setUnsignedReports(reports); + const token = localStorage.getItem("accessToken") ?? ""; + const response = await api.getUnsignedReportsInProject( + projectName ?? "", + token, + ); + console.log(response); + if (response.success) { + setUnsignedReports(response.data ?? []); + } else { + console.error(response.message); + } }; // Call getProjects when the component mounts @@ -95,32 +37,31 @@ function DisplayUserProject(): JSX.Element { All Unsigned Reports In: {projectName}{" "}
- {unsignedReports.map( - (unsignedReport: UnsignedReports, index: number) => ( -

-
-
-

{unsignedReport.username}

- Week: -

{unsignedReport.week}

- Signed: -

NO

-
-
-
- -

- View Report -

- -
+ {unsignedReports.map((unsignedReport: WeeklyReport, index: number) => ( +

+
+
+ UserID: +

{unsignedReport.userId}

+ Week: +

{unsignedReport.week}

+ Signed: +

NO

+
+
+
+ +

+ View Report +

+
-

- ), - )} +
+

+ ))}
); From 1e1677fc571c9a39b43491e6ab1c6b9044dac898 Mon Sep 17 00:00:00 2001 From: Mattias Date: Tue, 2 Apr 2024 17:07:47 +0200 Subject: [PATCH 07/14] Refactor getUnsignedReports in DisplayUnsignedReports component --- .../src/Components/DisplayUnsignedReports.tsx | 32 +++++++++---------- 1 file changed, 15 insertions(+), 17 deletions(-) diff --git a/frontend/src/Components/DisplayUnsignedReports.tsx b/frontend/src/Components/DisplayUnsignedReports.tsx index 13adc4b..340eae2 100644 --- a/frontend/src/Components/DisplayUnsignedReports.tsx +++ b/frontend/src/Components/DisplayUnsignedReports.tsx @@ -11,25 +11,23 @@ function DisplayUserProject(): JSX.Element { const { projectName } = useParams(); const [unsignedReports, setUnsignedReports] = useState([]); //const navigate = useNavigate(); - - const getUnsignedReports = async (): Promise => { - const token = localStorage.getItem("accessToken") ?? ""; - const response = await api.getUnsignedReportsInProject( - projectName ?? "", - token, - ); - console.log(response); - if (response.success) { - setUnsignedReports(response.data ?? []); - } else { - console.error(response.message); - } - }; - - // Call getProjects when the component mounts useEffect(() => { + const getUnsignedReports = async (): Promise => { + const token = localStorage.getItem("accessToken") ?? ""; + const response = await api.getUnsignedReportsInProject( + projectName ?? "", + token, + ); + console.log(response); + if (response.success) { + setUnsignedReports(response.data ?? []); + } else { + console.error(response.message); + } + }; + void getUnsignedReports(); - }, []); + }, [projectName]); // Include 'projectName' in the dependency array return ( <> From 7c7755085e374af4e342f888912aae0a88f307ac Mon Sep 17 00:00:00 2001 From: Mattias Date: Tue, 2 Apr 2024 17:11:30 +0200 Subject: [PATCH 08/14] Add comments for getUnsignedReportsInProject in API --- frontend/src/API/API.ts | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/frontend/src/API/API.ts b/frontend/src/API/API.ts index aa14183..c1480fb 100644 --- a/frontend/src/API/API.ts +++ b/frontend/src/API/API.ts @@ -160,6 +160,11 @@ interface API { token: string, ): Promise>; + /** Gets all unsigned reports in a project. + * @param {string} projectName The name of the project. + * @param {string} token The authentication token. + * @returns {Promise>} A promise resolving to an API response containing the list of unsigned reports. + */ getUnsignedReportsInProject( projectName: string, token: string, From 00ca5514e56768c2483dc531e16bd79bf427e6f2 Mon Sep 17 00:00:00 2001 From: Davenludd Date: Tue, 2 Apr 2024 17:27:17 +0200 Subject: [PATCH 09/14] Added sign functionality to component --- .../src/Components/ViewOtherTimeReport.tsx | 43 ++++++++++--------- 1 file changed, 23 insertions(+), 20 deletions(-) diff --git a/frontend/src/Components/ViewOtherTimeReport.tsx b/frontend/src/Components/ViewOtherTimeReport.tsx index 32e0716..bde0529 100644 --- a/frontend/src/Components/ViewOtherTimeReport.tsx +++ b/frontend/src/Components/ViewOtherTimeReport.tsx @@ -1,5 +1,5 @@ import { useState, useEffect } from "react"; -import { WeeklyReport, NewWeeklyReport } from "../Types/goTypes"; +import { WeeklyReport } from "../Types/goTypes"; import { api } from "../API/API"; import { useNavigate, useParams } from "react-router-dom"; import Button from "./Button"; @@ -18,6 +18,7 @@ export default function GetOtherUsersReport(): JSX.Element { const [ownWorkTime, setOwnWorkTime] = useState(0); const [studyTime, setStudyTime] = useState(0); const [testingTime, setTestingTime] = useState(0); + const [reportId, setReportId] = useState(0); const token = localStorage.getItem("accessToken") ?? ""; const { projectName } = useParams(); @@ -45,6 +46,7 @@ export default function GetOtherUsersReport(): JSX.Element { studyTime: 0, testingTime: 0, }; + setReportId(report.reportId); setWeek(report.week); setDevelopmentTime(report.developmentTime); setMeetingTime(report.meetingTime); @@ -61,30 +63,23 @@ export default function GetOtherUsersReport(): JSX.Element { }); const handleSignWeeklyReport = async (): Promise => { - const newWeeklyReport: NewWeeklyReport = { - projectName: projectName ?? "", - week, - developmentTime, - meetingTime, - adminTime, - ownWorkTime, - studyTime, - testingTime, - }; - - await api.submitWeeklyReport(newWeeklyReport, token); + await api.signReport(reportId, token); }; const navigate = useNavigate(); return ( <> -

{username}'s Report

+

+ {" "} + UserId: {username}'s Report +

{ e.preventDefault(); void handleSignWeeklyReport(); + alert("Report successfully signed!"); navigate(-1); }} > @@ -112,7 +107,10 @@ export default function GetOtherUsersReport(): JSX.Element { type="text" min="0" className="border-2 border-black rounded-md text-center w-1/2" - value={developmentTime === 0 ? "" : developmentTime} + defaultValue={ + developmentTime === 0 ? "" : developmentTime + } + readOnly /> @@ -123,7 +121,8 @@ export default function GetOtherUsersReport(): JSX.Element { type="text" min="0" className="border-2 border-black rounded-md text-center w-1/2" - value={meetingTime === 0 ? "" : meetingTime} + defaultValue={meetingTime === 0 ? "" : meetingTime} + readOnly /> @@ -134,7 +133,8 @@ export default function GetOtherUsersReport(): JSX.Element { type="text" min="0" className="border-2 border-black rounded-md text-center w-1/2" - value={adminTime === 0 ? "" : adminTime} + defaultValue={adminTime === 0 ? "" : adminTime} + readOnly /> @@ -145,7 +145,8 @@ export default function GetOtherUsersReport(): JSX.Element { type="text" min="0" className="border-2 border-black rounded-md text-center w-1/2" - value={ownWorkTime === 0 ? "" : ownWorkTime} + defaultValue={ownWorkTime === 0 ? "" : ownWorkTime} + readOnly /> @@ -156,7 +157,8 @@ export default function GetOtherUsersReport(): JSX.Element { type="text" min="0" className="border-2 border-black rounded-md text-center w-1/2" - value={studyTime === 0 ? "" : studyTime} + defaultValue={studyTime === 0 ? "" : studyTime} + readOnly /> @@ -167,7 +169,8 @@ export default function GetOtherUsersReport(): JSX.Element { type="text" min="0" className="border-2 border-black rounded-md text-center w-1/2" - value={testingTime === 0 ? "" : testingTime} + defaultValue={testingTime === 0 ? "" : testingTime} + readOnly /> From eb741ba20d8e9f832daccaf0effabf5a55d18cf9 Mon Sep 17 00:00:00 2001 From: Davenludd Date: Tue, 2 Apr 2024 17:33:20 +0200 Subject: [PATCH 10/14] Add total time calculation to DisplayUnsignedReports component --- frontend/src/Components/DisplayUnsignedReports.tsx | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/frontend/src/Components/DisplayUnsignedReports.tsx b/frontend/src/Components/DisplayUnsignedReports.tsx index 340eae2..232cb31 100644 --- a/frontend/src/Components/DisplayUnsignedReports.tsx +++ b/frontend/src/Components/DisplayUnsignedReports.tsx @@ -43,6 +43,15 @@ function DisplayUserProject(): JSX.Element {

{unsignedReport.userId}

Week:

{unsignedReport.week}

+ Total Time: +

+ {unsignedReport.developmentTime + + unsignedReport.meetingTime + + unsignedReport.adminTime + + unsignedReport.ownWorkTime + + unsignedReport.studyTime + + unsignedReport.testingTime} +

Signed:

NO

From ff37236cf610dfda526f14f411d9088bc1e16d95 Mon Sep 17 00:00:00 2001 From: Davenludd Date: Tue, 2 Apr 2024 17:35:02 +0200 Subject: [PATCH 11/14] Minor fixes TimePerActivity component to use readOnly input fields --- frontend/src/Components/TimePerActivity.tsx | 24 ++++++--------------- 1 file changed, 6 insertions(+), 18 deletions(-) diff --git a/frontend/src/Components/TimePerActivity.tsx b/frontend/src/Components/TimePerActivity.tsx index 3dc1a6b..e0bcddf 100644 --- a/frontend/src/Components/TimePerActivity.tsx +++ b/frontend/src/Components/TimePerActivity.tsx @@ -95,9 +95,7 @@ export default function TimePerRole(): JSX.Element { type="string" className="border-2 border-black rounded-md text-center w-1/2" value={developmentTime} - onKeyDown={(event) => { - event.preventDefault(); - }} + readOnly /> @@ -108,9 +106,7 @@ export default function TimePerRole(): JSX.Element { type="string" className="border-2 border-black rounded-md text-center w-1/2" value={meetingTime} - onKeyDown={(event) => { - event.preventDefault(); - }} + readOnly /> @@ -121,9 +117,7 @@ export default function TimePerRole(): JSX.Element { type="string" className="border-2 border-black rounded-md text-center w-1/2" value={adminTime} - onKeyDown={(event) => { - event.preventDefault(); - }} + readOnly /> @@ -134,9 +128,7 @@ export default function TimePerRole(): JSX.Element { type="string" className="border-2 border-black rounded-md text-center w-1/2" value={ownWorkTime} - onKeyDown={(event) => { - event.preventDefault(); - }} + readOnly /> @@ -147,9 +139,7 @@ export default function TimePerRole(): JSX.Element { type="string" className="border-2 border-black rounded-md text-center w-1/2" value={studyTime} - onKeyDown={(event) => { - event.preventDefault(); - }} + readOnly /> @@ -160,9 +150,7 @@ export default function TimePerRole(): JSX.Element { type="string" className="border-2 border-black rounded-md text-center w-1/2" value={testingTime} - onKeyDown={(event) => { - event.preventDefault(); - }} + readOnly /> From a7cc48d392d0100e1ed7b2420e128469102ae42f Mon Sep 17 00:00:00 2001 From: Mattias Date: Tue, 2 Apr 2024 18:00:30 +0200 Subject: [PATCH 12/14] Refactor TimePerRole component to use API response for time per activity --- frontend/src/Components/TimePerActivity.tsx | 85 ++++++++------------- 1 file changed, 30 insertions(+), 55 deletions(-) diff --git a/frontend/src/Components/TimePerActivity.tsx b/frontend/src/Components/TimePerActivity.tsx index e0bcddf..ef34521 100644 --- a/frontend/src/Components/TimePerActivity.tsx +++ b/frontend/src/Components/TimePerActivity.tsx @@ -1,70 +1,45 @@ import { useState, useEffect } from "react"; import { useParams } from "react-router-dom"; +import { api } from "../API/API"; +import { projectTimes } from "./GetProjectTimes"; /** * Renders the component for showing total time per role in a project. * @returns JSX.Element */ export default function TimePerRole(): JSX.Element { - const [developmentTime, setDevelopmentTime] = useState(); - const [meetingTime, setMeetingTime] = useState(); - const [adminTime, setAdminTime] = useState(); - const [ownWorkTime, setOwnWorkTime] = useState(); - const [studyTime, setStudyTime] = useState(); - const [testingTime, setTestingTime] = useState(); + const [development, setDevelopment] = useState(); + const [meeting, setMeeting] = useState(); + const [admin, setAdmin] = useState(); + const [own_work, setOwnWork] = useState(); + const [study, setStudy] = useState(); + const [testing, setTesting] = useState(); - // const token = localStorage.getItem("accessToken") ?? ""; - // const username = localStorage.getItem("username") ?? ""; + const token = localStorage.getItem("accessToken") ?? ""; const { projectName } = useParams(); - // const fetchTimePerRole = async (): Promise => { - // const response = await api.getTimePerRole( - // username, - // projectName ?? "", - // token, - // ); - // { - // if (response.success) { - // const report: TimePerRole = response.data ?? { - // PManagerTime: 0, - // SManagerTime: 0, - // DeveloperTime: 0, - // TesterTime: 0, - // }; - // } else { - // console.error("Failed to fetch weekly report:", response.message); - // } - // } - - interface TimePerActivity { - developmentTime: number; - meetingTime: number; - adminTime: number; - ownWorkTime: number; - studyTime: number; - testingTime: number; - } - const fetchTimePerActivity = async (): Promise => { - // Use mock data - const report: TimePerActivity = { - developmentTime: 100, - meetingTime: 200, - adminTime: 300, - ownWorkTime: 50, - studyTime: 75, - testingTime: 110, - }; - - // Set the state with the mock data - setDevelopmentTime(report.developmentTime); - setMeetingTime(report.meetingTime); - setAdminTime(report.adminTime); - setOwnWorkTime(report.ownWorkTime); - setStudyTime(report.studyTime); - setTestingTime(report.testingTime); - - await Promise.resolve(); + const response = await api.getProjectTimes(projectName ?? "", token); + { + if (response.success) { + const report: projectTimes = response.data ?? { + development: 0, + meeting: 0, + admin: 0, + own_work: 0, + study: 0, + testing: 0, + }; + setDevelopment(report.development); + setMeeting(report.meeting); + setAdmin(report.admin); + setOwnWork(report.own_work); + setStudy(report.study); + setTesting(report.testing); + } else { + console.error("Failed to fetch weekly report:", response.message); + } + } }; useEffect(() => { From 1b4e5215083b858fdbee4f5f4b7bd4a86c81005e Mon Sep 17 00:00:00 2001 From: Mattias Date: Tue, 2 Apr 2024 18:02:40 +0200 Subject: [PATCH 13/14] Update variable names in TimePerActivity component --- frontend/src/Components/TimePerActivity.tsx | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/frontend/src/Components/TimePerActivity.tsx b/frontend/src/Components/TimePerActivity.tsx index ef34521..6175845 100644 --- a/frontend/src/Components/TimePerActivity.tsx +++ b/frontend/src/Components/TimePerActivity.tsx @@ -69,7 +69,7 @@ export default function TimePerRole(): JSX.Element { @@ -80,7 +80,7 @@ export default function TimePerRole(): JSX.Element { @@ -91,7 +91,7 @@ export default function TimePerRole(): JSX.Element { @@ -102,7 +102,7 @@ export default function TimePerRole(): JSX.Element { @@ -113,7 +113,7 @@ export default function TimePerRole(): JSX.Element { @@ -124,7 +124,7 @@ export default function TimePerRole(): JSX.Element { From 4d7b3e0d5736628fa420cb12ec3ac1f282d9168f Mon Sep 17 00:00:00 2001 From: Davenludd Date: Wed, 3 Apr 2024 13:59:44 +0200 Subject: [PATCH 14/14] Refactor API call and types in AllTimeReportsInProjectOtherUser component --- .../AllTimeReportsInProjectOtherUser.tsx | 42 +++---------------- 1 file changed, 6 insertions(+), 36 deletions(-) diff --git a/frontend/src/Components/AllTimeReportsInProjectOtherUser.tsx b/frontend/src/Components/AllTimeReportsInProjectOtherUser.tsx index 09ca6dc..ef78642 100644 --- a/frontend/src/Components/AllTimeReportsInProjectOtherUser.tsx +++ b/frontend/src/Components/AllTimeReportsInProjectOtherUser.tsx @@ -1,8 +1,9 @@ //Info: This component is used to display all the time reports for a project. It will display the week number, //total time spent, and if the report has been signed or not. The user can click on a report to edit it. import { useEffect, useState } from "react"; -import { NewWeeklyReport } from "../Types/goTypes"; +import { WeeklyReport } from "../Types/goTypes"; import { Link, useParams } from "react-router-dom"; +import { api } from "../API/API"; /** * Renders a component that displays all the time reports for a specific project. @@ -11,14 +12,14 @@ import { Link, useParams } from "react-router-dom"; function AllTimeReportsInProject(): JSX.Element { const { username } = useParams(); const { projectName } = useParams(); - const [weeklyReports, setWeeklyReports] = useState([]); + const [weeklyReports, setWeeklyReports] = useState([]); - /* // Call getProjects when the component mounts useEffect(() => { const getWeeklyReports = async (): Promise => { const token = localStorage.getItem("accessToken") ?? ""; - const response = await api.getWeeklyReportsForUser( + const response = await api.getWeeklyReportsForDifferentUser( projectName ?? "", + username ?? "", token, ); console.log(response); @@ -27,39 +28,8 @@ function AllTimeReportsInProject(): JSX.Element { } else { console.error(response.message); } - }; */ - // Mock data - const getWeeklyReports = async (): Promise => { - // Simulate a delay - await Promise.resolve(); - const mockWeeklyReports: NewWeeklyReport[] = [ - { - projectName: "Project 1", - week: 1, - developmentTime: 10, - meetingTime: 2, - adminTime: 1, - ownWorkTime: 3, - studyTime: 4, - testingTime: 5, - }, - { - projectName: "Project 1", - week: 2, - developmentTime: 8, - meetingTime: 2, - adminTime: 1, - ownWorkTime: 3, - studyTime: 4, - testingTime: 5, - }, - // Add more reports as needed - ]; + }; - // Use the mock data instead of the real data - setWeeklyReports(mockWeeklyReports); - }; - useEffect(() => { void getWeeklyReports(); }, []);