diff --git a/frontend/src/API/API.ts b/frontend/src/API/API.ts index 41be31a..39b5d0a 100644 --- a/frontend/src/API/API.ts +++ b/frontend/src/API/API.ts @@ -114,10 +114,14 @@ interface API { ): Promise>; /** Gets all the projects of a user + * @param {string} username - The authentication token. * @param {string} token - The authentication token. * @returns {Promise>} A promise containing the API response with the user's projects. */ - getUserProjects(token: string): Promise>; + getUserProjects( + username: string, + token: string, + ): Promise>; /** Gets a project by its id. * @param {number} id The id of the project to retrieve. @@ -302,9 +306,12 @@ export const api: API = { } }, - async getUserProjects(token: string): Promise> { + async getUserProjects( + username: string, + token: string, + ): Promise> { try { - const response = await fetch("/api/getUserProjects", { + const response = await fetch(`/api/getUserProjects/${username}`, { method: "GET", headers: { "Content-Type": "application/json", diff --git a/frontend/src/Components/DisplayUserProjects.tsx b/frontend/src/Components/DisplayUserProjects.tsx index f4fd782..0cd5a8e 100644 --- a/frontend/src/Components/DisplayUserProjects.tsx +++ b/frontend/src/Components/DisplayUserProjects.tsx @@ -1,7 +1,7 @@ -import { useState, useEffect } from "react"; +import { useState } from "react"; import { Project } from "../Types/goTypes"; import { Link } from "react-router-dom"; -import { api } from "../API/API"; +import GetProjects from "./GetProjects"; /** * Renders a component that displays the projects a user is a part of and links to the projects start-page. @@ -10,21 +10,10 @@ import { api } from "../API/API"; function DisplayUserProject(): JSX.Element { const [projects, setProjects] = useState([]); - const getProjects = async (): Promise => { - const token = localStorage.getItem("accessToken") ?? ""; - const response = await api.getUserProjects(token); - console.log(response); - if (response.success) { - setProjects(response.data ?? []); - } else { - console.error(response.message); - } - }; - - // Call getProjects when the component mounts - useEffect(() => { - void getProjects(); - }, []); + GetProjects({ + setProjectsProp: setProjects, + username: localStorage.getItem("username") ?? "", + }); return ( <> diff --git a/frontend/src/Components/GetProjects.tsx b/frontend/src/Components/GetProjects.tsx index d6ab1f7..764b082 100644 --- a/frontend/src/Components/GetProjects.tsx +++ b/frontend/src/Components/GetProjects.tsx @@ -12,6 +12,7 @@ import { api } from "../API/API"; */ function GetProjects(props: { setProjectsProp: Dispatch>; + username: string; }): void { const setProjects: Dispatch> = props.setProjectsProp; @@ -19,7 +20,7 @@ function GetProjects(props: { const fetchUsers = async (): Promise => { try { const token = localStorage.getItem("accessToken") ?? ""; - const response = await api.getUserProjects(token); + const response = await api.getUserProjects(props.username, token); if (response.success) { setProjects(response.data ?? []); } else { @@ -31,7 +32,7 @@ function GetProjects(props: { }; void fetchUsers(); - }, [setProjects]); + }, [props.username, setProjects]); } export default GetProjects; diff --git a/frontend/src/Components/UserInfoModal.tsx b/frontend/src/Components/UserInfoModal.tsx index 9695899..9d8dc11 100644 --- a/frontend/src/Components/UserInfoModal.tsx +++ b/frontend/src/Components/UserInfoModal.tsx @@ -42,7 +42,7 @@ function UserInfoModal(props: { Member of these projects:
- +
diff --git a/frontend/src/Components/UserProjectListAdmin.tsx b/frontend/src/Components/UserProjectListAdmin.tsx index 1b7b923..5335f1b 100644 --- a/frontend/src/Components/UserProjectListAdmin.tsx +++ b/frontend/src/Components/UserProjectListAdmin.tsx @@ -2,16 +2,16 @@ import { useEffect, useState } from "react"; import { api } from "../API/API"; import { Project } from "../Types/goTypes"; -function UserProjectListAdmin(): JSX.Element { +function UserProjectListAdmin(props: { username: string }): JSX.Element { const [projects, setProjects] = useState([]); useEffect(() => { const fetchProjects = async (): Promise => { try { const token = localStorage.getItem("accessToken") ?? ""; - // const username = props.username; + const username = props.username; - const response = await api.getUserProjects(token); + const response = await api.getUserProjects(username, token); if (response.success) { setProjects(response.data ?? []); } else { @@ -23,7 +23,7 @@ function UserProjectListAdmin(): JSX.Element { }; void fetchProjects(); - }, []); + }, [props.username]); return (
diff --git a/frontend/src/Pages/AdminPages/AdminManageProjects.tsx b/frontend/src/Pages/AdminPages/AdminManageProjects.tsx index 7ea45df..6c03c01 100644 --- a/frontend/src/Pages/AdminPages/AdminManageProjects.tsx +++ b/frontend/src/Pages/AdminPages/AdminManageProjects.tsx @@ -9,7 +9,10 @@ import { useState } from "react"; function AdminManageProjects(): JSX.Element { const [projects, setProjects] = useState([]); - GetProjects({ setProjectsProp: setProjects }); + GetProjects({ + setProjectsProp: setProjects, + username: localStorage.getItem("username") ?? "", + }); const content = ( <>

Manage Projects