Add support to multiple networks

.env.example

@@ -1,6 +1,5 @@
-REACT_APP_SUPPORTED_CHAIN_ID=1337
-REACT_APP_ETH_HOSTNAME_HTTP=http://localhost:8545
-REACT_APP_ETH_HOSTNAME_WS=ws://localhost:8545
+REACT_APP_DEFAULT_PROVIDER_CHAIN_ID=1337
+REACT_APP_ALCHEMY_API=$ALCHEMY_API
 REACT_APP_MULTICALL_ADDRESS=$MULTICALL_ADDRESS
 REACT_APP_DAPP_DEVELOPMENT_TESTNET_CONTRACTS=$DAPP_DEVELOPMENT_TESTNET_CONTRACTS
 
@@ -19,11 +18,16 @@ REACT_APP_FEATURE_FLAG_SENTRY=false
 REACT_APP_SENTRY_DSN=$SENTRY_DSN
 REACT_APP_FEATURE_FLAG_TRM=false
 
-REACT_APP_ELECTRUM_PROTOCOL=$ELECTRUM_PROTOCOL
-REACT_APP_ELECTRUM_HOST=$ELECTRUM_HOST
-REACT_APP_ELECTRUM_PORT=$ELECTRUM_PORT
+REACT_APP_MAINNET_ELECTRUM_PROTOCOL=$MAINNET_ELECTRUM_PROTOCOL
+REACT_APP_MAINNET_ELECTRUM_HOST=$MAINNET_ELECTRUM_HOST
+REACT_APP_MAINNET_ELECTRUM_PORT=$MAINNET_ELECTRUM_PORT
+REACT_APP_TESTNET_ELECTRUM_PROTOCOL=$TESTNET_ELECTRUM_PROTOCOL
+REACT_APP_TESTNET_ELECTRUM_HOST=$TESTNET_ELECTRUM_HOST
+REACT_APP_TESTNET_ELECTRUM_PORT=$TESTNET_ELECTRUM_PORT
 REACT_APP_MOCK_BITCOIN_CLIENT=true
 
 REACT_APP_WALLET_CONNECT_PROJECT_ID=$WALLET_CONNECT_PROJECT_ID
 
+REACT_APP_TBTC_SUBGRAPH_API=$TBTC_SUBGRAPH_API
+
 REACT_APP_TACO_DOMAIN=dashboard

.env.production

@@ -1,6 +1,5 @@
-REACT_APP_SUPPORTED_CHAIN_ID=$CHAIN_ID
-REACT_APP_ETH_HOSTNAME_HTTP=$ETH_HOSTNAME_HTTP
-REACT_APP_ETH_HOSTNAME_WS=$ETH_HOSTNAME_WS
+REACT_APP_DEFAULT_PROVIDER_CHAIN_ID=$CHAIN_ID
+REACT_APP_ALCHEMY_API=$ALCHEMY_API
 REACT_APP_DAPP_DEVELOPMENT_TESTNET_CONTRACTS=$DAPP_DEVELOPMENT_TESTNET_CONTRACTS
 
 REACT_APP_FEATURE_FLAG_TBTC_V2=true
@@ -21,10 +20,16 @@ REACT_APP_SENTRY_DSN=$SENTRY_DSN
 REACT_APP_TRM_API_KEY=$TRM_API_KEY
 REACT_APP_FEATURE_FLAG_TRM=$TRM_SUPPORT
 
-REACT_APP_ELECTRUM_PROTOCOL=$ELECTRUM_PROTOCOL
-REACT_APP_ELECTRUM_HOST=$ELECTRUM_HOST
-REACT_APP_ELECTRUM_PORT=$ELECTRUM_PORT
+REACT_APP_MAINNET_ELECTRUM_PROTOCOL=$MAINNET_ELECTRUM_PROTOCOL
+REACT_APP_MAINNET_ELECTRUM_HOST=$MAINNET_ELECTRUM_HOST
+REACT_APP_MAINNET_ELECTRUM_PORT=$MAINNET_ELECTRUM_PORT
+REACT_APP_TESTNET_ELECTRUM_PROTOCOL=$TESTNET_ELECTRUM_PROTOCOL
+REACT_APP_TESTNET_ELECTRUM_HOST=$TESTNET_ELECTRUM_HOST
+REACT_APP_TESTNET_ELECTRUM_PORT=$TESTNET_ELECTRUM_PORT
 REACT_APP_MOCK_BITCOIN_CLIENT=false
 
 REACT_APP_WALLET_CONNECT_PROJECT_ID=$WALLET_CONNECT_PROJECT_ID
+
+REACT_APP_TBTC_SUBGRAPH_API=$TBTC_SUBGRAPH_API
+
 REACT_APP_TACO_DOMAIN=mainnet

.env.test

@@ -1,3 +1,3 @@
-REACT_APP_SUPPORTED_CHAIN_ID=1337
-REACT_APP_MULTICALL_ADDRESS=0x086813525A7dC7dafFf015Cdf03896Fd276eab60
+REACT_APP_DEFAULT_PROVIDER_CHAIN_ID=1337
+REACT_APP_MULTICALL_ADDRESS=0xcA11bde05977b3631167028862bE2a173976CA11
 REACT_APP_TACO_DOMAIN=dashboard

.github/workflows/dashboard-ci.yml

@@ -86,14 +86,17 @@ jobs:
         run: yarn build
         env:
           PUBLIC_URL: /${{ github.head_ref }}
-          CHAIN_ID: 11155111
-          ETH_HOSTNAME_HTTP: ${{ secrets.SEPOLIA_ETH_HOSTNAME_HTTP }}
-          ETH_HOSTNAME_WS: ${{ secrets.SEPOLIA_ETH_HOSTNAME_WS }}
+          DEFAULT_PROVIDER_CHAIN_ID: 11155111
+          ALCHEMY_API: ${{ secrets.ALCHEMY_API }}
           NODE_OPTIONS: --max_old_space_size=4096
-          ELECTRUM_PROTOCOL: ${{ secrets.TESTNET_ELECTRUMX_PROTOCOL }}
-          ELECTRUM_HOST: ${{ secrets.TESTNET_ELECTRUMX_HOST }}
-          ELECTRUM_PORT: ${{ secrets.TESTNET_ELECTRUMX_PORT }}
+          MAINNET_ELECTRUM_PROTOCOL: ${{ secrets.MAINNET_ELECTRUMX_PROTOCOL }}
+          MAINNET_ELECTRUM_HOST: ${{ secrets.MAINNET_ELECTRUMX_HOST }}
+          MAINNET_ELECTRUM_PORT: ${{ secrets.MAINNET_ELECTRUMX_PORT }}
+          TESTNET_ELECTRUM_PROTOCOL: ${{ secrets.TESTNET_ELECTRUMX_PROTOCOL }}
+          TESTNET_ELECTRUM_HOST: ${{ secrets.TESTNET_ELECTRUMX_HOST }}
+          TESTNET_ELECTRUM_PORT: ${{ secrets.TESTNET_ELECTRUMX_PORT }}
           WALLET_CONNECT_PROJECT_ID: ${{ secrets.WALLET_CONNECT_PROJECT_ID }}
+          TBTC_SUBGRAPH_API: ${{ secrets.TBTC_SUBGRAPH_API }}
 
       # FIXME: Tests are missing, will this step be needed?
       # - name: Test
@@ -121,14 +124,14 @@ jobs:
       gcpBucketPath: ${{ github.head_ref }}
       preview: true
     secrets:
-      ethUrlHttp: ${{ secrets.SEPOLIA_ETH_HOSTNAME_HTTP }}
-      ethUrlWS: ${{ secrets.SEPOLIA_ETH_HOSTNAME_WS }}
+      alchemyApi: ${{ secrets.ALCHEMY_API }}
       gcpServiceKey: ${{ secrets.KEEP_TEST_CI_UPLOAD_DAPP_JSON_KEY_BASE64 }}
       electrumProtocol: ${{ secrets.TESTNET_ELECTRUMX_PROTOCOL }}
       electrumHost: ${{ secrets.TESTNET_ELECTRUMX_HOST }}
       electrumPort: ${{ secrets.TESTNET_ELECTRUMX_PORT }}
       sentryDsn: ${{ secrets.TESTNET_SENTRY_DSN }}
       walletConnectProjectId: ${{ secrets.WALLET_CONNECT_PROJECT_ID }}
+      tbtcSubgraphApi: ${{ secrets.TBTC_SUBGRAPH_API }}
 
   # This job will be triggered via the `workflow_dispatch` event, as part of the
   # CI flow, which gets triggered manually after changes in the contracts,
@@ -152,14 +155,14 @@ jobs:
       gcpBucketName: dashboard.test.threshold.network
       preview: false
     secrets:
-      ethUrlHttp: ${{ secrets.SEPOLIA_ETH_HOSTNAME_HTTP }}
-      ethUrlWS: ${{ secrets.SEPOLIA_ETH_HOSTNAME_WS }}
+      alchemyApi: ${{ secrets.ALCHEMY_API }}
       gcpServiceKey: ${{ secrets.KEEP_TEST_CI_UPLOAD_DAPP_JSON_KEY_BASE64 }}
       electrumProtocol: ${{ secrets.TESTNET_ELECTRUMX_PROTOCOL }}
       electrumHost: ${{ secrets.TESTNET_ELECTRUMX_HOST }}
       electrumPort: ${{ secrets.TESTNET_ELECTRUMX_PORT }}
       sentryDsn: ${{ secrets.TESTNET_SENTRY_DSN }}
       walletConnectProjectId: ${{ secrets.WALLET_CONNECT_PROJECT_ID }}
+      tbtcSubgraphApi: ${{ secrets.TBTC_SUBGRAPH_API }}
 
   # This job will be triggered after merges of PRs to the `main` branch. As the
   # triggering is not related to the changes in the contracts / client code, we
@@ -178,11 +181,11 @@ jobs:
       gcpBucketName: dashboard.test.threshold.network
       preview: false
     secrets:
-      ethUrlHttp: ${{ secrets.SEPOLIA_ETH_HOSTNAME_HTTP }}
-      ethUrlWS: ${{ secrets.SEPOLIA_ETH_HOSTNAME_WS }}
+      alchemyApi: ${{ secrets.ALCHEMY_API }}
       gcpServiceKey: ${{ secrets.KEEP_TEST_CI_UPLOAD_DAPP_JSON_KEY_BASE64 }}
       electrumProtocol: ${{ secrets.TESTNET_ELECTRUMX_PROTOCOL }}
       electrumHost: ${{ secrets.TESTNET_ELECTRUMX_HOST }}
       electrumPort: ${{ secrets.TESTNET_ELECTRUMX_PORT }}
       sentryDsn: ${{ secrets.TESTNET_SENTRY_DSN }}
       walletConnectProjectId: ${{ secrets.WALLET_CONNECT_PROJECT_ID }}
+      tbtcSubgraphApi: ${{ secrets.TBTC_SUBGRAPH_API }}

.github/workflows/dashboard-mainnet.yml

@@ -48,18 +48,21 @@ jobs:
         run: yarn build
         env:
           PUBLIC_URL: /${{ github.ref_name }}
-          CHAIN_ID: 1
-          ETH_HOSTNAME_HTTP: ${{ secrets.MAINNET_ETH_HOSTNAME_HTTP }}
-          ETH_HOSTNAME_WS: ${{ secrets.MAINNET_ETH_HOSTNAME_WS }}
+          DEFAULT_PROVIDER_CHAIN_ID: 1
+          ALCHEMY_API: ${{ secrets.ALCHEMY_API }}
           NODE_OPTIONS: --max_old_space_size=4096
-          ELECTRUM_PROTOCOL: ${{ secrets.MAINNET_ELECTRUMX_PROTOCOL }}
-          ELECTRUM_HOST: ${{ secrets.MAINNET_ELECTRUMX_HOST }}
-          ELECTRUM_PORT: ${{ secrets.MAINNET_ELECTRUMX_PORT }}
+          MAINNET_ELECTRUM_PROTOCOL: ${{ secrets.MAINNET_ELECTRUMX_PROTOCOL }}
+          MAINNET_ELECTRUM_HOST: ${{ secrets.MAINNET_ELECTRUMX_HOST }}
+          MAINNET_ELECTRUM_PORT: ${{ secrets.MAINNET_ELECTRUMX_PORT }}
+          TESTNET_ELECTRUM_PROTOCOL: ${{ secrets.TESTNET_ELECTRUMX_PROTOCOL }}
+          TESTNET_ELECTRUM_HOST: ${{ secrets.TESTNET_ELECTRUMX_HOST }}
+          TESTNET_ELECTRUM_PORT: ${{ secrets.TESTNET_ELECTRUMX_PORT }}
           SENTRY_SUPPORT: true
           SENTRY_DSN: ${{ secrets.MAINNET_SENTRY_DSN }}
           TRM_API_KEY: ${{ secrets.TEST_TRM_API_KEY }}
           TRM_SUPPORT: ${{ secrets.TRM_SUPPORT }}
           WALLET_CONNECT_PROJECT_ID: ${{ secrets.WALLET_CONNECT_PROJECT_ID }}
+          TBTC_SUBGRAPH_API: ${{ secrets.TBTC_SUBGRAPH_API }}
           GOOGLE_TAG_MANAGER_SUPPORT: false
           GOOGLE_TAG_MANAGER_ID: ${{ secrets.GOOGLE_TAG_MANAGER_ID }}
 
@@ -68,9 +71,8 @@ jobs:
         run: yarn build
         env:
           PUBLIC_URL: /
-          CHAIN_ID: 1
-          ETH_HOSTNAME_HTTP: ${{ secrets.MAINNET_ETH_HOSTNAME_HTTP }}
-          ETH_HOSTNAME_WS: ${{ secrets.MAINNET_ETH_HOSTNAME_WS }}
+          DEFAULT_PROVIDER_CHAIN_ID: 1
+          ALCHEMY_API: ${{ secrets.ALCHEMY_API }}
           NODE_OPTIONS: --max_old_space_size=4096
           POSTHOG_SUPPORT: true
           POSTHOG_API_KEY: ${{ secrets.MAINNET_POSTHOG_API_KEY }}
@@ -83,6 +85,7 @@ jobs:
           TRM_API_KEY: ${{ secrets.MAINNET_TRM_API_KEY }}
           TRM_SUPPORT: ${{ secrets.TRM_SUPPORT }}
           WALLET_CONNECT_PROJECT_ID: ${{ secrets.WALLET_CONNECT_PROJECT_ID }}
+          TBTC_SUBGRAPH_API: ${{ secrets.TBTC_SUBGRAPH_API }}
           GOOGLE_TAG_MANAGER_SUPPORT: true
           GOOGLE_TAG_MANAGER_ID: ${{ secrets.GOOGLE_TAG_MANAGER_ID }}
 

.github/workflows/reusable-build-and-publish.yml

@@ -49,11 +49,8 @@ on:
         default: false
         type: boolean
     secrets:
-      ethUrlHttp:
-        description: The HTTP ETH API URL.
-        required: true
-      ethUrlWS:
-        description: The WebSocket ETH API URL.
+      alchemyApi:
+        description: The Alchemy API Key.
         required: true
       gcpServiceKey:
         description: JSON key for Google Cloud Platform service account.
@@ -75,6 +72,9 @@ on:
           Project Id gathered from WalletConnect cloud. Required for
           WalletConnect v2.
         required: true
+      tbtcSubgraphApi:
+        description: The API endpoint for the tBTC subgraph.
+        required: true
 
 jobs:
   build-and-publish:
@@ -161,16 +161,19 @@ jobs:
         run: yarn build
         env:
           PUBLIC_URL: /
-          CHAIN_ID: ${{ env.NETWORK_ID }}
-          ETH_HOSTNAME_HTTP: ${{ secrets.ethUrlHttp }}
-          ETH_HOSTNAME_WS: ${{ secrets.ethUrlWS }}
+          DEFAULT_PROVIDER_CHAIN_ID: ${{ env.NETWORK_ID }}
+          ALCHEMY_API: ${{ secrets.alchemyApi }}
           NODE_OPTIONS: --max_old_space_size=4096
-          ELECTRUM_PROTOCOL: ${{ secrets.electrumProtocol }}
-          ELECTRUM_HOST: ${{ secrets.electrumHost }}
-          ELECTRUM_PORT: ${{ secrets.electrumPort }}
+          MAINNET_ELECTRUM_PROTOCOL: ${{ secrets.mainnetElectrumProtocol }}
+          MAINNET_ELECTRUM_HOST: ${{ secrets.mainnetElectrumHost }}
+          MAINNET_ELECTRUM_PORT: ${{ secrets.mainnetElectrumPort }}
+          TESTNET_ELECTRUM_PROTOCOL: ${{ secrets.testnetElectrumProtocol }}
+          TESTNET_ELECTRUM_HOST: ${{ secrets.testnetElectrumHost }}
+          TESTNET_ELECTRUM_PORT: ${{ secrets.testnetElectrumPort }}
           SENTRY_SUPPORT: true
           SENTRY_DSN: ${{ secrets.sentryDsn }}
           WALLET_CONNECT_PROJECT_ID: ${{ secrets.walletConnectProjectId }}
+          TBTC_SUBGRAPH_API: ${{ secrets.tbtcSubgraphApi }}
           DAPP_DEVELOPMENT_TESTNET_CONTRACTS: ${{ inputs.preview == true }}
 
       - name: Build
@@ -179,16 +182,19 @@ jobs:
         run: yarn build
         env:
           PUBLIC_URL: /${{ inputs.gcpBucketPath }}
-          CHAIN_ID: ${{ env.NETWORK_ID }}
-          ETH_HOSTNAME_HTTP: ${{ secrets.ethUrlHttp }}
-          ETH_HOSTNAME_WS: ${{ secrets.ethUrlWS }}
+          DEFAULT_PROVIDER_CHAIN_ID: ${{ env.NETWORK_ID }}
+          ALCHEMY_API: ${{ secrets.alchemyApi }}
           NODE_OPTIONS: --max_old_space_size=4096
-          ELECTRUM_PROTOCOL: ${{ secrets.electrumProtocol }}
-          ELECTRUM_HOST: ${{ secrets.electrumHost }}
-          ELECTRUM_PORT: ${{ secrets.electrumPort }}
+          MAINNET_ELECTRUM_PROTOCOL: ${{ secrets.mainnetElectrumProtocol }}
+          MAINNET_ELECTRUM_HOST: ${{ secrets.mainnetElectrumHost }}
+          MAINNET_ELECTRUM_PORT: ${{ secrets.mainnetElectrumPort }}
+          TESTNET_ELECTRUM_PROTOCOL: ${{ secrets.testnetElectrumProtocol }}
+          TESTNET_ELECTRUM_HOST: ${{ secrets.testnetElectrumHost }}
+          TESTNET_ELECTRUM_PORT: ${{ secrets.testnetElectrumPort }}
           SENTRY_SUPPORT: true
           SENTRY_DSN: ${{ secrets.sentryDsn }}
           WALLET_CONNECT_PROJECT_ID: ${{ secrets.walletConnectProjectId }}
+          TBTC_SUBGRAPH_API: ${{ secrets.tbtcSubgraphApi }}
           DAPP_DEVELOPMENT_TESTNET_CONTRACTS: ${{ inputs.preview == true }}
 
       - name: Deploy to GCP

README.md

@@ -11,9 +11,8 @@ This project was bootstrapped with [Create React App](https://github.com/faceboo
 ## Update the `.env` file:
 
 ```
-REACT_APP_SUPPORTED_CHAIN_ID=11155111
-REACT_APP_ETH_HOSTNAME_HTTP=<your http ETH hostname- eg. Infura>
-REACT_APP_ETH_HOSTNAME_WS=<your ws ETH hostname- eg. Infura>
+REACT_APP_DEFAULT_PROVIDER_CHAIN_ID=11155111
+REACT_APP_ALCHEMY_API=<your Alchemy API key>
 // We can skip this env variable- the dapp uses the correct address
 // of Multicall contract for Sepolia under the hood.
 REACT_APP_MULTICALL_ADDRESS=$MULTICALL_ADDRESS
@@ -109,9 +108,8 @@ The following procedure allows to deploy T token dashboard to production:
 Update `.env` to contain:
 
 ```
-REACT_APP_SUPPORTED_CHAIN_ID=11155111
-REACT_APP_ETH_HOSTNAME_HTTP=https://sepolia.infura.io/v3/<your API key here>
-REACT_APP_ETH_HOSTNAME_WS=wss://sepolia.infura.io/v3/<your API key here>
+REACT_APP_DEFAULT_PROVIDER_CHAIN_ID=11155111
+REACT_APP_ALCHEMY_API=<your Alchemy API key here>
 REACT_APP_MULTICALL_ADDRESS=$MULTICALL_ADDRESS
 
 REACT_APP_FEATURE_FLAG_TBTC_V2=true
@@ -129,13 +127,18 @@ REACT_APP_FEATURE_FLAG_SENTRY=false
 REACT_APP_SENTRY_DSN=$SENTRY_DSN
 REACT_APP_FEATURE_FLAG_TRM=false
 
-REACT_APP_ELECTRUM_PROTOCOL=wss
-REACT_APP_ELECTRUM_HOST=electrumx-server.test.tbtc.network
-REACT_APP_ELECTRUM_PORT=8443
+REACT_APP_MAINNET_ELECTRUM_PROTOCOL=$MAINNET_ELECTRUM_PROTOCOL
+REACT_APP_MAINNET_ELECTRUM_HOST=$MAINNET_ELECTRUM_HOST
+REACT_APP_MAINNET_ELECTRUM_PORT=$MAINNET_ELECTRUM_PORT
+REACT_APP_TESTNET_ELECTRUM_PROTOCOL=wss
+REACT_APP_TESTNET_ELECTRUM_HOST=electrumx-server.test.tbtc.network
+REACT_APP_TESTNET_ELECTRUM_PORT=8443
 REACT_APP_MOCK_BITCOIN_CLIENT=false
 
 REACT_APP_WALLET_CONNECT_PROJECT_ID=$WALLET_CONNECT_PROJECT_ID
 
+REACT_APP_TBTC_SUBGRAPH_API=$TBTC_SUBGRAPH_API
+
 REACT_APP_TACO_DOMAIN=dashboard
 ```
 

package.json

@@ -18,7 +18,7 @@
     "@keep-network/keep-ecdsa": "development",
     "@keep-network/random-beacon": "development",
     "@keep-network/tbtc": "development",
-    "@keep-network/tbtc-v2.ts": "^2.4.1",
+    "@keep-network/tbtc-v2.ts": "^2.5.0-dev.8",
     "@ledgerhq/connect-kit-loader": "1.1.8",
     "@ledgerhq/wallet-api-client": "^1.2.0",
     "@ledgerhq/wallet-api-client-react": "^1.1.1",

src/App.tsx

@@ -38,7 +38,7 @@ import { useSubscribeToToppedUpEvent } from "./hooks/useSubscribeToToppedUpEvent
 import { pages } from "./pages"
 import { useCheckBonusEligibility } from "./hooks/useCheckBonusEligibility"
 import { useFetchStakingRewards } from "./hooks/useFetchStakingRewards"
-import { isSameChainId, isSameETHAddress } from "./web3/utils"
+import { isSameETHAddress } from "./web3/utils"
 import { ThresholdProvider } from "./contexts/ThresholdContext"
 import { LedgerLiveAppProvider } from "./contexts/LedgerLiveAppContext"
 import {
@@ -63,6 +63,9 @@ import { useIsEmbed } from "./hooks/useIsEmbed"
 import TBTC from "./pages/tBTC"
 import { useDetectIfEmbed } from "./hooks/useDetectIfEmbed"
 import { useGoogleTagManager } from "./hooks/google-tag-manager"
+import { hexToNumber, isSameChainId } from "./networks/utils"
+import { walletConnected } from "./store/account"
+import { useIsActive } from "./hooks/useIsActive"
 
 const Web3EventHandlerComponent = () => {
   useSubscribeToVendingMachineContractEvents()
@@ -133,15 +136,19 @@ const useSubscribeToVendingMachineContractEvents = () => {
 
 const AppBody = () => {
   const dispatch = useDispatch()
-  const { connector, account, chainId, deactivate } = useWeb3React()
+  const { connector, account, chainId } = useIsActive()
 
   useEffect(() => {
     const updateHandler = (update: ConnectorUpdate) => {
-      // if chain is changed then just deactivate the current provider and reset
-      // store
+      // if chain is changed then just update the redux store for the wallet
+      // connection
       if (update.chainId && !isSameChainId(update.chainId, chainId as number)) {
-        dispatch(resetStoreAction())
-        deactivate()
+        dispatch(
+          walletConnected({
+            address: account || "",
+            chainId: hexToNumber(update.chainId),
+          })
+        )
       } else if (
         update.account &&
         !isSameETHAddress(update.account, account as string)
@@ -169,7 +176,7 @@ const AppBody = () => {
       connector?.removeListener(ConnectorEvent.Update, updateHandler)
       connector?.removeListener(ConnectorEvent.Deactivate, deactivateHandler)
     }
-  }, [connector, dispatch, account])
+  }, [connector, dispatch, account, chainId])
 
   useEffect(() => {
     dispatch(fetchETHPriceUSD())

src/components/CopyToClipboard/index.tsx

@@ -12,7 +12,7 @@ import shortenAddress from "../../utils/shortenAddress"
 import ViewInBlockExplorer, {
   ViewInBlockExplorerProps,
 } from "../ViewInBlockExplorer"
-import { ExplorerDataType } from "../../utils/createEtherscanLink"
+import { ExplorerDataType } from "../../networks/enums/networks"
 
 type CopyToClipboardProps = {
   textToCopy: string