Skip to content

Commit

Permalink
Merge pull request #134 from tahmid-saj/dev-general-cleanup-2
Browse files Browse the repository at this point in the history
adding calories burned calendar to dashboard
  • Loading branch information
tahmid-saj authored Jun 19, 2024
2 parents 720cfca + 50554fa commit 856d571
Show file tree
Hide file tree
Showing 14 changed files with 187 additions and 37 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -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>
)
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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>
)
}
Expand Down
Original file line number Diff line number Diff line change
@@ -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
Original file line number Diff line number Diff line change
@@ -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%;
}
Original file line number Diff line number Diff line change
@@ -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
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
.calories-burned-schedule-day-info {
display: flex;
justify-content: center;
align-items: center;
padding: 2% 2% 2% 2%;
}
Original file line number Diff line number Diff line change
@@ -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"

Expand Down
Original file line number Diff line number Diff line change
@@ -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";
Expand Down
Original file line number Diff line number Diff line change
@@ -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";

Expand Down
Original file line number Diff line number Diff line change
@@ -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";
Expand Down
Original file line number Diff line number Diff line change
@@ -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";
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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
})

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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
})

Expand Down
9 changes: 4 additions & 5 deletions src/pages/signed-out/dashboard/dashboard.component.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand All @@ -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()
Expand Down Expand Up @@ -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>
Expand Down

0 comments on commit 856d571

Please sign in to comment.