nuxt.config.js

@@ -181,19 +181,6 @@ export default {
       config.module.rules.push({
         test: /\.bin$/,
         use: 'arraybuffer-loader'
-      },
-      {
-        test: /node_modules[\\/]@walletconnect/,
-        use: {
-          loader: 'babel-loader',
-          options: {
-            presets: ['@babel/preset-env'],
-            plugins: [
-              '@babel/plugin-proposal-optional-chaining',
-              '@babel/plugin-proposal-nullish-coalescing-operator'
-            ]
-          }
-        }
       })
     },
     plugins: [

package.json

@@ -23,17 +23,13 @@
     "@apollo/client": "^3.3.20",
     "@metamask/onboarding": "^1.0.0",
     "@nuxtjs/moment": "^1.6.0",
-    "@tornado/snarkjs": "0.1.20-p2",
+    "@walletconnect/web3-provider": "1.7.8",
-    "@tornado/websnark": "0.0.4-p1",
-    "@walletconnect/ethereum-provider": "^2.8.6",
-    "@walletconnect/modal": "^2.5.9",
     "ajv": "^6.10.2",
     "arraybuffer-loader": "^1.0.8",
     "base-path-converter": "^1.0.2",
     "bignumber.js": "^9.0.0",
     "bloomfilter.js": "^1.0.2",
     "circomlibjs": "0.1.2",
-    "cross-env": "7.0.3",
     "crypto": "^1.0.1",
     "dotenv": "^8.2.0",
     "eth-ens-namehash": "^2.0.8",
@@ -57,7 +53,10 @@
     "vue-clipboard2": "^0.3.1",
     "vue-i18n": "^8.15.4",
     "vuex-persistedstate": "^2.7.0",
-    "web3": "1.5.2"
+    "web3": "1.5.2",
+    "cross-env": "7.0.3",
+    "@tornado/snarkjs": "0.1.20-p2",
+    "@tornado/websnark": "0.0.4-p1"
   },
   "devDependencies": {
     "@nuxtjs/eslint-config": "^1.1.2",

services/walletConnect.js

@@ -1,69 +1,50 @@
-// Imports
-
 import BN from 'bignumber.js'
-import { EthereumProvider } from '@walletconnect/ethereum-provider'
+import WalletConnectProvider from '@walletconnect/web3-provider'
-import networkConfig, { enabledChains } from '@/networkConfig'
 
-// Build an array of the first RPC URL for each network in a reduce
+import { NETWORKS } from '@/constants'
-const createRpcMapIterator = (accumulator, chainId) => {
+import networkConfig from '@/networkConfig'
-  // Get RPCs urls
-  const { rpcUrls } = networkConfig[`netId${chainId}`]
 
-  // Choose for each network the first rpc's url
+const { WC_BRIDGE } = process.env
+
+const WALLET_CONNECT_INTERVAL = 1000
+const SUPPORTED_WALLETS = ['metamask', 'trust', 'imtoken', 'genericWeb3']
+
+const RECONNECT_TIME = 3600000 // 1 hour
+
+const getFirstRpcUrls = (acc, netId) => {
+  const { rpcUrls } = networkConfig[`netId${netId}`]
   const [{ url }] = Object.values(rpcUrls)
 
-  // Append and continue
+  return { ...acc, [netId]: url }
-  return { ...accumulator, [chainId]: url }
 }
 
-// const walletConnectInterval = 1000 // TODO: Check if we still need
+const RPC = NETWORKS.reduce(getFirstRpcUrls, {})
-const reconnectInterval = 3600000 // 1 hour
-const supportedWallets = ['metamask', 'trust', 'imtoken', 'genericWeb3']
-const rpcMap = enabledChains.reduce(createRpcMapIterator, {})
 
-const walletConnectConnector = async (chainId) => {
+const walletConnectConnector = (chainId) => {
   try {
     const prevConnection = localStorage.getItem('walletconnectTimeStamp')
 
-    if (new BN(Date.now()).minus(prevConnection).isGreaterThanOrEqualTo(reconnectInterval)) {
+    if (new BN(Date.now()).minus(prevConnection).isGreaterThanOrEqualTo(RECONNECT_TIME)) {
       localStorage.removeItem('walletconnect')
     }
 
-    const optionalChains = enabledChains.filter((chain) => chain !== chainId)
+    const provider = new WalletConnectProvider({
-
+      chainId,
-    const provider = await EthereumProvider.init({
+      rpc: RPC,
-      projectId: process.env.WC_PROJECT_ID,
+      pollingInterval: WALLET_CONNECT_INTERVAL,
-      relayUrl: process.env.WC_BRIDGE,
+      qrcodeModalOptions: {
-      chains: [chainId],
+        mobileLinks: SUPPORTED_WALLETS
-      optionalChains,
+      },
-      rpcMap,
+      bridge: WC_BRIDGE
-      methods: [
-        'eth_sendTransaction',
-        'personal_sign',
-        'eth_signTypedData_v4',
-        'eth_getEncryptionPublicKey',
-        'eth_decrypt',
-        'eth_getBalance',
-        'eth_getTransactionReceipt',
-        'eth_accounts',
-        'eth_chainId',
-        'wallet_addEthereumChain',
-        'wallet_switchEthereumChain'
-      ],
-      showQrModal: true,
-      qrModalOptions: {
-        mobileWallets: supportedWallets
-      }
     })
 
     provider.injectedRequest = provider.enable
 
     localStorage.setItem('walletconnectTimeStamp', Date.now())
-
     return provider
   } catch (err) {
-    console.error(err)
+    console.log(err)
-    throw new Error('WalletConnectConnector error: ', err)
+    throw new Error('WalletConnect error: ', err)
   }
 }
 

store/metamask.js

@@ -402,7 +402,6 @@ const actions = {
       if (providerName === 'walletConnect') {
         await dispatch(listener, { provider })
       }
-
       const address = await this.$provider.initProvider(provider, {})
 
       if (!address) {
@@ -422,8 +421,8 @@ const actions = {
       await dispatch('updateAccountBalance', address)
 
       if (getters.isWalletConnect) {
-        if (provider.signer.client.name) {
+        if (provider.wc.peerMeta) {
-          commit('SET_WALLET_NAME', provider.signer.client.name)
+          commit('SET_WALLET_NAME', provider.wc.peerMeta.name)
         }
       }
 
@@ -458,33 +457,33 @@ const actions = {
     const { enabled } = rootState.loading
 
     try {
-      provider.on('disconnect', (error, payload) => {
+      provider.wc.on('disconnect', (error, payload) => {
         if (state.isReconnecting) {
           console.warn('Provider reconnect payload', { payload, error, isReconnecting: state.isReconnecting })
 
           if (enabled) {
             dispatch('loading/disable', {}, { root: true })
           }
-
           commit('SET_RECONNECTING', false)
-        } else {
+          return
-          const prevConnection = localStorage.getItem('walletconnectTimeStamp')
+        }
 
-          const isPrevConnection = new BN(Date.now()).minus(prevConnection).isGreaterThanOrEqualTo(5000)
+        const prevConnection = localStorage.getItem('walletconnectTimeStamp')
 
-          if (isPrevConnection) {
+        const isPrevConnection = new BN(Date.now()).minus(prevConnection).isGreaterThanOrEqualTo(5000)
-            console.warn('Provider disconnect payload', {
-              payload,
-              error,
-              isReconnecting: state.isReconnecting
-            })
 
-            dispatch('onLogOut')
+        if (isPrevConnection) {
-          }
+          console.warn('Provider disconnect payload', {
+            payload,
+            error,
+            isReconnecting: state.isReconnecting
+          })
 
-          if (enabled) {
+          dispatch('onLogOut')
-            dispatch('loading/disable', {}, { root: true })
+        }
-          }
+
+        if (enabled) {
+          dispatch('loading/disable', {}, { root: true })
         }
       })
     } catch (err) {

store/snark.js

@@ -55,7 +55,6 @@ async function fetchFile({ url, name, getProgress, id, retryAttempt = 0 }) {
       headers: {
         'Content-Type': 'application/x-www-form-urlencoded'
       },
-      timeout: 10_000,
       onDownloadProgress: (progressEvent) => {
         if (typeof getProgress === 'function') {
           const progress = Math.round((progressEvent.loaded * 100) / 9626311)