fix hour calculation and report form

src/components/ProfileCalendar/ProfileCalendarComponent.jsx

@@ -20,7 +20,8 @@ import {
   currentMonthAndDay,
   getCorrectDate,
   getReports,
-  hourOfNum
+  hourOfNum,
+  correctDay
 } from "@components/Calendar/calendarHelper";
 import BaseButton from "@components/Common/BaseButton/BaseButton";
 import ShortReport from "@components/ShortReport/ShortReport";
@@ -30,7 +31,6 @@ import calendarIcon from "assets/icons/calendar.svg";
 // import close from "assets/icons/closeProjectPersons.svg";
 import rectangle from "assets/images/rectangle__calendar.png";
 
-// eslint-disable-next-line react/display-name
 export const ProfileCalendarComponent = React.memo(
   ({
     value,
@@ -44,7 +44,6 @@ export const ProfileCalendarComponent = React.memo(
   }) => {
     const dispatch = useDispatch();
 
-    const [currentDay] = useState(moment());
     const [calendar, setCalendar] = useState([]);
     const [month, setMonth] = useState("");
     const [shortReport, setShortReport] = useState(false);
@@ -74,15 +73,8 @@ export const ProfileCalendarComponent = React.memo(
       return day.isSame(new Date(), "day");
     }
 
-    function correctDay(day) {
-      if (day < 10) {
-        return `0${day}`;
-      }
-      return day;
-    }
-
     function dayStyles(day) {
-      if (currentDay < day) return `block`;
+      if (moment() < day) return `block`;
       for (const date of reports) {
         if (
           `${new Date(day).getFullYear()}-${correctDay(
@@ -110,13 +102,9 @@ export const ProfileCalendarComponent = React.memo(
       return "../../report";
     }
 
-    function prevMonth() {
-      return value.clone().subtract(1, "month");
-    }
+    const prevMonth = () => value.clone().subtract(1, "month");
 
-    function nextMonth() {
-      return value.clone().add(1, "month");
-    }
+    const nextMonth = () => value.clone().add(1, "month");
 
     function reportsByDate(endDay) {
       const requestDates =
@@ -133,25 +121,16 @@ export const ProfileCalendarComponent = React.memo(
         )}`
       ).then((reports) => {
         let spendTime = 0;
-        for (const report of reports) {
-          report.task.map((task) => {
-            if (task.hours_spent) {
-              spendTime += Number(task.hours_spent);
-            }
-          });
-        }
-        setTotalRangeHours(spendTime);
+        reports.map((report) => {
+          spendTime += report.task.reduce(
+            (acc, task) => acc + task.hours_spent,
+            0
+          );
+        });
+        setTotalRangeHours(Math.floor(spendTime));
       });
     }
 
-    function toggleActivePeriod() {
-      if (!activePeriod) {
-        setActivePeriod(true);
-      } else {
-        setActivePeriod(false);
-      }
-    }
-
     function rangeDays(day) {
       if (!startDate) {
         setStartDateRange(day);
@@ -308,7 +287,7 @@ export const ProfileCalendarComponent = React.memo(
             onClick={() => {
               if (startRangeDays) resetRangeDays();
               toggleRangeDays();
-              toggleActivePeriod();
+              setActivePeriod(!activePeriod);
             }}
           >
             {endDate
@@ -331,7 +310,7 @@ export const ProfileCalendarComponent = React.memo(
               styles={"clear-days"}
               onClick={() => {
                 resetRangeDays();
-                toggleActivePeriod();
+                setActivePeriod(false);
                 toggleRangeDays();
               }}
             >