chore(bridge-ui-v2): update and fix typescript-linting (#15372)

taikoxyz · Dec 11, 2023 · 0ece27d · 0ece27d
1 parent 9ef2dd2
commit 0ece27d
Show file tree

Hide file tree

Showing 24 changed files with 223 additions and 76 deletions.
diff --git a/packages/bridge-ui-v2/.env.example b/packages/bridge-ui-v2/.env.example
@@ -20,6 +20,6 @@ export SENTRY_AUTH_TOKEN=
 # Config jsons in base64 (see ReadMe, these are generated via a script)
 export CONFIGURED_BRIDGES=
 export CONFIGURED_CHAINS=
-export CONFIGURED_CUSTOM_TOKEN=
+export CONFIGURED_CUSTOM_TOKENS=
 export CONFIGURED_RELAYER=
 export CONFIGURED_EVENT_INDEXER=
diff --git a/packages/bridge-ui-v2/__mocks__/$env/static/public.ts b/packages/bridge-ui-v2/__mocks__/$env/static/public.ts
@@ -6,5 +6,5 @@ export const PUBLIC_WALLETCONNECT_PROJECT_ID = '123';
 export const PUBLIC_SENTRY_DSN = 'https://sentry.com';
 export const CONFIGURED_BRIDGES = '';
 export const CONFIGURED_CHAINS = '';
-export const CONFIGURED_CUSTOM_TOKEN = '';
+export const CONFIGURED_CUSTOM_TOKENS = '';
 export const CONFIGURED_RELAYER = '';
diff --git a/packages/bridge-ui-v2/__mocks__/@wagmi/core.ts b/packages/bridge-ui-v2/__mocks__/@wagmi/core.ts
@@ -14,8 +14,30 @@ export const fetchToken = vi.fn();
 
 export const readContract = vi.fn();
 
-export const configureChains = vi.fn(() => {
-  return { publicClient: 'mockPublicClient' };
+const mockChains = [
+  {
+    id: 0,
+    name: 'Debug',
+    network: 'Debug',
+    nativeCurrency: {
+      name: 'ETH',
+      symbol: 'ETH',
+      decimals: 18,
+    },
+    rpcUrls: {
+      public: { http: ['some/url/'] },
+      default: { http: ['some/url/'] },
+    },
+  },
+];
+
+const mockPublicClient = () => {
+  return {};
+};
+
+export const configureChains = vi.fn().mockReturnValue({
+  chains: mockChains,
+  publicClient: mockPublicClient,
 });
 
 export const createConfig = vi.fn(() => {

diff --git a/packages/bridge-ui-v2/config/schemas/configuredCustomToken.schema.json b/packages/bridge-ui-v2/config/schemas/configuredCustomToken.schema.json
@@ -1,5 +1,5 @@
 {
-  "$id": "configuredCustomToken.json",
+  "$id": "configuredCustomTokens.json",
   "type": "array",
   "items": {
     "type": "object",

diff --git a/packages/bridge-ui-v2/package.json b/packages/bridge-ui-v2/package.json
@@ -27,8 +27,8 @@
     "@sveltejs/kit": "^1.27.4",
     "@types/debug": "^4.1.12",
     "@types/object-hash": "^3.0.6",
-    "@typescript-eslint/eslint-plugin": "^6.10.0",
-    "@typescript-eslint/parser": "^6.10.0",
+    "@typescript-eslint/eslint-plugin": "^6.13.2",
+    "@typescript-eslint/parser": "^6.13.2",
     "@vitest/coverage-v8": "^0.33.0",
     "@wagmi/cli": "^1.5.2",
     "abitype": "^0.8.11",

diff --git a/packages/bridge-ui-v2/scripts/exportJsonToEnv.js b/packages/bridge-ui-v2/scripts/exportJsonToEnv.js
@@ -11,7 +11,7 @@ const envFile = './.env';
 
 const bridgesPath = 'config/configuredBridges.json';
 const chainsPath = 'config/configuredChains.json';
-const tokensPath = 'config/configuredCustomToken.json';
+const tokensPath = 'config/configuredCustomTokens.json';
 const relayerPath = 'config/configuredRelayer.json';
 const eventIndexerPath = 'config/configuredEventIndexer.json';
 

diff --git a/packages/bridge-ui-v2/scripts/vite-plugins/generateCustomTokenConfig.ts b/packages/bridge-ui-v2/scripts/vite-plugins/generateCustomTokenConfig.ts
@@ -30,14 +30,14 @@ export function generateCustomTokenConfig() {
       if (skip) {
         configuredTokenConfigFile = '';
       } else {
-        if (!process.env.CONFIGURED_CUSTOM_TOKEN) {
+        if (!process.env.CONFIGURED_CUSTOM_TOKENS) {
           throw new Error(
-            'CONFIGURED_CUSTOM_TOKEN is not defined in environment. Make sure to run the export step in the documentation.',
+            'CONFIGURED_CUSTOM_TOKENS is not defined in environment. Make sure to run the export step in the documentation.',
           );
         }
 
         // Decode base64 encoded JSON string
-        configuredTokenConfigFile = decodeBase64ToJson(process.env.CONFIGURED_CUSTOM_TOKEN || '');
+        configuredTokenConfigFile = decodeBase64ToJson(process.env.CONFIGURED_CUSTOM_TOKENS || '');
 
         // Valide JSON against schema
         const isValid = validateJsonAgainstSchema(configuredTokenConfigFile, configuredChainsSchema);

diff --git a/packages/bridge-ui-v2/src/components/AccountConnectionToast/AccountConnectionToast.svelte b/packages/bridge-ui-v2/src/components/AccountConnectionToast/AccountConnectionToast.svelte
@@ -9,12 +9,12 @@
   // when the account is connected or disconnected via toast
   function onAccountChange(newAccount: Account, oldAccount?: Account) {
     if (newAccount?.isConnected) {
-      successToast({title: $t('messages.account.connected')});
+      successToast({ title: $t('messages.account.connected') });
     } else if (oldAccount && newAccount?.isDisconnected) {
       // We check if there was previous account, if not
       // the user just hit the app, and there is no need
       // to show the message.
-      warningToast({title: $t('messages.account.disconnected')});
+      warningToast({ title: $t('messages.account.disconnected') });
     }
   }
 </script>

diff --git a/packages/bridge-ui-v2/src/components/Bridge/Actions.svelte b/packages/bridge-ui-v2/src/components/Bridge/Actions.svelte
@@ -132,8 +132,8 @@
       ? typeof $tokenBalance === 'bigint'
         ? $tokenBalance > BigInt(0) // ERC721/1155
         : 'value' in $tokenBalance
-        ? $tokenBalance.value > BigInt(0)
-        : false // ERC20
+          ? $tokenBalance.value > BigInt(0)
+          : false // ERC20
       : false);
   $: canDoNothing = !hasAddress || !hasNetworks || !hasBalance || !$selectedToken;
 
@@ -144,10 +144,10 @@
     $selectedToken?.type === TokenType.ERC20
       ? isSelectedERC20 && $enteredAmount && !$insufficientAllowance && !$validatingAmount
       : $selectedToken?.type === TokenType.ERC721
-      ? allTokensApproved
-      : $selectedToken?.type === TokenType.ERC1155
-      ? allTokensApproved
-      : false;
+        ? allTokensApproved
+        : $selectedToken?.type === TokenType.ERC1155
+          ? allTokensApproved
+          : false;
 
   $: {
     checkTokensApproved();
@@ -158,10 +158,10 @@
     $selectedToken?.type === TokenType.ERC20
       ? canDoNothing || $insufficientBalance || $validatingAmount || approving || isTokenApproved || !$enteredAmount
       : $selectedToken?.type === TokenType.ERC721
-      ? allTokensApproved || approving
-      : $selectedToken?.type === TokenType.ERC1155
-      ? allTokensApproved || approving
-      : approving;
+        ? allTokensApproved || approving
+        : $selectedToken?.type === TokenType.ERC1155
+          ? allTokensApproved || approving
+          : approving;
 
   $: isERC20 = $selectedToken?.type === TokenType.ERC20;
   $: isERC721 = $selectedToken?.type === TokenType.ERC721;
@@ -187,12 +187,12 @@
   $: disableBridge = isERC20
     ? !erc20ConditionsSatisfied
     : isERC721
-    ? !erc721ConditionsSatisfied
-    : isERC1155
-    ? !erc1155ConditionsSatisfied
-    : isETH
-    ? !ethConditionsSatisfied
-    : commonConditions;
+      ? !erc721ConditionsSatisfied
+      : isERC1155
+        ? !erc1155ConditionsSatisfied
+        : isETH
+          ? !ethConditionsSatisfied
+          : commonConditions;
 </script>
 
 {#if oldStyle}

diff --git a/packages/bridge-ui-v2/src/components/Bridge/Amount.svelte b/packages/bridge-ui-v2/src/components/Bridge/Amount.svelte
@@ -233,8 +233,8 @@
         ? $tokenBalance
         : BigInt(0) // ERC721/1155
       : 'value' in $tokenBalance && $tokenBalance.value > BigInt(0)
-      ? $tokenBalance.value
-      : BigInt(0) // ERC20
+        ? $tokenBalance.value
+        : BigInt(0) // ERC20
     : BigInt(0);
 
   $: if (inputBox && sanitizedValue !== inputBox.getValue()) {

diff --git a/packages/bridge-ui-v2/src/components/Bridge/SwitchChainsButton.svelte b/packages/bridge-ui-v2/src/components/Bridge/SwitchChainsButton.svelte
@@ -16,9 +16,9 @@
     } catch (err) {
       console.error(err);
       if (err instanceof SwitchChainError) {
-        warningToast({title: $t('messages.network.pending')});
+        warningToast({ title: $t('messages.network.pending') });
       } else if (err instanceof UserRejectedRequestError) {
-        warningToast({title: $t('messages.network.rejected')});
+        warningToast({ title: $t('messages.network.rejected') });
       }
     }
   }

diff --git a/packages/bridge-ui-v2/src/components/ConnectButton/ConnectButton.svelte b/packages/bridge-ui-v2/src/components/ConnectButton/ConnectButton.svelte
@@ -16,7 +16,7 @@
 
   function connectWallet() {
     if (web3modalOpen) return;
-    web3modal.openModal(); 
+    web3modal.openModal();
   }
 
   function onWeb3Modal(state: { open: boolean }) {
@@ -31,7 +31,10 @@
 </script>
 
 {#if connected}
-  <Button class="hidden sm:flex  pl-[14px] pr-[20px] h-[38px] mr-[8px] rounded-full" type="neutral" on:click={connectWallet}>
+  <Button
+    class="hidden sm:flex  pl-[14px] pr-[20px] h-[38px] mr-[8px] rounded-full"
+    type="neutral"
+    on:click={connectWallet}>
     <span class="body-regular f-items-center">
       <svelte:component this={EthIcon} size={20} />
       {#if $ethBalance >= 0}

diff --git a/packages/bridge-ui-v2/src/components/SwitchChainModal/SwitchChainModal.svelte b/packages/bridge-ui-v2/src/components/SwitchChainModal/SwitchChainModal.svelte
@@ -29,10 +29,10 @@
     } catch (err) {
       console.error(err);
       if (err instanceof SwitchChainError) {
-        warningToast({title: $t('messages.network.pending')});
+        warningToast({ title: $t('messages.network.pending') });
       }
       if (err instanceof UserRejectedRequestError) {
-        warningToast({title: $t('messages.network.rejected')});
+        warningToast({ title: $t('messages.network.rejected') });
       }
     } finally {
       switchingNetwork = false;

diff --git a/packages/bridge-ui-v2/src/components/ThemeButton/ThemeButton.svelte b/packages/bridge-ui-v2/src/components/ThemeButton/ThemeButton.svelte
@@ -2,7 +2,7 @@
   import { onMount } from 'svelte';
 
   import { Icon } from '$components/Icon';
-  import { Theme,theme } from '$stores/theme';
+  import { Theme, theme } from '$stores/theme';
 
   $: isDarkTheme = $theme === Theme.DARK;
 

diff --git a/packages/bridge-ui-v2/src/components/Transactions/StatusInfoDialog.svelte b/packages/bridge-ui-v2/src/components/Transactions/StatusInfoDialog.svelte
@@ -47,8 +47,7 @@
 <svelte:window on:keydown={closeModalIfKeyDown} />
 
 <dialog id={dialogId} class="modal" class:modal-open={modalOpen}>
-  <div
-    class="modal-box bg-neutral-background text-primary-content text-center max-w-[565px]">
+  <div class="modal-box bg-neutral-background text-primary-content text-center max-w-[565px]">
     <div class="w-full flex justify-end">
       <CloseButton onClick={closeModal} />
     </div>

diff --git a/packages/bridge-ui-v2/src/libs/bridge/ERC1155Bridge.ts b/packages/bridge-ui-v2/src/libs/bridge/ERC1155Bridge.ts
@@ -210,8 +210,8 @@ export class ERC1155Bridge extends Bridge {
     const gasLimit = !isTokenAlreadyDeployed
       ? BigInt(bridgeService.noERC1155TokenDeployedGasLimit)
       : fee > 0
-      ? bridgeService.noOwnerGasLimit
-      : BigInt(0);
+        ? bridgeService.noOwnerGasLimit
+        : BigInt(0);
 
     const sendERC1155Args: NFTBridgeTransferOp = {
       destChainId: BigInt(destChainId),

diff --git a/packages/bridge-ui-v2/src/libs/bridge/ERC20Bridge.ts b/packages/bridge-ui-v2/src/libs/bridge/ERC20Bridge.ts
@@ -45,8 +45,8 @@ export class ERC20Bridge extends Bridge {
     const gasLimit = !isTokenAlreadyDeployed
       ? BigInt(bridgeService.noERC20TokenDeployedGasLimit)
       : fee > 0
-      ? bridgeService.noOwnerGasLimit
-      : BigInt(0);
+        ? bridgeService.noOwnerGasLimit
+        : BigInt(0);
 
     const sendERC20Args: BridgeTransferOp = {
       destChainId: BigInt(destChainId),

diff --git a/packages/bridge-ui-v2/src/libs/bridge/ERC721Bridge.ts b/packages/bridge-ui-v2/src/libs/bridge/ERC721Bridge.ts
@@ -216,8 +216,8 @@ export class ERC721Bridge extends Bridge {
     const gasLimit = !isTokenAlreadyDeployed
       ? BigInt(bridgeService.noERC721TokenDeployedGasLimit)
       : fee > 0
-      ? bridgeService.noOwnerGasLimit
-      : BigInt(0);
+        ? bridgeService.noOwnerGasLimit
+        : BigInt(0);
 
     const sendERC721Args: NFTBridgeTransferOp = {
       destChainId: BigInt(destChainId),

diff --git a/packages/bridge-ui-v2/src/libs/relayer/RelayerAPIService.test.ts b/packages/bridge-ui-v2/src/libs/relayer/RelayerAPIService.test.ts
@@ -3,18 +3,9 @@ import type { Address } from 'viem';
 
 import { RelayerAPIService } from './RelayerAPIService';
 
-vi.mock('axios');
-
-vi.mock('@wagmi/core');
-
-vi.mock('$libs/chain', () => {
-  return {
-    chains: ['mockChain1', 'mockChain2'],
-    getConfiguredChainIds: vi.fn(() => [1, 2, 3]),
-  };
-});
-
 function setupMocks() {
+  vi.mock('axios');
+  vi.mock('@wagmi/core');
   vi.mock('$customToken', () => {
     return {
       customToken: [

diff --git a/packages/bridge-ui-v2/src/libs/token/checkOwnership.ts b/packages/bridge-ui-v2/src/libs/token/checkOwnership.ts
@@ -76,8 +76,8 @@ const determineOwnership = async (
   return tokenType === TokenType.ERC1155
     ? isOwnerERC1155(tokenAddress, tokenId, accountAddress, chainId)
     : tokenType === TokenType.ERC721
-    ? isOwnerERC721(tokenAddress, tokenId, accountAddress, chainId)
-    : Promise.resolve(false);
+      ? isOwnerERC721(tokenAddress, tokenId, accountAddress, chainId)
+      : Promise.resolve(false);
 };
 
 const isOwnerERC1155 = async (

diff --git a/packages/bridge-ui-v2/src/libs/token/fetchNFTImageUrl.ts b/packages/bridge-ui-v2/src/libs/token/fetchNFTImageUrl.ts
@@ -102,8 +102,8 @@ const crossChainFetchNFTMetadata = async (token: NFT, srcChainId: number, destCh
       token.type === TokenType.ERC721
         ? erc721VaultABI
         : token.type === TokenType.ERC1155
-        ? erc1155VaultABI
-        : erc20VaultABI;
+          ? erc1155VaultABI
+          : erc20VaultABI;
 
     const srcChainTokenVault = getContract({
       abi: vaultABI as Abi,

diff --git a/packages/bridge-ui-v2/src/libs/token/getCrossChainAddress.ts b/packages/bridge-ui-v2/src/libs/token/getCrossChainAddress.ts
@@ -36,15 +36,15 @@ export async function getCrossChainAddress({
     token.type === TokenType.ERC721
       ? erc721VaultABI
       : token.type === TokenType.ERC1155
-      ? erc1155VaultABI
-      : erc20VaultABI;
+        ? erc1155VaultABI
+        : erc20VaultABI;
 
   const vaultAddressKey =
     token.type === TokenType.ERC721
       ? 'erc721VaultAddress'
       : token.type === TokenType.ERC1155
-      ? 'erc1155VaultAddress'
-      : 'erc20VaultAddress';
+        ? 'erc1155VaultAddress'
+        : 'erc20VaultAddress';
 
   // it could be that we don't have the token address on the current chain, but we might it on another chain
   if (!existsOnSourceChain) {
@@ -123,8 +123,8 @@ async function getVaultForToken(tokenType: TokenType, configuredChainId: string)
     tokenType === TokenType.ERC721
       ? 'erc721VaultAddress'
       : tokenType === TokenType.ERC1155
-      ? 'erc1155VaultAddress'
-      : 'erc20VaultAddress';
+        ? 'erc1155VaultAddress'
+        : 'erc20VaultAddress';
 
   // we need find a vault that is configured with the selected srcChainId and the configuredChainId
   const vaultInfo = chains

diff --git a/packages/bridge-ui-v2/src/libs/util/mergeTransactions.test.ts b/packages/bridge-ui-v2/src/libs/util/mergeTransactions.test.ts
@@ -7,13 +7,6 @@ import { mergeAndCaptureOutdatedTransactions } from '$libs/util/mergeTransaction
 function setupMocks() {
   vi.mock('@wagmi/core');
 
-  vi.mock('$libs/chain', () => {
-    return {
-      chains: ['mockChain1', 'mockChain2'],
-      getConfiguredChainIds: vi.fn(() => [1, 2, 3]),
-    };
-  });
-
   vi.mock('$customToken', () => {
     return {
       customToken: [