Added comments to TypeScript API, merge
This commit is contained in:
parent
67680e2616
commit
9f61a36a68
3 changed files with 202 additions and 19 deletions
|
@ -4,50 +4,135 @@ import {
|
||||||
User,
|
User,
|
||||||
Project,
|
Project,
|
||||||
NewProject,
|
NewProject,
|
||||||
|
WeeklyReport,
|
||||||
} from "../Types/goTypes";
|
} from "../Types/goTypes";
|
||||||
|
|
||||||
// This type of pattern should be hard to misuse
|
/**
|
||||||
|
* Response object returned by API methods.
|
||||||
|
*/
|
||||||
export interface APIResponse<T> {
|
export interface APIResponse<T> {
|
||||||
|
/** Indicates whether the API call was successful */
|
||||||
success: boolean;
|
success: boolean;
|
||||||
|
/** Optional message providing additional information or error description */
|
||||||
message?: string;
|
message?: string;
|
||||||
|
/** Optional data returned by the API method */
|
||||||
data?: T;
|
data?: T;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Note that all protected routes also require a token
|
/**
|
||||||
// Defines all the methods that an instance of the API must implement
|
* Interface defining methods that an instance of the API must implement.
|
||||||
|
*/
|
||||||
interface API {
|
interface API {
|
||||||
/** Register a new user */
|
/**
|
||||||
|
* Register a new user
|
||||||
|
* @param {NewUser} user The user object to be registered
|
||||||
|
* @returns {Promise<APIResponse<User>>} A promise containing the API response with the user data.
|
||||||
|
*/
|
||||||
registerUser(user: NewUser): Promise<APIResponse<User>>;
|
registerUser(user: NewUser): Promise<APIResponse<User>>;
|
||||||
/** Remove a user */
|
|
||||||
|
/**
|
||||||
|
* Removes a user.
|
||||||
|
* @param {string} username The username of the user to be removed.
|
||||||
|
* @param {string} token The authentication token.
|
||||||
|
* @returns {Promise<APIResponse<User>>} A promise containing the API response with the removed user data.
|
||||||
|
*/
|
||||||
removeUser(username: string, token: string): Promise<APIResponse<User>>;
|
removeUser(username: string, token: string): Promise<APIResponse<User>>;
|
||||||
/** Login */
|
|
||||||
|
/**
|
||||||
|
* Check if user is project manager.
|
||||||
|
* @param {string} username The username of the user.
|
||||||
|
* @param {string} projectName The name of the project.
|
||||||
|
* @param {string} token The authentication token.
|
||||||
|
* @returns {Promise<APIResponse<boolean>>} A promise containing the API response indicating if the user is a project manager.
|
||||||
|
*/
|
||||||
|
checkIfProjectManager(
|
||||||
|
username: string,
|
||||||
|
projectName: string,
|
||||||
|
token: string,
|
||||||
|
): Promise<APIResponse<boolean>>;
|
||||||
|
|
||||||
|
/** Logs in a user with the provided credentials.
|
||||||
|
* @param {NewUser} NewUser The user object containing username and password.
|
||||||
|
* @returns {Promise<APIResponse<string>>} A promise resolving to an API response with a token.
|
||||||
|
*/
|
||||||
login(NewUser: NewUser): Promise<APIResponse<string>>;
|
login(NewUser: NewUser): Promise<APIResponse<string>>;
|
||||||
/** Renew the token */
|
|
||||||
|
/**
|
||||||
|
* Renew the token
|
||||||
|
* @param {string} token The current authentication token.
|
||||||
|
* @returns {Promise<APIResponse<string>>} A promise resolving to an API response with a renewed token.
|
||||||
|
*/
|
||||||
renewToken(token: string): Promise<APIResponse<string>>;
|
renewToken(token: string): Promise<APIResponse<string>>;
|
||||||
/** Create a project */
|
|
||||||
|
/** Promote user to admin */
|
||||||
|
|
||||||
|
/** Creates a new project.
|
||||||
|
* @param {NewProject} project The project object containing name and description.
|
||||||
|
* @param {string} token The authentication token.
|
||||||
|
* @returns {Promise<APIResponse<Project>>} A promise resolving to an API response with the created project.
|
||||||
|
*/
|
||||||
createProject(
|
createProject(
|
||||||
project: NewProject,
|
project: NewProject,
|
||||||
token: string,
|
token: string,
|
||||||
): Promise<APIResponse<Project>>;
|
): Promise<APIResponse<Project>>;
|
||||||
/** Submit a weekly report */
|
|
||||||
|
/** Submits a weekly report
|
||||||
|
* @param {NewWeeklyReport} weeklyReport The weekly report object.
|
||||||
|
* @param {string} token The authentication token.
|
||||||
|
* @returns {Promise<APIResponse<NewWeeklyReport>>} A promise resolving to an API response with the submitted report.
|
||||||
|
*/
|
||||||
submitWeeklyReport(
|
submitWeeklyReport(
|
||||||
project: NewWeeklyReport,
|
weeklyReport: NewWeeklyReport,
|
||||||
token: string,
|
token: string,
|
||||||
): Promise<APIResponse<NewWeeklyReport>>;
|
): Promise<APIResponse<NewWeeklyReport>>;
|
||||||
/**Gets a weekly report*/
|
|
||||||
|
/** Gets a weekly report for a specific user, project and week
|
||||||
|
* @param {string} username The username of the user.
|
||||||
|
* @param {string} projectName The name of the project.
|
||||||
|
* @param {string} week The week number.
|
||||||
|
* @param {string} token The authentication token.
|
||||||
|
* @returns {Promise<APIResponse<WeeklyReport>>} A promise resolving to an API response with the retrieved report.
|
||||||
|
*/
|
||||||
getWeeklyReport(
|
getWeeklyReport(
|
||||||
username: string,
|
username: string,
|
||||||
projectName: string,
|
projectName: string,
|
||||||
week: string,
|
week: string,
|
||||||
token: string,
|
token: string,
|
||||||
): Promise<APIResponse<NewWeeklyReport>>;
|
): Promise<APIResponse<WeeklyReport>>;
|
||||||
/** Gets all the projects of a user*/
|
|
||||||
|
/**
|
||||||
|
* Returns all the weekly reports for a user in a particular project
|
||||||
|
* The username is derived from the token
|
||||||
|
* @param {string} projectName The name of the project
|
||||||
|
* @param {string} token The token of the user
|
||||||
|
* @returns {APIResponse<WeeklyReport[]>} A list of weekly reports
|
||||||
|
*/
|
||||||
|
getWeeklyReportsForUser(
|
||||||
|
username: string,
|
||||||
|
projectName: string,
|
||||||
|
token: string,
|
||||||
|
): Promise<APIResponse<WeeklyReport[]>>;
|
||||||
|
|
||||||
|
/** Gets all the projects of a user
|
||||||
|
* @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(token: string): Promise<APIResponse<Project[]>>;
|
||||||
/** Gets a project from id*/
|
|
||||||
|
/** Gets a project by its id.
|
||||||
|
* @param {number} id The id of the project to retrieve.
|
||||||
|
* @returns {Promise<APIResponse<Project>>} A promise resolving to an API response containing the project data.
|
||||||
|
*/
|
||||||
getProject(id: number): Promise<APIResponse<Project>>;
|
getProject(id: number): Promise<APIResponse<Project>>;
|
||||||
|
|
||||||
|
/** 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.
|
||||||
|
*/
|
||||||
|
getAllUsers(token: string): Promise<APIResponse<string[]>>;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Export an instance of the API
|
/** An instance of the API */
|
||||||
export const api: API = {
|
export const api: API = {
|
||||||
async registerUser(user: NewUser): Promise<APIResponse<User>> {
|
async registerUser(user: NewUser): Promise<APIResponse<User>> {
|
||||||
try {
|
try {
|
||||||
|
@ -253,7 +338,6 @@ export const api: API = {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
// Gets a projet by id, currently untested since we have no javascript-based tests
|
|
||||||
async getProject(id: number): Promise<APIResponse<Project>> {
|
async getProject(id: number): Promise<APIResponse<Project>> {
|
||||||
try {
|
try {
|
||||||
const response = await fetch(`/api/project/${id}`, {
|
const response = await fetch(`/api/project/${id}`, {
|
||||||
|
@ -278,4 +362,31 @@ export const api: API = {
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
async getAllUsers(token: string): Promise<APIResponse<string[]>> {
|
||||||
|
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",
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
};
|
};
|
||||||
|
|
|
@ -7,7 +7,7 @@ import Button from "./Button";
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Tries to add a project to the system
|
* Tries to add a project to the system
|
||||||
* @param props - Project name and description
|
* @param {Object} props - Project name and description
|
||||||
* @returns {boolean} True if created, false if not
|
* @returns {boolean} True if created, false if not
|
||||||
*/
|
*/
|
||||||
function CreateProject(props: { name: string; description: string }): boolean {
|
function CreateProject(props: { name: string; description: string }): boolean {
|
||||||
|
@ -34,8 +34,8 @@ function CreateProject(props: { name: string; description: string }): boolean {
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Tries to add a project to the system
|
* Provides UI for adding a project to the system.
|
||||||
* @returns {JSX.Element} UI for project adding
|
* @returns {JSX.Element} - Returns the component UI for adding a project
|
||||||
*/
|
*/
|
||||||
function AddProject(): JSX.Element {
|
function AddProject(): JSX.Element {
|
||||||
const [name, setName] = useState("");
|
const [name, setName] = useState("");
|
||||||
|
|
72
frontend/src/Components/AllTimeReportsInProject.tsx
Normal file
72
frontend/src/Components/AllTimeReportsInProject.tsx
Normal file
|
@ -0,0 +1,72 @@
|
||||||
|
//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 { 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.
|
||||||
|
* @returns {JSX.Element} representing the component.
|
||||||
|
*/
|
||||||
|
function AllTimeReportsInProject(): JSX.Element {
|
||||||
|
const { projectName } = useParams();
|
||||||
|
const [weeklyReports, setWeeklyReports] = useState<WeeklyReport[]>([]);
|
||||||
|
|
||||||
|
const getWeeklyReports = async (): Promise<void> => {
|
||||||
|
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
|
||||||
|
useEffect(() => {
|
||||||
|
void getWeeklyReports();
|
||||||
|
});
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div className="border-4 border-black bg-white flex flex-col items-center justify-center min-h-[65vh] h-fit w-[50vw] rounded-3xl content-center overflow-scroll space-y-[10vh] p-[30px] text-[30px]">
|
||||||
|
{weeklyReports.map((newWeeklyReport, index) => (
|
||||||
|
<Link
|
||||||
|
to={`/editTimeReport/${projectName}/${newWeeklyReport.week}`}
|
||||||
|
key={index}
|
||||||
|
className="border-b-2 border-black w-full"
|
||||||
|
>
|
||||||
|
<div className="flex justify-between">
|
||||||
|
<h1>
|
||||||
|
<span className="font-bold">{"Week: "}</span>
|
||||||
|
{newWeeklyReport.week}
|
||||||
|
</h1>
|
||||||
|
<h1>
|
||||||
|
<span className="font-bold">{"Total Time: "}</span>
|
||||||
|
{newWeeklyReport.developmentTime +
|
||||||
|
newWeeklyReport.meetingTime +
|
||||||
|
newWeeklyReport.adminTime +
|
||||||
|
newWeeklyReport.ownWorkTime +
|
||||||
|
newWeeklyReport.studyTime +
|
||||||
|
newWeeklyReport.testingTime}{" "}
|
||||||
|
min
|
||||||
|
</h1>
|
||||||
|
<h1>
|
||||||
|
<span className="font-bold">{"Signed: "}</span>
|
||||||
|
{newWeeklyReport.signedBy ? "YES" : "NO"}
|
||||||
|
</h1>
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default AllTimeReportsInProject;
|
Loading…
Reference in a new issue