//info: New weekly report form component to create a new weekly report to //sumbit development time, meeting time, admin time, own work time, study time and testing time import { useState } from "react"; import type { NewWeeklyReport } from "../Types/goTypes"; import { api } from "../API/API"; import { useNavigate, useParams } from "react-router-dom"; import Button from "./Button"; /** * Renders a form for creating a new weekly report. * @returns The JSX element representing the new weekly report form. */ export default function NewWeeklyReport(): JSX.Element { const [week, setWeek] = useState(0); const [developmentTime, setDevelopmentTime] = useState(); const [meetingTime, setMeetingTime] = useState(); const [adminTime, setAdminTime] = useState(); const [ownWorkTime, setOwnWorkTime] = useState(); const [studyTime, setStudyTime] = useState(); const [testingTime, setTestingTime] = useState(); const { projectName } = useParams(); const token = localStorage.getItem("accessToken") ?? ""; const handleNewWeeklyReport = async (): Promise => { const newWeeklyReport: NewWeeklyReport = { projectName: projectName ?? "", week: week, developmentTime: developmentTime ?? 0, meetingTime: meetingTime ?? 0, adminTime: adminTime ?? 0, ownWorkTime: ownWorkTime ?? 0, studyTime: studyTime ?? 0, testingTime: testingTime ?? 0, }; await api.submitWeeklyReport(newWeeklyReport, token); }; const navigate = useNavigate(); const isChromeOrEdge = /Chrome|Edg/.test(navigator.userAgent); return ( <>
{ if (week === 0 || week > 53 || week < 1) { alert("Please enter a valid week number"); e.preventDefault(); return; } e.preventDefault(); void handleNewWeeklyReport(); navigate(-1); }} >
{isChromeOrEdge ? ( { const weekNumber = parseInt(e.target.value.split("-W")[1]); setWeek(weekNumber); }} onKeyDown={(event) => { const keyValue = event.key; if (!/\d/.test(keyValue) && keyValue !== "Backspace") event.preventDefault(); }} onPaste={(event) => { event.preventDefault(); }} /> ) : ( { const weekNumber = parseInt(e.target.value); setWeek(weekNumber); }} onKeyDown={(event) => { const keyValue = event.key; if (!/\d/.test(keyValue) && keyValue !== "Backspace") event.preventDefault(); }} onPaste={(event) => { event.preventDefault(); }} /> )}
Activity Total Time (min)
Development { setDevelopmentTime(parseInt(e.target.value)); }} onKeyDown={(event) => { const keyValue = event.key; if (!/\d/.test(keyValue) && keyValue !== "Backspace") event.preventDefault(); }} />
Meeting { setMeetingTime(parseInt(e.target.value)); }} onKeyDown={(event) => { const keyValue = event.key; if (!/\d/.test(keyValue) && keyValue !== "Backspace") event.preventDefault(); }} />
Administration { setAdminTime(parseInt(e.target.value)); }} onKeyDown={(event) => { const keyValue = event.key; if (!/\d/.test(keyValue) && keyValue !== "Backspace") event.preventDefault(); }} />
Own Work { setOwnWorkTime(parseInt(e.target.value)); }} onKeyDown={(event) => { const keyValue = event.key; if (!/\d/.test(keyValue) && keyValue !== "Backspace") event.preventDefault(); }} />
Studies { setStudyTime(parseInt(e.target.value)); }} onKeyDown={(event) => { const keyValue = event.key; if (!/\d/.test(keyValue) && keyValue !== "Backspace") event.preventDefault(); }} />
Testing { setTestingTime(parseInt(e.target.value)); }} onKeyDown={(event) => { const keyValue = event.key; if (!/\d/.test(keyValue) && keyValue !== "Backspace") event.preventDefault(); }} />
); }