[Hotfix - 1.6.1 🔥 ] - Fix for double QR code issue

package.json

@@ -74,7 +74,7 @@
     "@web3-react/fortmatic-connector": "^6.1.6",
     "@web3-react/injected-connector": "^6.0.7",
     "@web3-react/portis-connector": "^6.1.9",
-    "@web3-react/walletconnect-connector": "6.2.4",
+    "@web3-react/walletconnect-connector": "^7.0.2-alpha.0",
     "@web3-react/walletlink-connector": "^6.2.5",
     "ajv": "^6.12.3",
     "cids": "^1.0.0",

src/custom/components/WalletModal/WalletModalMod.tsx

@@ -6,6 +6,7 @@ import { useEffect, useState } from 'react'
 import { isMobile } from 'react-device-detect'
 import ReactGA from 'react-ga'
 import styled from 'styled-components/macro'
+import { SignerConnection } from '@walletconnect/signer-connection'
 import MetamaskIcon from 'assets/images/metamask.png'
 import { ReactComponent as Close } from 'assets/images/x.svg'
 import { fortmatic, injected, portis } from 'connectors'
@@ -14,6 +15,7 @@ import { SUPPORTED_WALLETS } from 'constants/index'
 import usePrevious from 'hooks/usePrevious'
 import { ApplicationModal } from 'state/application/actions'
 import { useModalOpen, useWalletModalToggle } from 'state/application/hooks'
+import { SupportedChainId } from 'constants/chains'
 import {
   // ExternalLink,
   TYPE,
@@ -206,18 +208,28 @@ export default function WalletModal({
     setWalletView(WALLET_VIEWS.PENDING)
 
     // if the connector is walletconnect and the user has already tried to connect, manually reset the connector
-    if (connector instanceof WalletConnectConnector && connector.walletConnectProvider?.wc?.uri) {
+    if (connector instanceof WalletConnectConnector) {
       connector.walletConnectProvider = undefined
     }
 
     connector &&
-      activate(connector, undefined, true).catch((error) => {
-        if (error instanceof UnsupportedChainIdError) {
-          activate(connector) // a little janky...can't use setError because the connector isn't set
-        } else {
-          setPendingError(true)
-        }
-      })
+      activate(connector, undefined, true)
+        .catch((error) => {
+          if (error instanceof UnsupportedChainIdError) {
+            activate(connector) // a little janky...can't use setError because the connector isn't set
+          } else {
+            setPendingError(true)
+          }
+        })
+        .then(() => {
+          // manually set the WalletConnectConnector http.connection.url to currently connected network url
+          // fix for the https://github.com/gnosis/cowswap/issues/1930 issue
+          if (connector instanceof WalletConnectConnector) {
+            const { http, rpc, signer } = connector.walletConnectProvider
+            const chainId = (signer.connection as SignerConnection).chainId || SupportedChainId.MAINNET
+            http.connection.url = rpc.custom[chainId]
+          }
+        })
   }
 
   // close wallet modal if fortmatic modal is active

src/custom/hooks/useWalletInfo.ts

@@ -65,7 +65,7 @@ function checkIsSupportedWallet(params: {
 async function getWcPeerMetadata(connector: WalletConnectConnector): Promise<{ walletName?: string; icon?: string }> {
   const provider = (await connector.getProvider()) as WalletConnectProvider
 
-  const meta = provider.walletMeta
+  const meta = provider.walletMeta || provider.signer.connection.wc.peerMeta
   if (meta) {
     return {
       walletName: meta.name,

src/custom/hooks/web3.ts

@@ -3,6 +3,7 @@ import { useEffect, useState, useCallback } from 'react'
 import { isMobile } from 'react-device-detect'
 import { injected, walletconnect, getProviderType, WalletProvider } from 'connectors'
 import { STORAGE_KEY_LAST_PROVIDER } from 'constants/index'
+import { WalletConnectConnector } from '@web3-react/walletconnect-connector'
 
 // exports from the original file
 export { useActiveWeb3React, useInactiveListener } from '@src/hooks/web3'
@@ -72,6 +73,26 @@ export function useEagerConnect() {
     }
   }, [active])
 
+  useEffect(() => {
+    if (connector) {
+      // check if current connector is of type WalletConnect
+      if (connector instanceof WalletConnectConnector) {
+        const walletConnect = connector.walletConnectProvider.signer.connection.wc
+
+        // listen on disconnect events directly on WalletConnect client and close connection
+        // important if the connection is closed from the wallet side after page refresh
+        walletConnect.on('disconnect', (error: any) => {
+          connector.close()
+          localStorage.removeItem(STORAGE_KEY_LAST_PROVIDER)
+
+          if (error) {
+            throw error
+          }
+        })
+      }
+    }
+  }, [connector])
+
   useEffect(() => {
     // add beforeunload event listener on initial component mount
     window.addEventListener('beforeunload', handleBeforeUnload)

yarn.lock

@@ -4874,7 +4874,7 @@
   resolved "https://registry.yarnpkg.com/@walletconnect/environment/-/environment-1.0.0.tgz#c4545869fa9c389ec88c364e1a5f8178e8ab5034"
   integrity sha512-4BwqyWy6KpSvkocSaV7WR3BlZfrxLbJSLkg+j7Gl6pTDE+U55lLhJvQaMuDVazXYxcjBsG09k7UlH7cGiUI5vQ==
 
-"@walletconnect/[email protected]":
+"@walletconnect/[email protected]", "@walletconnect/ethereum-provider@^1.5.4":
   version "1.6.4"
   resolved "https://registry.yarnpkg.com/@walletconnect/ethereum-provider/-/ethereum-provider-1.6.4.tgz#ffe3fee5aab7d0d7f02da2d31e7125e82de1ab53"
   integrity sha512-QhrBcAv/XJKz+UGRChjOl/SSJfbf0+QL86KjHzPufSTIGazusjNRtXc60QdFMy3Nh5u3xLODUbjXeSYIUR9UHQ==
@@ -5009,7 +5009,7 @@
     js-sha3 "0.8.0"
     query-string "6.13.5"
 
-"@walletconnect/web3-provider@^1.5.0", "@walletconnect/web3-provider@^1.6.6":
+"@walletconnect/web3-provider@^1.6.6":
   version "1.6.6"
   resolved "https://registry.yarnpkg.com/@walletconnect/web3-provider/-/web3-provider-1.6.6.tgz#7be7b6d6230d6925f8728cdddc226ef24119e602"
   integrity sha512-8z4r9JCE0lKuZmVCPSdYnX114ckQ+oMfr9D8osRBtdyhvN9elwITMloUJfACDRelcuet94yEbXuDobQeBDDkkw==
@@ -5085,12 +5085,12 @@
   resolved "https://registry.yarnpkg.com/@web3-react/types/-/types-6.0.7.tgz#34a6204224467eedc6123abaf55fbb6baeb2809f"
   integrity sha512-ofGmfDhxmNT1/P/MgVa8IKSkCStFiyvXe+U5tyZurKdrtTDFU+wJ/LxClPDtFerWpczNFPUSrKcuhfPX1sI6+A==
 
-"@web3-react/walletconnect-connector@6.2.4":
-  version "6.2.4"
-  resolved "https://registry.yarnpkg.com/@web3-react/walletconnect-connector/-/walletconnect-connector-6.2.4.tgz#0a128699fc93ddac885935f4aeca32925f6285f0"
-  integrity sha512-IEVjCXrlcfVa6ggUBEyKtLRaLQuZGtT2lGuzOFtdbJJkN84u1++pzzeDrcsVhKAoS5wq33zyJT9baEbG1Aed8g==
+"@web3-react/walletconnect-connector@^7.0.2-alpha.0":
+  version "7.0.2-alpha.0"
+  resolved "https://registry.yarnpkg.com/@web3-react/walletconnect-connector/-/walletconnect-connector-7.0.2-alpha.0.tgz#dacd59db626b42137a1e4f34ea23ef1f04cc8b99"
+  integrity sha512-Qr+AecDt5/gbAb8sFfW5kbMo0nberCAU/6AB9KmmwCm2YGEEqJrj8fW3Kin7SGxv8pgDxgXwPYsW7qMUzayXEQ==
   dependencies:
-    "@walletconnect/web3-provider" "^1.5.0"
+    "@walletconnect/ethereum-provider" "^1.5.4"
     "@web3-react/abstract-connector" "^6.0.7"
     "@web3-react/types" "^6.0.7"
     tiny-invariant "^1.0.6"