From 531fb4e0ebe1c537d4f899972a4c69d8b9f2a3cb Mon Sep 17 00:00:00 2001
From: Dmytro <dmitry.tkk@gmail.com>
Date: Mon, 9 Dec 2024 16:12:03 +0000
Subject: [PATCH] Add handler for address change - reset state, add unfinished
 to history

---
 src/components/History.tsx                | 14 +++++++-------
 src/components/WidgetBody.tsx             |  5 +++++
 src/core/interfaces/TransactionHistory.ts |  2 +-
 src/store/MetaportState.ts                |  2 ++
 src/store/MetaportStore.ts                | 23 +++++++++++++++++++++++
 5 files changed, 38 insertions(+), 8 deletions(-)

diff --git a/src/components/History.tsx b/src/components/History.tsx
index 8a643b1..d5d0ebe 100644
--- a/src/components/History.tsx
+++ b/src/components/History.tsx
@@ -165,8 +165,8 @@ export default function History(props: { size?: interfaces.SimplifiedSize }) {
                   <p
                     className={cls(
                       cmn.p,
-                      [cmn.p3, size == 'sm'],
-                      [cmn.p2, size == 'md'],
+                      [cmn.p3, size === 'sm'],
+                      [cmn.p2, size === 'md'],
                       cmn.p600,
                       cmn.cap,
                       cmn.pPrim,
@@ -174,14 +174,14 @@ export default function History(props: { size?: interfaces.SimplifiedSize }) {
                       cmn.flexg
                     )}
                   >
-                    •{' '}
-                    {transfer.address.substring(0, 6) +
-                      '...' +
-                      transfer.address.substring(transfer.address.length - 4)}
+                    {transfer.address !== undefined
+                      ? `• ${transfer.address.substring(0, 6)}...${transfer.address.substring(
+                          transfer.address.length - 4
+                        )}`
+                      : '• UNFINISHED'}
                   </p>
                 </div>
               </div>
-
               <SkPaper gray>
                 {transfer.transactions.map((transactionData: interfaces.TransactionHistory) => (
                   <TransactionData
diff --git a/src/components/WidgetBody.tsx b/src/components/WidgetBody.tsx
index e4d4232..0137609 100644
--- a/src/components/WidgetBody.tsx
+++ b/src/components/WidgetBody.tsx
@@ -54,6 +54,7 @@ export function WidgetBody(props) {
   const tokenBalances = useMetaportStore((state) => state.tokenBalances)
 
   const transferInProgress = useMetaportStore((state) => state.transferInProgress)
+  const addressChanged = useMetaportStore((state) => state.addressChanged)
 
   const theme = useUIStore((state) => state.theme)
 
@@ -64,6 +65,10 @@ export function WidgetBody(props) {
     setChainName2(mpc.config.chains ? mpc.config.chains[1] : '')
   }, [])
 
+  useEffect(() => {
+    addressChanged()
+  }, [address])
+
   useEffect(() => {
     if (tokens && !token) {
       if (tokens.erc20 && Object.values(tokens.erc20)[0]) {
diff --git a/src/core/interfaces/TransactionHistory.ts b/src/core/interfaces/TransactionHistory.ts
index f5399ca..d2db612 100644
--- a/src/core/interfaces/TransactionHistory.ts
+++ b/src/core/interfaces/TransactionHistory.ts
@@ -33,7 +33,7 @@ export interface TransactionHistory {
 export interface TransferHistory {
   transactions: TransactionHistory[]
   tokenKeyname: string
-  address: AddressType
+  address: AddressType | undefined
   chainName1: string
   chainName2: string
   amount: string
diff --git a/src/store/MetaportState.ts b/src/store/MetaportState.ts
index a4b3e6b..67fcd86 100644
--- a/src/store/MetaportState.ts
+++ b/src/store/MetaportState.ts
@@ -73,6 +73,8 @@ export interface MetaportState {
   setChainName1: (name: string) => void
   setChainName2: (name: string) => void
 
+  addressChanged: () => void
+
   appName1: string
   appName2: string
 
diff --git a/src/store/MetaportStore.ts b/src/store/MetaportStore.ts
index d2ef645..0b231c8 100644
--- a/src/store/MetaportStore.ts
+++ b/src/store/MetaportStore.ts
@@ -252,6 +252,29 @@ export const useMetaportStore = create<MetaportState>()((set, get) => ({
     set(get().mpc.chainChanged(get().chainName1, name, get().token))
   },
 
+  addressChanged: () => {
+    if (get().currentStep !== 0) {
+      get().setTransfersHistory([
+        ...get().transfersHistory,
+        {
+          transactions: get().transactionsHistory,
+          chainName1: get().chainName1,
+          chainName2: get().chainName2,
+          amount: get().amount,
+          tokenKeyname: get().token.keyname,
+          address: undefined
+        }
+      ])
+    }
+    set({
+      tokenBalances: {},
+      wrappedTokenBalances: {},
+      currentStep: 0,
+      amount: '',
+      transferInProgress: false
+    })
+  },
+
   tokens: getEmptyTokenDataMap(),
 
   token: null,