From 06288af18d8ca0e23c5f219d01054b547ca9ac65 Mon Sep 17 00:00:00 2001
From: Mo Tarbin <mhed.t91@gmail.com>
Date: Sun, 6 Apr 2025 19:40:12 -0400
Subject: [PATCH] Fix #21 Frontend shows in calendar (Mon-Sun) the tasks
 delayed by one day

---
 src/views/components/CalendarView.jsx | 20 ++++++++++++--------
 1 file changed, 12 insertions(+), 8 deletions(-)

diff --git a/src/views/components/CalendarView.jsx b/src/views/components/CalendarView.jsx
index 154b723..9a27811 100644
--- a/src/views/components/CalendarView.jsx
+++ b/src/views/components/CalendarView.jsx
@@ -21,11 +21,15 @@ const CalendarView = ({ chores }) => {
 
   const tileContent = ({ date, view }) => {
     if (view === 'month') {
-      const dayChores = chores.filter(
-        chore =>
-          new Date(chore.nextDueDate)?.toISOString().split('T')[0] ===
-          date.toISOString().split('T')[0],
-      )
+      const dayChores = chores.filter(chore => {
+        // Validate chore.nextDueDate before using it
+        if (!chore.nextDueDate) return false
+
+        const choreDate = new Date(chore.nextDueDate)
+        if (isNaN(choreDate)) return false // Check if the date is invalid
+        if (!date) return false
+        return choreDate.toLocaleDateString() === date.toLocaleDateString()
+      })
 
       return (
         <div className='dot-container'>
@@ -66,7 +70,7 @@ const CalendarView = ({ chores }) => {
       <Calendar
         tileContent={tileContent}
         onChange={d => {
-          setSeletedDate(new Date(d))
+          setSeletedDate(new Date(d.toLocaleDateString()))
         }}
       />
       {!selectedDate && (
@@ -118,8 +122,8 @@ const CalendarView = ({ chores }) => {
           {chores
             .filter(
               chore =>
-                new Date(chore.nextDueDate)?.toISOString().split('T')[0] ===
-                selectedDate.toISOString().split('T')[0],
+                new Date(chore.nextDueDate)?.toLocaleDateString() ===
+                selectedDate.toLocaleDateString(),
             )
             .map((chore, idx) => (
               <Card