Imbus/TTime
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Merge remote-tracking branch 'origin/dev' into borean

Browse source
This commit is contained in:
thugborean 2024-04-03 19:02:01 +02:00
commit 745786b7fd
54 changed files with 1657 additions and 1034 deletions
Download patch file Download diff file Expand all files Collapse all files

316
frontend/src/API/API.ts
View file

@ -1,13 +1,16 @@
import { NewProjMember } from "../Components/AddMember";
import { ProjectRoleChange } from "../Components/ChangeRole";
import { projectTimes } from "../Components/GetProjectTimes";
import { ProjectMember } from "../Components/GetUsersInProject";
import {
UpdateWeeklyReport,
NewWeeklyReport,
NewUser,
User,
Project,
NewProject,
UserProjectMember,
WeeklyReport,
StrNameChange,
NewProjMember,
} from "../Types/goTypes";
/**
@ -73,10 +76,7 @@ interface API {
* @param {string} token The authentication token.
* @returns {Promise<APIResponse<Project>>} A promise resolving to an API response with the created project.
*/
createProject(
project: NewProject,
token: string,
): Promise<APIResponse<Project>>;
createProject(project: NewProject, token: string): Promise<APIResponse<void>>;
/** Submits a weekly report
* @param {NewWeeklyReport} weeklyReport The weekly report object.
@ -88,16 +88,31 @@ interface API {
token: string,
): Promise<APIResponse<string>>;
/** Gets a weekly report for a specific user, project and week
/**
* Updates a weekly report.
* @param {UpdateWeeklyReport} weeklyReport The updated weekly report object.
* @param {string} token The authentication token.
* @returns {Promise<APIResponse<string>>} A promise containing the API response with the updated report.
*/
updateWeeklyReport(
weeklyReport: UpdateWeeklyReport,
token: string,
): Promise<APIResponse<string>>;
/** Gets a weekly report for a specific user, project and week.
* Keep in mind that the user within the token needs to be PM
* of the project to get the report, unless the user is the target user.
* @param {string} projectName The name of the project.
* @param {string} week The week number.
* @param {string} token The authentication token.
* @param {string} targetUser The username of the target user. Defaults to token user.
* @returns {Promise<APIResponse<WeeklyReport>>} A promise resolving to an API response with the retrieved report.
*/
getWeeklyReport(
projectName: string,
week: string,
token: string,
targetUser?: string,
): Promise<APIResponse<WeeklyReport>>;
/**
@ -107,16 +122,21 @@ interface API {
* @param {string} token The token of the user
* @returns {APIResponse<WeeklyReport[]>} A list of weekly reports
*/
getWeeklyReportsForUser(
getAllWeeklyReportsForUser(
projectName: string,
token: string,
targetUser?: string,
): Promise<APIResponse<WeeklyReport[]>>;
/** Gets all the projects of a user
* @param {string} username - The authentication token.
* @param {string} token - The authentication token.
* @returns {Promise<APIResponse<Project[]>>} A promise containing the API response with the user's projects.
*/
getUserProjects(token: string): Promise<APIResponse<Project[]>>;
getUserProjects(
username: string,
token: string,
): Promise<APIResponse<Project[]>>;
/** Gets a project by its id.
* @param {number} id The id of the project to retrieve.
@ -124,6 +144,16 @@ interface API {
*/
getProject(id: number): Promise<APIResponse<Project>>;
/** Gets a projects reported time
* @param {string} projectName The name of the project.
* @param {string} token The usertoken.
* @returns {Promise<APIResponse<Times>>} A promise resolving to an API response containing the project times.
*/
getProjectTimes(
projectName: string,
token: string,
): Promise<APIResponse<projectTimes>>;
/** Gets a list of all users.
* @param {string} token The authentication token of the requesting user.
* @returns {Promise<APIResponse<string[]>>} A promise resolving to an API response containing the list of users.
@ -133,7 +163,18 @@ interface API {
getAllUsersProject(
projectName: string,
token: string,
): Promise<APIResponse<UserProjectMember[]>>;
): Promise<APIResponse<ProjectMember[]>>;
/** Gets all unsigned reports in a project.
* @param {string} projectName The name of the project.
* @param {string} token The authentication token.
* @returns {Promise<APIResponse<WeeklyReport[]>>} A promise resolving to an API response containing the list of unsigned reports.
*/
getUnsignedReportsInProject(
projectName: string,
token: string,
): Promise<APIResponse<WeeklyReport[]>>;
/**
* Changes the username of a user in the database.
* @param {StrNameChange} data The object containing the previous and new username.
@ -144,10 +185,27 @@ interface API {
data: StrNameChange,
token: string,
): Promise<APIResponse<void>>;
/**
* Changes the role of a user in the database.
* @param {RoleChange} roleInfo The object containing the previous and new username.
* @param {string} token The authentication token.
* @returns {Promise<APIResponse<void>>} A promise resolving to an API response.
*/
changeUserRole(
roleInfo: ProjectRoleChange,
token: string,
): Promise<APIResponse<void>>;
addUserToProject(
user: NewProjMember,
token: string,
): Promise<APIResponse<NewProjMember>>;
): Promise<APIResponse<void>>;
removeUserFromProject(
user: string,
project: string,
token: string,
): Promise<APIResponse<void>>;
removeProject(
projectName: string,
@ -161,8 +219,18 @@ interface API {
* @param {number} reportId The id of the report to sign
* @param {string} token The authentication token
*/
signReport(
reportId: number,
signReport(reportId: number, token: string): Promise<APIResponse<string>>;
/**
* Promotes a user to project manager within a project.
*
* @param {string} userName The username of the user to promote
* @param {string} projectName The name of the project to promote the user in
* @returns {Promise<APIResponse<string>} A promise resolving to an API response.
*/
promoteToPm(
userName: string,
projectName: string,
token: string,
): Promise<APIResponse<string>>;
}
@ -252,7 +320,7 @@ export const api: API = {
async createProject(
project: NewProject,
token: string,
): Promise<APIResponse<Project>> {
): Promise<APIResponse<void>> {
try {
const response = await fetch("/api/project", {
method: "POST",
@ -266,18 +334,17 @@ export const api: API = {
if (!response.ok) {
return { success: false, message: "Failed to create project" };
} else {
const data = (await response.json()) as Project;
return { success: true, data };
return { success: true };
}
} catch (e) {
return { success: false, message: "Failed to create project" };
return { success: false, message: "Failed to create project!" };
}
},
async addUserToProject(
user: NewProjMember,
token: string,
): Promise<APIResponse<NewProjMember>> {
): Promise<APIResponse<void>> {
try {
const response = await fetch("/api/addUserToProject", {
method: "PUT",
@ -298,6 +365,31 @@ export const api: API = {
}
},
async removeUserFromProject(
user: string,
project: string,
token: string,
): Promise<APIResponse<void>> {
try {
const response = await fetch(
`/api/removeUserFromProject/${project}?userName=${user}`,
{
method: "DELETE",
headers: {
"Content-Type": "application/json",
Authorization: "Bearer " + token,
},
},
);
if (!response.ok) {
return { success: false, message: "Failed to remove member" };
}
} catch (e) {
return { success: false, message: "Failed to remove member" };
}
return { success: true, message: "Removed member" };
},
async renewToken(token: string): Promise<APIResponse<string>> {
try {
const response = await fetch("/api/loginrenew", {
@ -319,9 +411,39 @@ export const api: API = {
}
},
async getUserProjects(token: string): Promise<APIResponse<Project[]>> {
async changeUserRole(
roleInfo: ProjectRoleChange,
token: string,
): Promise<APIResponse<void>> {
try {
const response = await fetch("/api/getUserProjects", {
const response = await fetch("/api/ProjectRoleChange", {
method: "POST",
headers: {
"Content-Type": "application/json",
Authorization: "Bearer " + token,
},
body: JSON.stringify(roleInfo),
});
if (!response.ok) {
if (response.status === 403) {
return { success: false, message: "Cannot change your own role" };
}
return { success: false, message: "Could not change role" };
} else {
return { success: true };
}
} catch (e) {
return { success: false, message: "Could not change role" };
}
},
async getUserProjects(
username: string,
token: string,
): Promise<APIResponse<Project[]>> {
try {
const response = await fetch(`/api/getUserProjects/${username}`, {
method: "GET",
headers: {
"Content-Type": "application/json",
@ -346,6 +468,37 @@ export const api: API = {
}
},
async getProjectTimes(
projectName: string,
token: string,
): Promise<APIResponse<projectTimes>> {
try {
const response = await fetch(`/api/getProjectTimes/${projectName}`, {
method: "GET",
headers: {
"Content-Type": "application/json",
Authorization: "Bearer " + token,
},
});
if (!response.ok) {
return Promise.resolve({
success: false,
message:
"Fetch error: " + response.status + ", failed to get project times",
});
} else {
const data = (await response.json()) as projectTimes;
return Promise.resolve({ success: true, data });
}
} catch (e) {
return Promise.resolve({
success: false,
message: "API error! Could not get times.",
});
}
},
async submitWeeklyReport(
weeklyReport: NewWeeklyReport,
token: string,
@ -377,14 +530,46 @@ export const api: API = {
}
},
async updateWeeklyReport(
weeklyReport: UpdateWeeklyReport,
token: string,
): Promise<APIResponse<string>> {
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,
token: string,
targetUser?: string,
): Promise<APIResponse<WeeklyReport>> {
try {
const response = await fetch(
`/api/getWeeklyReport?projectName=${projectName}&week=${week}`,
`/api/getWeeklyReport?projectName=${projectName}&week=${week}&targetUser=${targetUser ?? ""}`,
{
method: "GET",
headers: {
@ -405,18 +590,22 @@ export const api: API = {
}
},
async getWeeklyReportsForUser(
async getAllWeeklyReportsForUser(
projectName: string,
token: string,
targetUser?: string,
): Promise<APIResponse<WeeklyReport[]>> {
try {
const response = await fetch(`/api/getWeeklyReportsUser/${projectName}`, {
method: "GET",
headers: {
"Content-Type": "application/json",
Authorization: "Bearer " + token,
const response = await fetch(
`/api/getAllWeeklyReports/${projectName}?targetUser=${targetUser ?? ""}`,
{
method: "GET",
headers: {
"Content-Type": "application/json",
Authorization: "Bearer " + token,
},
},
});
);
if (!response.ok) {
return {
@ -513,7 +702,7 @@ export const api: API = {
async getAllUsersProject(
projectName: string,
token: string,
): Promise<APIResponse<UserProjectMember[]>> {
): Promise<APIResponse<ProjectMember[]>> {
try {
const response = await fetch(`/api/getUsersProject/${projectName}`, {
method: "GET",
@ -529,7 +718,7 @@ export const api: API = {
message: "Failed to get users",
});
} else {
const data = (await response.json()) as UserProjectMember[];
const data = (await response.json()) as ProjectMember[];
return Promise.resolve({ success: true, data });
}
} catch (e) {
@ -540,6 +729,38 @@ export const api: API = {
}
},
async getUnsignedReportsInProject(
projectName: string,
token: string,
): Promise<APIResponse<WeeklyReport[]>> {
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,
@ -569,7 +790,7 @@ export const api: API = {
token: string,
): Promise<APIResponse<string>> {
try {
const response = await fetch(`/api/projectdelete/${projectName}`, {
const response = await fetch(`/api/removeProject/${projectName}`, {
method: "DELETE",
headers: {
"Content-Type": "application/json",
@ -615,5 +836,36 @@ export const api: API = {
} catch (e) {
return { success: false, message: "Failed to sign report" };
}
}
},
async promoteToPm(
userName: string,
projectName: string,
token: string,
): Promise<APIResponse<string>> {
try {
const response = await fetch(
`/api/promoteToPm/${projectName}?userName=${userName}`,
{
method: "PUT",
headers: {
"Content-Type": "application/json",
Authorization: "Bearer " + token,
},
},
);
if (!response.ok) {
return {
success: false,
message: "Failed to promote user to project manager",
};
}
} catch (e) {
return {
success: false,
message: "Failed to promote user to project manager",
};
}
return { success: true, message: "User promoted to project manager" };
},
};

9
frontend/src/Components/AddMember.tsx
View file

@ -1,5 +1,10 @@
import { APIResponse, api } from "../API/API";
import { NewProjMember } from "../Types/goTypes";
export interface NewProjMember {
username: string;
role: string;
projectname: string;
}
/**
* Tries to add a member to a project
@ -21,7 +26,7 @@ function AddMember(props: { memberToAdd: NewProjMember }): boolean {
props.memberToAdd,
localStorage.getItem("accessToken") ?? "",
)
.then((response: APIResponse<NewProjMember>) => {
.then((response: APIResponse<void>) => {
if (response.success) {
alert("Member added");
added = true;

54
frontend/src/Components/AddProject.tsx
View file

@ -1,6 +1,6 @@
import { useState } from "react";
import { APIResponse, api } from "../API/API";
import { NewProject, Project } from "../Types/goTypes";
import { NewProject } from "../Types/goTypes";
import InputField from "./InputField";
import Logo from "../assets/Logo.svg";
import Button from "./Button";
@ -10,27 +10,26 @@ import Button from "./Button";
* @param {Object} props - Project name and description
* @returns {boolean} True if created, false if not
*/
function CreateProject(props: { name: string; description: string }): boolean {
function CreateProject(props: { name: string; description: string }): void {
const project: NewProject = {
name: props.name,
description: props.description,
};
let created = false;
api
.createProject(project, localStorage.getItem("accessToken") ?? "")
.then((response: APIResponse<Project>) => {
.then((response: APIResponse<void>) => {
if (response.success) {
created = true;
alert("Project added!");
} else {
alert("Project NOT added!");
console.error(response.message);
}
})
.catch((error) => {
alert("Project NOT added!");
console.error("An error occurred during creation:", error);
});
return created;
}
/**
@ -49,7 +48,10 @@ function AddProject() {
className="bg-white rounded px-8 pt-6 pb-8 mb-4 items-center justify-center flex flex-col w-fit h-fit"
onSubmit={(e) => {
e.preventDefault();
CreateProject({ name: name, description: description });
CreateProject({
name: name,
description: description,
});
}}
>
<img
@ -60,22 +62,26 @@ function AddProject() {
<h3 className="pb-4 mb-2 text-center font-bold text-[18px]">
Create a new project
</h3>
<InputField
label="Name"
type="text"
value={name}
onChange={(e) => {
setName(e.target.value);
}}
/>
<InputField
label="Description"
type="text"
value={description}
onChange={(e) => {
setDescription(e.target.value);
}}
/>
<div className="space-y-3">
<InputField
label="Name"
type="text"
value={name}
onChange={(e) => {
e.preventDefault();
setName(e.target.value);
}}
/>
<InputField
label="Description"
type="text"
value={description}
onChange={(e) => {
e.preventDefault();
setDescription(e.target.value);
}}
/>
</div>
<div className="flex items-center justify-between">
<Button
text="Create"

15
frontend/src/Components/AddUserToProject.tsx
View file

@ -1,15 +1,14 @@
import { useState } from "react";
import { NewProjMember } from "../Types/goTypes";
import Button from "./Button";
import GetAllUsers from "./GetAllUsers";
import AddMember from "./AddMember";
import AddMember, { NewProjMember } from "./AddMember";
import BackButton from "./BackButton";
/**
* Provides UI for adding a member to a project.
* @returns {JSX.Element} - Returns the component UI for adding a member
*/
function AddUserToProject(): JSX.Element {
function AddUserToProject(props: { projectName: string }): JSX.Element {
const [name, setName] = useState("");
const [users, setUsers] = useState<string[]>([]);
const [role, setRole] = useState("");
@ -18,7 +17,7 @@ function AddUserToProject(): JSX.Element {
const handleClick = (): boolean => {
const newMember: NewProjMember = {
username: name,
projectname: localStorage.getItem("projectName") ?? "",
projectname: props.projectName,
role: role,
};
return AddMember({ memberToAdd: newMember });
@ -33,13 +32,13 @@ function AddUserToProject(): JSX.Element {
Role chosen: [{role}]
</p>
<p className="pb-4 mb-2 text-center font-bold text-[18px]">
Project chosen: [{localStorage.getItem("projectName") ?? ""}]
Project chosen: [{props.projectName}]
</p>
<p className="p-1">Choose role:</p>
<div className="border-2 border-black p-2 rounded-xl text-center h-[10h] w-[16vh]">
<div className="border-2 border-black p-2 rounded-xl text-center h-[10h] w-[16] overflow-auto">
<ul className="text-center items-center font-medium space-y-2">
<li
className="h-[10h] w-[14vh] items-start p-1 border-2 border-black rounded-full bg-orange-200 hover:bg-orange-600 hover:text-slate-100 hover:cursor-pointer"
className="h-[10] w-[14] items-start px-2 py-1 border-2 border-black rounded-full bg-orange-200 hover:bg-orange-600 hover:text-slate-100 hover:cursor-pointer"
onClick={() => {
setRole("member");
}}
@ -47,7 +46,7 @@ function AddUserToProject(): JSX.Element {
{"Member"}
</li>
<li
className="h-[10h] w-[14vh] items-start p-1 border-2 border-black rounded-full bg-orange-200 hover:bg-orange-600 hover:text-slate-100 hover:cursor-pointer"
className="h-[10] w-[14] items-start px-2 py-1 border-2 border-black rounded-full bg-orange-200 hover:bg-orange-600 hover:text-slate-100 hover:cursor-pointer"
onClick={() => {
setRole("project_manager");
}}

42
frontend/src/Components/AllTimeReportsInProjectOtherUser.tsx
View file

@ -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<NewWeeklyReport[]>([]);
const [weeklyReports, setWeeklyReports] = useState<WeeklyReport[]>([]);
/* // Call getProjects when the component mounts
useEffect(() => {
const getWeeklyReports = async (): Promise<void> => {
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<void> => {
// 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();
}, []);

37
frontend/src/Components/ChangeRole.tsx Normal file
View file

@ -0,0 +1,37 @@
import { APIResponse, api } from "../API/API";
export interface ProjectRoleChange {
username: string;
role: "project_manager" | "member" | "";
projectname: string;
}
export default function ChangeRole(roleChangeInfo: ProjectRoleChange): void {
if (
roleChangeInfo.username === "" ||
roleChangeInfo.role === "" ||
roleChangeInfo.projectname === ""
) {
// FOR DEBUG
// console.log(roleChangeInfo.role + ": Role");
// console.log(roleChangeInfo.projectname + ": P-Name");
// console.log(roleChangeInfo.username + ": U-name");
alert("You have to select a role");
return;
}
api
.changeUserRole(roleChangeInfo, localStorage.getItem("accessToken") ?? "")
.then((response: APIResponse<void>) => {
if (response.success) {
alert("Role changed successfully");
location.reload();
} else {
alert(response.message);
console.error(response.message);
}
})
.catch((error) => {
alert(error);
console.error("An error occurred during change:", error);
});
}

73
frontend/src/Components/ChangeRoleView.tsx Normal file
View file

@ -0,0 +1,73 @@
import { useState } from "react";
import Button from "./Button";
import ChangeRole, { ProjectRoleChange } from "./ChangeRole";
export default function ChangeRoles(props: {
projectName: string;
username: string;
}): JSX.Element {
const [selectedRole, setSelectedRole] = useState<
"project_manager" | "member" | ""
>("");
const handleRoleChange = (
event: React.ChangeEvent<HTMLInputElement>,
): void => {
if (event.target.value === "member") {
setSelectedRole(event.target.value);
} else if (event.target.value === "project_manager") {
setSelectedRole(event.target.value);
}
};
const handleSubmit = (event: React.FormEvent<HTMLFormElement>): void => {
event.preventDefault();
const roleChangeInfo: ProjectRoleChange = {
username: props.username,
projectname: props.projectName,
role: selectedRole,
};
ChangeRole(roleChangeInfo);
};
return (
<div className="overflow-auto rounded-lg">
<h1 className="font-bold text-[20px]">Select role:</h1>
<form onSubmit={handleSubmit}>
<div className="h-[7vh] self-start text-left font-medium overflow-auto border-2 border-black rounded-lg p-2">
<div className="hover:font-bold">
<label>
<input
type="radio"
value="project_manager"
checked={selectedRole === "project_manager"}
onChange={handleRoleChange}
className="ml-2 mr-2 mb-3"
/>
Project manager
</label>
</div>
<div className="hover:font-bold">
<label>
<input
type="radio"
value="member"
checked={selectedRole === "member"}
onChange={handleRoleChange}
className="ml-2 mr-2"
/>
Member
</label>
</div>
</div>
<Button
text="Change"
onClick={(): void => {
return;
}}
type="submit"
/>
</form>
</div>
);
}

71
frontend/src/Components/ChangeUsername.tsx
View file

@ -1,61 +1,26 @@
import React, { useState } from "react";
import InputField from "./InputField";
import { api } from "../API/API";
function ChangeUsername(): JSX.Element {
const [newUsername, setNewUsername] = useState("");
const [errorMessage, setErrorMessage] = useState("");
const handleChange = (e: React.ChangeEvent<HTMLInputElement>): void => {
setNewUsername(e.target.value);
};
const handleSubmit = async (): Promise<void> => {
try {
// Call the API function to change the username
const token = localStorage.getItem("accessToken");
if (!token) {
throw new Error("Access token not found");
}
const response = await api.changeUserName(
{ prevName: "currentName", newName: newUsername },
token,
);
import { APIResponse, api } from "../API/API";
import { StrNameChange } from "../Types/goTypes";
function ChangeUsername(props: { nameChange: StrNameChange }): void {
if (props.nameChange.newName === "") {
alert("You have to select a new name");
return;
}
api
.changeUserName(props.nameChange, localStorage.getItem("accessToken") ?? "")
.then((response: APIResponse<void>) => {
if (response.success) {
// Optionally, add a success message or redirect the user
console.log("Username changed successfully");
alert("Name changed successfully");
location.reload();
} else {
// Handle the error message
console.error("Failed to change username:", response.message);
setErrorMessage(response.message ?? "Failed to change username");
alert("Name not changed");
console.error(response.message);
}
} catch (error) {
console.error("Error changing username:", error);
// Optionally, handle the error
setErrorMessage("Failed to change username");
}
};
const handleButtonClick = (): void => {
handleSubmit().catch((error) => {
console.error("Error in handleSubmit:", error);
})
.catch((error) => {
alert("Name not changed");
console.error("An error occurred during change:", error);
});
};
return (
<div>
<InputField
label="New Username"
type="text"
value={newUsername}
onChange={handleChange}
/>
{errorMessage && <div>{errorMessage}</div>}
<button onClick={handleButtonClick}>Update Username</button>
</div>
);
}
export default ChangeUsername;

33
frontend/src/Components/DeleteProject.tsx Normal file
View file

@ -0,0 +1,33 @@
import { api, APIResponse } from "../API/API";
/**
* Use to delete a project from the system
* @param {string} props.projectToDelete - The projectname of project to delete
* @returns {void} Nothing
* @example
* const exampleProjectName = "project";
* DeleteProject({ projectToDelete: exampleProjectName });
*/
function DeleteProject(props: { projectToDelete: string }): void {
api
.removeProject(
props.projectToDelete,
localStorage.getItem("accessToken") ?? "",
)
.then((response: APIResponse<string>) => {
if (response.success) {
alert("Project has been deleted!");
location.reload();
} else {
alert("Project has not been deleted");
console.error(response.message);
}
})
.catch((error) => {
alert("project has not been deleted");
console.error("An error occurred during deletion:", error);
});
}
export default DeleteProject;

4
frontend/src/Components/DeleteUser.tsx
View file

@ -3,7 +3,7 @@ import { api, APIResponse } from "../API/API";
/**
* Use to remove a user from the system
* @param props - The username of user to remove
* @param {string} props.usernameToDelete - The username of user to remove
* @returns {boolean} True if removed, false if not
* @example
* const exampleUsername = "user";
@ -29,7 +29,7 @@ function DeleteUser(props: { usernameToDelete: string }): boolean {
})
.catch((error) => {
alert("User has not been deleted");
console.error("An error occurred during creation:", error);
console.error("An error occurred during deletion:", error);
});
return removed;
}

152
frontend/src/Components/DisplayUnsignedReports.tsx
View file

@ -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,80 +9,25 @@ interface UnsignedReports {
*/
function DisplayUserProject(): JSX.Element {
const { projectName } = useParams();
const [unsignedReports, setUnsignedReports] = useState<UnsignedReports[]>([]);
const [unsignedReports, setUnsignedReports] = useState<WeeklyReport[]>([]);
//const navigate = useNavigate();
// const getUnsignedReports = async (): Promise<void> => {
// 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<void> => {
// 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<void> => {
// 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);
};
// Call getProjects when the component mounts
useEffect(() => {
const getUnsignedReports = async (): Promise<void> => {
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 (
<>
@ -95,32 +35,40 @@ function DisplayUserProject(): JSX.Element {
All Unsigned Reports In: {projectName}{" "}
</h1>
<div className="border-4 border-black bg-white flex flex-col items-center justify-center min-h-[65vh] h-fit w-[70vw] rounded-3xl content-center overflow-scroll space-y-[10vh] p-[30px] text-[20px]">
{unsignedReports.map(
(unsignedReport: UnsignedReports, index: number) => (
<h1 key={index} className="border-b-2 border-black w-full">
<div className="flex justify-between">
<div className="flex">
<h1>{unsignedReport.username}</h1>
<span className="ml-6 mr-2 font-bold">Week:</span>
<h1>{unsignedReport.week}</h1>
<span className="ml-6 mr-2 font-bold">Signed:</span>
<h1>NO</h1>
</div>
<div className="flex">
<div className="ml-auto flex space-x-4">
<Link
to={`/PMViewUnsignedReport/${projectName}/${unsignedReport.username}/${unsignedReport.week}`}
>
<h1 className="underline cursor-pointer font-bold">
View Report
</h1>
</Link>
</div>
{unsignedReports.map((unsignedReport: WeeklyReport, index: number) => (
<h1 key={index} className="border-b-2 border-black w-full">
<div className="flex justify-between">
<div className="flex">
<span className="ml-6 mr-2 font-bold">UserID:</span>
<h1>{unsignedReport.userId}</h1>
<span className="ml-6 mr-2 font-bold">Week:</span>
<h1>{unsignedReport.week}</h1>
<span className="ml-6 mr-2 font-bold">Total Time:</span>
<h1>
{unsignedReport.developmentTime +
unsignedReport.meetingTime +
unsignedReport.adminTime +
unsignedReport.ownWorkTime +
unsignedReport.studyTime +
unsignedReport.testingTime}
</h1>
<span className="ml-6 mr-2 font-bold">Signed:</span>
<h1>NO</h1>
</div>
<div className="flex">
<div className="ml-auto flex space-x-4">
<Link
to={`/PMViewUnsignedReport/${projectName}/${unsignedReport.userId}/${unsignedReport.week}`}
>
<h1 className="underline cursor-pointer font-bold">
View Report
</h1>
</Link>
</div>
</div>
</h1>
),
)}
</div>
</h1>
))}
</div>
</>
);

28
frontend/src/Components/DisplayUserProjects.tsx
View file

@ -1,6 +1,7 @@
import { useState, useEffect } from "react";
import { useState } from "react";
import { Project } from "../Types/goTypes";
import { useNavigate } from "react-router-dom";
import GetProjects from "./GetProjects";
import { api } from "../API/API";
/**
@ -11,22 +12,20 @@ function DisplayUserProject(): JSX.Element {
const [projects, setProjects] = useState<Project[]>([]);
const navigate = useNavigate();
const getProjects = async (): Promise<void> => {
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);
}
};
GetProjects({
setProjectsProp: setProjects,
username: localStorage.getItem("username") ?? "",
});
const handleProjectClick = async (projectName: string): Promise<void> => {
const token = localStorage.getItem("accessToken") ?? "";
const response = await api.checkIfProjectManager(projectName, token);
console.log(response.data);
if (response.success) {
if (response.data) {
if (
(response.data as unknown as { isProjectManager: boolean })
.isProjectManager
) {
navigate(`/PMProjectPage/${projectName}`);
} else {
navigate(`/project/${projectName}`);
@ -37,11 +36,6 @@ function DisplayUserProject(): JSX.Element {
}
};
// Call getProjects when the component mounts
useEffect(() => {
void getProjects();
}, []);
return (
<>
<h1 className="font-bold text-[30px] mb-[20px]">Your Projects</h1>

55
frontend/src/Components/EditWeeklyReport.tsx
View file

@ -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";
@ -22,6 +22,7 @@ export default function GetWeeklyReport(): JSX.Element {
projectName: string;
fetchedWeek: string;
}>();
const username = localStorage.getItem("userName") ?? "";
console.log(projectName, fetchedWeek);
useEffect(() => {
@ -60,8 +61,9 @@ export default function GetWeeklyReport(): JSX.Element {
void fetchWeeklyReport();
}, [projectName, fetchedWeek, token]);
const handleNewWeeklyReport = async (): Promise<void> => {
const newWeeklyReport: NewWeeklyReport = {
const handleUpdateWeeklyReport = async (): Promise<void> => {
const updateWeeklyReport: UpdateWeeklyReport = {
userName: username,
projectName: projectName ?? "",
week,
developmentTime,
@ -72,7 +74,7 @@ export default function GetWeeklyReport(): JSX.Element {
testingTime,
};
await api.submitWeeklyReport(newWeeklyReport, token);
await api.updateWeeklyReport(updateWeeklyReport, token);
};
const navigate = useNavigate();
@ -89,7 +91,8 @@ export default function GetWeeklyReport(): JSX.Element {
return;
}
e.preventDefault();
void handleNewWeeklyReport();
void handleUpdateWeeklyReport();
alert("Changes submitted");
navigate(-1);
}}
>
@ -128,7 +131,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 +160,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 +189,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 +218,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 +247,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 +276,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();
}}
/>

59
frontend/src/Components/GetProjectTimes.tsx Normal file
View file

@ -0,0 +1,59 @@
import { Dispatch, SetStateAction, useEffect } from "react";
import { api } from "../API/API";
/**
* Interface for reported time per category + total time reported
*/
export interface projectTimes {
admin: number;
development: number;
meeting: number;
own_work: number;
study: number;
testing: number;
totalTime?: number;
}
/**
* Gets all reported times for this project
* @param {Dispatch} props.setTimesProp - A setStateAction for the map you want to put times in
* @param {string} props.projectName - Username
* @returns {void} Nothing
* @example
* const projectName = "Example";
* const [times, setTimes] = useState<Times>();
* GetProjectTimes({ setTimesProp: setTimes, projectName: projectName });
*/
function GetProjectTimes(props: {
setTimesProp: Dispatch<SetStateAction<projectTimes | undefined>>;
projectName: string;
}): void {
const setTimes: Dispatch<SetStateAction<projectTimes | undefined>> =
props.setTimesProp;
useEffect(() => {
const fetchUsers = async (): Promise<void> => {
try {
const token = localStorage.getItem("accessToken") ?? "";
const response = await api.getProjectTimes(props.projectName, token);
if (response.success && response.data) {
// Calculates total time reported
response.data.totalTime = response.data.admin;
response.data.totalTime += response.data.development;
response.data.totalTime += response.data.meeting;
response.data.totalTime += response.data.own_work;
response.data.totalTime += response.data.study;
response.data.totalTime += response.data.testing;
setTimes(response.data);
} else {
console.error("Failed to fetch project times:", response.message);
}
} catch (error) {
console.error("Error fetching times:", error);
}
};
void fetchUsers();
}, [props.projectName, setTimes]);
}
export default GetProjectTimes;

11
frontend/src/Components/GetProjects.tsx
View file

@ -4,14 +4,17 @@ import { api } from "../API/API";
/**
* Gets all projects that user is a member of
* @param props - A setStateAction for the array you want to put projects in
* @param {Dispatch} props.setProjectsProp - A setStateAction for the array you want to put projects in
* @param {string} props.username - Username
* @returns {void} Nothing
* @example
* const username = "Example";
* const [projects, setProjects] = useState<Project[]>([]);
* GetAllUsers({ setProjectsProp: setProjects });
* GetProjects({ setProjectsProp: setProjects, username: username });
*/
function GetProjects(props: {
setProjectsProp: Dispatch<React.SetStateAction<Project[]>>;
username: string;
}): void {
const setProjects: Dispatch<React.SetStateAction<Project[]>> =
props.setProjectsProp;
@ -19,7 +22,7 @@ function GetProjects(props: {
const fetchUsers = async (): Promise<void> => {
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 +34,7 @@ function GetProjects(props: {
};
void fetchUsers();
}, [setProjects]);
}, [props.username, setProjects]);
}
export default GetProjects;

23
frontend/src/Components/GetUsersInProject.tsx
View file

@ -1,20 +1,25 @@
import { Dispatch, useEffect } from "react";
import { UserProjectMember } from "../Types/goTypes";
import { api } from "../API/API";
export interface ProjectMember {
Username: string;
UserRole: string;
}
/**
* Gets all projects that user is a member of
* @param props - A setStateAction for the array you want to put projects in
* Gets all members of a project
* @param string - The project's name
* @param Dispatch - A setStateAction for the array you want to put members in
* @returns {void} Nothing
* @example
* const [projects, setProjects] = useState<Project[]>([]);
* GetAllUsers({ setProjectsProp: setProjects });
* const [users, setUsers] = useState<User[]>([]);
* GetUsersInProject({ projectName: props.projectname, setUsersProp: setUsers });
*/
function GetUsersInProject(props: {
projectName: string;
setUsersProp: Dispatch<React.SetStateAction<UserProjectMember[]>>;
setUsersProp: Dispatch<React.SetStateAction<ProjectMember[]>>;
}): void {
const setUsers: Dispatch<React.SetStateAction<UserProjectMember[]>> =
const setUsers: Dispatch<React.SetStateAction<ProjectMember[]>> =
props.setUsersProp;
useEffect(() => {
const fetchUsers = async (): Promise<void> => {
@ -24,10 +29,10 @@ function GetUsersInProject(props: {
if (response.success) {
setUsers(response.data ?? []);
} else {
console.error("Failed to fetch projects:", response.message);
console.error("Failed to fetch members:", response.message);
}
} catch (error) {
console.error("Error fetching projects:", error);
console.error("Error fetching members:", error);
}
};
void fetchUsers();

2
frontend/src/Components/InputField.tsx
View file

@ -19,7 +19,7 @@ function InputField(props: {
onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
}): JSX.Element {
return (
<div className="mb-4">
<div className="">
<label
className="block text-gray-700 text-sm font-sans font-bold mb-2"
htmlFor={props.label}

34
frontend/src/Components/LoginField.tsx
View file

@ -25,22 +25,24 @@ function Login(props: {
}): JSX.Element {
return (
<form className="flex flex-col items-center" onSubmit={props.handleSubmit}>
<InputField
type="text"
label="Username"
onChange={(e) => {
props.setUsername(e.target.value);
}}
value={props.username}
/>
<InputField
type="password"
label="Password"
onChange={(e) => {
props.setPassword(e.target.value);
}}
value={props.password}
/>
<div className="space-y-3">
<InputField
type="text"
label="Username"
onChange={(e) => {
props.setUsername(e.target.value);
}}
value={props.username}
/>
<InputField
type="password"
label="Password"
onChange={(e) => {
props.setPassword(e.target.value);
}}
value={props.password}
/>
</div>
<Button
text="Login"
onClick={(): void => {

72
frontend/src/Components/MemberInfoModal.tsx Normal file
View file

@ -0,0 +1,72 @@
import Button from "./Button";
import DeleteUser from "./DeleteUser";
import UserProjectListAdmin from "./UserProjectListAdmin";
import { useState } from "react";
import ChangeRoleView from "./ChangeRoleView";
function MemberInfoModal(props: {
projectName: string;
username: string;
onClose: () => void;
}): JSX.Element {
const [showRoles, setShowRoles] = useState(false);
const handleChangeRole = (): void => {
if (showRoles) {
setShowRoles(false);
} else {
setShowRoles(true);
}
};
return (
<div
className="fixed inset-0 bg-black bg-opacity-30 backdrop-blur-sm
flex justify-center items-center"
>
<div className="border-4 border-black bg-white rounded-lg text-center flex flex-col">
<div className="mx-10">
<p className="font-bold text-[30px]">{props.username}</p>
<p
className="hover:font-bold hover:cursor-pointer underline"
onClick={handleChangeRole}
>
(Change Role)
</p>
{showRoles && (
<ChangeRoleView
projectName={props.projectName}
username={props.username}
/>
)}
<h2 className="font-bold text-[20px]">Member of these projects:</h2>
<UserProjectListAdmin username={props.username} />
<div className="items-center space-x-6">
<Button
text={"Delete"}
onClick={function (): void {
if (
window.confirm("Are you sure you want to delete this user?")
) {
DeleteUser({
usernameToDelete: props.username,
});
}
}}
type="button"
/>
<Button
text={"Close"}
onClick={function (): void {
setShowRoles(false);
props.onClose();
}}
type="button"
/>
</div>
</div>
</div>
</div>
);
}
export default MemberInfoModal;

42
frontend/src/Components/NewWeeklyReport.tsx
View file

@ -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();
}}
/>

98
frontend/src/Components/ProjectInfoModal.tsx
View file

@ -1,31 +1,54 @@
import { useState } from "react";
import { useEffect, useRef, useState } from "react";
import Button from "./Button";
import { UserProjectMember } from "../Types/goTypes";
import GetUsersInProject from "./GetUsersInProject";
import GetUsersInProject, { ProjectMember } from "./GetUsersInProject";
import { Link } from "react-router-dom";
import GetProjectTimes, { projectTimes } from "./GetProjectTimes";
import DeleteProject from "./DeleteProject";
function ProjectInfoModal(props: {
isVisible: boolean;
projectname: string;
onClose: () => void;
onClick: (username: string) => void;
}): JSX.Element {
const [users, setUsers] = useState<UserProjectMember[]>([]);
const [users, setUsers] = useState<ProjectMember[]>([]);
const [times, setTimes] = useState<projectTimes>();
const totalTime = useRef(0);
GetUsersInProject({ projectName: props.projectname, setUsersProp: setUsers });
if (!props.isVisible) return <></>;
GetProjectTimes({ setTimesProp: setTimes, projectName: props.projectname });
useEffect(() => {
if (times?.totalTime !== undefined) {
totalTime.current = times.totalTime;
}
}, [times]);
return (
<div
className="fixed inset-0 bg-black bg-opacity-30 backdrop-blur-sm
flex justify-center items-center"
>
<div className="border-4 border-black bg-white p-2 rounded-2xl text-center h-[47vh] w-[40] flex flex-col">
<div className="pl-20 pr-20">
<div className="border-4 border-black bg-white p-2 rounded-2xl text-center h-[61vh] w-[40] overflow-auto">
<div className="pl-10 pr-10">
<h1 className="font-bold text-[32px] mb-[20px]">
{localStorage.getItem("projectName") ?? ""}
{props.projectname}
</h1>
<h2 className="font-bold text-[24px] mb-[20px]">Project members:</h2>
<div className="border-2 border-black p-2 rounded-lg text-center overflow-scroll h-[26vh]">
<div className="p-1 text-center">
<h2 className="text-[20px] font-bold">Statistics:</h2>
</div>
<div className="border-2 border-black rounded-lg h-[8vh] text-left divide-y-2 flex flex-col overflow-auto mx-10">
<p className="p-2">Number of members: {users.length}</p>
<p className="p-2">
Total time reported:{" "}
{Math.floor(totalTime.current / 60 / 24) + " d "}
{Math.floor((totalTime.current / 60) % 24) + " h "}
{(totalTime.current % 60) + " m "}
</p>
</div>
<div className="h-[6vh] p-7 text-center">
<h2 className="text-[20px] font-bold">Project members:</h2>
</div>
<div className="border-2 border-black p-2 rounded-lg text-center overflow-auto h-[24vh] mx-10">
<ul className="text-left font-medium space-y-2">
<div></div>
{users.map((user) => (
@ -45,31 +68,44 @@ function ProjectInfoModal(props: {
))}
</ul>
</div>
</div>
<div className="space-x-16">
<Button
text={"Delete"}
onClick={function (): void {
//DELETE PROJECT
}}
type="button"
/>
<Link to={"/adminProjectAddMember"}>
<div className="space-x-5 my-2">
<Button
text={"Add Member"}
text={"Delete"}
onClick={function (): void {
return;
if (
window.confirm(
"Are you sure you want to delete this project?",
)
) {
DeleteProject({
projectToDelete: props.projectname,
});
}
}}
type="button"
/>
</Link>
<Button
text={"Close"}
onClick={function (): void {
props.onClose();
}}
type="button"
/>
<Link
to={{
pathname: "/adminProjectAddMember",
search: props.projectname,
}}
>
<Button
text={"Add Member"}
onClick={function (): void {
return;
}}
type="button"
/>
</Link>
<Button
text={"Close"}
onClick={function (): void {
props.onClose();
}}
type="button"
/>
</div>
</div>
</div>
</div>

41
frontend/src/Components/ProjectListAdmin.tsx
View file

@ -1,7 +1,7 @@
import { useState } from "react";
import { NewProject } from "../Types/goTypes";
import ProjectInfoModal from "./ProjectInfoModal";
import UserInfoModal from "./UserInfoModal";
import MemberInfoModal from "./MemberInfoModal";
/**
* A list of projects for admin manage projects page, that sets an onClick
@ -18,7 +18,7 @@ export function ProjectListAdmin(props: {
projects: NewProject[];
}): JSX.Element {
const [projectModalVisible, setProjectModalVisible] = useState(false);
const [projectname, setProjectname] = useState("");
const [projectName, setProjectName] = useState("");
const [userModalVisible, setUserModalVisible] = useState(false);
const [username, setUsername] = useState("");
@ -28,39 +28,36 @@ export function ProjectListAdmin(props: {
};
const handleClickProject = (projectname: string): void => {
setProjectname(projectname);
localStorage.setItem("projectName", projectname);
setProjectName(projectname);
setProjectModalVisible(true);
};
const handleCloseProject = (): void => {
setProjectname("");
setProjectName("");
setProjectModalVisible(false);
};
const handleCloseUser = (): void => {
setProjectname("");
setUsername("");
setUserModalVisible(false);
};
return (
<>
<ProjectInfoModal
onClose={handleCloseProject}
onClick={handleClickUser}
isVisible={projectModalVisible}
projectname={projectname}
/>
<UserInfoModal
manageMember={true}
onClose={handleCloseUser}
//TODO: CHANGE TO REMOVE USER FROM PROJECT
onDelete={() => {
return;
}}
isVisible={userModalVisible}
username={username}
/>
{projectModalVisible && (
<ProjectInfoModal
onClose={handleCloseProject}
onClick={handleClickUser}
projectname={projectName}
/>
)}
{userModalVisible && (
<MemberInfoModal
onClose={handleCloseUser}
username={username}
projectName={projectName}
/>
)}
<div>
<ul className="font-bold underline text-[30px] cursor-pointer padding">
{props.projects.map((project) => (

30
frontend/src/Components/ProjectMembers.tsx
View file

@ -1,31 +1,15 @@
import { useEffect, useState } from "react";
import { useState } from "react";
import { Link, useParams } from "react-router-dom";
import { api } from "../API/API";
import { UserProjectMember } from "../Types/goTypes";
import GetUsersInProject, { ProjectMember } from "./GetUsersInProject";
function ProjectMembers(): JSX.Element {
const { projectName } = useParams();
const [projectMembers, setProjectMembers] = useState<UserProjectMember[]>([]);
const [projectMembers, setProjectMembers] = useState<ProjectMember[]>([]);
useEffect(() => {
const getProjectMembers = async (): Promise<void> => {
const token = localStorage.getItem("accessToken") ?? "";
const response = await api.getAllUsersProject(projectName ?? "", token);
console.log(response);
if (response.success) {
setProjectMembers(response.data ?? []);
} else {
console.error(response.message);
}
};
void getProjectMembers();
}, [projectName]);
interface ProjectMember {
Username: string;
UserRole: string;
}
GetUsersInProject({
projectName: projectName ?? "",
setUsersProp: setProjectMembers,
});
return (
<>

36
frontend/src/Components/Register.tsx
View file

@ -22,6 +22,8 @@ export default function Register(): JSX.Element {
const response = await api.registerUser(newUser);
if (response.success) {
alert("User added!");
setPassword("");
setUsername("");
} else {
alert("User not added");
setErrMessage(response.message ?? "Unknown error");
@ -47,22 +49,24 @@ export default function Register(): JSX.Element {
<h3 className="pb-4 mb-2 text-center font-bold text-[18px]">
Register New User
</h3>
<InputField
label="Username"
type="text"
value={username ?? ""}
onChange={(e) => {
setUsername(e.target.value);
}}
/>
<InputField
label="Password"
type="password"
value={password ?? ""}
onChange={(e) => {
setPassword(e.target.value);
}}
/>
<div className="space-y-3">
<InputField
label="Username"
type="text"
value={username ?? ""}
onChange={(e) => {
setUsername(e.target.value);
}}
/>
<InputField
label="Password"
type="password"
value={password ?? ""}
onChange={(e) => {
setPassword(e.target.value);
}}
/>
</div>
<div className="flex items-center justify-between">
<Button
text="Register"

121
frontend/src/Components/TimePerActivity.tsx
View file

@ -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<number>();
const [meetingTime, setMeetingTime] = useState<number>();
const [adminTime, setAdminTime] = useState<number>();
const [ownWorkTime, setOwnWorkTime] = useState<number>();
const [studyTime, setStudyTime] = useState<number>();
const [testingTime, setTestingTime] = useState<number>();
const [development, setDevelopment] = useState<number>();
const [meeting, setMeeting] = useState<number>();
const [admin, setAdmin] = useState<number>();
const [own_work, setOwnWork] = useState<number>();
const [study, setStudy] = useState<number>();
const [testing, setTesting] = useState<number>();
// const token = localStorage.getItem("accessToken") ?? "";
// const username = localStorage.getItem("username") ?? "";
const token = localStorage.getItem("accessToken") ?? "";
const { projectName } = useParams();
// const fetchTimePerRole = async (): Promise<void> => {
// 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<void> => {
// 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(() => {
@ -94,10 +69,8 @@ export default function TimePerRole(): JSX.Element {
<input
type="string"
className="border-2 border-black rounded-md text-center w-1/2"
value={developmentTime}
onKeyDown={(event) => {
event.preventDefault();
}}
value={development}
readOnly
/>
</td>
</tr>
@ -107,10 +80,8 @@ export default function TimePerRole(): JSX.Element {
<input
type="string"
className="border-2 border-black rounded-md text-center w-1/2"
value={meetingTime}
onKeyDown={(event) => {
event.preventDefault();
}}
value={meeting}
readOnly
/>
</td>
</tr>
@ -120,10 +91,8 @@ export default function TimePerRole(): JSX.Element {
<input
type="string"
className="border-2 border-black rounded-md text-center w-1/2"
value={adminTime}
onKeyDown={(event) => {
event.preventDefault();
}}
value={admin}
readOnly
/>
</td>
</tr>
@ -133,10 +102,8 @@ export default function TimePerRole(): JSX.Element {
<input
type="string"
className="border-2 border-black rounded-md text-center w-1/2"
value={ownWorkTime}
onKeyDown={(event) => {
event.preventDefault();
}}
value={own_work}
readOnly
/>
</td>
</tr>
@ -146,10 +113,8 @@ export default function TimePerRole(): JSX.Element {
<input
type="string"
className="border-2 border-black rounded-md text-center w-1/2"
value={studyTime}
onKeyDown={(event) => {
event.preventDefault();
}}
value={study}
readOnly
/>
</td>
</tr>
@ -159,10 +124,8 @@ export default function TimePerRole(): JSX.Element {
<input
type="string"
className="border-2 border-black rounded-md text-center w-1/2"
value={testingTime}
onKeyDown={(event) => {
event.preventDefault();
}}
value={testing}
readOnly
/>
</td>
</tr>

129
frontend/src/Components/UserInfoModal.tsx
View file

@ -1,72 +1,99 @@
import { Link } from "react-router-dom";
import Button from "./Button";
import DeleteUser from "./DeleteUser";
import UserProjectListAdmin from "./UserProjectListAdmin";
import { useState } from "react";
import InputField from "./InputField";
import ChangeUsername from "./ChangeUsername";
import { StrNameChange } from "../Types/goTypes";
function UserInfoModal(props: {
isVisible: boolean;
manageMember: boolean;
username: string;
onClose: () => void;
onDelete: (username: string) => void;
}): JSX.Element {
if (!props.isVisible) return <></>;
const ManageUserOrMember = (check: boolean): JSX.Element => {
if (check) {
return (
<Link to="/AdminChangeRole">
<p className="mb-[20px] hover:font-bold hover:cursor-pointer underline">
(Change Role)
</p>
</Link>
);
const [showInput, setShowInput] = useState(false);
const [newUsername, setNewUsername] = useState("");
if (!props.isVisible) {
return <></>;
}
const handleChangeNameView = (): void => {
if (showInput) {
setShowInput(false);
} else {
setShowInput(true);
}
return (
<Link to="/AdminChangeUserName">
<p className="mb-[20px] hover:font-bold hover:cursor-pointer underline">
(Change Username)
</p>
</Link>
);
};
const handleClickChangeName = (): void => {
const nameChange: StrNameChange = {
prevName: props.username,
newName: newUsername,
};
ChangeUsername({ nameChange: nameChange });
};
return (
<div
className="fixed inset-0 bg-black bg-opacity-30 backdrop-blur-sm
flex justify-center items-center"
>
<div className="border-4 border-black bg-white p-2 rounded-lg text-center flex flex-col">
<p className="font-bold text-[30px]">{props.username}</p>
{ManageUserOrMember(props.manageMember)}
<div>
<h2 className="font-bold text-[22px] mb-[20px]">
Member of these projects:
</h2>
<div className="pr-6 pl-6">
<UserProjectListAdmin />
<div className="border-4 border-black bg-white rounded-lg text-center flex flex-col">
<div className="mx-10">
<p className="font-bold text-[30px]">{props.username}</p>
<p
className="mb-[10px] hover:font-bold hover:cursor-pointer underline"
onClick={handleChangeNameView}
>
(Change Username)
</p>
{showInput && (
<div>
<InputField
label={"New username"}
type={"text"}
value={newUsername}
onChange={function (e): void {
e.defaultPrevented;
setNewUsername(e.target.value);
}}
/>
<Button
text={"Change"}
onClick={function (): void {
handleClickChangeName();
}}
type={"submit"}
/>
</div>
)}
<h2 className="font-bold text-[20px]">Member of these projects:</h2>
<UserProjectListAdmin username={props.username} />
<div className="items-center space-x-6">
<Button
text={"Delete"}
onClick={function (): void {
if (
window.confirm("Are you sure you want to delete this user?")
) {
DeleteUser({
usernameToDelete: props.username,
});
}
}}
type="button"
/>
<Button
text={"Close"}
onClick={function (): void {
setNewUsername("");
setShowInput(false);
props.onClose();
}}
type="button"
/>
</div>
</div>
<div className="items-center space-x-6 pr-6 pl-6">
<Button
text={"Delete"}
onClick={function (): void {
if (
window.confirm("Are you sure you want to delete this user?")
) {
DeleteUser({
usernameToDelete: props.username,
});
}
}}
type="button"
/>
<Button
text={"Close"}
onClick={function (): void {
props.onClose();
}}
type="button"
/>
</div>
</div>
</div>
);

3
frontend/src/Components/UserListAdmin.tsx
View file

@ -1,6 +1,5 @@
import { useState } from "react";
import UserInfoModal from "./UserInfoModal";
import DeleteUser from "./DeleteUser";
/**
* A list of users for admin manage users page, that sets an onClick
@ -30,9 +29,7 @@ export function UserListAdmin(props: { users: string[] }): JSX.Element {
return (
<>
<UserInfoModal
manageMember={false}
onClose={handleClose}
onDelete={() => DeleteUser}
isVisible={modalVisible}
username={username}
/>

32
frontend/src/Components/UserProjectListAdmin.tsx
View file

@ -1,35 +1,17 @@
import { useEffect, useState } from "react";
import { api } from "../API/API";
import { useState } from "react";
import { Project } from "../Types/goTypes";
import GetProjects from "./GetProjects";
function UserProjectListAdmin(): JSX.Element {
function UserProjectListAdmin(props: { username: string }): JSX.Element {
const [projects, setProjects] = useState<Project[]>([]);
useEffect(() => {
const fetchProjects = async (): Promise<void> => {
try {
const token = localStorage.getItem("accessToken") ?? "";
// const username = props.username;
const response = await api.getUserProjects(token);
if (response.success) {
setProjects(response.data ?? []);
} else {
console.error("Failed to fetch projects:", response.message);
}
} catch (error) {
console.error("Error fetching projects:", error);
}
};
void fetchProjects();
}, []);
GetProjects({ setProjectsProp: setProjects, username: props.username });
return (
<div className="border-2 border-black bg-white p-2 rounded-lg text-center">
<ul>
<div className="border-2 border-black bg-white rounded-lg text-left overflow-auto h-[15vh] font-medium">
<ul className="divide-y-2">
{projects.map((project) => (
<li key={project.id}>
<li className="mx-2 my-1" key={project.id}>
<span>{project.name}</span>
</li>
))}

43
frontend/src/Components/ViewOtherTimeReport.tsx
View file

@ -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<void> => {
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 (
<>
<h1 className="text-[30px] font-bold">{username}&apos;s Report</h1>
<h1 className="text-[30px] font-bold">
{" "}
UserId: {username}&apos;s Report
</h1>
<div className="border-4 border-black bg-white flex flex-col justify-start min-h-[65vh] h-fit w-[50vw] rounded-3xl overflow-scroll space-y-[2vh] p-[30px] items-center">
<form
onSubmit={(e) => {
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
/>
</td>
</tr>
@ -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
/>
</td>
</tr>
@ -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
/>
</td>
</tr>
@ -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
/>
</td>
</tr>
@ -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
/>
</td>
</tr>
@ -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
/>
</td>
</tr>

28
frontend/src/Pages/AdminPages/AdminChangeUsername.tsx
View file

@ -1,28 +0,0 @@
import BackButton from "../../Components/BackButton";
import BasicWindow from "../../Components/BasicWindow";
import Button from "../../Components/Button";
import ChangeUsername from "../../Components/ChangeUsername";
function AdminChangeUsername(): JSX.Element {
const content = (
<>
<ChangeUsername />
</>
);
const buttons = (
<>
<Button
text="Finish"
onClick={(): void => {
return;
}}
type="button"
/>
<BackButton />
</>
);
return <BasicWindow content={content} buttons={buttons} />;
}
export default AdminChangeUsername;

5
frontend/src/Pages/AdminPages/AdminManageProjects.tsx
View file

@ -9,7 +9,10 @@ import { useState } from "react";
function AdminManageProjects(): JSX.Element {
const [projects, setProjects] = useState<Project[]>([]);
GetProjects({ setProjectsProp: setProjects });
GetProjects({
setProjectsProp: setProjects,
username: localStorage.getItem("username") ?? "",
});
const content = (
<>
<h1 className="font-bold text-[30px] mb-[20px]">Manage Projects</h1>

6
frontend/src/Pages/AdminPages/AdminProjectAddMember.tsx
View file

@ -1,11 +1,11 @@
import { useLocation } from "react-router-dom";
import AddUserToProject from "../../Components/AddUserToProject";
import BasicWindow from "../../Components/BasicWindow";
function AdminProjectAddMember(): JSX.Element {
const content = <AddUserToProject />;
const projectName = useLocation().search.slice(1);
const content = <AddUserToProject projectName={projectName} />;
const buttons = <></>;
return <BasicWindow content={content} buttons={buttons} />;
}
export default AdminProjectAddMember;

23
frontend/src/Pages/AdminPages/AdminProjectChangeUserRole.tsx
View file

@ -1,23 +0,0 @@
import BackButton from "../../Components/BackButton";
import BasicWindow from "../../Components/BasicWindow";
import Button from "../../Components/Button";
function AdminProjectChangeUserRole(): JSX.Element {
const content = <></>;
const buttons = (
<>
<Button
text="Change"
onClick={(): void => {
return;
}}
type="button"
/>
<BackButton />
</>
);
return <BasicWindow content={content} buttons={buttons} />;
}
export default AdminProjectChangeUserRole;

23
frontend/src/Pages/AdminPages/AdminProjectManageMembers.tsx
View file

@ -1,23 +0,0 @@
import BackButton from "../../Components/BackButton";
import BasicWindow from "../../Components/BasicWindow";
import Button from "../../Components/Button";
function AdminProjectManageMembers(): JSX.Element {
const content = <></>;
const buttons = (
<>
<Button
text="Add Member"
onClick={(): void => {
return;
}}
type="button"
/>
<BackButton />
</>
);
return <BasicWindow content={content} buttons={buttons} />;
}
export default AdminProjectManageMembers;

33
frontend/src/Pages/AdminPages/AdminProjectPage.tsx
View file

@ -1,33 +0,0 @@
import { useParams } from "react-router-dom";
import { api } from "../../API/API";
import BackButton from "../../Components/BackButton";
import BasicWindow from "../../Components/BasicWindow";
import Button from "../../Components/Button";
async function handleDeleteProject(
projectName: string,
token: string,
): Promise<void> {
await api.removeProject(projectName, token);
}
function AdminProjectPage(): JSX.Element {
const content = <></>;
const { projectName } = useParams();
const token = localStorage.getItem("accessToken");
const buttons = (
<>
<Button
text="Delete"
onClick={() => handleDeleteProject(projectName, token)}
type="button"
/>
<BackButton />
</>
);
return <BasicWindow content={content} buttons={buttons} />;
}
export default AdminProjectPage;

23
frontend/src/Pages/AdminPages/AdminProjectViewMemberInfo.tsx
View file

@ -1,23 +0,0 @@
import BackButton from "../../Components/BackButton";
import BasicWindow from "../../Components/BasicWindow";
import Button from "../../Components/Button";
function AdminProjectViewMemberInfo(): JSX.Element {
const content = <></>;
const buttons = (
<>
<Button
text="Remove"
onClick={(): void => {
return;
}}
type="button"
/>
<BackButton />
</>
);
return <BasicWindow content={content} buttons={buttons} />;
}
export default AdminProjectViewMemberInfo;

28
frontend/src/Pages/AdminPages/AdminViewUserInfo.tsx
View file

@ -1,28 +0,0 @@
import BasicWindow from "../../Components/BasicWindow";
import Button from "../../Components/Button";
import BackButton from "../../Components/BackButton";
import UserProjectListAdmin from "../../Components/UserProjectListAdmin";
function AdminViewUserInfo(): JSX.Element {
const content = (
<>
<UserProjectListAdmin />
</>
);
const buttons = (
<>
<Button
text="Delete"
onClick={(): void => {
return;
}}
type="button"
/>
<BackButton />
</>
);
return <BasicWindow content={content} buttons={buttons} />;
}
export default AdminViewUserInfo;

30
frontend/src/main.tsx
View file

@ -18,17 +18,11 @@ import PMTotalTimeRole from "./Pages/ProjectManagerPages/PMTotalTimeRole.tsx";
import PMUnsignedReports from "./Pages/ProjectManagerPages/PMUnsignedReports.tsx";
import PMViewUnsignedReport from "./Pages/ProjectManagerPages/PMViewUnsignedReport.tsx";
import AdminManageUsers from "./Pages/AdminPages/AdminManageUsers.tsx";
import AdminViewUserInfo from "./Pages/AdminPages/AdminViewUserInfo.tsx";
import AdminManageProjects from "./Pages/AdminPages/AdminManageProjects.tsx";
import AdminAddProject from "./Pages/AdminPages/AdminAddProject.tsx";
import AdminAddUser from "./Pages/AdminPages/AdminAddUser.tsx";
import AdminChangeUsername from "./Pages/AdminPages/AdminChangeUsername.tsx";
import AdminProjectAddMember from "./Pages/AdminPages/AdminProjectAddMember.tsx";
import AdminProjectChangeUserRole from "./Pages/AdminPages/AdminProjectChangeUserRole.tsx";
import AdminProjectManageMembers from "./Pages/AdminPages/AdminProjectManageMembers.tsx";
import AdminProjectStatistics from "./Pages/AdminPages/AdminProjectStatistics.tsx";
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";
import PMViewOtherUsersTR from "./Pages/ProjectManagerPages/PMViewOtherUsersTR.tsx";
@ -100,34 +94,14 @@ const router = createBrowserRouter([
path: "/PMViewUnsignedReport/:projectName/:username/:fetchedWeek",
element: <PMViewUnsignedReport />,
},
{
path: "/adminChangeUsername",
element: <AdminChangeUsername />,
},
{
path: "/adminProjectAddMember",
element: <AdminProjectAddMember />,
},
{
path: "/adminProjectChangeUserRole",
element: <AdminProjectChangeUserRole />,
},
{
path: "/adminProjectManageMembers",
element: <AdminProjectManageMembers />,
},
{
path: "/adminProjectPage",
element: <AdminProjectPage />,
},
{
path: "/adminProjectStatistics",
element: <AdminProjectStatistics />,
},
{
path: "/adminProjectViewMembers",
element: <AdminProjectViewMemberInfo />,
},
{
path: "/addProject",
element: <AdminAddProject />,
@ -136,10 +110,6 @@ const router = createBrowserRouter([
path: "/adminAddUser",
element: <AdminAddUser />,
},
{
path: "/adminUserInfo",
element: <AdminViewUserInfo />,
},
{
path: "/adminManageProject",
element: <AdminManageProjects />,