fix: regenerate the unsignedTx with correct stxAddress after switch a…

…ccount
secretkeylabs · Dec 20, 2023 · e3d235d · e3d235d
1 parent 4855207
commit e3d235d
Show file tree

Hide file tree

Showing 4 changed files with 73 additions and 42 deletions.
diff --git a/src/app/components/transactionSetting/editNonce.tsx b/src/app/components/transactionSetting/editNonce.tsx
@@ -58,7 +58,7 @@ function EditNonce({ nonce, setNonce }: Props) {
 
   useEffect(() => {
     setNonce(nonceInput);
-  }, [nonceInput]);
+  }, [nonceInput, setNonce]);
 
   return (
     <NonceContainer>

diff --git a/src/app/hooks/queries/useStxWalletData.ts b/src/app/hooks/queries/useStxWalletData.ts
@@ -7,6 +7,7 @@ import { useDispatch } from 'react-redux';
 import useNetworkSelector from '../useNetwork';
 import useWalletSelector from '../useWalletSelector';
 
+// TODO refactor: no need to put this in store. use this hook instead
 export const useStxWalletData = () => {
   const dispatch = useDispatch();
   const { stxAddress } = useWalletSelector();

diff --git a/src/app/screens/transactionRequest/index.tsx b/src/app/screens/transactionRequest/index.tsx
@@ -39,7 +39,6 @@ function TransactionRequest() {
   const [coinsMetaData, setCoinsMetaData] = useState<Coin[] | null>(null);
   const [codeBody, setCodeBody] = useState(undefined);
   const [contractName, setContractName] = useState(undefined);
-  const [hasSwitchedAccount, setHasSwitchedAccount] = useState(false);
   const [attachment, setAttachment] = useState<Buffer | undefined>(undefined);
 
   const handleTokenTransferRequest = async () => {
@@ -57,7 +56,7 @@ function TransactionRequest() {
     navigate('/confirm-stx-tx', {
       state: {
         unsignedTx: unsignedSendStxTx.serialize().toString('hex'),
-        sponosred: payload.sponsored,
+        sponsored: payload.sponsored,
         isBrowserTx: true,
         tabId,
         requestToken,
@@ -107,58 +106,58 @@ function TransactionRequest() {
     setContractName(response.contractName);
   };
 
-  const switchAccountBasedOnRequest = () => {
-    if (getNetworkType(payload.network) !== network.type) {
-      navigate('/tx-status', {
-        state: {
-          txid: '',
-          currency: 'STX',
-          error:
-            'There’s a mismatch between your active network and the network you’re logged with.',
-          browserTx: true,
-        },
-      });
-      return;
+  const createRequestTx = async () => {
+    try {
+      if (payload.txType === 'token_transfer') {
+        await handleTokenTransferRequest();
+      } else if (payload.txType === 'contract_call') {
+        await handleContractCallRequest();
+      } else if (payload.txType === 'smart_contract') {
+        await handleContractDeployRequest();
+      }
+    } catch (e: unknown) {
+      console.log(e);
     }
-    if (payload.stxAddress !== selectedAccount?.stxAddress && !isHardwareAccount(selectedAccount)) {
-      const account = accountsList.find((acc) => acc.stxAddress === payload.stxAddress);
-      if (account) {
-        switchAccount(account);
-      } else {
+  };
+
+  createRequestTx();
+
+  useEffect(() => {
+    const switchAccountBasedOnRequest = () => {
+      if (getNetworkType(payload.network) !== network.type) {
         navigate('/tx-status', {
           state: {
             txid: '',
             currency: 'STX',
             error:
-              'There’s a mismatch between your active  address and the address you’re logged with.',
+              'There’s a mismatch between your active network and the network you’re logged with.',
             browserTx: true,
           },
         });
+        return;
       }
-    }
-    setHasSwitchedAccount(true);
-  };
-
-  const createRequestTx = async () => {
-    try {
-      if (hasSwitchedAccount) {
-        if (payload.txType === 'token_transfer') {
-          await handleTokenTransferRequest();
-        } else if (payload.txType === 'contract_call') {
-          await handleContractCallRequest();
-        } else if (payload.txType === 'smart_contract') {
-          await handleContractDeployRequest();
+      if (
+        payload.stxAddress !== selectedAccount?.stxAddress &&
+        !isHardwareAccount(selectedAccount)
+      ) {
+        const account = accountsList.find((acc) => acc.stxAddress === payload.stxAddress);
+        if (account) {
+          switchAccount(account);
+        } else {
+          navigate('/tx-status', {
+            state: {
+              txid: '',
+              currency: 'STX',
+              error:
+                'There’s a mismatch between your active  address and the address you’re logged with.',
+              browserTx: true,
+            },
+          });
         }
       }
-    } catch (e: unknown) {
-      console.log(e);
-    }
-  };
-
-  useEffect(() => {
+    };
     switchAccountBasedOnRequest();
-    createRequestTx();
-  }, [hasSwitchedAccount]);
+  }, [accountsList, network.type, navigate, payload, selectedAccount, switchAccount]);
 
   return (
     <>

diff --git a/src/app/stores/wallet/reducer.ts b/src/app/stores/wallet/reducer.ts
@@ -31,6 +31,37 @@ import {
   WalletState,
 } from './actions/types';
 
+/*
+ * This store should ONLY be used for global app settings such as:
+ *  - hasActivatedOrdinalsKey: undefined,
+ *  - hasActivatedRareSatsKey: undefined,
+ *  - hasActivatedRBFKey: true,
+ *  - rareSatsNoticeDismissed: undefined,
+ *  - showBtcReceiveAlert: true,
+ *  - showOrdinalReceiveAlert: true,
+ *  - showDataCollectionAlert: true,
+ *  - btcApiUrl: '',
+ *  - selectedAccount: null,
+ *  - accountType: 'software',
+ *  - accountName: undefined,
+ *  - walletLockPeriod: WalletSessionPeriods.STANDARD,
+ *  - isUnlocked: false,
+ *  - fiatCurrency: 'USD',
+ *
+ * because we get many bugs around caching the wrong values when switching accounts,
+ * we prefer react-query cache (with the correct cache keys) for all
+ * account-specific values, and API fetch results such as:
+ *  - btcFiatRate: '0',
+ *  - stxBtcRate: '0',
+ *  - stxBalance: '0',
+ *  - stxAvailableBalance: '0',
+ *  - stxLockedBalance: '0',
+ *  - stxNonce: 0,
+ *  - btcBalance: '0',
+ *  - feeMultipliers: null,
+ *
+ * TODO refactor most of these values out of the store and use query cache instead
+ */
 const initialWalletState: WalletState = {
   stxAddress: '',
   btcAddress: '',