1.29.0-0.4.1: Allow Hardware wallets to add custom network info (#457)

* Add support for EWC/Volta
* Upgrade etherumjs-tx to @ethereumjs/tx
* Add common object to @ethereumjs/tx config
* Add networkName config for hardware wallets
* Remove patch-package dep
* Remove logs + useless network case
* Update yarn.lock & rm instance of ethereumjs-tx
* Add validation

Co-authored-by: Taylor Dawson <taylorjdawson@gmail.com>

Author: matextrem

package.json

@@ -1,6 +1,6 @@
 {
   "name": "bnc-onboard",
-  "version": "1.29.0-0.3.1",
+  "version": "1.29.0-0.4.1",
   "description": "Onboard users to web3 by allowing them to select a wallet, get that wallet ready to transact and have access to synced wallet state.",
   "keywords": [
     "ethereum",
@@ -57,6 +57,8 @@
     "@gnosis.pm/safe-apps-provider": "^0.5.0",
     "@gnosis.pm/safe-apps-sdk": "^3.0.0",
     "@ledgerhq/hw-app-eth": "^5.49.0",
+    "@ethereumjs/common": "^2.0.0",
+    "@ethereumjs/tx": "^3.0.0",
     "@ledgerhq/hw-transport-u2f": "^5.21.0",
     "@ledgerhq/hw-transport-webusb": "5.53.0",
     "@portis/web3": "^4.0.0",
@@ -72,7 +74,6 @@
     "eth-lattice-keyring": "^0.2.7",
     "eth-provider": "^0.6.1",
     "eth-sig-util": "^3.0.1",
-    "ethereumjs-tx": "^2.1.2",
     "ethereumjs-util": "^7.0.3",
     "fortmatic": "^2.2.1",
     "hdkey": "^2.0.1",

rollup.config.js

@@ -66,7 +66,8 @@ export default {
     'walletlink',
     'regenerator-runtime/runtime',
     'trezor-connect',
-    'ethereumjs-tx',
+    '@ethereumjs/tx',
+    '@ethereumjs/common',
     'ethereumjs-util',
     'eth-lattice-keyring',
     'eth-sig-util',

src/@types/index.d.ts

@@ -8,8 +8,8 @@ declare module 'web3-provider-engine/subproviders/subscriptions'
 declare module 'web3-provider-engine/subproviders/filters'
 declare module 'trezor-connect'
 declare module 'eth-lattice-keyring'
-declare module 'eth-sig-util'
-declare module 'ethereumjs-tx'
+declare module '@ethereumjs/tx'
+declare module '@ethereumjs/common'
 declare module 'ethereumjs-util'
 declare module 'hdkey'
 declare module '@ledgerhq/hw-app-eth'

src/interfaces.ts

@@ -196,20 +196,59 @@ export interface WalletConnectOptions extends CommonWalletOptions {
   bridge: string
 }
 
+/*
+ * Types taken from https://github.com/ethereumjs/ethereumjs-vm/blob/eb05651554ec23d2ba7c46af6e5f5a7bc199f217/packages/common/src/types.ts#L15
+ * since they are not exported
+ */
+
+export interface GenesisBlock {
+  hash: string
+  timestamp: string | null
+  gasLimit: number
+  difficulty: number
+  nonce: string
+  extraData: string
+  stateRoot: string
+}
+export interface Hardfork {
+  name: string
+  block: number | null
+}
+
+export interface BootstrapNode {
+  ip: string
+  port: number | string
+  network?: string
+  chainId?: number
+  id: string
+  location: string
+  comment: string
+}
+
+export interface HardwareWalletCustomNetwork {
+  networkId: number
+  genesis: GenesisBlock
+  hardforks: Hardfork[]
+  bootstrapNodes: BootstrapNode[]
+}
+
 export interface TrezorOptions extends CommonWalletOptions {
   appUrl: string
   email: string
   rpcUrl: string
+  customNetwork?: HardwareWalletCustomNetwork
 }
 
 export interface LatticeOptions extends CommonWalletOptions {
   appName: string
   rpcUrl: string
+  customNetwork?: HardwareWalletCustomNetwork
 }
 
 export interface LedgerOptions extends CommonWalletOptions {
   rpcUrl: string
   LedgerTransport?: any
+  customNetwork?: HardwareWalletCustomNetwork
 }
 
 //#region torus

src/modules/select/wallets/cobovault.ts

@@ -65,7 +65,7 @@ async function cobovaultProvider(options: {
     walletName: string
   }) => void
 }) {
-  const EthereumTx = await import('ethereumjs-tx')
+  const { Transaction } = await import('@ethereumjs/tx')
   const { default: createProvider } = await import('./providerEngine')
 
   const BASE_PATH = "m/44'/60'/0'/0"
@@ -227,7 +227,7 @@ async function cobovaultProvider(options: {
       await enable()
     }
 
-    const transaction = new EthereumTx.Transaction(transactionData, {
+    const transaction = Transaction.fromTxData(transactionData, {
       chain: networkName(networkId)
     })
 

src/modules/select/wallets/hd-wallet.ts

@@ -37,7 +37,6 @@ export function generateAddresses(
 
 export function isValidPath(path: string) {
   const parts = path.split('/')
-
   if (parts[0] !== 'm') {
     return false
   }
@@ -46,11 +45,11 @@ export function isValidPath(path: string) {
     return false
   }
 
-  if (parts[2] !== "60'" && parts[2] !== "1'") {
+  if (!["60'", "1'", "73799'", "246'"].includes(parts[2])) {
     return false
   }
 
-  if (parts[3] === undefined) {
+  if (parts[3] === undefined || parts[3] === "0'") {
     return true
   }
 

src/modules/select/wallets/lattice.ts

@@ -1,10 +1,24 @@
-import { LatticeOptions, WalletModule, Helpers } from '../../../interfaces'
+import {
+  LatticeOptions,
+  WalletModule,
+  HardwareWalletCustomNetwork,
+  Helpers
+} from '../../../interfaces'
 import latticeIcon from '../wallet-icons/icon-lattice'
 
 function lattice(
   options: LatticeOptions & { networkId: number }
 ): WalletModule {
-  const { appName, rpcUrl, networkId, preferred, label, iconSrc, svg } = options
+  const {
+    appName,
+    rpcUrl,
+    networkId,
+    preferred,
+    label,
+    iconSrc,
+    svg,
+    customNetwork
+  } = options
 
   return {
     name: label || 'Lattice',
@@ -19,6 +33,7 @@ function lattice(
         networkId,
         BigNumber,
         networkName,
+        customNetwork,
         resetWalletState
       })
 
@@ -57,18 +72,21 @@ async function latticeProvider(options: {
   rpcUrl: string
   BigNumber: any
   networkName: (id: number) => string
+  customNetwork?: HardwareWalletCustomNetwork
   resetWalletState: (options?: {
     disconnected: boolean
     walletName: string
   }) => void
 }) {
   const { default: EthLatticeKeyring } = await import('eth-lattice-keyring')
-  const EthereumTx = await import('ethereumjs-tx')
+  const { Transaction } = await import('@ethereumjs/tx')
+  const { default: Common } = await import('@ethereumjs/common')
   const { default: createProvider } = await import('./providerEngine')
 
   const BASE_PATH = "m/44'/60'/0'/0"
 
-  const { networkId, appName, rpcUrl, BigNumber, networkName } = options
+  const { networkId, appName, rpcUrl, BigNumber, networkName, customNetwork } =
+    options
 
   const params = {
     name: appName,
@@ -228,11 +246,18 @@ async function latticeProvider(options: {
     if (addressList.length === 0) {
       await enable()
     }
-
-    const transaction = new EthereumTx.Transaction(transactionData, {
-      chain: networkName(networkId)
+    const common = new Common({
+      chain: customNetwork || networkName(networkId)
     })
 
+    const transaction = Transaction.fromTxData(
+      {
+        ...transactionData,
+        gasLimit: transactionData.gas ?? transactionData.gasLimit
+      },
+      { common, freeze: false }
+    )
+
     try {
       const signedTx = await Lattice.signTransaction(
         addressList[0],

src/modules/select/wallets/ledger.ts

@@ -1,12 +1,26 @@
-import { LedgerOptions, WalletModule, Helpers } from '../../../interfaces'
+import {
+  LedgerOptions,
+  WalletModule,
+  HardwareWalletCustomNetwork,
+  Helpers
+} from '../../../interfaces'
+
 import ledgerIcon from '../wallet-icons/icon-ledger'
 
 const LEDGER_LIVE_PATH = `m/44'/60'`
 const ACCOUNTS_TO_GET = 5
 
 function ledger(options: LedgerOptions & { networkId: number }): WalletModule {
-  const { rpcUrl, LedgerTransport, networkId, preferred, label, iconSrc, svg } =
-    options
+  const {
+    rpcUrl,
+    LedgerTransport,
+    networkId,
+    preferred,
+    label,
+    iconSrc,
+    svg,
+    customNetwork
+  } = options
 
   return {
     name: label || 'Ledger',
@@ -21,7 +35,8 @@ function ledger(options: LedgerOptions & { networkId: number }): WalletModule {
         LedgerTransport,
         BigNumber,
         networkName,
-        resetWalletState
+        resetWalletState,
+        customNetwork
       })
 
       return {
@@ -58,6 +73,7 @@ interface LedgerProviderOptions {
   rpcUrl: string
   LedgerTransport: any
   BigNumber: any
+  customNetwork?: HardwareWalletCustomNetwork
   networkName: (id: number) => string
   resetWalletState: (options?: {
     disconnected: boolean
@@ -70,7 +86,8 @@ async function ledgerProvider(options: LedgerProviderOptions) {
   const { generateAddresses, isValidPath } = await import('./hd-wallet')
   const { default: Eth } = await import('@ledgerhq/hw-app-eth')
 
-  const EthereumTx = await import('ethereumjs-tx')
+  const { Transaction } = await import('@ethereumjs/tx')
+  const { default: Common } = await import('@ethereumjs/common')
   const ethUtil = await import('ethereumjs-util')
   const buffer = await import('buffer')
   const { TypedDataUtils } = await import('eth-sig-util')
@@ -98,7 +115,8 @@ async function ledgerProvider(options: LedgerProviderOptions) {
     LedgerTransport,
     BigNumber,
     networkName,
-    resetWalletState
+    resetWalletState,
+    customNetwork
   } = options
 
   let dPath = ''
@@ -383,24 +401,36 @@ async function ledgerProvider(options: LedgerProviderOptions) {
 
   async function signTransaction(transactionData: any) {
     const path = [...addressToPath.values()][0]
-
+    const { BN, toBuffer } = ethUtil
+    const common = new Common({
+      chain: customNetwork || networkName(networkId)
+    })
     try {
-      const transaction = new EthereumTx.Transaction(transactionData, {
-        chain: networkName(networkId)
-      })
-
-      transaction.raw[6] = buffer.Buffer.from([networkId]) // v
-      transaction.raw[7] = buffer.Buffer.from([]) // r
-      transaction.raw[8] = buffer.Buffer.from([]) // s
+      const transaction = Transaction.fromTxData(
+        {
+          ...transactionData,
+          gasLimit: transactionData.gas ?? transactionData.gasLimit
+        },
+        { common, freeze: false }
+      )
+      transaction.v = new BN(toBuffer(networkId))
+      transaction.r = transaction.s = new BN(toBuffer(0))
 
       const ledgerResult = await eth.signTransaction(
         path,
         transaction.serialize().toString('hex')
       )
-
-      transaction.v = buffer.Buffer.from(ledgerResult.v, 'hex')
-      transaction.r = buffer.Buffer.from(ledgerResult.r, 'hex')
-      transaction.s = buffer.Buffer.from(ledgerResult.s, 'hex')
+      let v = ledgerResult.v.toString(16)
+      // EIP155 support. check/recalc signature v value.
+      const rv = parseInt(v, 16)
+      let cv = networkId * 2 + 35
+      if (rv !== cv && (rv & cv) !== rv) {
+        cv += 1 // add signature v bit.
+      }
+      v = cv.toString(16)
+      transaction.v = new BN(toBuffer(`0x${v}`))
+      transaction.r = new BN(toBuffer(`0x${ledgerResult.r}`))
+      transaction.s = new BN(toBuffer(`0x${ledgerResult.s}`))
 
       return `0x${transaction.serialize().toString('hex')}`
     } catch (error) {