Fix display bug caused by flipping inputs on SwapCreateScene

Because we're flipping the wallets and the amounts for each SwapInput
component and each strategy to change this state is mixed between
imperative and declarative, we converge with incorrect state. This is
because the imperative change to the amounts happens to the SwapInput
before it's wallet state is change (which is the declarative state
change). Ultimately the mix of two techniques on state management is
the cause of the bug.

The solution is to add a delay to the imperative change, to allow for
the component's state to be updated before making the imperative
changes.

Author: samholmes

CHANGELOG.md

@@ -15,6 +15,7 @@
 - fixed: Default swap pair logic from the trade modal was not prioritizing mainnet assets
 - fixed: "FIO Address does not exist" error after transferring a FIO name
 - fixed: Fix incorrect string comparison resulting in wrong rate used for 24 change calculation
+- fixed: Crypto amount display bug after flipping the wallet input on `SwapCreateScne`
 - removed: 'fasterpayments' payment type
 - removed: Turking bank transfer support
 

src/components/scenes/SwapCreateScene.tsx

@@ -215,13 +215,17 @@ export const SwapCreateScene = (props: Props) => {
     setInputNativeAmountFor(inputNativeAmountFor === 'from' ? 'to' : 'from')
 
     // Swap the amounts:
-    if (inputNativeAmountFor === 'from') {
-      fromInputRef.current?.setAmount('fiat', '0')
-      toInputRef.current?.setAmount('fiat', inputFiatAmount)
-    } else {
-      toInputRef.current?.setAmount('fiat', '0')
-      fromInputRef.current?.setAmount('fiat', inputFiatAmount)
-    }
+    // Use setTimeout to allow the component's state to change before making
+    // the imperative state changes.
+    setTimeout(() => {
+      if (inputNativeAmountFor === 'from') {
+        fromInputRef.current?.setAmount('fiat', '0')
+        toInputRef.current?.setAmount('fiat', inputFiatAmount)
+      } else {
+        toInputRef.current?.setAmount('fiat', '0')
+        fromInputRef.current?.setAmount('fiat', inputFiatAmount)
+      }
+    }, 0)
   })
 
   const handleSelectWallet = useHandler(async (walletId: string, tokenId: EdgeTokenId, direction: 'from' | 'to') => {