harivansh-afk/Habit-Tracker
1
0
Fork 0
mirror of https://github.com/harivansh-afk/Habit-Tracker.git synced 2026-04-18 20:03:38 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

debugging day/date and streak

Browse source
This commit is contained in:
Harivansh Rathi 2024-11-20 21:28:38 -05:00
parent 7858b03494
commit d113922158
1 changed files with 17 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

34
src/components/HabitList.tsx
View file

@ -18,10 +18,11 @@ const calculateStreak = (completedDates: string[]): { currentStreak: number; bes
return { currentStreak: 0, bestStreak: 0 }; return { currentStreak: 0, bestStreak: 0 };
} }
// Get today's date at midnight // Get today at midnight in UTC
const today = new Date(); const today = new Date();
today.setHours(0, 0, 0, 0); const utcToday = new Date(Date.UTC(today.getUTCFullYear(), today.getUTCMonth(), today.getUTCDate()));
const todayStr = today.toISOString().split('T')[0];
const todayStr = utcToday.toISOString().split('T')[0];
// Sort dates in descending order (most recent first) // Sort dates in descending order (most recent first)
const sortedDates = [...completedDates] const sortedDates = [...completedDates]
@ -32,28 +33,23 @@ const calculateStreak = (completedDates: string[]): { currentStreak: number; bes
let bestStreak = 0; let bestStreak = 0;
let tempStreak = 0; let tempStreak = 0;
// First, check if today is completed // Check if today is completed to maintain streak
const hasTodayCompleted = sortedDates.includes(todayStr); const hasTodayCompleted = sortedDates.includes(todayStr);
if (!hasTodayCompleted) { // Initialize current streak based on today's completion
// If today isn't completed, current streak is 0 if (hasTodayCompleted) {
currentStreak = 0; currentStreak = 1;
} else { let checkDate = new Date(utcToday);
// Start counting current streak from today
/* eslint-disable-next-line prefer-const */
let checkDate = new Date(today);
currentStreak = 1; // Start with 1 for today
// Check previous days // Check previous days
while (true) { while (true) {
// Move to previous day checkDate.setUTCDate(checkDate.getUTCDate() - 1);
checkDate.setDate(checkDate.getDate() - 1);
const dateStr = checkDate.toISOString().split('T')[0]; const dateStr = checkDate.toISOString().split('T')[0];
if (sortedDates.includes(dateStr)) { if (sortedDates.includes(dateStr)) {
currentStreak++; currentStreak++;
} else { } else {
break; // Break streak if a day is missed break;
} }
} }
} }
@ -61,6 +57,7 @@ const calculateStreak = (completedDates: string[]): { currentStreak: number; bes
// Calculate best streak // Calculate best streak
for (let i = 0; i < sortedDates.length; i++) { for (let i = 0; i < sortedDates.length; i++) {
const currentDate = new Date(sortedDates[i]); const currentDate = new Date(sortedDates[i]);
currentDate.setHours(0, 0, 0, 0); // Normalize time part for comparison
if (i === 0) { if (i === 0) {
tempStreak = 1; tempStreak = 1;
@ -85,7 +82,6 @@ const calculateStreak = (completedDates: string[]): { currentStreak: number; bes
// Final check for best streak // Final check for best streak
bestStreak = Math.max(bestStreak, tempStreak); bestStreak = Math.max(bestStreak, tempStreak);
// Also check if current streak is the best
bestStreak = Math.max(bestStreak, currentStreak); bestStreak = Math.max(bestStreak, currentStreak);
return { currentStreak, bestStreak }; return { currentStreak, bestStreak };
@ -118,13 +114,13 @@ export function HabitList({
<th className="text-left px-4 py-2 dark:text-white">Habit</th> <th className="text-left px-4 py-2 dark:text-white">Habit</th>
{currentWeek.map((dateStr, index) => { {currentWeek.map((dateStr, index) => {
const date = new Date(dateStr); const date = new Date(dateStr);
const displayDate = new Date(date.getTime() + date.getTimezoneOffset() * 60000); const dayIndex = date.getDay() === 0 ? 6 : date.getDay() - 1;
return ( return (
<th key={dateStr} className="px-4 py-2 text-center dark:text-white"> <th key={dateStr} className="px-4 py-2 text-center dark:text-white">
<div>{daysOfWeek[index]}</div> <div>{daysOfWeek[dayIndex]}</div>
<div className="text-xs text-gray-500 dark:text-gray-400"> <div className="text-xs text-gray-500 dark:text-gray-400">
{displayDate.getDate()} {date.getDate()}
</div> </div>
</th> </th>
); );