From 53ea81e8ca69b4981819cd3735c30fa4bb472d05 Mon Sep 17 00:00:00 2001
From: Mo Tarbin <mhed.t91@gmail.com>
Date: Sat, 21 Dec 2024 00:15:44 -0500
Subject: [PATCH] Add Ability to archive and unarchive

---
 src/utils/Fetcher.jsx          | 14 ++++++++++++++
 src/views/Chores/ChoreCard.jsx | 34 ++++++++++++++++++++++++++++++++++
 src/views/Chores/MyChores.jsx  | 27 +++++++++++++++++++++++++--
 3 files changed, 73 insertions(+), 2 deletions(-)

diff --git a/src/utils/Fetcher.jsx b/src/utils/Fetcher.jsx
index 75c8190..5e168c6 100644
--- a/src/utils/Fetcher.jsx
+++ b/src/utils/Fetcher.jsx
@@ -65,6 +65,18 @@ const GetArchivedChores = () => {
     headers: HEADERS(),
   })
 }
+const ArchiveChore = id => {
+  return Fetch(`${API_URL}/chores/${id}/archive`, {
+    method: 'PUT',
+    headers: HEADERS(),
+  })
+}
+const UnArchiveChore = id => {
+  return Fetch(`${API_URL}/chores/${id}/unarchive`, {
+    method: 'PUT',
+    headers: HEADERS(),
+  })
+}
 
 const GetChoreByID = id => {
   return Fetch(`${API_URL}/chores/${id}`, {
@@ -348,6 +360,7 @@ const DeleteLabel = id => {
 
 export {
   AcceptCircleMemberRequest,
+  ArchiveChore,
   CancelSubscription,
   createChore,
   CreateChore,
@@ -384,6 +397,7 @@ export {
   SaveThing,
   signUp,
   SkipChore,
+  UnArchiveChore,
   UpdateChoreAssignee,
   UpdateChoreHistory,
   UpdateChorePriority,
diff --git a/src/views/Chores/ChoreCard.jsx b/src/views/Chores/ChoreCard.jsx
index 44e8c1f..641daf2 100644
--- a/src/views/Chores/ChoreCard.jsx
+++ b/src/views/Chores/ChoreCard.jsx
@@ -1,4 +1,5 @@
 import {
+  Archive,
   CancelScheduleSend,
   Check,
   Delete,
@@ -18,6 +19,7 @@ import {
   Report,
   SwitchAccessShortcut,
   TimesOneMobiledata,
+  Unarchive,
   Update,
   ViewCarousel,
   Webhook,
@@ -43,8 +45,10 @@ import { useNavigate } from 'react-router-dom'
 import { API_URL } from '../../Config'
 import { UserContext } from '../../contexts/UserContext'
 import {
+  ArchiveChore,
   MarkChoreComplete,
   SkipChore,
+  UnArchiveChore,
   UpdateChoreAssignee,
 } from '../../utils/Fetcher'
 import { getTextColorFromBackgroundColor } from '../../utils/LabelColors'
@@ -137,6 +141,30 @@ const ChoreCard = ({
       },
     })
   }
+  const handleArchive = () => {
+    if (chore.isActive) {
+      ArchiveChore(chore.id).then(response => {
+        if (response.ok) {
+          response.json().then(data => {
+            const newChore = { ...chore, isActive: false }
+
+            onChoreUpdate(newChore, 'archive')
+          })
+        }
+      })
+    } else {
+      UnArchiveChore(chore.id).then(response => {
+        if (response.ok) {
+          response.json().then(data => {
+            const newChore = { ...chore, isActive: true }
+            onChoreUpdate(newChore, 'unarchive')
+          })
+        }
+      })
+    }
+
+    handleMenuClose()
+  }
 
   const handleTaskCompletion = () => {
     setIsPendingCompletion(true)
@@ -691,6 +719,12 @@ const ChoreCard = ({
                   <ViewCarousel />
                   View
                 </MenuItem>
+                <MenuItem onClick={handleArchive} color='neutral'>
+                  {chore.isActive ? <Archive /> : <Unarchive />}
+                  {chore.isActive ? 'Archive' : 'Unarchive'}
+                </MenuItem>
+                <Divider />
+
                 <MenuItem onClick={handleDelete} color='danger'>
                   <Delete />
                   Delete
diff --git a/src/views/Chores/MyChores.jsx b/src/views/Chores/MyChores.jsx
index d56588a..8a5b70e 100644
--- a/src/views/Chores/MyChores.jsx
+++ b/src/views/Chores/MyChores.jsx
@@ -272,22 +272,39 @@ const MyChores = () => {
   }
 
   const handleChoreUpdated = (updatedChore, event) => {
-    const newChores = chores.map(chore => {
+    var newChores = chores.map(chore => {
       if (chore.id === updatedChore.id) {
         return updatedChore
       }
       return chore
     })
 
-    const newFilteredChores = filteredChores.map(chore => {
+    var newFilteredChores = filteredChores.map(chore => {
       if (chore.id === updatedChore.id) {
         return updatedChore
       }
       return chore
     })
+    if (event === 'archive') {
+      newChores = newChores.filter(chore => chore.id !== updatedChore.id)
+      newFilteredChores = newFilteredChores.filter(
+        chore => chore.id !== updatedChore.id,
+      )
+      if (archivedChores !== null) {
+        setArchivedChores([...archivedChores, updatedChore])
+      }
+    }
+    if (event === 'unarchive') {
+      newChores.push(updatedChore)
+      newFilteredChores.push(updatedChore)
+      setArchivedChores(
+        archivedChores.filter(chore => chore.id !== updatedChore.id),
+      )
+    }
     setChores(newChores)
     setFilteredChores(newFilteredChores)
     setChoreSections(sectionSorter('due_date', newChores))
+
     switch (event) {
       case 'completed':
         setSnackBarMessage('Completed')
@@ -298,6 +315,12 @@ const MyChores = () => {
       case 'rescheduled':
         setSnackBarMessage('Rescheduled')
         break
+      case 'unarchive':
+        setSnackBarMessage('Unarchive')
+        break
+      case 'archive':
+        setSnackBarMessage('Archived')
+        break
       default:
         setSnackBarMessage('Updated')
     }