From ea2d92944f7303622dcf2e8ddfeb1cd7f7691f81 Mon Sep 17 00:00:00 2001
From: Korbinian <KorbinianK@users.noreply.github.com>
Date: Wed, 10 Jan 2024 07:34:00 +0100
Subject: [PATCH] fix(bridge-ui-v2): fixing getFilterLogs errors (#15468)

---
 .../src/components/Bridge/Amount.svelte       | 41 ++++++++++++++-----
 .../Bridge/NFTBridgeSteps/ReviewStep.svelte   |  2 +-
 .../TokenDropdown/AddCustomERC20.svelte       |  5 ++-
 .../TokenDropdown/TokenDropdown.svelte        |  9 ++--
 .../src/libs/relayer/RelayerAPIService.ts     |  6 +--
 .../src/libs/storage/BridgeTxService.ts       |  6 +--
 .../src/libs/storage/CustomTokenService.ts    |  1 +
 .../bridge-ui-v2/src/libs/token/getBalance.ts |  4 +-
 .../src/libs/util/fetchTransactionReceipt.ts  | 31 ++++++++++++++
 9 files changed, 76 insertions(+), 29 deletions(-)
 create mode 100644 packages/bridge-ui-v2/src/libs/util/fetchTransactionReceipt.ts

diff --git a/packages/bridge-ui-v2/src/components/Bridge/Amount.svelte b/packages/bridge-ui-v2/src/components/Bridge/Amount.svelte
index 1d5558ff53..ce2bdde6da 100644
--- a/packages/bridge-ui-v2/src/components/Bridge/Amount.svelte
+++ b/packages/bridge-ui-v2/src/components/Bridge/Amount.svelte
@@ -20,6 +20,7 @@
   import { getLogger } from '$libs/util/logger';
   import { uid } from '$libs/util/uid';
   import { account } from '$stores/account';
+  import { ethBalance } from '$stores/balance';
   import { network } from '$stores/network';
 
   import {
@@ -59,6 +60,8 @@
 
     const to = $recipientAddress || $account?.address;
 
+    let balanceForGasCalculation = $ethBalance;
+
     // We need all these guys to validate
     if (
       !to ||
@@ -67,9 +70,11 @@
       !$destNetwork ||
       !$tokenBalance ||
       !$selectedToken ||
+      !(balanceForGasCalculation && balanceForGasCalculation > BigInt(0)) ||
       $enteredAmount === BigInt(0) // no need to check if the amount is 0
-    )
+    ) {
       return;
+    }
 
     try {
       await checkBalanceToBridge({
@@ -77,7 +82,7 @@
         token,
         amount: $enteredAmount,
         fee,
-        balance,
+        balance: balanceForGasCalculation,
         srcChainId: $network.id,
         destChainId: $destNetwork.id,
         tokenIds:
@@ -192,6 +197,8 @@
 
     computingMaxAmount = true;
 
+    const balance = determineBalance();
+
     try {
       let maxAmount;
 
@@ -228,15 +235,27 @@
     }
   }
 
-  $: balance = $tokenBalance
-    ? typeof $tokenBalance === 'bigint'
-      ? $tokenBalance > BigInt(0)
-        ? $tokenBalance
-        : BigInt(0) // ERC721/1155
-      : 'value' in $tokenBalance && $tokenBalance.value > BigInt(0)
-        ? $tokenBalance.value
-        : BigInt(0) // ERC20
-    : BigInt(0);
+  const determineBalance = () => {
+    let balance = 0n;
+    if (!$selectedToken) return balance;
+    const type = $selectedToken.type;
+    switch (type) {
+      case TokenType.ERC20:
+        if (typeof $tokenBalance === 'bigint') break;
+        if ($tokenBalance?.value) balance = $tokenBalance.value;
+        break;
+      case TokenType.ETH:
+        balance = $ethBalance;
+        break;
+      case TokenType.ERC721:
+      case TokenType.ERC1155:
+        if (typeof $tokenBalance === 'bigint') balance = $tokenBalance;
+        break;
+      default:
+        break;
+    }
+    return balance;
+  };
 
   $: if (inputBox && sanitizedValue !== inputBox.getValue()) {
     inputBox.setValue(sanitizedValue); // Update InputBox value if sanitizedValue changes
diff --git a/packages/bridge-ui-v2/src/components/Bridge/NFTBridgeSteps/ReviewStep.svelte b/packages/bridge-ui-v2/src/components/Bridge/NFTBridgeSteps/ReviewStep.svelte
index f5c95f09ec..7ac1bdab80 100644
--- a/packages/bridge-ui-v2/src/components/Bridge/NFTBridgeSteps/ReviewStep.svelte
+++ b/packages/bridge-ui-v2/src/components/Bridge/NFTBridgeSteps/ReviewStep.svelte
@@ -44,7 +44,7 @@
   $: isERC1155 = $selectedNFTs ? $selectedNFTs.some((nft) => nft.type === 'ERC1155') : false;
 </script>
 
-<div class="container mx-auto inline-block align-middle space-y-[25px] mt-[30px]">
+<div class="container mx-auto inline-block align-middle space-y-[25px] w-full md:w-[524px] mt-[30px]">
   <div class="flex justify-between mb-2 items-center">
     <div class="font-bold text-primary-content">{$t('bridge.nft.step.review.transfer_details')}</div>
   </div>
diff --git a/packages/bridge-ui-v2/src/components/TokenDropdown/AddCustomERC20.svelte b/packages/bridge-ui-v2/src/components/TokenDropdown/AddCustomERC20.svelte
index bcc564e3cc..857189e2bd 100644
--- a/packages/bridge-ui-v2/src/components/TokenDropdown/AddCustomERC20.svelte
+++ b/packages/bridge-ui-v2/src/components/TokenDropdown/AddCustomERC20.svelte
@@ -18,6 +18,7 @@
   import { getLogger } from '$libs/util/logger';
   import { uid } from '$libs/util/uid';
   import { account } from '$stores/account';
+  import { network } from '$stores/network';
 
   import { destNetwork } from '../Bridge/state';
 
@@ -44,7 +45,7 @@
       tokenService.storeToken(customToken, $account?.address as Address);
       customTokens = tokenService.getTokens($account?.address as Address);
 
-      const { chain: srcChain } = getNetwork();
+      const srcChain = $network;
       const destChain = $destNetwork;
 
       if (!srcChain || !destChain) return;
@@ -119,7 +120,7 @@
       return;
     }
 
-    const { chain: srcChain } = getNetwork();
+    const srcChain = $network;
     if (!srcChain) return;
     try {
       const token = await getTokenWithInfoFromAddress({
diff --git a/packages/bridge-ui-v2/src/components/TokenDropdown/TokenDropdown.svelte b/packages/bridge-ui-v2/src/components/TokenDropdown/TokenDropdown.svelte
index efa237644c..c9048d8605 100644
--- a/packages/bridge-ui-v2/src/components/TokenDropdown/TokenDropdown.svelte
+++ b/packages/bridge-ui-v2/src/components/TokenDropdown/TokenDropdown.svelte
@@ -1,5 +1,5 @@
 <script lang="ts">
-  import { type Address, getNetwork } from '@wagmi/core';
+  import type { Address } from '@wagmi/core';
   import { onDestroy } from 'svelte';
   import { t } from 'svelte-i18n';
 
@@ -12,6 +12,7 @@
   import { getCrossChainAddress } from '$libs/token/getCrossChainAddress';
   import { uid } from '$libs/util/uid';
   import { account } from '$stores/account';
+  import { network } from '$stores/network';
 
   import { destNetwork } from '../Bridge/state';
   import DialogView from './DialogView.svelte';
@@ -64,12 +65,12 @@
   };
 
   const selectToken = async (token: Token) => {
-    const { chain } = getNetwork();
+    const srcChain = $network;
     const destChain = $destNetwork;
 
     // In order to select a token, we only need the source chain to be selected,
     // unless it's an imported token...
-    if (!chain) {
+    if (!srcChain) {
       warningToast({ title: $t('messages.network.required') });
       return;
     }
@@ -88,7 +89,7 @@
       try {
         bridgedAddress = await getCrossChainAddress({
           token,
-          srcChainId: chain.id,
+          srcChainId: srcChain.id,
           destChainId: destChain.id,
         });
       } catch (error) {
diff --git a/packages/bridge-ui-v2/src/libs/relayer/RelayerAPIService.ts b/packages/bridge-ui-v2/src/libs/relayer/RelayerAPIService.ts
index 62a5fd74bd..4ccdb11436 100644
--- a/packages/bridge-ui-v2/src/libs/relayer/RelayerAPIService.ts
+++ b/packages/bridge-ui-v2/src/libs/relayer/RelayerAPIService.ts
@@ -9,8 +9,8 @@ import { apiService } from '$config';
 import type { BridgeTransaction, MessageStatus } from '$libs/bridge';
 import { isSupportedChain } from '$libs/chain';
 import { TokenType } from '$libs/token';
+import { fetchTransactionReceipt } from '$libs/util/fetchTransactionReceipt';
 import { getLogger } from '$libs/util/logger';
-import { publicClient } from '$libs/wagmi';
 
 import type {
   APIRequestParams,
@@ -36,9 +36,7 @@ export class RelayerAPIService {
   //Todo: duplicate code in BridgeTxService
   private static async _getTransactionReceipt(chainId: number, hash: Hash) {
     try {
-      const client = publicClient({ chainId });
-      const receipt = await client.getTransactionReceipt({ hash });
-      return receipt;
+      return await fetchTransactionReceipt(hash, chainId);
     } catch (error) {
       log(`Error getting transaction receipt for ${hash}: ${error}`);
       return null;
diff --git a/packages/bridge-ui-v2/src/libs/storage/BridgeTxService.ts b/packages/bridge-ui-v2/src/libs/storage/BridgeTxService.ts
index df08d3a682..1c088a436e 100644
--- a/packages/bridge-ui-v2/src/libs/storage/BridgeTxService.ts
+++ b/packages/bridge-ui-v2/src/libs/storage/BridgeTxService.ts
@@ -6,6 +6,7 @@ import { routingContractsMap } from '$bridgeConfig';
 import { pendingTransaction, storageService } from '$config';
 import { type BridgeTransaction, MessageStatus } from '$libs/bridge';
 import { isSupportedChain } from '$libs/chain';
+import { fetchTransactionReceipt } from '$libs/util/fetchTransactionReceipt';
 import { jsonParseWithDefault } from '$libs/util/jsonParseWithDefault';
 import { getLogger } from '$libs/util/logger';
 import { publicClient } from '$libs/wagmi';
@@ -23,11 +24,8 @@ export class BridgeTxService {
 
   //Todo: duplicate code in RelayerAPIService
   private static async _getTransactionReceipt(chainId: number, hash: Hash) {
-    log(`Getting transaction receipt for ${hash} on chain ${chainId}`);
     try {
-      const client = publicClient({ chainId });
-      const receipt = await client.getTransactionReceipt({ hash });
-      return receipt;
+      return await fetchTransactionReceipt(hash, chainId);
     } catch (error) {
       log(`Error getting transaction receipt for ${hash}: ${error}`);
       return null;
diff --git a/packages/bridge-ui-v2/src/libs/storage/CustomTokenService.ts b/packages/bridge-ui-v2/src/libs/storage/CustomTokenService.ts
index 3bb4afee06..fdc0e3c107 100644
--- a/packages/bridge-ui-v2/src/libs/storage/CustomTokenService.ts
+++ b/packages/bridge-ui-v2/src/libs/storage/CustomTokenService.ts
@@ -31,6 +31,7 @@ export class CustomTokenService implements TokenService {
       doesTokenAlreadyExist = tokens.findIndex((tokenFromStorage) => tokenFromStorage.symbol === token.symbol) >= 0;
     }
     if (!doesTokenAlreadyExist) {
+      token.imported = true;
       tokens.push(token);
     }
 
diff --git a/packages/bridge-ui-v2/src/libs/token/getBalance.ts b/packages/bridge-ui-v2/src/libs/token/getBalance.ts
index feeb240b3b..0af4a5bb36 100644
--- a/packages/bridge-ui-v2/src/libs/token/getBalance.ts
+++ b/packages/bridge-ui-v2/src/libs/token/getBalance.ts
@@ -17,7 +17,7 @@ const log = getLogger('token:getBalance');
 
 export async function getBalance({ userAddress, token, srcChainId, destChainId }: GetBalanceArgs) {
   let tokenBalance: FetchBalanceResult;
-
+  log('getBalance', { userAddress, token, srcChainId, destChainId });
   if (!token || token.type === TokenType.ETH) {
     // If no token is passed in, we assume is ETH
     tokenBalance = await fetchBalance({ address: userAddress, chainId: srcChainId });
@@ -37,8 +37,6 @@ export async function getBalance({ userAddress, token, srcChainId, destChainId }
       chainId: srcChainId,
     });
   }
-
   log('Token balance', tokenBalance);
-
   return tokenBalance;
 }
diff --git a/packages/bridge-ui-v2/src/libs/util/fetchTransactionReceipt.ts b/packages/bridge-ui-v2/src/libs/util/fetchTransactionReceipt.ts
new file mode 100644
index 0000000000..c94b46f42a
--- /dev/null
+++ b/packages/bridge-ui-v2/src/libs/util/fetchTransactionReceipt.ts
@@ -0,0 +1,31 @@
+import type { Hash } from 'viem';
+
+import { chains } from '$libs/chain';
+
+export async function fetchTransactionReceipt(transactionHash: Hash, chainId: number) {
+  try {
+    const nodeUrl = chains.find((c) => c.id === chainId)?.rpcUrls?.public?.http[0];
+    if (!nodeUrl) {
+      throw new Error('Node URL not found');
+    }
+
+    const response = await fetch(nodeUrl, {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify({
+        jsonrpc: '2.0',
+        method: 'eth_getTransactionReceipt',
+        params: [transactionHash],
+        id: 1,
+      }),
+    });
+
+    const data = await response.json();
+    return data.result;
+  } catch (error) {
+    console.error('Error fetching transaction receipt:', error);
+    throw error;
+  }
+}