Merge pull request #1104 from blocknative/release/2.2.0

Release 2.2.0 - Main

.github/ISSUE_TEMPLATE/BUG.yml

@@ -5,11 +5,15 @@ labels: [bug]
 assignees:
   - taylorjdawson
   - aaronbarnardsound
+  - Adamj1232
+  - mahmud-bn
 body:
   - type: markdown
     attributes:
       value: |
-        Thanks for taking the time to fill out this bug report!
+        Thanks for taking the time to fill out this bug report! Note that the more detailed the report the faster we can get the issue fixed.
+        When possible, please provide a [Minimal, Reproducible Example](https://stackoverflow.com/help/minimal-reproducible-example) this will
+        reduce the time it takes us to fix the issue.
   - type: textarea
     attributes:
       label: Current Behavior
@@ -25,26 +29,61 @@ body:
   - type: textarea
     attributes:
       label: Steps To Reproduce
-      description: Steps to reproduce the behavior.
+      description: Steps to reproduce the behavior. Link or paste your [Minimal, Reproducible Example](https://stackoverflow.com/help/minimal-reproducible-example) here.
       placeholder: |
         1. In this environment...
         2. With this config...
         3. Run '...'
         4. See error...
     validations:
       required: false
+  - type: dropdown
+    attributes:
+      label: What package is effected by this issue?
+      options:
+        - @web3-onboard/core
+        - @web3-onboard/common
+        - @web3-onboard/coinbase
+        - @web3-onboard/decent
+        - @web3-onboard/formatic
+        - @web3-onboard/gnosis
+        - @web3-onboard/injected
+        - @web3-onboard/keepkey
+        - @web3-onboard/keystone
+        - @web3-onboard/ledger
+        - @web3-onboard/magic
+        - @web3-onboard/mew
+        - @web3-onboard/portis
+        - @web3-onboard/react
+        - @web3-onboard/torus
+        - @web3-onboard/trezor
+        - @web3-onboard/vue
+        - @web3-onboard/walletconnect
+        - @web3-onboard/walletlink
+        - @web3-onboard/web3auth
+        - bnc-onboard (v1)
+    validations:
+      required: true
+  - type: dropdown
+    attributes:
+      label: Is this a build or a runtime issue?
+      multiple: true
+      options:
+        - Build
+        - Runtime
+        - N/A
+    validations:
+      required: true
   - type: input
     attributes:
-      label: Onboard Version
+      label: Package Version
       description: What version of Onboard are you using?
     validations:
       required: true
   - type: input
     attributes:
       label: Node Version
       description: What version of NodeJS are you running?
-    validations:
-      required: true
   - type: dropdown
     id: browsers
     attributes:
@@ -70,3 +109,11 @@ body:
         Tip: You can attach images or log files by clicking this area to highlight it and then dragging files in.
     validations:
       required: false
+  - type: checkboxes
+    id: terms
+    attributes:
+      label: Sanity Check
+      description: Sanity check to ensure that issue has been properly filled out to reduce friction for all involved parties.
+      options:
+        - label: If this is a build issue, I have included my build config. If this is a runtime issue, I have included reproduction steps and/or a [Minimal, Reproducible Example](https://stackoverflow.com/help/minimal-reproducible-example).
+          required: true

.prettierignore

@@ -0,0 +1 @@
+packages/**/dist

README.md

@@ -12,17 +12,20 @@
 
 ## Quickstart
 
-Install the core Onboard library and the injected wallets module to support browser extension and mobile wallets:
+Install the core Onboard library, the injected wallets module and optionally ethers js to support browser extension and mobile wallets:
 
-`npm i @web3-onboard/core @web3-onboard/injected-wallets`
+**NPM**
+`npm i @web3-onboard/core @web3-onboard/injected-wallets ethers`
 
-- [@web3-onboard/core Official NPM Documentation](https://www.npmjs.com/package/@web3-onboard/core)
+**Yarn**
+`yarn add @web3-onboard/core @web3-onboard/injected-wallets ethers`
 
 Then initialize in your app:
 
 ```javascript
 import Onboard from '@web3-onboard/core'
 import injectedModule from '@web3-onboard/injected-wallets'
+import { ethers } from 'ethers'
 
 const MAINNET_RPC_URL = 'https://mainnet.infura.io/v3/<INFURA_KEY>'
 
@@ -37,17 +40,31 @@ const onboard = Onboard({
       label: 'Ethereum Mainnet',
       rpcUrl: MAINNET_RPC_URL
     }
-  ],
-  appMetadata: {
-    name: 'My App',
-    icon: '<SVG_ICON_STRING>',
-    description: 'My app using Onboard'
-  }
+  ]
 })
 
 const wallets = await onboard.connectWallet()
 
 console.log(wallets)
+
+if (wallets[0]) {
+  // create an ethers provider with the last connected wallet provider
+  const ethersProvider = new ethers.providers.Web3Provider(
+    wallets[0].provider,
+    'any'
+  )
+
+  const signer = ethersProvider.getSigner()
+
+  // send a transaction with the ethers provider
+  const txn = await signer.sendTransaction({
+    to: '0x',
+    value: 100000000000000
+  })
+
+  const receipt = await txn.wait()
+  console.log(receipt)
+}
 ```
 
 ## Documentation
@@ -64,22 +81,23 @@ For full documentation, check out the README.md for each package:
 
 **SDK Wallets**
 
-- [Fortmatic](packages/fortmatic/README.md)
+- [Coinbase](packages/coinbase/README.md)
+- [WalletConnect](packages/walletconnect/README.md)
 - [Gnosis](packages/gnosis/README.md)
-- [MEW](packages/mew/README.md)
+- [Magic](packages/magic/README.md)
+- [Fortmatic](packages/fortmatic/README.md)
 - [Portis](packages/portis/README.md)
-- [Torus](packages/torus/README.md)
-- [WalletConnect](packages/walletconnect/README.md)
-- [WalletLink](packages/walletlink/README.md)
-- Magic (in active development)
+- [MEW](packages/mew/README.md)
+- [Web3Auth](packages/web3auth/README.md)
 
 **Hardware Wallets**
 
-- [KeepKey](packages/keepkey/README.md)
 - [Ledger](packages/ledger/README.md)
 - [Trezor](packages/trezor/README.md)
 - [Keystone](packages/keystone/README.md)
+- [KeepKey](packages/keepkey/README.md)
 - [D'CENT](packages/dcent/README.md)
+
 **Frameworks**
 
 - [React](packages/react/README.md)

package.json

@@ -1,6 +1,6 @@
 {
   "name": "web3-onboard-monorepo",
-  "version": "2.1.0",
+  "version": "2.2.0",
   "private": true,
   "workspaces": [
     "./packages/*"

packages/coinbase/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@web3-onboard/coinbase",
-  "version": "2.0.5",
+  "version": "2.0.6",
   "description": "Coinbase Wallet module for web3-onboard",
   "module": "dist/index.js",
   "browser": "dist/index.js",
@@ -21,6 +21,6 @@
   },
   "dependencies": {
     "@coinbase/wallet-sdk": "^3.0.5",
-    "@web3-onboard/common": "2.1.2"
+    "@web3-onboard/common": "^2.1.3"
   }
 }

packages/common/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@web3-onboard/common",
-  "version": "2.1.2",
+  "version": "2.1.3",
   "scripts": {
     "build": "rollup -c",
     "dev": "rollup -c -w",

packages/common/src/hdwallets.ts

@@ -1,6 +1,6 @@
 import type Common from '@ethereumjs/common'
 import type { BigNumber } from 'ethers'
-import type { CustomNetwork } from './types'
+import type { CustomNetwork, EIP1193Provider, RPCResponse } from './types'
 import type { TransactionRequest } from '@ethersproject/providers'
 
 /**
@@ -19,18 +19,22 @@ export const getCommon = async ({
   // eslint-disable-next-line @typescript-eslint/ban-ts-comment
   // @ts-ignore
   const CommonConstructor: typeof Common = Common.default || Common
+
+  const commonOptions = {
+    // Berlin is the minimum hardfork that will allow for EIP1559
+    hardfork: Hardfork.Berlin,
+    // List of supported EIPS
+    eips: [1559]
+  }
   let common: Common
   try {
     common = new CommonConstructor({
       chain: customNetwork || chainId,
-      // Berlin is the minimum hardfork that will allow for EIP1559
-      hardfork: Hardfork.Berlin,
-      // List of supported EIPS
-      eips: [1559]
+      ...commonOptions
     })
   } catch (e: any) {
     if (e.message && /Chain.*not supported/.test(e.message)) {
-      common = CommonConstructor.custom({ chainId })
+      common = CommonConstructor.custom({ chainId }, commonOptions)
     } else {
       throw e
     }
@@ -77,3 +81,34 @@ export const bigNumberFieldsToStrings = (
     }),
     transaction
   ) as StringifiedTransactionRequest
+
+/**
+ * Helper method for hardware wallets to build an object
+ * with a request method used for making rpc requests.
+ * @param getRpcUrl - callback used to get the current chain's rpc url
+ * @returns An object with a request method
+ * to be called when making rpc requests
+ */
+export const getHardwareWalletProvider = (
+  getRpcUrl: () => string
+): { request: EIP1193Provider['request'] } => ({
+  request: ({ method, params }) =>
+    fetch(getRpcUrl(), {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json'
+      },
+      body: JSON.stringify({
+        jsonrpc: '2.0',
+        id: '42',
+        method,
+        params
+      })
+    }).then(async res => {
+      const response = (await res.json()) as RPCResponse
+      if ('error' in response) {
+        throw response.error
+      }
+      return response.result
+    })
+})

packages/common/src/index.ts

@@ -53,7 +53,8 @@ import type {
   Chain,
   TokenSymbol,
   CustomNetwork,
-  TransactionObject
+  TransactionObject,
+  RPCResponse
 } from './types'
 
 export { ProviderRpcErrorCode } from './types'
@@ -62,7 +63,11 @@ export { createEIP1193Provider } from './eip-1193'
 export { default as accountSelect } from './account-select'
 export { entryModal } from './entry-modal'
 export { SofiaProLight, SofiaProRegular, SofiaProSemiBold } from './fonts'
-export { getCommon, bigNumberFieldsToStrings } from './hdwallets'
+export {
+  getCommon,
+  bigNumberFieldsToStrings,
+  getHardwareWalletProvider
+} from './hdwallets'
 
 export type {
   RequestPatch,
@@ -119,5 +124,6 @@ export type {
   Chain,
   TokenSymbol,
   CustomNetwork,
-  TransactionObject
+  TransactionObject,
+  RPCResponse
 }

packages/common/src/types.ts

@@ -466,3 +466,10 @@ export interface BootstrapNode {
   location: string
   comment: string
 }
+
+export interface RPCResponse {
+  id: number
+  jsonrpc: string
+  error?: { code: number; message: string }
+  result?: any
+}