From 08532444f089c17f077d4513a2dfd8d04195a5fc Mon Sep 17 00:00:00 2001 From: Davenludd Date: Tue, 19 Mar 2024 09:14:30 +0100 Subject: [PATCH 01/52] Cleanup YourProjectsPage --- frontend/src/Pages/YourProjectsPage.tsx | 22 +++++----------------- 1 file changed, 5 insertions(+), 17 deletions(-) diff --git a/frontend/src/Pages/YourProjectsPage.tsx b/frontend/src/Pages/YourProjectsPage.tsx index 0f2428e..b5644c3 100644 --- a/frontend/src/Pages/YourProjectsPage.tsx +++ b/frontend/src/Pages/YourProjectsPage.tsx @@ -1,13 +1,11 @@ -import { useState, createContext } from "react"; +import { useState, useEffect } from "react"; import { Project } from "../Types/goTypes"; import { Link } from "react-router-dom"; import BasicWindow from "../Components/BasicWindow"; - -export const ProjectNameContext = createContext(""); +import { api } from "../API/API"; function UserProjectPage(): JSX.Element { const [projects, setProjects] = useState([]); - const [selectedProject, setSelectedProject] = useState(""); const getProjects = async (): Promise => { const token = localStorage.getItem("accessToken") ?? ""; @@ -24,29 +22,19 @@ function UserProjectPage(): JSX.Element { void getProjects(); }, []); - const handleProjectClick = (projectName: string): void => { - setSelectedProject(projectName); - }; - const content = ( - + <>

Your Projects

{projects.map((project, index) => ( - { - handleProjectClick(project.name); - }} - key={index} - > +

{project.name}

))}
- + ); const buttons = <>; From d775a6e381f7d2ccac0c1b035ae1b540d7238ee3 Mon Sep 17 00:00:00 2001 From: Davenludd Date: Tue, 19 Mar 2024 09:21:33 +0100 Subject: [PATCH 02/52] Update navigation in NewWeeklyReport component --- frontend/src/Components/NewWeeklyReport.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/src/Components/NewWeeklyReport.tsx b/frontend/src/Components/NewWeeklyReport.tsx index ab9084d..b8a6f7e 100644 --- a/frontend/src/Components/NewWeeklyReport.tsx +++ b/frontend/src/Components/NewWeeklyReport.tsx @@ -45,7 +45,7 @@ export default function NewWeeklyReport(): JSX.Element { } e.preventDefault(); void handleNewWeeklyReport(); - navigate("/project"); + navigate(-1); }} >
From 53f468d7c89b791428da33aff193d707ca4823a3 Mon Sep 17 00:00:00 2001 From: Davenludd Date: Tue, 19 Mar 2024 09:23:09 +0100 Subject: [PATCH 03/52] Update navigation in EditWeeklyReport component --- frontend/src/Components/EditWeeklyReport.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/src/Components/EditWeeklyReport.tsx b/frontend/src/Components/EditWeeklyReport.tsx index b0e8771..3da3b86 100644 --- a/frontend/src/Components/EditWeeklyReport.tsx +++ b/frontend/src/Components/EditWeeklyReport.tsx @@ -82,7 +82,7 @@ export default function GetWeeklyReport(): JSX.Element { } e.preventDefault(); void handleNewWeeklyReport(); - navigate("/project"); + navigate(-1); }} >
From 4f53f9de94e5b83361c3b0cc8dd6778f0fc08eb0 Mon Sep 17 00:00:00 2001 From: Davenludd Date: Tue, 19 Mar 2024 09:33:20 +0100 Subject: [PATCH 04/52] Fix initial value of week state in NewWeeklyReport component for error message --- frontend/src/Components/NewWeeklyReport.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/frontend/src/Components/NewWeeklyReport.tsx b/frontend/src/Components/NewWeeklyReport.tsx index b8a6f7e..e53823d 100644 --- a/frontend/src/Components/NewWeeklyReport.tsx +++ b/frontend/src/Components/NewWeeklyReport.tsx @@ -5,7 +5,7 @@ import { useNavigate, useParams } from "react-router-dom"; import Button from "./Button"; export default function NewWeeklyReport(): JSX.Element { - const [week, setWeek] = useState(); + const [week, setWeek] = useState(0); const [developmentTime, setDevelopmentTime] = useState(); const [meetingTime, setMeetingTime] = useState(); const [adminTime, setAdminTime] = useState(); @@ -19,7 +19,7 @@ export default function NewWeeklyReport(): JSX.Element { const handleNewWeeklyReport = async (): Promise => { const newWeeklyReport: NewWeeklyReport = { projectName: projectName ?? "", - week: week ?? 0, + week: week, developmentTime: developmentTime ?? 0, meetingTime: meetingTime ?? 0, adminTime: adminTime ?? 0, From cda2b72d08031330b3d7f5676815df381f627a35 Mon Sep 17 00:00:00 2001 From: Mattias Date: Tue, 19 Mar 2024 09:34:37 +0100 Subject: [PATCH 05/52] projectName is now fetched from params --- frontend/src/Components/EditWeeklyReport.tsx | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/frontend/src/Components/EditWeeklyReport.tsx b/frontend/src/Components/EditWeeklyReport.tsx index 3da3b86..0bfc608 100644 --- a/frontend/src/Components/EditWeeklyReport.tsx +++ b/frontend/src/Components/EditWeeklyReport.tsx @@ -1,11 +1,10 @@ import { useState, useEffect } from "react"; import { NewWeeklyReport } from "../Types/goTypes"; import { api } from "../API/API"; -import { useNavigate } from "react-router-dom"; +import { useNavigate, useParams } from "react-router-dom"; import Button from "./Button"; export default function GetWeeklyReport(): JSX.Element { - const [projectName, setProjectName] = useState(""); const [week, setWeek] = useState(0); const [developmentTime, setDevelopmentTime] = useState(0); const [meetingTime, setMeetingTime] = useState(0); @@ -16,12 +15,13 @@ export default function GetWeeklyReport(): JSX.Element { const token = localStorage.getItem("accessToken") ?? ""; const username = localStorage.getItem("username") ?? ""; + const { projectName } = useParams(); useEffect(() => { const fetchWeeklyReport = async (): Promise => { const response = await api.getWeeklyReport( username, - projectName, + projectName ?? "", week.toString(), token, ); @@ -37,7 +37,7 @@ export default function GetWeeklyReport(): JSX.Element { studyTime: 0, testingTime: 0, }; - setProjectName(report.projectName); + setWeek(report.week); setDevelopmentTime(report.developmentTime); setMeetingTime(report.meetingTime); @@ -55,7 +55,7 @@ export default function GetWeeklyReport(): JSX.Element { const handleNewWeeklyReport = async (): Promise => { const newWeeklyReport: NewWeeklyReport = { - projectName, + projectName: projectName ?? "", week, developmentTime, meetingTime, From a30a6a498899f04ddceacd9b635211ef0062603c Mon Sep 17 00:00:00 2001 From: Davenludd Date: Tue, 19 Mar 2024 09:37:13 +0100 Subject: [PATCH 06/52] Fix button UserNewTimeReportPage --- .../src/Pages/UserPages/UserNewTimeReportPage.tsx | 13 ++----------- 1 file changed, 2 insertions(+), 11 deletions(-) diff --git a/frontend/src/Pages/UserPages/UserNewTimeReportPage.tsx b/frontend/src/Pages/UserPages/UserNewTimeReportPage.tsx index 2cdeb15..cd69b3b 100644 --- a/frontend/src/Pages/UserPages/UserNewTimeReportPage.tsx +++ b/frontend/src/Pages/UserPages/UserNewTimeReportPage.tsx @@ -1,7 +1,6 @@ +import BackButton from "../../Components/BackButton"; import BasicWindow from "../../Components/BasicWindow"; -import Button from "../../Components/Button"; import NewWeeklyReport from "../../Components/NewWeeklyReport"; -import { Link } from "react-router-dom"; function UserNewTimeReportPage(): JSX.Element { const content = ( @@ -13,15 +12,7 @@ function UserNewTimeReportPage(): JSX.Element { const buttons = ( <> - -
+ ); +} \ No newline at end of file diff --git a/frontend/src/main.tsx b/frontend/src/main.tsx index 20ecbcd..29a67d1 100644 --- a/frontend/src/main.tsx +++ b/frontend/src/main.tsx @@ -30,6 +30,7 @@ import AdminProjectStatistics from "./Pages/AdminPages/AdminProjectStatistics.ts import AdminProjectViewMemberInfo from "./Pages/AdminPages/AdminProjectViewMemberInfo.tsx"; import AdminProjectPage from "./Pages/AdminPages/AdminProjectPage.tsx"; import NotFoundPage from "./Pages/NotFoundPage.tsx"; +import UnauthorizedPage from "./Pages/UnauthorizedPage.tsx"; // This is where the routes are mounted const router = createBrowserRouter([ @@ -146,6 +147,10 @@ const router = createBrowserRouter([ path: "/adminManageUser", element: , }, + { + path: "unauthorized", + element: , + }, ]); // Semi-hacky way to get the root element From 900c1614e9dc6c9621ab826f647249b55a61d23c Mon Sep 17 00:00:00 2001 From: Mattias Date: Tue, 19 Mar 2024 22:50:57 +0100 Subject: [PATCH 24/52] minor fix --- frontend/src/Pages/UnauthorizedPage.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/src/Pages/UnauthorizedPage.tsx b/frontend/src/Pages/UnauthorizedPage.tsx index ed21b25..37e3d2c 100644 --- a/frontend/src/Pages/UnauthorizedPage.tsx +++ b/frontend/src/Pages/UnauthorizedPage.tsx @@ -15,4 +15,4 @@ export default function UnauthorizedPage(): JSX.Element {
); -} \ No newline at end of file +} From ffaa6616281dcd4165e575bd9d660b27e4908d8b Mon Sep 17 00:00:00 2001 From: Mattias Date: Tue, 19 Mar 2024 22:51:54 +0100 Subject: [PATCH 25/52] Minor fix --- frontend/src/main.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/src/main.tsx b/frontend/src/main.tsx index 29a67d1..ddf7119 100644 --- a/frontend/src/main.tsx +++ b/frontend/src/main.tsx @@ -148,7 +148,7 @@ const router = createBrowserRouter([ element: , }, { - path: "unauthorized", + path: "/unauthorized", element: , }, ]); From 863a14c316eafb0d1d0dbc1d5392e771bc95c659 Mon Sep 17 00:00:00 2001 From: Davenludd Date: Tue, 19 Mar 2024 23:44:00 +0100 Subject: [PATCH 26/52] Add WeeklyReport type and update getWeeklyReportsForProject method --- frontend/src/API/API.ts | 18 ++++++++++++------ 1 file changed, 12 insertions(+), 6 deletions(-) diff --git a/frontend/src/API/API.ts b/frontend/src/API/API.ts index fc2367b..3ebf343 100644 --- a/frontend/src/API/API.ts +++ b/frontend/src/API/API.ts @@ -4,6 +4,7 @@ import { User, Project, NewProject, + WeeklyReport, } from "../Types/goTypes"; // This type of pattern should be hard to misuse @@ -49,9 +50,10 @@ interface API { token: string, ): Promise>; getWeeklyReportsForProject( + username: string, projectName: string, token: string, - ): Promise>; + ): Promise>; /** Gets all the projects of a user*/ getUserProjects(token: string): Promise>; /** Gets a project from id*/ @@ -272,15 +274,19 @@ export const api: API = { } }, - async getWeeklyReportsForProject(projectName: string, token: string) { + async getWeeklyReportsForProject( + username: string, + projectName: string, + token: string, + ) { try { - const response = await fetch("/api/getWeeklyReportsForProject", { + const response = await fetch("/api/getWeeklyReportsUser", { method: "GET", headers: { "Content-Type": "application/json", Authorization: "Bearer " + token, }, - body: JSON.stringify({ projectName }), + body: JSON.stringify({ username, projectName }), }); if (!response.ok) { @@ -289,13 +295,13 @@ export const api: API = { message: "Failed to get weekly reports for project", }; } else { - const data = (await response.json()) as NewWeeklyReport[]; + const data = (await response.json()) as WeeklyReport[]; return { success: true, data }; } } catch (e) { return { success: false, - message: "Failed to get weekly reports for project", + message: "fuck", }; } }, From b5d3ab7cb73e2a75473770b6166ce94d152bb776 Mon Sep 17 00:00:00 2001 From: Davenludd Date: Tue, 19 Mar 2024 23:44:25 +0100 Subject: [PATCH 27/52] Refactor AllTimeReportsInProject component to use API for fetching weekly reports --- .../Components/AllTimeReportsInProject.tsx | 75 ++++--------------- 1 file changed, 16 insertions(+), 59 deletions(-) diff --git a/frontend/src/Components/AllTimeReportsInProject.tsx b/frontend/src/Components/AllTimeReportsInProject.tsx index 067712e..cc2bac4 100644 --- a/frontend/src/Components/AllTimeReportsInProject.tsx +++ b/frontend/src/Components/AllTimeReportsInProject.tsx @@ -1,68 +1,25 @@ import React, { 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"; function AllTimeReportsInProject(): JSX.Element { const { projectName } = useParams(); - const [weeklyReports, setWeeklyReports] = useState([]); - - /* const getWeeklyReports = async (): Promise => { - const token = localStorage.getItem("accessToken") ?? ""; - const response = await api.getWeeklyReports(token); - console.log(response); - if (response.success) { - setWeeklyReports(response.data ?? []); - } else { - console.error(response.message); - } -}; */ + const [weeklyReports, setWeeklyReports] = useState([]); const getWeeklyReports = async (): Promise => { - const report: NewWeeklyReport[] = [ - { - projectName: projectName ?? "", - week: 10, - developmentTime: 1, - meetingTime: 1, - adminTime: 1, - ownWorkTime: 1, - studyTime: 1, - testingTime: 1, - }, - { - projectName: projectName ?? "", - week: 11, - developmentTime: 1, - meetingTime: 1, - adminTime: 1, - ownWorkTime: 100, - studyTime: 1, - testingTime: 1, - }, - { - projectName: projectName ?? "", - week: 12, - developmentTime: 1, - meetingTime: 1, - adminTime: 1, - ownWorkTime: 1, - studyTime: 1, - testingTime: 1000, - }, - { - projectName: projectName ?? "", - week: 20, - developmentTime: 1, - meetingTime: 1, - adminTime: 1, - ownWorkTime: 1, - studyTime: 1, - testingTime: 10000, - }, - // Add more reports as needed - ]; - setWeeklyReports(report); - await Promise.resolve(); + const token = localStorage.getItem("accessToken") ?? ""; + const response = await api.getWeeklyReportsForProject( + localStorage.getItem("username") ?? "", + projectName ?? "", + token, + ); + console.log(response); + if (response.success) { + setWeeklyReports(response.data ?? []); + } else { + console.error(response.message); + } }; // Call getProjects when the component mounts @@ -96,7 +53,7 @@ function AllTimeReportsInProject(): JSX.Element {

{"Signed: "} - YES + {newWeeklyReport.signedBy ? "YES" : "NO"}

From 8300fb3a6fe0ec4abe47a8e5bde02928b21b845d Mon Sep 17 00:00:00 2001 From: Peter KW Date: Wed, 20 Mar 2024 00:10:24 +0100 Subject: [PATCH 28/52] Added getAllUsers to API --- frontend/src/API/API.ts | 32 +++++++++++++++++++++++++++++++- 1 file changed, 31 insertions(+), 1 deletion(-) diff --git a/frontend/src/API/API.ts b/frontend/src/API/API.ts index 8fd66d3..7f5c420 100644 --- a/frontend/src/API/API.ts +++ b/frontend/src/API/API.ts @@ -45,6 +45,8 @@ interface API { getUserProjects(token: string): Promise>; /** Gets a project from id*/ getProject(id: number): Promise>; + /** Gets a project from id*/ + getAllUsers(token: string): Promise>; } // Export an instance of the API @@ -81,7 +83,7 @@ export const api: API = { token: string, ): Promise> { try { - const response = await fetch("/api/userdelete", { + const response = await fetch(`/api/userdelete/${username}`, { method: "POST", headers: { "Content-Type": "application/json", @@ -278,4 +280,32 @@ export const api: API = { }; } }, + + // Gets all users + async getAllUsers(token: string): Promise> { + try { + const response = await fetch("/api/users/all", { + method: "GET", + headers: { + "Content-Type": "application/json", + Authorization: "Bearer " + token, + }, + }); + + if (!response.ok) { + return Promise.resolve({ + success: false, + message: "Failed to get users", + }); + } else { + const data = (await response.json()) as string[]; + return Promise.resolve({ success: true, data }); + } + } catch (e) { + return Promise.resolve({ + success: false, + message: "API is not ok", + }); + } + }, }; From cc231dbfaad1f5adbff021cd6270ad7db2f38ba3 Mon Sep 17 00:00:00 2001 From: Peter KW Date: Wed, 20 Mar 2024 00:14:23 +0100 Subject: [PATCH 29/52] Component for getting all users --- frontend/src/Components/GetAllUsers.tsx | 35 +++++++++++++++++++++++++ 1 file changed, 35 insertions(+) create mode 100644 frontend/src/Components/GetAllUsers.tsx diff --git a/frontend/src/Components/GetAllUsers.tsx b/frontend/src/Components/GetAllUsers.tsx new file mode 100644 index 0000000..73ad244 --- /dev/null +++ b/frontend/src/Components/GetAllUsers.tsx @@ -0,0 +1,35 @@ +import { Dispatch, useEffect } from "react"; +import { api } from "../API/API"; + +/** + * Gets all usernames in the system and puts them in an array + * @param props - A setStateAction for the array you want to put users in + * @returns {void} Nothing + * @example + * const [users, setUsers] = useState([]); + * GetAllUsers({ setUsersProp: setUsers }); + */ +function GetAllUsers(props: { + setUsersProp: Dispatch>; +}): void { + const setUsers: Dispatch> = props.setUsersProp; + useEffect(() => { + const fetchUsers = async (): Promise => { + try { + const token = localStorage.getItem("accessToken") ?? ""; + const response = await api.getAllUsers(token); + if (response.success) { + setUsers(response.data ?? []); + } else { + console.error("Failed to fetch users:", response.message); + } + } catch (error) { + console.error("Error fetching users:", error); + } + }; + + void fetchUsers(); + }, [setUsers]); +} + +export default GetAllUsers; From b20817ec8aafd833b4e37e989db5cf45b830a7a9 Mon Sep 17 00:00:00 2001 From: Peter KW Date: Wed, 20 Mar 2024 00:16:30 +0100 Subject: [PATCH 30/52] Small fix to props and imports --- frontend/src/Components/UserListAdmin.tsx | 16 ++++------------ 1 file changed, 4 insertions(+), 12 deletions(-) diff --git a/frontend/src/Components/UserListAdmin.tsx b/frontend/src/Components/UserListAdmin.tsx index 3d2bcae..76cae9f 100644 --- a/frontend/src/Components/UserListAdmin.tsx +++ b/frontend/src/Components/UserListAdmin.tsx @@ -1,14 +1,6 @@ import { useState } from "react"; -import { PublicUser } from "../Types/goTypes"; import UserInfoModal from "./UserInfoModal"; -/** - * The props for the UserProps component - */ -interface UserProps { - users: PublicUser[]; -} - /** * A list of users for admin manage users page, that sets an onClick * function for eact user
  • element, which displays a modul with @@ -20,7 +12,7 @@ interface UserProps { * return ; */ -export function UserListAdmin(props: UserProps): JSX.Element { +export function UserListAdmin(props: { users: string[] }): JSX.Element { const [modalVisible, setModalVisible] = useState(false); const [username, setUsername] = useState(""); @@ -46,12 +38,12 @@ export function UserListAdmin(props: UserProps): JSX.Element { {props.users.map((user) => (
  • { - handleClick(user.username); + handleClick(user); }} > - {user.username} + {user}
    • ))} From 4e100229f5c3c84d65865547de4c8e1cd03fc2d1 Mon Sep 17 00:00:00 2001 From: Peter KW Date: Wed, 20 Mar 2024 00:16:56 +0100 Subject: [PATCH 31/52] Now uses GetAllUsers --- frontend/src/Pages/AdminPages/AdminManageUsers.tsx | 10 ++++------ 1 file changed, 4 insertions(+), 6 deletions(-) diff --git a/frontend/src/Pages/AdminPages/AdminManageUsers.tsx b/frontend/src/Pages/AdminPages/AdminManageUsers.tsx index 0939d77..353fddc 100644 --- a/frontend/src/Pages/AdminPages/AdminManageUsers.tsx +++ b/frontend/src/Pages/AdminPages/AdminManageUsers.tsx @@ -2,15 +2,13 @@ import BasicWindow from "../../Components/BasicWindow"; import Button from "../../Components/Button"; import BackButton from "../../Components/BackButton"; import { UserListAdmin } from "../../Components/UserListAdmin"; -import { PublicUser } from "../../Types/goTypes"; import { useNavigate } from "react-router-dom"; +import GetAllUsers from "../../Components/GetAllUsers"; +import { useState } from "react"; function AdminManageUsers(): JSX.Element { - //TODO: Change so that it reads users from database - const users: PublicUser[] = []; - for (let i = 1; i <= 20; i++) { - users.push({ userId: "id" + i, username: "Example User " + i }); - } + const [users, setUsers] = useState([]); + GetAllUsers({ setUsersProp: setUsers }); const navigate = useNavigate(); From 033268f4eff1908317f86e93f7c73664860ebe9d Mon Sep 17 00:00:00 2001 From: Davenludd Date: Wed, 20 Mar 2024 08:47:11 +0100 Subject: [PATCH 32/52] Added info to component --- frontend/src/Components/AllTimeReportsInProject.tsx | 3 +++ 1 file changed, 3 insertions(+) diff --git a/frontend/src/Components/AllTimeReportsInProject.tsx b/frontend/src/Components/AllTimeReportsInProject.tsx index cc2bac4..809e6ed 100644 --- a/frontend/src/Components/AllTimeReportsInProject.tsx +++ b/frontend/src/Components/AllTimeReportsInProject.tsx @@ -1,3 +1,6 @@ +//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 React, { useEffect, useState } from "react"; import { WeeklyReport } from "../Types/goTypes"; import { Link, useParams } from "react-router-dom"; From 1b21b2574aa51dc16443792fe084a6dae55fd572 Mon Sep 17 00:00:00 2001 From: Mattias Date: Wed, 20 Mar 2024 12:36:30 +0100 Subject: [PATCH 33/52] Comp for displaying projectmembers and changed path in main --- frontend/src/Components/ProjectMembers.tsx | 99 +++++++++++++++++++ .../ProjectManagerPages/PMProjectMembers.tsx | 13 ++- frontend/src/main.tsx | 8 +- 3 files changed, 114 insertions(+), 6 deletions(-) create mode 100644 frontend/src/Components/ProjectMembers.tsx diff --git a/frontend/src/Components/ProjectMembers.tsx b/frontend/src/Components/ProjectMembers.tsx new file mode 100644 index 0000000..e1f261e --- /dev/null +++ b/frontend/src/Components/ProjectMembers.tsx @@ -0,0 +1,99 @@ +import { useEffect, useState } from "react"; +import { Link, useParams } from "react-router-dom"; + +function ProjectMembers(): JSX.Element { + const { projectName } = useParams(); + const [projectMembers, setProjectMembers] = useState([]); + + // const getProjectMembers = async (): Promise => { + // const token = localStorage.getItem("accessToken") ?? ""; + // const response = await api.getProjectMembers(projectName ?? "", token); + // console.log(response); + // if (response.success) { + // setProjectMembers(response.data ?? []); + // } else { + // console.error(response.message); + // } + // }; + + interface ProjectMember { + username: string; + role: string; + } + + const mockProjectMembers = [ + { + username: "username1", + role: "Project Manager", + }, + { + username: "username2", + role: "System Manager", + }, + { + username: "username3", + role: "Developer", + }, + { + username: "username4", + role: "Tester", + }, + { + username: "username5", + role: "Tester", + }, + { + username: "username6", + role: "Tester", + }, + ]; + + const getProjectMembers = async (): Promise => { + // Use the mock data + setProjectMembers(mockProjectMembers); + + await Promise.resolve(); + }; + + useEffect(() => { + void getProjectMembers(); + }, []); + + return ( + <> +
    + {projectMembers.map((projectMember, index) => ( +

    +
    +
    +

    {projectMember.username}

    + Role: +

    {projectMember.role}

    +
    +
    +
    + +

    + View Reports +

    + + +

    + Change Role +

    + +
    +
    +
    +

    + ))} +
    + + ); +} + +export default ProjectMembers; diff --git a/frontend/src/Pages/ProjectManagerPages/PMProjectMembers.tsx b/frontend/src/Pages/ProjectManagerPages/PMProjectMembers.tsx index 9fe96cf..11b8636 100644 --- a/frontend/src/Pages/ProjectManagerPages/PMProjectMembers.tsx +++ b/frontend/src/Pages/ProjectManagerPages/PMProjectMembers.tsx @@ -1,10 +1,19 @@ import BasicWindow from "../../Components/BasicWindow"; import Button from "../../Components/Button"; import BackButton from "../../Components/BackButton"; -import { Link } from "react-router-dom"; +import { Link, useParams } from "react-router-dom"; +import ProjectMembers from "../../Components/ProjectMembers"; function PMProjectMembers(): JSX.Element { - const content = <>; + const { projectName } = useParams(); + const content = ( + <> +

    + All Members In: {projectName}{" "} +

    + + + ); const buttons = ( <> diff --git a/frontend/src/main.tsx b/frontend/src/main.tsx index 25c7a35..bac2292 100644 --- a/frontend/src/main.tsx +++ b/frontend/src/main.tsx @@ -64,7 +64,7 @@ const router = createBrowserRouter([ element: , }, { - path: "/changeRole", + path: "/changeRole/:projectName/:username", element: , }, { @@ -72,11 +72,11 @@ const router = createBrowserRouter([ element: , }, { - path: "/projectMembers", + path: "/projectMembers/:projectName", element: , }, { - path: "/PMProjectPage", + path: "/PMProjectPage/:projectName", element: , }, { @@ -88,7 +88,7 @@ const router = createBrowserRouter([ element: , }, { - path: "/unsignedReports", + path: "/unsignedReports/:projectName", element: , }, { From d3bb6f49e5d597b7c73816de2cbffd54dd766978 Mon Sep 17 00:00:00 2001 From: Mattias Date: Wed, 20 Mar 2024 13:51:49 +0100 Subject: [PATCH 34/52] New comp changeRoles --- frontend/src/Components/ChangeRoles.tsx | 83 +++++++++++++++++++ .../ProjectManagerPages/PMChangeRole.tsx | 15 ++-- 2 files changed, 89 insertions(+), 9 deletions(-) create mode 100644 frontend/src/Components/ChangeRoles.tsx diff --git a/frontend/src/Components/ChangeRoles.tsx b/frontend/src/Components/ChangeRoles.tsx new file mode 100644 index 0000000..e11d623 --- /dev/null +++ b/frontend/src/Components/ChangeRoles.tsx @@ -0,0 +1,83 @@ +import { useState } from "react"; +import { useParams } from "react-router-dom"; +import Button from "./Button"; + +export default function ChangeRoles(): JSX.Element { + const [selectedRole, setSelectedRole] = useState(""); + const { username } = useParams(); + + const handleRoleChange = ( + event: React.ChangeEvent, + ): void => { + setSelectedRole(event.target.value); + }; + + // const handleSubmit = async (event: React.FormEvent) => { + // event.preventDefault(); + + // const response = await api.changeRole(username, selectedRole, token); + // if (response.success) { + // console.log("Role changed successfully"); + // } else { + // console.error("Failed to change role:", response.message); + // } + // }; + + return ( + <> +

    + Change roll for: {username} +

    +
    +
    +
    + +
    +
    + +
    +
    + +
    +
    +
    ; -} From aa5c4017bb3087d475e4fd85a1f94c7a9d5463c6 Mon Sep 17 00:00:00 2001 From: Davenludd Date: Wed, 20 Mar 2024 13:54:13 +0100 Subject: [PATCH 41/52] Docs/Comments to DisplayUserProjects component --- frontend/src/Components/DisplayUserProjects.tsx | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/frontend/src/Components/DisplayUserProjects.tsx b/frontend/src/Components/DisplayUserProjects.tsx index 266f1ce..f4fd782 100644 --- a/frontend/src/Components/DisplayUserProjects.tsx +++ b/frontend/src/Components/DisplayUserProjects.tsx @@ -3,6 +3,10 @@ import { Project } from "../Types/goTypes"; import { Link } from "react-router-dom"; import { api } from "../API/API"; +/** + * Renders a component that displays the projects a user is a part of and links to the projects start-page. + * @returns The JSX element representing the component. + */ function DisplayUserProject(): JSX.Element { const [projects, setProjects] = useState([]); @@ -16,6 +20,7 @@ function DisplayUserProject(): JSX.Element { console.error(response.message); } }; + // Call getProjects when the component mounts useEffect(() => { void getProjects(); From dbeeb609b322d0572abff578e00ac7c0ad44d020 Mon Sep 17 00:00:00 2001 From: Davenludd Date: Wed, 20 Mar 2024 13:54:32 +0100 Subject: [PATCH 42/52] Docs/Comments to GetWeeklyReport component --- frontend/src/Components/EditWeeklyReport.tsx | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/frontend/src/Components/EditWeeklyReport.tsx b/frontend/src/Components/EditWeeklyReport.tsx index 3017204..e824b19 100644 --- a/frontend/src/Components/EditWeeklyReport.tsx +++ b/frontend/src/Components/EditWeeklyReport.tsx @@ -4,6 +4,10 @@ import { api } from "../API/API"; import { useNavigate, useParams } from "react-router-dom"; import Button from "./Button"; +/** + * Renders the component for editing a weekly report. + * @returns JSX.Element + */ export default function GetWeeklyReport(): JSX.Element { const [week, setWeek] = useState(0); const [developmentTime, setDevelopmentTime] = useState(0); From cf6c8cd34c779b86ffa07a96427aa66a1be7d1a8 Mon Sep 17 00:00:00 2001 From: Davenludd Date: Wed, 20 Mar 2024 13:54:59 +0100 Subject: [PATCH 43/52] Docs/Comments to Footer component --- frontend/src/Components/Footer.tsx | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/frontend/src/Components/Footer.tsx b/frontend/src/Components/Footer.tsx index a3b7469..192926f 100644 --- a/frontend/src/Components/Footer.tsx +++ b/frontend/src/Components/Footer.tsx @@ -1,5 +1,13 @@ +//info: Footer component to display the footer of a page where the buttons are placed import React from "react"; +/** + * Footer component. + * + * @param {Object} props - The component props. + * @param {React.ReactNode} props.children - The children elements to render inside the footer (buttons). + * @returns {JSX.Element} The rendered footer component. + */ function Footer({ children }: { children: React.ReactNode }): JSX.Element { return (