From f495e406633fc9349e8d3a125c463c0be1e15b66 Mon Sep 17 00:00:00 2001
From: Korbinian <KorbinianK@users.noreply.github.com>
Date: Tue, 23 Jul 2024 08:33:58 +0200
Subject: [PATCH] fix(bridge-ui): balance visually not updating correctly when
 switching chains (#17832)

---
 .../ImportStep/TokenInput/TokenInput.svelte   | 21 +++++++++++++++++--
 1 file changed, 19 insertions(+), 2 deletions(-)

diff --git a/packages/bridge-ui/src/components/Bridge/FungibleBridgeComponents/ImportStep/TokenInput/TokenInput.svelte b/packages/bridge-ui/src/components/Bridge/FungibleBridgeComponents/ImportStep/TokenInput/TokenInput.svelte
index 58d641e62d..0d66940616 100644
--- a/packages/bridge-ui/src/components/Bridge/FungibleBridgeComponents/ImportStep/TokenInput/TokenInput.svelte
+++ b/packages/bridge-ui/src/components/Bridge/FungibleBridgeComponents/ImportStep/TokenInput/TokenInput.svelte
@@ -34,7 +34,7 @@
   import { debounce } from '$libs/util/debounce';
   import { getLogger } from '$libs/util/logger';
   import { truncateDecimal } from '$libs/util/truncateDecimal';
-  import { account } from '$stores/account';
+  import { type Account, account } from '$stores/account';
   import { ethBalance } from '$stores/balance';
   import { connectedSourceChain } from '$stores/network';
   import type { TokenInfo } from '$stores/tokenInfo';
@@ -126,11 +126,13 @@
     if ($account && $account.address && $account?.isConnected && $selectedToken) {
       validateAmount($selectedToken);
       refreshUserBalance();
+      log('fetching on chain', $connectedSourceChain?.name);
       $tokenBalance = await fetchBalance({
         userAddress: $account.address,
         token: $selectedToken,
         srcChainId: $connectedSourceChain?.id,
       });
+      log('tokenBalance', $tokenBalance);
       previousSelectedToken = $selectedToken;
     } else {
       balance = '0.00';
@@ -259,6 +261,21 @@
     const token = $selectedToken;
     if (!user || !token) return;
   });
+
+  const onAccountChange = async (newAccount: Account, oldAccount?: Account) => {
+    log('onAccountChange', newAccount, oldAccount);
+    if (newAccount?.isConnected && newAccount.address && newAccount.address !== oldAccount?.address) {
+      log('resetting input');
+      reset();
+    } else if (newAccount.address && newAccount?.isConnected && $selectedToken) {
+      log('refreshing user balance', $connectedSourceChain?.name);
+      $tokenBalance = await fetchBalance({
+        userAddress: newAccount.address,
+        token: $selectedToken,
+        srcChainId: newAccount.chainId,
+      });
+    }
+  };
 </script>
 
 <div class="TokenInput space-y-[8px]">
@@ -325,7 +342,7 @@
   </div>
 </div>
 
-<OnAccount change={reset} />
+<OnAccount change={onAccountChange} />
 
 <style>
   .max-button {