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

Merge remote-tracking branch 'origin/frontend' into gruppPP

Browse source
This commit is contained in:
Peter KW 2024-03-18 00:48:21 +01:00
commit 4876038613
14 changed files with 513 additions and 279 deletions
Download patch file Download diff file Expand all files Collapse all files

87
frontend/src/API/API.test.ts Normal file
View file

@ -0,0 +1,87 @@
import { describe, expect, test } from "@jest/globals";
import { api } from "../API/API";
import { NewUser, NewWeeklyReport } from "../Types/goTypes";
describe("API", () => {
test("registerUser", async () => {
const user: NewUser = {
username: "lol", // Add the username property
password: "lol",
};
const response = await api.registerUser(user);
console.log(response.message);
expect(response.success).toBe(true);
expect(response.data).toHaveProperty("userId");
});
test("createProject", async () => {
const project = {
name: "Project X",
description: "This is a test project",
};
const token =
"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJhZG1pbiI6ZmFsc2UsImV4cCI6MTcxMDk0MDIwMywibmFtZSI6InJyZ3VtZHpwbWMifQ.V9NHoYMYV61t";
const response = await api.createProject(project, token);
console.log(response.message);
expect(response.success).toBe(true);
expect(response.data).toHaveProperty("projectId");
});
test("renewToken", async () => {
const refreshToken =
"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJhZG1pbiI6ZmFsc2UsImV4cCI6MTcxMDk0MDIwMywibmFtZSI6InJyZ3VtZHpwbWMifQ.V9NHoYMYV61t";
const response = await api.renewToken(refreshToken);
console.log(response.message);
expect(response.success).toBe(true);
expect(response.data).toHaveProperty("accessToken");
expect(response.data).toHaveProperty("refreshToken");
});
test("getUserProjects", async () => {
const token =
"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJhZG1pbiI6ZmFsc2UsImV4cCI6MTcxMDk0MDIwMywibmFtZSI6InJyZ3VtZHpwbWMifQ.V9NHoYMYV61t";
const username = "rrgumdzpmc";
const response = await api.getUserProjects(username, token);
console.log(response.message);
expect(response.success).toBe(true);
expect(response.data).toHaveProperty("projects");
});
test("submitWeeklyReport", async () => {
const report: NewWeeklyReport = {
projectName: "vtmosxssst",
week: 2,
developmentTime: 40,
meetingTime: 5,
adminTime: 2,
ownWorkTime: 10,
studyTime: 12,
testingTime: 41,
};
const token =
"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJhZG1pbiI6ZmFsc2UsImV4cCI6MTcxMDk0MDIwMywibmFtZSI6InJyZ3VtZHpwbWMifQ.V9NHoYMYV61t";
const response = await api.submitWeeklyReport(report, token);
console.log(response.message);
expect(response.success).toBe(true);
expect(response.data).toHaveProperty(
"message",
"Report submitted successfully",
);
});
test("login", async () => {
const user: NewUser = {
username: "rrgumdzpmc", // Add an empty string value for the username property
password: "always_same",
};
const response = await api.login(user);
console.log(response.message);
expect(response.success).toBe(true);
expect(response.data).toHaveProperty("accessToken");
expect(response.data).toHaveProperty("refreshToken");
});
});

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

@ -167,32 +167,29 @@ export const api: API = {
token: string,
): Promise<APIResponse<Project>> {
try {
return fetch("/api/submitWeeklyReport", {
const response = await fetch("/api/submitWeeklyReport", {
method: "POST",
headers: {
"Content-Type": "application/json",
Authorization: "Bearer " + token,
},
body: JSON.stringify(project),
})
.then((response) => {
if (!response.ok) {
return {
success: false,
message: "Failed to submit weekly report",
};
} else {
return response.json();
}
})
.then((data: Project) => {
return { success: true, data };
});
});
if (!response.ok) {
return {
success: false,
message: "Failed to submit weekly report",
};
}
const data = (await response.json()) as Project;
return { success: true, data };
} catch (e) {
return Promise.resolve({
return {
success: false,
message: "Failed to submit weekly report",
});
};
}
},

52
frontend/src/Components/TimeReport.tsx
View file

@ -1,40 +1,44 @@
import { useState } from "react";
import { TimeReport } from "../Types/TimeReport";
import { api } from "../API/API";
import { useNavigate } from "react-router-dom";
import Button from "./Button";
import { NewWeeklyReport } from "../Types/goTypes";
export default function NewTimeReport(): JSX.Element {
const [week, setWeek] = useState("");
const [development, setDevelopment] = useState("0");
const [meeting, setMeeting] = useState("0");
const [administration, setAdministration] = useState("0");
const [ownwork, setOwnWork] = useState("0");
const [studies, setStudies] = useState("0");
const [testing, setTesting] = useState("0");
const [projectName, setProjectName] = useState<string>("projectName"); // TODO: Get from backend
const [week, setWeek] = useState<number>(NaN);
const [development, setDevelopment] = useState<number>(NaN);
const [meeting, setMeeting] = useState<number>(NaN);
const [administration, setAdministration] = useState<number>(NaN);
const [ownwork, setOwnWork] = useState<number>(NaN);
const [studies, setStudies] = useState<number>(NaN);
const [testing, setTesting] = useState<number>(NaN);
const handleNewTimeReport = async (): Promise<void> => {
const newTimeReport: TimeReport = {
const newTimeReport: NewWeeklyReport = {
projectName,
week,
development,
meeting,
administration,
ownwork,
studies,
testing,
developmentTime: development,
meetingTime: meeting,
adminTime: administration,
ownWorkTime: ownwork,
studyTime: studies,
testingTime: testing,
};
await Promise.resolve();
// await api.registerTimeReport(newTimeReport); This needs to be implemented!
await api.submitWeeklyReport(newTimeReport, "token");
};
const navigate = useNavigate();
setProjectName("Something Reasonable"); // This should obviously not be used here
return (
<>
<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) => {
if (week === "") {
if (!week) {
alert("Please enter a week number");
e.preventDefault();
return;
@ -50,7 +54,7 @@ export default function NewTimeReport(): JSX.Element {
type="week"
placeholder="Week"
onChange={(e) => {
const weekNumber = e.target.value.split("-W")[1];
const weekNumber = parseInt(e.target.value.split("-W")[1]);
setWeek(weekNumber);
}}
onKeyDown={(event) => {
@ -81,7 +85,7 @@ export default function NewTimeReport(): JSX.Element {
className="border-2 border-black rounded-md text-center w-1/2"
value={development}
onChange={(e) => {
setDevelopment(e.target.value);
setDevelopment(parseInt(e.target.value));
}}
onKeyDown={(event) => {
const keyValue = event.key;
@ -100,7 +104,7 @@ export default function NewTimeReport(): JSX.Element {
className="border-2 border-black rounded-md text-center w-1/2"
value={meeting}
onChange={(e) => {
setMeeting(e.target.value);
setMeeting(parseInt(e.target.value));
}}
onKeyDown={(event) => {
const keyValue = event.key;
@ -119,7 +123,7 @@ export default function NewTimeReport(): JSX.Element {
className="border-2 border-black rounded-md text-center w-1/2"
value={administration}
onChange={(e) => {
setAdministration(e.target.value);
setAdministration(parseInt(e.target.value));
}}
onKeyDown={(event) => {
const keyValue = event.key;
@ -138,7 +142,7 @@ export default function NewTimeReport(): JSX.Element {
className="border-2 border-black rounded-md text-center w-1/2"
value={ownwork}
onChange={(e) => {
setOwnWork(e.target.value);
setOwnWork(parseInt(e.target.value));
}}
onKeyDown={(event) => {
const keyValue = event.key;
@ -157,7 +161,7 @@ export default function NewTimeReport(): JSX.Element {
className="border-2 border-black rounded-md text-center w-1/2"
value={studies}
onChange={(e) => {
setStudies(e.target.value);
setStudies(parseInt(e.target.value));
}}
onKeyDown={(event) => {
const keyValue = event.key;
@ -176,7 +180,7 @@ export default function NewTimeReport(): JSX.Element {
className="border-2 border-black rounded-md text-center w-1/2"
value={testing}
onChange={(e) => {
setTesting(e.target.value);
setTesting(parseInt(e.target.value));
}}
onKeyDown={(event) => {
const keyValue = event.key;

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

@ -1,5 +1,5 @@
import { Link } from "react-router-dom";
import { User } from "../Types/Users";
import { User } from "../Types/goTypes";
/**
* The props for the UserProps component
@ -23,9 +23,9 @@ export function UserListAdmin(props: UserProps): JSX.Element {
<div>
<ul className="font-bold underline text-[30px] cursor-pointer padding">
{props.users.map((user) => (
<Link to="/admin-view-user" key={user.id} state={user.userName}>
<li className="pt-5" key={user.id}>
{user.userName}
<Link to="/admin-view-user" key={user.userId} state={user.username}>
<li className="pt-5" key={user.userId}>
{user.username}
</li>
</Link>
))}