Update to Ethers.js v5

package.json

@@ -73,6 +73,14 @@
     "webpack-merge": "^4.2.1"
   },
   "dependencies": {
+    "@ethersproject/bignumber": "^5.0.0-beta.126",
+    "@ethersproject/contracts": "^5.0.0-beta.129",
+    "@ethersproject/hdnode": "^5.0.0-beta.125",
+    "@ethersproject/keccak256": "^5.0.0-beta.124",
+    "@ethersproject/providers": "^5.0.0-beta.131",
+    "@ethersproject/strings": "^5.0.0-beta.125",
+    "@ethersproject/transactions": "^5.0.0-beta.125",
+    "@ethersproject/units": "^5.0.0-beta.124",
     "@hot-loader/react-dom": "^16.8.6",
     "@ledgerhq/hw-app-eth": "^4.60.3",
     "@ledgerhq/hw-transport": "^4.56.0",
@@ -81,7 +89,6 @@
     "@ledgerhq/hw-transport-webusb": "^4.56.0",
     "@mycrypto/ui": "^0.16.2",
     "eth-scan": "^0.1.2",
-    "ethers": "^4.0.28",
     "hdkey": "^1.1.1",
     "react": "^16.8.6",
     "react-dom": "^16.8.6",

src/components/Main/Main.tsx

@@ -2,7 +2,14 @@ import React, { FunctionComponent, useEffect } from 'react';
 import { StyledMain } from './StyledMain';
 import { connect, MapDispatchToProps } from 'react-redux';
 import { connectProvider, setNetwork } from '../../store/network';
-import { providers } from 'ethers';
+import {
+  EtherscanProvider,
+  FallbackProvider,
+  InfuraProvider,
+  JsonRpcProvider,
+  Provider,
+  Web3Provider
+} from '@ethersproject/providers';
 import { NETWORK_OFFLINE } from '../../config';
 
 interface Web3 {
@@ -12,7 +19,7 @@ interface Web3 {
 declare const window: { web3?: Web3 } & Window;
 
 interface DispatchProps {
-  handleConnect(provider: providers.Provider): void;
+  handleConnect(provider: Provider): void;
 
   handleOffline(): void;
 }
@@ -23,11 +30,11 @@ const Main: FunctionComponent<Props> = ({ handleConnect, handleOffline, children
   const initialize = () => {
     const provider =
       window.web3 && window.web3.currentProvider
-        ? new providers.Web3Provider(window.web3.currentProvider)
-        : new providers.FallbackProvider([
-            new providers.JsonRpcProvider('https://api.mycryptoapi.com/eth'),
-            new providers.InfuraProvider(),
-            new providers.EtherscanProvider()
+        ? new Web3Provider(window.web3.currentProvider)
+        : new FallbackProvider([
+            new JsonRpcProvider('https://api.mycryptoapi.com/eth'),
+            new InfuraProvider(),
+            new EtherscanProvider()
           ]);
 
     handleConnect(provider);
@@ -57,7 +64,7 @@ const Main: FunctionComponent<Props> = ({ handleConnect, handleOffline, children
 };
 
 const mapDispatchToProps: MapDispatchToProps<DispatchProps, {}> = dispatch => ({
-  handleConnect: (provider: providers.Provider) => dispatch(connectProvider(provider)),
+  handleConnect: (provider: Provider) => dispatch(connectProvider(provider)),
   handleOffline: () => dispatch(setNetwork(NETWORK_OFFLINE))
 });
 

src/config/abi.ts

@@ -0,0 +1,139 @@
+export const TOKEN_METADATA_ABI = [
+  {
+    constant: true,
+    inputs: [],
+    name: 'name',
+    outputs: [
+      {
+        name: '',
+        type: 'string'
+      }
+    ],
+    payable: false,
+    stateMutability: 'view',
+    type: 'function'
+  },
+  {
+    constant: true,
+    inputs: [],
+    name: 'symbol',
+    outputs: [
+      {
+        name: '',
+        type: 'string'
+      }
+    ],
+    payable: false,
+    stateMutability: 'view',
+    type: 'function'
+  },
+  {
+    constant: true,
+    inputs: [],
+    name: 'decimals',
+    outputs: [
+      {
+        name: '',
+        type: 'uint8'
+      }
+    ],
+    payable: false,
+    stateMutability: 'view',
+    type: 'function'
+  }
+];
+
+export const ALT_TOKEN_METADATA_ABI = [
+  {
+    constant: true,
+    inputs: [],
+    name: 'name',
+    outputs: [
+      {
+        name: '',
+        type: 'bytes32'
+      }
+    ],
+    payable: false,
+    stateMutability: 'view',
+    type: 'function'
+  },
+  {
+    constant: true,
+    inputs: [],
+    name: 'symbol',
+    outputs: [
+      {
+        name: '',
+        type: 'bytes32'
+      }
+    ],
+    payable: false,
+    stateMutability: 'view',
+    type: 'function'
+  },
+  {
+    constant: true,
+    inputs: [],
+    name: 'decimals',
+    outputs: [
+      {
+        name: '',
+        type: 'uint8'
+      }
+    ],
+    payable: false,
+    stateMutability: 'view',
+    type: 'function'
+  }
+];
+
+export const BALANCE_SCANNER_ABI = [
+  {
+    constant: true,
+    inputs: [
+      {
+        name: 'addresses',
+        type: 'address[]'
+      },
+      {
+        name: 'token',
+        type: 'address'
+      }
+    ],
+    name: 'tokenBalances',
+    outputs: [
+      {
+        name: 'balances',
+        type: 'uint256[]'
+      }
+    ],
+    payable: false,
+    stateMutability: 'view',
+    type: 'function'
+  },
+  {
+    constant: true,
+    inputs: [
+      {
+        name: 'addresses',
+        type: 'address[]'
+      }
+    ],
+    name: 'etherBalances',
+    outputs: [
+      {
+        name: 'balances',
+        type: 'uint256[]'
+      }
+    ],
+    payable: false,
+    stateMutability: 'view',
+    type: 'function'
+  },
+  {
+    payable: true,
+    stateMutability: 'payable',
+    type: 'fallback'
+  }
+];

src/config/index.ts

@@ -1,2 +1,3 @@
+export * from './abi';
 export * from './constants';
 export * from './derivation-paths';

src/store/ens/sagas.ts

@@ -1,20 +1,19 @@
 import { SagaIterator } from 'redux-saga';
 import { all, call, put, select, takeLatest } from 'redux-saga/effects';
 import { ApplicationState } from '../store';
-import { providers } from 'ethers';
 import { RESOLVE_NAME, ResolveNameAction } from './types';
 import { setResolvedAddress } from './actions';
 import { setAddress } from '../search';
+import { Provider } from '@ethersproject/providers';
 
 export function* ensSaga(): SagaIterator {
   yield all([takeLatest(RESOLVE_NAME, resolveNameSaga)]);
 }
 
-const getProvider = (state: ApplicationState): providers.Provider | undefined =>
-  state.network.provider;
+const getProvider = (state: ApplicationState): Provider | undefined => state.network.provider;
 
 function* resolveNameSaga({ payload }: ResolveNameAction): SagaIterator {
-  const provider: providers.Provider = yield select(getProvider);
+  const provider: Provider = yield select(getProvider);
   const address = yield call([provider, provider.resolveName], payload);
 
   if (address) {

src/store/network/actions.ts

@@ -15,10 +15,10 @@ import {
   SET_NETWORK,
   SetNetworkAction
 } from './types';
-import { providers } from 'ethers';
+import { Provider } from '@ethersproject/providers';
 import { Network } from '../../config';
 
-export const connectProvider: ActionCreator<ConnectAction> = (payload: providers.Provider) => ({
+export const connectProvider: ActionCreator<ConnectAction> = (payload: Provider) => ({
   type: CONNECT,
   payload
 });

src/store/network/sagas.ts

@@ -10,15 +10,15 @@ import {
   NETWORK_UNKNOWN,
   SearchType
 } from '../../config';
-import { providers } from 'ethers';
+import { Provider } from '@ethersproject/providers';
 import { Token } from '../tokens';
 import { getEtherBalances, getTokenBalances } from '../../utils';
 
 export function* networkSaga(): SagaIterator {
   yield all([takeLatest(CONNECT, connectSaga), takeEvery(FETCH_BALANCES, fetchBalancesSaga)]);
 }
 
-const getNetwork = async (provider: providers.Provider): Promise<Network> => {
+const getNetwork = async (provider: Provider): Promise<Network> => {
   const id = (await provider.getNetwork()).chainId;
   switch (id) {
     case 1:
@@ -39,8 +39,7 @@ function* connectSaga({ payload }: ConnectAction): SagaIterator {
   yield put(setNetwork(network));
 }
 
-const getProvider = (state: ApplicationState): providers.Provider | undefined =>
-  state.network.provider;
+const getProvider = (state: ApplicationState): Provider | undefined => state.network.provider;
 
 const getAddresses = (state: ApplicationState): Address[] => state.network.addresses;
 
@@ -67,7 +66,7 @@ function* fetchEtherBalances(addresses: Address[]): SagaIterator {
   const balance: utils.BigNumber = yield call([provider, provider.getBalance], address.address);
   return utils.formatUnits(balance, 18);*/
 
-  const provider: providers.Provider = yield select(getProvider);
+  const provider: Provider = yield select(getProvider);
 
   return yield call(getEtherBalances, provider, addresses);
 }
@@ -81,7 +80,7 @@ function* fetchTokenBalances(addresses: Address[]): SagaIterator {
   const balance: utils.BigNumber = yield call(getTokenBalance, provider, token, address.address);
   return utils.formatUnits(balance, token.decimals);*/
 
-  const provider: providers.Provider = yield select(getProvider);
+  const provider: Provider = yield select(getProvider);
   const token: Token = yield select(getToken);
 
   return yield call(getTokenBalances, provider, addresses, token);

src/store/network/types.ts

@@ -1,5 +1,5 @@
 import { Action } from 'redux';
-import { providers } from 'ethers';
+import { Provider } from '@ethersproject/providers';
 import { Network } from '../../config';
 
 export interface Address {
@@ -14,7 +14,7 @@ export interface Balance {
 }
 
 export interface NetworkState {
-  provider?: providers.Provider;
+  provider?: Provider;
   current?: Network;
   addresses: Address[];
   balances: Balance[];
@@ -23,7 +23,7 @@ export interface NetworkState {
 export const CONNECT = 'CONNECT';
 export interface ConnectAction extends Action {
   type: typeof CONNECT;
-  payload: providers.Provider;
+  payload: Provider;
 }
 
 export const SET_NETWORK = 'SET_NETWORK';

src/store/tokens/sagas.ts

@@ -1,7 +1,7 @@
 import { SagaIterator } from 'redux-saga';
 import { all, select, takeLatest, call, put } from 'redux-saga/effects';
 import { ApplicationState } from '../store';
-import { providers } from 'ethers';
+import { Provider } from '@ethersproject/providers';
 import { FETCH_TOKEN, FetchTokenAction } from './types';
 import { getTokenInfo } from '../../utils';
 import { setToken } from './actions';
@@ -10,11 +10,10 @@ export function* tokensSaga(): SagaIterator {
   yield all([takeLatest(FETCH_TOKEN, fetchTokenSaga)]);
 }
 
-const getProvider = (state: ApplicationState): providers.Provider | undefined =>
-  state.network.provider;
+const getProvider = (state: ApplicationState): Provider | undefined => state.network.provider;
 
 function* fetchTokenSaga({ payload }: FetchTokenAction): SagaIterator {
-  const provider: providers.Provider = yield select(getProvider);
+  const provider: Provider = yield select(getProvider);
 
   try {
     const tokenInfo = yield call(getTokenInfo, provider, payload);

src/utils/balance.ts

@@ -1,6 +1,6 @@
 import { Address, Balance } from '../store/network';
-import { providers } from 'ethers';
 import { Token } from '../store/tokens';
+import { Provider } from '@ethersproject/providers';
 import EthScan, { EthersProvider } from 'eth-scan';
 
 /**
@@ -14,7 +14,7 @@ import EthScan, { EthersProvider } from 'eth-scan';
  *   balance.
  */
 export const getEtherBalances = async (
-  provider: providers.Provider,
+  provider: Provider,
   addresses: Address[]
 ): Promise<Balance[]> => {
   const scanner = new EthScan(new EthersProvider(provider));
@@ -40,7 +40,7 @@ export const getEtherBalances = async (
  *   balance.
  */
 export const getTokenBalances = async (
-  provider: providers.Provider,
+  provider: Provider,
   addresses: Address[],
   token: Token
 ): Promise<Balance[]> => {