Refactor TimePerRole component to use API response for time per activity

This commit is contained in:
Mattias 2024-04-02 18:00:30 +02:00
parent ff37236cf6
commit a7cc48d392

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,
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,
};
// 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();
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(() => {