From e93cc24dbf087ac0792ef63aafcf47a527066d3a Mon Sep 17 00:00:00 2001
From: Gabriel Cavalcante <gabriel.cavalcant.pb@compasso.com.br>
Date: Sat, 9 Nov 2024 23:03:39 -0300
Subject: [PATCH] =?UTF-8?q?feat:=20edi=C3=A7=C3=A3o=20de=20movimenta=C3=A7?=
 =?UTF-8?q?=C3=B5es?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 context/MovimentationCtx.tsx           | 32 ++++++++++++++++++++++++++
 src/App.tsx                            |  2 ++
 src/components/ReceivedTable/index.tsx | 26 ++++++++++++++++++++-
 src/components/SpentTable/index.tsx    | 21 +++++++++++++++++
 src/main.tsx                           | 17 ++++++++------
 5 files changed, 90 insertions(+), 8 deletions(-)

diff --git a/context/MovimentationCtx.tsx b/context/MovimentationCtx.tsx
index f72e545..4853778 100644
--- a/context/MovimentationCtx.tsx
+++ b/context/MovimentationCtx.tsx
@@ -12,6 +12,7 @@ interface IMovimentationCtx {
   spentValues: IMovimentation[];
   addMovimentation: (movimentation: IMovimentation) => void;
   removeMovimentation: (id: string) => void;
+  editMovimentation: (id: string, mov: IMovimentation) => void;
 }
 
 const Movimentation = createContext<IMovimentationCtx | undefined>(undefined);
@@ -100,6 +101,36 @@ const MovimentationProvider = ({ children }: { children: ReactNode }) => {
     }
   };
 
+  const editMovimentation = (id: string, mov: IMovimentation) => {
+    const { date, reason, value } = mov;
+
+    const formatDate = (dateStr: string) => {
+      const [day, month, year] = dateStr.split("-");
+      return `${year}/${month}/${day}`;
+    };
+
+    const treatedDate = formatDate(date as string);
+
+    const updatedReceivedValues = receivedValues.map((receivedValue) =>
+      receivedValue.id === id
+        ? { ...receivedValue, date: treatedDate, reason, value }
+        : receivedValue
+    );
+
+    const updatedSpentValues = spentValues.map((spentValue) =>
+      spentValue.id === id
+        ? { ...spentValue, date: treatedDate, reason, value }
+        : spentValue
+    );
+
+    // Atualiza o estado e salva no storage
+    setReceivedValues(updatedReceivedValues);
+    setSpentValues(updatedSpentValues);
+
+    saveToStorage("receivedValues", updatedReceivedValues);
+    saveToStorage("spentValues", updatedSpentValues);
+  };
+
   return (
     <Movimentation.Provider
       value={{
@@ -107,6 +138,7 @@ const MovimentationProvider = ({ children }: { children: ReactNode }) => {
         spentValues,
         addMovimentation,
         removeMovimentation,
+        editMovimentation,
       }}
     >
       {children}
diff --git a/src/App.tsx b/src/App.tsx
index f041473..8275b13 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -4,6 +4,7 @@ import Header from "./components/Header";
 import Informations from "./components/Informations";
 import ReceivedTable from "./components/ReceivedTable";
 import RemoveModal from "./components/RemoveModal";
+import EditModal from "./components/EditModal";
 import SpentTable from "./components/SpentTable";
 
 const App = () => {
@@ -31,6 +32,7 @@ const App = () => {
         </section>
         <AddModal />
         <RemoveModal />
+        <EditModal />
       </main>
       <Footer />
     </>
diff --git a/src/components/ReceivedTable/index.tsx b/src/components/ReceivedTable/index.tsx
index 6cc24d1..8779930 100644
--- a/src/components/ReceivedTable/index.tsx
+++ b/src/components/ReceivedTable/index.tsx
@@ -1,6 +1,7 @@
 import { useRef } from "react";
 import BodyRow from "../Table/BodyRow";
 import RemoveButton from "../RemoveButton";
+import EditButton from "../EditButton";
 import TableButtonWrapper from "../Table/TableButtonWrapper";
 import Td from "../Table/Td";
 import Th from "../Table/Th";
@@ -10,11 +11,15 @@ import { MovimentationType } from "../../../utils/enums/movimentationType";
 import { useCurrentRemoveTarget } from "../../../context/CurrentRemoveTargetCtx";
 import { useMovimentation } from "../../../context/MovimentationCtx";
 import { useOpenCloseRemoveModal } from "../../../context/OpenCloseRemoveModalCtx";
+import { useOpenCloseEditModal } from "../../../context/OpenCloseEditModalCtx";
+import { useCurrentMovimentation } from "../../../context/CurrentMovimentationCtx";
 
 const ReceivedTable = () => {
   const { openRemoveModal } = useOpenCloseRemoveModal();
-  const { receivedValues } = useMovimentation();
+  const { openEditModal } = useOpenCloseEditModal();
   const { setRemoveTargetID } = useCurrentRemoveTarget();
+  const { setCurrentMovimentation } = useCurrentMovimentation();
+  const { receivedValues } = useMovimentation();
   const trRefs = useRef<(HTMLTableRowElement | null)[]>([]);
 
   const removeMovimentation = (index: number) => {
@@ -22,6 +27,21 @@ const ReceivedTable = () => {
     openRemoveModal();
   };
 
+  const editMovimentation = (index: number) => {
+    openEditModal();
+
+    const treatedDate = String(receivedValues[index].date).split("/");
+    const newDate = `${treatedDate[2]}-${treatedDate[1]}-${treatedDate[0]}`;
+
+    setCurrentMovimentation({
+      id: receivedValues[index].id,
+      date: newDate,
+      value: receivedValues[index].value,
+      reason: receivedValues[index].reason,
+      type: receivedValues[index].type,
+    });
+  };
+
   const setRef = (el: HTMLTableRowElement | null, index: number) =>
     (trRefs.current[index] = el);
 
@@ -58,6 +78,10 @@ const ReceivedTable = () => {
                         index={index}
                         handleClick={removeMovimentation}
                       />
+                      <EditButton
+                        index={index}
+                        handleClick={editMovimentation}
+                      />
                     </TableButtonWrapper>
                   </Td>
                 </BodyRow>
diff --git a/src/components/SpentTable/index.tsx b/src/components/SpentTable/index.tsx
index 932ed46..f0c42b6 100644
--- a/src/components/SpentTable/index.tsx
+++ b/src/components/SpentTable/index.tsx
@@ -1,6 +1,7 @@
 import { useRef } from "react";
 import BodyRow from "../Table/BodyRow";
 import RemoveButton from "../RemoveButton";
+import EditButton from "../EditButton";
 import TableButtonWrapper from "../Table/TableButtonWrapper";
 import Td from "../Table/Td";
 import Th from "../Table/Th";
@@ -10,10 +11,14 @@ import { MovimentationType } from "../../../utils/enums/movimentationType";
 import { useCurrentRemoveTarget } from "../../../context/CurrentRemoveTargetCtx";
 import { useMovimentation } from "../../../context/MovimentationCtx";
 import { useOpenCloseRemoveModal } from "../../../context/OpenCloseRemoveModalCtx";
+import { useOpenCloseEditModal } from "../../../context/OpenCloseEditModalCtx";
+import { useCurrentMovimentation } from "../../../context/CurrentMovimentationCtx";
 
 const SpentTable = () => {
   const { openRemoveModal } = useOpenCloseRemoveModal();
+  const { openEditModal } = useOpenCloseEditModal();
   const { setRemoveTargetID } = useCurrentRemoveTarget();
+  const { setCurrentMovimentation } = useCurrentMovimentation();
   const { spentValues } = useMovimentation();
   const trRefs = useRef<(HTMLTableRowElement | null)[]>([]);
 
@@ -22,6 +27,21 @@ const SpentTable = () => {
     openRemoveModal();
   };
 
+  const editMovimentation = (index: number) => {
+    openEditModal();
+
+    const treatedDate = String(spentValues[index].date).split("/");
+    const newDate = `${treatedDate[2]}-${treatedDate[1]}-${treatedDate[0]}`;
+
+    setCurrentMovimentation({
+      id: spentValues[index].id,
+      date: newDate,
+      value: spentValues[index].value,
+      reason: spentValues[index].reason,
+      type: spentValues[index].type,
+    });
+  };
+
   const setRef = (el: HTMLTableRowElement | null, index: number) =>
     (trRefs.current[index] = el);
 
@@ -57,6 +77,7 @@ const SpentTable = () => {
                       index={index}
                       handleClick={removeMovimentation}
                     />
+                    <EditButton index={index} handleClick={editMovimentation} />
                   </TableButtonWrapper>
                 </Td>
               </BodyRow>
diff --git a/src/main.tsx b/src/main.tsx
index 1349033..da2106c 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -7,18 +7,21 @@ import { CurrentRemoveTargetProvider } from "../context/CurrentRemoveTargetCtx.t
 import { MovimentationProvider } from "../context/MovimentationCtx.tsx";
 import { OpenCloseAddModalProvider } from "../context/OpenCloseAddModalCtx.tsx";
 import { OpenCloseRemoveModalProvider } from "../context/OpenCloseRemoveModalCtx.tsx";
+import { OpenCloseEditModalProvider } from "../context/OpenCloseEditModalCtx.tsx";
 
 createRoot(document.getElementById("root")!).render(
   <StrictMode>
     <MovimentationProvider>
       <OpenCloseAddModalProvider>
-        <OpenCloseRemoveModalProvider>
-          <CurrentMovimentationProvider>
-            <CurrentRemoveTargetProvider>
-              <App />
-            </CurrentRemoveTargetProvider>
-          </CurrentMovimentationProvider>
-        </OpenCloseRemoveModalProvider>
+      	<OpenCloseEditModalProvider>
+		      <OpenCloseRemoveModalProvider>
+		        <CurrentMovimentationProvider>
+		          <CurrentRemoveTargetProvider>
+		            <App />
+		          </CurrentRemoveTargetProvider>
+		        </CurrentMovimentationProvider>
+		      </OpenCloseRemoveModalProvider>
+      	</OpenCloseEditModalProvider>
       </OpenCloseAddModalProvider>
     </MovimentationProvider>
   </StrictMode>