tahmid-saj · tahmid-saj · Jun 19, 2024 · Jun 19, 2024
diff --git a/...ents/signed-in/calories-burned/schedule/schedule-day-info/schedule-day-info.component.jsx b/...ents/signed-in/calories-burned/schedule/schedule-day-info/schedule-day-info.component.jsx
@@ -13,20 +13,28 @@ const paperStyles = {
 const ScheduleDayInfo = () => {
   const { scheduledTrackedCaloriesBurnedView } = useContext(CaloriesBurnedContext)
 
+  if (!scheduledTrackedCaloriesBurnedView.length) return <Fragment/>
+
   return (
     <div className="calories-burned-schedule-day-info">
-      <SimplePaper styles={ paperStyles }>
-        <Typography sx={{ display: "flex", justifyContent: "center" }} variant="h6">{`${scheduledTrackedCaloriesBurnedView.dateTracked}`}</Typography>
-        <Typography sx={{ display: "flex", justifyContent: "center" }} variant="body1">{`Activity - ${scheduledTrackedCaloriesBurnedView.activity}`}</Typography>
-        <Typography sx={{ display: "flex", justifyContent: "center" }} variant="body1">{`Total calories burned - ${scheduledTrackedCaloriesBurnedView.totalCaloriesBurned}`}</Typography>
+    {
+      scheduledTrackedCaloriesBurnedView.map((trackedCaloriesBurned) => {
+        return (
+          <SimplePaper styles={ paperStyles }>
+            <Typography sx={{ display: "flex", justifyContent: "center" }} variant="h6">{`${trackedCaloriesBurned.dateTracked}`}</Typography>
+            <Typography sx={{ display: "flex", justifyContent: "center" }} variant="body1">{`Activity - ${trackedCaloriesBurned.activity}`}</Typography>
+            <Typography sx={{ display: "flex", justifyContent: "center" }} variant="body1">{`Total calories burned - ${trackedCaloriesBurned.totalCaloriesBurned}`}</Typography>
 
-        <br/>
-        <Divider/>
-        <br/>
+            <br/>
+            <Divider/>
+            <br/>
 
-        <Typography sx={{ display: "flex", justifyContent: "center" }} variant="body1">{`Duration (mins) - ${scheduledTrackedCaloriesBurnedView.durationMinutes}`}</Typography>
-        <Typography sx={{ display: "flex", justifyContent: "center" }} variant="body1">{`Calories burned / hr - ${scheduledTrackedCaloriesBurnedView.caloriesBurnedPerHour}`}</Typography>
-      </SimplePaper>
+            <Typography sx={{ display: "flex", justifyContent: "center" }} variant="body1">{`Duration (mins) - ${trackedCaloriesBurned.durationMinutes}`}</Typography>
+            <Typography sx={{ display: "flex", justifyContent: "center" }} variant="body1">{`Calories burned / hr - ${trackedCaloriesBurned.caloriesBurnedPerHour}`}</Typography>
+          </SimplePaper>
+        )
+      })
+    }
     </div>
   )
 }

diff --git a/...nts/signed-out/calories-burned/schedule/schedule-day-info/schedule-day-info.component.jsx b/...nts/signed-out/calories-burned/schedule/schedule-day-info/schedule-day-info.component.jsx
@@ -7,26 +7,34 @@ import { CaloriesBurnedContext } from "../../../../../contexts/signed-out/calori
 
 const paperStyles = {
   backgroundColor: COLOR_CODES.general["1"],
-  width: 400
+  width: 400,
 }
 
 const ScheduleDayInfo = () => {
   const { scheduledTrackedCaloriesBurnedView } = useContext(CaloriesBurnedContext)
 
+  if (!scheduledTrackedCaloriesBurnedView.length) return <Fragment/>
+
   return (
     <div className="calories-burned-schedule-day-info">
-      <SimplePaper styles={ paperStyles }>
-        <Typography sx={{ display: "flex", justifyContent: "center" }} variant="h6">{`${scheduledTrackedCaloriesBurnedView.dateTracked}`}</Typography>
-        <Typography sx={{ display: "flex", justifyContent: "center" }} variant="body1">{`Activity - ${scheduledTrackedCaloriesBurnedView.activity}`}</Typography>
-        <Typography sx={{ display: "flex", justifyContent: "center" }} variant="body1">{`Total calories burned - ${scheduledTrackedCaloriesBurnedView.totalCaloriesBurned}`}</Typography>
+    {
+      scheduledTrackedCaloriesBurnedView.map((trackedCaloriesBurned) => {
+        return (
+          <SimplePaper styles={ paperStyles }>
+            <Typography sx={{ display: "flex", justifyContent: "center" }} variant="h6">{`${trackedCaloriesBurned.dateTracked}`}</Typography>
+            <Typography sx={{ display: "flex", justifyContent: "center" }} variant="body1">{`Activity - ${trackedCaloriesBurned.activity}`}</Typography>
+            <Typography sx={{ display: "flex", justifyContent: "center" }} variant="body1">{`Total calories burned - ${trackedCaloriesBurned.totalCaloriesBurned}`}</Typography>
 
-        <br/>
-        <Divider/>
-        <br/>
+            <br/>
+            <Divider/>
+            <br/>
 
-        <Typography sx={{ display: "flex", justifyContent: "center" }} variant="body1">{`Duration (mins) - ${scheduledTrackedCaloriesBurnedView.durationMinutes}`}</Typography>
-        <Typography sx={{ display: "flex", justifyContent: "center" }} variant="body1">{`Calories burned / hr - ${scheduledTrackedCaloriesBurnedView.caloriesBurnedPerHour}`}</Typography>
-      </SimplePaper>
+            <Typography sx={{ display: "flex", justifyContent: "center" }} variant="body1">{`Duration (mins) - ${trackedCaloriesBurned.durationMinutes}`}</Typography>
+            <Typography sx={{ display: "flex", justifyContent: "center" }} variant="body1">{`Calories burned / hr - ${trackedCaloriesBurned.caloriesBurnedPerHour}`}</Typography>
+          </SimplePaper>
+        )
+      })
+    }
     </div>
   )
 }

diff --git a/...-out/dashboard/calories-burned/schedule/schedule-calendar/schedule-calendar.component.jsx b/...-out/dashboard/calories-burned/schedule/schedule-calendar/schedule-calendar.component.jsx
@@ -0,0 +1,68 @@
+import "./schedule-calendar.styles.scss"
+import 'rsuite/Calendar/styles/index.css';
+import { Fragment, useContext, useState } from "react";
+import { Calendar, Whisper, Popover, Badge } from 'rsuite';
+import { Typography } from "@mui/material";
+import { COLOR_CODES } from "../../../../../../utils/constants/shared.constants";
+
+import { CaloriesBurnedContext } from "../../../../../../contexts/signed-out/calories-burned/calories-burned.context";
+
+function getScheduledData(date, trackedCaloriesBurned) {
+  date = date.toISOString().split('T')[0]
+
+  let scheduledTrackedCaloriesBurnedForDate = []
+  trackedCaloriesBurned.map((trackedDay) => {
+    if (trackedDay.dateTracked === date) {
+      scheduledTrackedCaloriesBurnedForDate.push({
+        caloriesBurned: trackedDay.totalCaloriesBurned
+      })
+    }
+  })
+
+  return scheduledTrackedCaloriesBurnedForDate
+}
+
+const ScheduleCalendar = () => {
+  const { trackedCaloriesBurned, selectScheduledTrackedCaloriesBurned } = useContext(CaloriesBurnedContext)
+
+  function renderCell(date) {
+    const list = getScheduledData(date, trackedCaloriesBurned);
+    const displayList = list.filter((item, index) => index < 1);
+
+    if (list.length) {
+      const moreCount = list.length - displayList.length;
+
+      return (
+        <Fragment>
+          <ul className="calendar-todo-list">
+            {displayList.map((item, index) => (
+              <li key={index}>
+                <Badge /> <b>{`Calories: ${item.caloriesBurned}`}</b>
+              </li>
+            ))}
+            {moreCount ? `${moreCount} more` : null}
+          </ul>
+          {/* {moreCount} more */}
+        </Fragment>
+      );
+    }
+
+    return null;
+  }
+
+  const onSelectDate = (date) => {
+    const selectedDate = date.toISOString().split('T')[0]
+    console.log(selectedDate)
+    selectScheduledTrackedCaloriesBurned(selectedDate)
+  }
+
+  return (
+    <div className="calories-burned-schedule-calendar-container" style={{ backgroundColor: COLOR_CODES.general["0"] }}>
+      <Typography sx={{ display: "flex", marginLeft: "1%" }} 
+        variant="h6">{`Calories burned calendar`}</Typography>
+      <Calendar bordered renderCell={ renderCell } onSelect={ onSelectDate } style={{ backgroundColor: COLOR_CODES.general["0"] }}/>
+    </div>
+  )
+}
+
+export default ScheduleCalendar
diff --git a/...ed-out/dashboard/calories-burned/schedule/schedule-calendar/schedule-calendar.styles.scss b/...ed-out/dashboard/calories-burned/schedule/schedule-calendar/schedule-calendar.styles.scss
@@ -0,0 +1,26 @@
+.calendar-todo-list {
+  text-align: left;
+  padding: 0;
+  list-style: none;
+}
+
+.calendar-todo-list li {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.calendar-todo-item-badge {
+  vertical-align: top;
+  margin-top: 8px;
+  width: 6px;
+  height: 6px;
+}  
+
+.calories-burned-calendar-container {
+  display: block;
+  justify-content: center;
+  align-items: center;
+  margin: 2%;
+  padding: 1%;
+}
diff --git a/...-out/dashboard/calories-burned/schedule/schedule-day-info/schedule-day-info.component.jsx b/...-out/dashboard/calories-burned/schedule/schedule-day-info/schedule-day-info.component.jsx
@@ -0,0 +1,42 @@
+import "./schedule-day-info.styles.scss"
+import { Typography, Divider } from "@mui/material"
+import { Fragment, useContext } from "react"
+import SimplePaper from "../../../../../shared/mui/paper/paper.component"
+import { COLOR_CODES } from "../../../../../../utils/constants/shared.constants"
+import { CaloriesBurnedContext } from "../../../../../../contexts/signed-out/calories-burned/calories-burned.context"
+
+const paperStyles = {
+  backgroundColor: COLOR_CODES.general["1"],
+  width: 400
+}
+
+const ScheduleDayInfo = () => {
+  const { scheduledTrackedCaloriesBurnedView } = useContext(CaloriesBurnedContext)
+
+  if (!scheduledTrackedCaloriesBurnedView.length) return <Fragment/>
+
+  return (
+    <div className="calories-burned-schedule-day-info">
+    {
+      scheduledTrackedCaloriesBurnedView.map((trackedCaloriesBurned) => {
+        return (
+          <SimplePaper styles={ paperStyles }>
+            <Typography sx={{ display: "flex", justifyContent: "center" }} variant="h6">{`${trackedCaloriesBurned.dateTracked}`}</Typography>
+            <Typography sx={{ display: "flex", justifyContent: "center" }} variant="body1">{`Activity - ${trackedCaloriesBurned.activity}`}</Typography>
+            <Typography sx={{ display: "flex", justifyContent: "center" }} variant="body1">{`Total calories burned - ${trackedCaloriesBurned.totalCaloriesBurned}`}</Typography>
+
+            <br/>
+            <Divider/>
+            <br/>
+
+            <Typography sx={{ display: "flex", justifyContent: "center" }} variant="body1">{`Duration (mins) - ${trackedCaloriesBurned.durationMinutes}`}</Typography>
+            <Typography sx={{ display: "flex", justifyContent: "center" }} variant="body1">{`Calories burned / hr - ${trackedCaloriesBurned.caloriesBurnedPerHour}`}</Typography>
+          </SimplePaper>
+        )
+      })
+    }
+    </div>
+  )
+}
+
+export default ScheduleDayInfo
diff --git a/...ed-out/dashboard/calories-burned/schedule/schedule-day-info/schedule-day-info.styles.scss b/...ed-out/dashboard/calories-burned/schedule/schedule-day-info/schedule-day-info.styles.scss
@@ -0,0 +1,6 @@
+.calories-burned-schedule-day-info {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding: 2% 2% 2% 2%;
+}
diff --git a/...n-tracker/nutrition-tracker-graph-calories/nutrition-tracker-graph-calories.component.jsx b/...n-tracker/nutrition-tracker-graph-calories/nutrition-tracker-graph-calories.component.jsx
@@ -1,7 +1,5 @@
 import "./nutrition-tracker-graph-calories.styles.scss"
 import ReactApexChart from "react-apexcharts"
-// import { useContext } from "react"
-// import { NutritionTrackerContext } from "../../../../../contexts/signed-out/nutrition-tracker/nutrition-tracker.context"
 import { useSelector } from "react-redux"
 import { selectNutritionTrackedDays } from "../../../../../store/signed-out/nutrition-tracker/nutrition-tracker.selector"
 

diff --git a/...trition-tracker-graph-macronutrients/nutrition-tracker-graph-macronutrients.component.jsx b/...trition-tracker-graph-macronutrients/nutrition-tracker-graph-macronutrients.component.jsx
@@ -1,8 +1,7 @@
 import "./nutrition-tracker-graph-macronutrients.styles.scss"
-import { Fragment, useContext, useState, Component } from "react";
+import { Fragment, useState, Component } from "react";
 import ReactApexChart from 'react-apexcharts'
 
-// import { NutritionTrackerContext } from "../../../../../contexts/signed-out/nutrition-tracker/nutrition-tracker.context";
 import { GRAPH_FIELDS } from "../../../../../utils/constants/nutrition-tracker.constants";
 
 import { useSelector } from "react-redux";

diff --git a/...ion-tracker-summary/nutrition-tracker-graph-pie/nutrition-tracker-graph-pie.component.jsx b/...ion-tracker-summary/nutrition-tracker-graph-pie/nutrition-tracker-graph-pie.component.jsx
@@ -1,7 +1,5 @@
 import "./nutrition-tracker-graph-pie.styles.scss"
 import ReactApexChart from "react-apexcharts";
-// import { useContext, Fragment } from "react"
-// import { NutritionTrackerContext } from "../../../../../../contexts/signed-out/nutrition-tracker/nutrition-tracker.context"
 
 import { GRAPH_FIELDS } from "../../../../../../utils/constants/nutrition-tracker.constants";
 

diff --git a/...board/nutrition-tracker/nutrition-tracker-summary/nutrition-tracker-summary.component.jsx b/...board/nutrition-tracker/nutrition-tracker-summary/nutrition-tracker-summary.component.jsx
@@ -1,6 +1,4 @@
 import "./nutrition-tracker-summary.styles.scss"
-// import { useContext } from "react";
-// import { NutritionTrackerContext } from "../../../../../contexts/signed-out/nutrition-tracker/nutrition-tracker.context";
 import NutritionTrackerGraphPie from "./nutrition-tracker-graph-pie/nutrition-tracker-graph-pie.component";
 import { useSelector } from "react-redux";
 import { selectNutritionTrackedDaysSummary } from "../../../../../store/signed-out/nutrition-tracker/nutrition-tracker.selector";

diff --git a/...ut/dashboard/nutrition-tracker/schedule/schedule-calendar/schedule-calendar.component.jsx b/...ut/dashboard/nutrition-tracker/schedule/schedule-calendar/schedule-calendar.component.jsx
@@ -1,6 +1,6 @@
 import "./schedule-calendar.styles.scss"
 import 'rsuite/Calendar/styles/index.css';
-import { Fragment, useContext, useState } from "react";
+import { Fragment, useState } from "react";
 import { Calendar, Whisper, Popover, Badge } from 'rsuite';
 import { Typography } from "@mui/material";
 import { COLOR_CODES } from "../../../../../../utils/constants/shared.constants";

diff --git a/src/contexts/signed-in/calories-burned/calories-burned.context.js b/src/contexts/signed-in/calories-burned/calories-burned.context.js
@@ -77,7 +77,7 @@ const setDefaultTrackedCaloriesBurnedSummaryValuesHelper = () => {
 const selectScheduledTrackedCaloriesBurnedHelper = (trackedCaloriesBurned, trackedDay) => {
   console.log(trackedDay)
 
-  const filteredTrackedCaloriesBurned = trackedCaloriesBurned.find((caloriesTrackedDay) => {
+  const filteredTrackedCaloriesBurned = trackedCaloriesBurned.filter((caloriesTrackedDay) => {
     return caloriesTrackedDay.dateTracked === trackedDay
   })
 

diff --git a/src/contexts/signed-out/calories-burned/calories-burned.context.js b/src/contexts/signed-out/calories-burned/calories-burned.context.js
@@ -53,7 +53,7 @@ const removeActivityDateHelper = (trackedCaloriesBurned, activityId) => {
 const selectScheduledTrackedCaloriesBurnedHelper = (trackedCaloriesBurned, trackedDay) => {
   console.log(trackedDay)
 
-  const filteredTrackedCaloriesBurned = trackedCaloriesBurned.find((caloriesTrackedDay) => {
+  const filteredTrackedCaloriesBurned = trackedCaloriesBurned.filter((caloriesTrackedDay) => {
     return caloriesTrackedDay.dateTracked === trackedDay
   })
 

diff --git a/src/pages/signed-out/dashboard/dashboard.component.jsx b/src/pages/signed-out/dashboard/dashboard.component.jsx
@@ -7,7 +7,6 @@ import NutritionTrackerGraphMacronutrients from "../../../components/signed-out/
 import NutritionTrackerSummary from "../../../components/signed-out/dashboard/nutrition-tracker/nutrition-tracker-summary/nutrition-tracker-summary.component"
 
 import { useContext, Fragment, useEffect } from "react"
-// import { NutritionTrackerContext } from "../../../contexts/signed-out/nutrition-tracker/nutrition-tracker.context"
 import { useDispatch, useSelector } from "react-redux"
 import { selectNutritionTrackedDays, selectScheduledNutritionTrackedDaysView,
   selectSelectedNutritionTrackedDay
@@ -19,8 +18,8 @@ import ChatBot from "../../shared/chatbot/chatbot.component"
 
 import ScheduleCalendarNutritionTracker from "../../../components/signed-out/dashboard/nutrition-tracker/schedule/schedule-calendar/schedule-calendar.component"
 import ScheduleDayInfoNutritionTracker from "../../../components/signed-out/dashboard/nutrition-tracker/schedule/schedule-day-info/schedule-day-info.component"
-// import ScheduleCalendarCaloriesBurned from "../../../components/signed-out/dashboard/calories-burned"
-// import ScheduleDayInfoCaloriesBurned from "../../../components/signed-out/calories-burned/schedule/schedule-day-info/schedule-day-info.component"
+import ScheduleCalendarCaloriesBurned from "../../../components/signed-out/dashboard/calories-burned/schedule/schedule-calendar/schedule-calendar.component"
+import ScheduleDayInfoCaloriesBurned from "../../../components/signed-out/dashboard/calories-burned/schedule/schedule-day-info/schedule-day-info.component"
 
 const Dashboard = () => {
   const dispatch = useDispatch()
@@ -80,11 +79,11 @@ const Dashboard = () => {
             <div className="calories-burned-dashboard-summary-graph-container">
               <CaloriesBurnedSummary></CaloriesBurnedSummary>
             </div>
-            {/* <ScheduleCalendarCaloriesBurned></ScheduleCalendarCaloriesBurned>
+            <ScheduleCalendarCaloriesBurned></ScheduleCalendarCaloriesBurned>
             {
               scheduledTrackedCaloriesBurnedView ?
               <ScheduleDayInfoCaloriesBurned></ScheduleDayInfoCaloriesBurned> : null
-            } */}
+            }
 
             <CaloriesBurnedGraphPie></CaloriesBurnedGraphPie>
             <CaloriesBurnedGraph></CaloriesBurnedGraph>