Silence onboard RPC requests

safe-global · Aug 18, 2023 · b91b830 · b91b830
1 parent 18a1313
commit b91b830
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 28 deletions.
diff --git a/src/hooks/wallets/useInitWeb3.ts b/src/hooks/wallets/useInitWeb3.ts
@@ -6,6 +6,8 @@ import { createWeb3, createWeb3ReadOnly, setWeb3, setWeb3ReadOnly } from '@/hook
 import { useAppSelector } from '@/store'
 import { selectRpc } from '@/store/settingsSlice'
 
+const READONLY_WAIT = 1000
+
 export const useInitWeb3 = () => {
   const chain = useCurrentChain()
   const wallet = useWallet()
@@ -15,18 +17,22 @@ export const useInitWeb3 = () => {
   useEffect(() => {
     if (!chain) return
 
-    let web3
     if (wallet) {
-      web3 = createWeb3(wallet.provider)
+      const web3 = createWeb3(wallet.provider)
       setWeb3(web3)
-    }
 
-    let web3ReadOnly
-    if (wallet && wallet.chainId === chain.chainId) {
-      web3ReadOnly = web3
-    } else {
-      web3ReadOnly = createWeb3ReadOnly(chain.rpcUri, customRpcUrl)
+      if (wallet.chainId === chain.chainId) {
+        setWeb3ReadOnly(web3)
+        return
+      }
     }
-    setWeb3ReadOnly(web3ReadOnly)
+
+    // Wait for wallet to be connected
+    const timeout = setTimeout(() => {
+      const web3ReadOnly = createWeb3ReadOnly(chain.rpcUri, customRpcUrl)
+      setWeb3ReadOnly(web3ReadOnly)
+    }, READONLY_WAIT)
+
+    return () => clearTimeout(timeout)
   }, [wallet, chain, customRpcUrl])
 }
diff --git a/src/hooks/wallets/useOnboard.ts b/src/hooks/wallets/useOnboard.ts
@@ -7,8 +7,6 @@ import ExternalStore from '@/services/ExternalStore'
 import { logError, Errors } from '@/services/exceptions'
 import { trackEvent, WALLET_EVENTS } from '@/services/analytics'
 import { useInitPairing } from '@/services/pairing/hooks'
-import { useAppSelector } from '@/store'
-import { type EnvState, selectRpc } from '@/store/settingsSlice'
 import { E2E_WALLET_NAME } from '@/tests/e2e-wallet'
 
 const WALLETCONNECT = 'WalletConnect'
@@ -24,14 +22,10 @@ export type ConnectedWallet = {
 
 const { getStore, setStore, useStore } = new ExternalStore<OnboardAPI>()
 
-export const initOnboard = async (
-  chainConfigs: ChainInfo[],
-  currentChain: ChainInfo,
-  rpcConfig: EnvState['rpc'] | undefined,
-) => {
+export const initOnboard = async (chainConfigs: ChainInfo[], currentChain: ChainInfo) => {
   const { createOnboard } = await import('@/services/onboard')
   if (!getStore()) {
-    setStore(createOnboard(chainConfigs, currentChain, rpcConfig))
+    setStore(createOnboard(chainConfigs, currentChain))
   }
 }
 
@@ -140,15 +134,14 @@ export const useInitOnboard = () => {
   const { configs } = useChains()
   const chain = useCurrentChain()
   const onboard = useStore()
-  const customRpc = useAppSelector(selectRpc)
 
   useInitPairing()
 
   useEffect(() => {
     if (configs.length > 0 && chain) {
-      void initOnboard(configs, chain, customRpc)
+      void initOnboard(configs, chain)
     }
-  }, [configs, chain, customRpc])
+  }, [configs, chain])
 
   // Disable unsupported wallets on the current chain
   useEffect(() => {

diff --git a/src/services/onboard.ts b/src/services/onboard.ts
@@ -2,8 +2,6 @@ import Onboard, { type EIP1193Provider, type OnboardAPI } from '@web3-onboard/co
 import type { ChainInfo } from '@safe-global/safe-gateway-typescript-sdk'
 import { hexValue } from '@ethersproject/bytes'
 import { getAllWallets, getRecommendedInjectedWallets } from '@/hooks/wallets/wallets'
-import { getRpcServiceUrl } from '@/hooks/wallets/web3'
-import type { EnvState } from '@/store/settingsSlice'
 
 export type ConnectedWallet = {
   label: string
@@ -15,19 +13,15 @@ export type ConnectedWallet = {
 
 let onboard: OnboardAPI | null = null
 
-export const createOnboard = (
-  chainConfigs: ChainInfo[],
-  currentChain: ChainInfo,
-  rpcConfig: EnvState['rpc'] | undefined,
-): OnboardAPI => {
+export const createOnboard = (chainConfigs: ChainInfo[], currentChain: ChainInfo): OnboardAPI => {
   if (onboard) return onboard
 
   const wallets = getAllWallets(currentChain)
 
   const chains = chainConfigs.map((cfg) => ({
     id: hexValue(parseInt(cfg.chainId)),
     label: cfg.chainName,
-    rpcUrl: rpcConfig?.[cfg.chainId] || getRpcServiceUrl(cfg.rpcUri) || undefined,
+    rpcUrl: 'data:application/json;{}',
     token: cfg.nativeCurrency.symbol,
     color: cfg.theme.backgroundColor,
     publicRpcUrl: cfg.publicRpcUri.value,