Fix wallet connect rpc methods (#860)

Author: lnbc1QWFyb24

packages/walletconnect/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@web3-onboard/walletconnect",
-  "version": "2.0.0",
+  "version": "2.0.1",
   "description": "WalletConnect module for web3-onboard",
   "module": "dist/index.js",
   "browser": "dist/index.js",
@@ -20,6 +20,7 @@
     "typescript": "^4.5.5"
   },
   "dependencies": {
+    "@ethersproject/providers": "^5.5.0",
     "@web3-onboard/common": "^2.0.0",
     "@walletconnect/client": "^1.7.1",
     "@walletconnect/qrcode-modal": "^1.7.1",

packages/walletconnect/src/index.ts

@@ -1,12 +1,14 @@
+import { StaticJsonRpcProvider } from '@ethersproject/providers'
+
 import {
   Chain,
-  EIP1193Provider,
   ProviderAccounts,
-  WalletInit
+  WalletInit,
+  EIP1193Provider,
+  ProviderRpcError,
+  ProviderRpcErrorCode
 } from '@web3-onboard/common'
 
-import { ProviderRpcError } from '@web3-onboard/common'
-
 interface WalletConnectOptions {
   bridge?: string
   qrcodeModalOptions?: {
@@ -48,6 +50,7 @@ function walletConnect(options?: WalletConnectOptions): WalletInit {
           public removeListener: typeof EventEmitter['removeListener']
 
           private disconnected$: InstanceType<typeof Subject>
+          private providers: Record<string, StaticJsonRpcProvider>
 
           constructor({
             connector,
@@ -63,6 +66,7 @@ function walletConnect(options?: WalletConnectOptions): WalletInit {
             this.connector = connector
             this.chains = chains
             this.disconnected$ = new Subject()
+            this.providers = {}
 
             // listen for session updates
             fromEvent(this.connector, 'session_update', (error, payload) => {
@@ -103,11 +107,9 @@ function walletConnect(options?: WalletConnectOptions): WalletInit {
 
             this.disconnect = () => this.connector.killSession()
 
-            this.request = ({ method, params }) => {
+            this.request = async ({ method, params }) => {
               if (method === 'eth_chainId') {
-                return Promise.resolve(
-                  `0x${this.connector.chainId.toString(16)}`
-                )
+                return `0x${this.connector.chainId.toString(16)}`
               }
 
               if (method === 'eth_requestAccounts') {
@@ -161,7 +163,7 @@ function walletConnect(options?: WalletConnectOptions): WalletInit {
                 method === 'eth_selectAccounts'
               ) {
                 throw new ProviderRpcError({
-                  code: 4200,
+                  code: ProviderRpcErrorCode.UNSUPPORTED_METHOD,
                   message: `The Provider does not support the requested method: ${method}`
                 })
               }
@@ -196,12 +198,33 @@ function walletConnect(options?: WalletConnectOptions): WalletInit {
                 return this.connector.signTypedData(params)
               }
 
-              return this.connector.sendCustomRequest({
-                id: 1337,
-                jsonrpc: '2.0',
-                method,
-                params
-              })
+              if (method === 'eth_accounts') {
+                return this.connector.sendCustomRequest({
+                  id: 1337,
+                  jsonrpc: '2.0',
+                  method,
+                  params
+                })
+              }
+
+              const chainId = await this.request({ method: 'eth_chainId' })
+
+              if (!this.providers[chainId]) {
+                const currentChain = chains.find(({ id }) => id === chainId)
+
+                if (!currentChain) {
+                  throw new ProviderRpcError({
+                    code: ProviderRpcErrorCode.CHAIN_NOT_ADDED,
+                    message: `The Provider does not have a rpcUrl to make a request for the requested method: ${method}`
+                  })
+                }
+
+                this.providers[chainId] = new StaticJsonRpcProvider(
+                  currentChain.rpcUrl
+                )
+              }
+
+              return this.providers[chainId].send(method, params)
             }
           }
         }