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 { useState, useEffect } from "react";
import { useParams } from "react-router-dom"; 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. * Renders the component for showing total time per role in a project.
* @returns JSX.Element * @returns JSX.Element
*/ */
export default function TimePerRole(): JSX.Element { export default function TimePerRole(): JSX.Element {
const [developmentTime, setDevelopmentTime] = useState<number>(); const [development, setDevelopment] = useState<number>();
const [meetingTime, setMeetingTime] = useState<number>(); const [meeting, setMeeting] = useState<number>();
const [adminTime, setAdminTime] = useState<number>(); const [admin, setAdmin] = useState<number>();
const [ownWorkTime, setOwnWorkTime] = useState<number>(); const [own_work, setOwnWork] = useState<number>();
const [studyTime, setStudyTime] = useState<number>(); const [study, setStudy] = useState<number>();
const [testingTime, setTestingTime] = useState<number>(); const [testing, setTesting] = useState<number>();
// const token = localStorage.getItem("accessToken") ?? ""; const token = localStorage.getItem("accessToken") ?? "";
// const username = localStorage.getItem("username") ?? "";
const { projectName } = useParams(); 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> => { const fetchTimePerActivity = async (): Promise<void> => {
// Use mock data const response = await api.getProjectTimes(projectName ?? "", token);
const report: TimePerActivity = { {
developmentTime: 100, if (response.success) {
meetingTime: 200, const report: projectTimes = response.data ?? {
adminTime: 300, development: 0,
ownWorkTime: 50, meeting: 0,
studyTime: 75, admin: 0,
testingTime: 110, own_work: 0,
}; study: 0,
testing: 0,
// Set the state with the mock data };
setDevelopmentTime(report.developmentTime); setDevelopment(report.development);
setMeetingTime(report.meetingTime); setMeeting(report.meeting);
setAdminTime(report.adminTime); setAdmin(report.admin);
setOwnWorkTime(report.ownWorkTime); setOwnWork(report.own_work);
setStudyTime(report.studyTime); setStudy(report.study);
setTestingTime(report.testingTime); setTesting(report.testing);
} else {
await Promise.resolve(); console.error("Failed to fetch weekly report:", response.message);
}
}
}; };
useEffect(() => { useEffect(() => {