From 42f5623c92ff8d2950ff6e48d6058af208c22c1c Mon Sep 17 00:00:00 2001 From: Maxime RICHARD Date: Tue, 21 May 2024 23:35:04 +0200 Subject: [PATCH] feat: finish stas --- presentation/react/components/Stats/Stats.tsx | 279 ++++++++++-------- 1 file changed, 155 insertions(+), 124 deletions(-) diff --git a/presentation/react/components/Stats/Stats.tsx b/presentation/react/components/Stats/Stats.tsx index bf3d9f8..f1260c1 100644 --- a/presentation/react/components/Stats/Stats.tsx +++ b/presentation/react/components/Stats/Stats.tsx @@ -1,18 +1,18 @@ import { Card, Text } from "react-native-paper" import CircularProgress from "react-native-circular-progress-indicator" import { Agenda } from "react-native-calendars" -import { useState } from "react" +import type { SetStateAction } from "react" +import { useState, useEffect } from "react" import { getNowDateUTC, getISODate } from "@/utils/dates" import type { HabitsTracker } from "@/domain/entities/HabitsTracker" +import type { HabitHistory } from "@/domain/entities/HabitHistory" export interface StatsProps { habitsTracker: HabitsTracker } -export const Stats: React.FC = (props) => { - const { habitsTracker } = props - +export const Stats: React.FC = ({ habitsTracker }) => { const today = getNowDateUTC() const todayISO = getISODate(today) @@ -21,81 +21,98 @@ export const Stats: React.FC = (props) => { const habitsHistory = habitsTracker.getAllHabitsHistory() - let goalDays = 0 - let totalGoalDays = 0 - const dailyHabits = habitsHistory.filter((el) => { - return ( - el.habit.goal.frequency === "daily" && el.habit.startDate <= selectedDate - ) - }) - let displayDaily = true - if (dailyHabits.length === 0) { - displayDaily = false - } else { - for (const el of dailyHabits) { - totalGoalDays++ - if ( - el.getProgressesByDate(selectedDate)[0]?.goalProgress.isCompleted() ?? - false - ) { - goalDays++ - } + const [goalDays, setGoalDays] = useState(0) + const [totalGoalDays, setTotalGoalDays] = useState(0) + const [displayDaily, setDisplayDaily] = useState(true) + const [goalWeek, setGoalWeek] = useState(0) + const [totalGoalWeek, setTotalGoalWeek] = useState(0) + const [displayWeekly, setDisplayWeekly] = useState(true) + const [goalMonth, setGoalMonth] = useState(0) + const [totalGoalMonth, setTotalGoalMonth] = useState(0) + const [displayMonthly, setDisplayMonthly] = useState(true) + + const updateStats = (date: Date): void => { + const dailyHabits = habitsHistory.filter((el) => { + return ( + el.habit.goal.frequency === "daily" && + el.habit.startDate.getFullYear() <= date.getFullYear() && + el.habit.startDate.getMonth() <= date.getMonth() && + el.habit.startDate.getDate() <= date.getDate() + ) + }) + const weeklyHabits = habitsHistory.filter((el) => { + return ( + el.habit.goal.frequency === "weekly" && + el.habit.startDate.getFullYear() <= date.getFullYear() && + el.habit.startDate.getMonth() <= date.getMonth() && + el.habit.startDate.getDate() <= date.getDate() + ) + }) + const monthlyHabits = habitsHistory.filter((el) => { + return ( + el.habit.goal.frequency === "monthly" && + el.habit.startDate.getFullYear() <= date.getFullYear() && + el.habit.startDate.getMonth() <= date.getMonth() && + el.habit.startDate.getDate() <= date.getDate() + ) + }) + + const calculateGoals = ( + habits: HabitHistory[], + setTotalGoals: { + (value: SetStateAction): void + (value: SetStateAction): void + (value: SetStateAction): void + (arg0: any): void + }, + setGoals: { + (value: SetStateAction): void + (value: SetStateAction): void + (value: SetStateAction): void + (arg0: any): void + }, + ): void => { + setTotalGoals(habits.length) + const completedGoals = habits.filter((el) => { + return ( + el.getProgressesByDate(date)[0]?.goalProgress.isCompleted() ?? false + ) + }).length + setGoals(completedGoals) + } + + if (dailyHabits.length === 0) { + setDisplayDaily(false) + } else { + setDisplayDaily(true) + calculateGoals(dailyHabits, setTotalGoalDays, setGoalDays) + } + + if (weeklyHabits.length === 0) { + setDisplayWeekly(false) + } else { + setDisplayWeekly(true) + calculateGoals(weeklyHabits, setTotalGoalWeek, setGoalWeek) + } + + if (monthlyHabits.length === 0) { + setDisplayMonthly(false) + } else { + setDisplayMonthly(true) + calculateGoals(monthlyHabits, setTotalGoalMonth, setGoalMonth) } } - let goalWeek = 0 - let totalGoalWeek = 0 - const weeklyHabits = habitsHistory.filter((el) => { - return ( - el.habit.goal.frequency === "weekly" && el.habit.startDate <= selectedDate - ) - }) - - let displayWeekly = true - if (weeklyHabits.length === 0) { - displayWeekly = false - } else { - for (const el of weeklyHabits) { - totalGoalWeek++ - if ( - el.getProgressesByDate(selectedDate)[0]?.goalProgress.isCompleted() ?? - false - ) { - goalWeek++ - } - } - } - - let goalMonth = 0 - let totalGoalMonth = 0 - const monthlyHabits = habitsHistory.filter((el) => { - return ( - el.habit.goal.frequency === "monthly" && - el.habit.startDate <= selectedDate - ) - }) - - let displayMonthly = true - if (monthlyHabits.length === 0) { - displayMonthly = false - } else { - for (const el of monthlyHabits) { - totalGoalMonth++ - if ( - el.getProgressesByDate(selectedDate)[0]?.goalProgress.isCompleted() ?? - false - ) { - goalMonth++ - } - } - } + useEffect(() => { + updateStats(selectedDate) + }, [selectedDate]) return ( { - setSelectedDate(new Date(date.dateString)) + return setSelectedDate(new Date(date.dateString)) }} markedDates={{ [todayISO]: { marked: true, today: true }, @@ -105,60 +122,74 @@ export const Stats: React.FC = (props) => { renderList={() => { return ( <> - {displayDaily ? ( - - - - - {goalDays} but réussi dans la journée sur {totalGoalDays} - - - - - ) : null} - {displayWeekly ? ( - - - - - {goalWeek} but réussi dans la semaine sur {totalGoalWeek} - - - - - ) : null} - {displayMonthly ? ( - - - - - {goalMonth} but réussi dans le mois sur {totalGoalMonth} - - - - - ) : null} + + + + {displayDaily ? ( + <> + + {goalDays} but réussi dans la journée sur {totalGoalDays} + + + + ) : ( + Aucun objectif quotidien + )} + + + + + + + {displayWeekly ? ( + <> + + {goalWeek} but réussi dans la semaine sur {totalGoalWeek} + + + + ) : ( + Aucun objectif hebdomadaire + )} + + + + + + + {displayMonthly ? ( + <> + + {goalMonth} but réussi dans le mois sur {totalGoalMonth} + + + + ) : ( + Aucun objectif mensuel + )} + + ) }}