From cc6605168858ae819601caed0c00e2a919d9fabb Mon Sep 17 00:00:00 2001
From: theknowledgepro <ajibopromise10@gmail.com>
Date: Thu, 30 Mar 2023 03:10:16 +0100
Subject: [PATCH] Important Changes

---
 src/pages/Dashboard/Dashboard.js |  4 ++--
 src/pages/Dashboard/history_.js  | 12 ++++++-----
 src/pages/Dashboard/recent.js    | 24 ++++++++++------------
 src/store/alerts.js              | 35 +++++++++++++-------------------
 4 files changed, 34 insertions(+), 41 deletions(-)

diff --git a/src/pages/Dashboard/Dashboard.js b/src/pages/Dashboard/Dashboard.js
index 5a56067..f05d0d5 100644
--- a/src/pages/Dashboard/Dashboard.js
+++ b/src/pages/Dashboard/Dashboard.js
@@ -54,7 +54,7 @@ const Dashboard = () => {
       getData();
     }, 60000);
     return () => clearInterval(interval);
-  }, [dispatch]);
+  }, []);
   return (
     <React.Fragment>
       {/** DASHBOARD SIDEPANEL SECTION */}
@@ -208,7 +208,7 @@ const Dashboard = () => {
           boxShadow="1px 1px 2px 0 rgba(42, 141, 0, 0.3)"
         >
           <Box w="100%" fontWeight={600} p="10px" fontSize="15px">
-            Recent Collections
+            {!pathname.includes("history") ? 'Recent Collections' : 'Your Collections History'}
           </Box>
           <Outlet />
         </Box>
diff --git a/src/pages/Dashboard/history_.js b/src/pages/Dashboard/history_.js
index 339cbb6..d9db6cd 100644
--- a/src/pages/Dashboard/history_.js
+++ b/src/pages/Dashboard/history_.js
@@ -76,7 +76,7 @@ export default function Recent() {
   }, [data, token]);
   useEffect(() => {
     fetchAndUpdateData();
-  }, [fetchAndUpdateData]);
+  }, [items]);
 
   return (
     <>
@@ -105,7 +105,7 @@ export default function Recent() {
               </Tr>
             </Thead>
             <Tbody>
-              {newData?.map((item, index) => {
+              {newData?.reverse()?.map((item, index) => {
                 return (
                   <Tr key={item._id}>
                     <Td>{index + 1}</Td>
@@ -117,12 +117,13 @@ export default function Recent() {
                             onOpen();
                             setWastepic({
                               image: item.images[0],
-                              Text: item.address,
+                              address: item.address,
+                              description: item.description,
                               amount: item.quantity,
                             });
                           }}
                         >
-                          <Avatar src={item.images[0]} mr="5px" size="sm" />
+                          <Avatar borderRadius='5px' src={item.images[0]} mr="5px" size="sm" />
                           <Text my='auto'>{item.Fullname}</Text>
                         </div>
                       </Tooltip>
@@ -168,7 +169,8 @@ export default function Recent() {
             <Box>
               <Image maxH={{ base: '350px', md: '400px' }} width='100%' height='100%' src={Wastepic.image} alt="waste Picture" />
             </Box>
-            <Text mt='10px' fontWeight={600} color={useColors.appGreen}>Address: <span style={{ color: '#000' }}>{Wastepic.Text}</span></Text>
+            <Text mt='10px' fontWeight={700} color={useColors.appGreen}>Address: <span style={{ color: '#000' }}>{Wastepic.address}</span></Text>
+            <Text mt='10px' fontWeight={700} color={useColors.appGreen}>Alert Description: <span style={{ color: '#000' }}>{Wastepic.description}</span></Text>
             <Text mt='10px' fontWeight={700} color={useColors.appGreen}>Amount in Kg: <span style={{ color: '#000' }}>{Wastepic.amount}kg</span></Text>
           </ModalBody>
           <ModalFooter>
diff --git a/src/pages/Dashboard/recent.js b/src/pages/Dashboard/recent.js
index 8065bc4..42896e9 100644
--- a/src/pages/Dashboard/recent.js
+++ b/src/pages/Dashboard/recent.js
@@ -41,12 +41,6 @@ export default function Recent() {
   });
   const token = setToken();
   const [newData, SetnewData] = useState([]);
-  const OverlayOne = () => (
-    <ModalOverlay
-      bg="blackAlpha.300"
-      backdropFilter="blur(10px) hue-rotate(90deg)"
-    />
-  );
 
   const { isOpen, onOpen, onClose } = useDisclosure();
   const [Wastepic, setWastepic] = useState({});
@@ -75,10 +69,12 @@ export default function Recent() {
     });
     const newdata = await Promise.all(promises);
     SetnewData(newdata);
-  }, [data, token]);
+  }, [items, data, token]);
+
   useEffect(() => {
     fetchAndUpdateData();
-  }, [fetchAndUpdateData]);
+  }, [items]);
+
   return (
     <>
       {" "}
@@ -106,7 +102,7 @@ export default function Recent() {
               </Tr>
             </Thead>
             <Tbody>
-              {newData?.map((item, index) => {
+              {newData?.reverse()?.map((item, index) => {
                 return (
                   <Tr key={item._id}>
                     <Td>{index + 1}</Td>
@@ -118,13 +114,14 @@ export default function Recent() {
                             onOpen();
                             setWastepic({
                               image: item.images[0],
-                              Text: item.address,
+                              address: item.address,
+                              description:item.description,
                               amount: item.quantity,
                             });
                           }}
                         >
-                          <Avatar src={item.images[0]} mr="5px" size="sm" />
-                          {item.Fullname}
+                          <Avatar borderRadius='5px' src={item.images[0]} mr="5px" size="sm" />
+                          <Text my='auto'>{item.Fullname}</Text>
                         </div>
                       </Tooltip>
                     </Td>
@@ -172,7 +169,8 @@ export default function Recent() {
             <Box>
               <Image maxH={{ base: '350px', md: '400px' }} width='100%' height='100%' src={Wastepic.image} alt="waste Picture" />
             </Box>
-            <Text mt='10px' fontWeight={600} color={useColors.appGreen}>Address: <span style={{ color: '#000' }}>{Wastepic.Text}</span></Text>
+            <Text mt='10px' fontWeight={700} color={useColors.appGreen}>Address: <span style={{ color: '#000' }}>{Wastepic.address}</span></Text>
+            <Text mt='10px' fontWeight={700} color={useColors.appGreen}>Alert Description: <span style={{ color: '#000' }}>{Wastepic.description}</span></Text>
             <Text mt='10px' fontWeight={700} color={useColors.appGreen}>Amount in Kg: <span style={{ color: '#000' }}>{Wastepic.amount}kg</span></Text>
           </ModalBody>
           <ModalFooter>
diff --git a/src/store/alerts.js b/src/store/alerts.js
index 5b1f280..446f418 100644
--- a/src/store/alerts.js
+++ b/src/store/alerts.js
@@ -13,16 +13,12 @@ const Alertdata = createSlice({
   initialState: initialState,
   reducers: {
     AcceptingUpdate(state) {
-      state.Accepted = state.items
-        .filter((item) => {
-          return item.status === "accepted" && item.collectorId === state.user;
-        })
-        .reduce((initial, item) => {
-          if (item.status === "accepted") {
-            return initial + 1;
-          }
-          return initial;
-        }, 0);
+      state.Accepted = state.items.reduce((initial, item) => {
+        if (item.status === "accepted" && item.collectorId === state.user) {
+          return initial + 1;
+        }
+        return initial;
+      }, 0);
     },
     pendingUpdate(state) {
       state.pending = state.items.reduce((initial, item) => {
@@ -33,16 +29,12 @@ const Alertdata = createSlice({
       }, 0);
     },
     completedUpdate(state) {
-      state.completed = state.items
-        .filter((item) => {
-          return item.status === "collected" && item.collectorId === state.user;
-        })
-        .reduce((initial, item) => {
-          if (item.status === "collected") {
-            return initial + 1;
-          }
-          return initial;
-        }, 0);
+      state.completed = state.items.reduce((initial, item) => {
+        if (item.status === "collected" && item.collectorId === state.user) {
+          return initial + 1;
+        }
+        return initial;
+      }, 0);
     },
     update(state) {
       Alertdata.caseReducers.completedUpdate(state);
@@ -52,9 +44,9 @@ const Alertdata = createSlice({
     accepted(state, action) {
       const actions = action.payload;
       const pending = state.items.find((item) => item._id === actions.id);
-      console.log(state.items);
       if (pending?.status === "pending") {
         pending.status = "accepted";
+        pending.collectorId = state.user;
         Alertdata.caseReducers.update(state);
       }
     },
@@ -71,6 +63,7 @@ const Alertdata = createSlice({
       const pending = state.items.find((item) => item._id === actions.id);
       if (pending?.status === "accepted") {
         pending.status = "collected";
+        pending.collectorId = state.user;
         pending.updatedAt = new Date().toISOString();
         Alertdata.caseReducers.update(state);
       }