UI using Commons (#145)

* ui using commons

* Update paths in abis

* Lint.

commons/abis.js

@@ -1,17 +1,18 @@
-const path = '../contracts/build/contracts/'
+const HOME_NATIVE_TO_ERC_ABI = require('../contracts/build/contracts/HomeBridgeNativeToErc').abi
-
+const FOREIGN_NATIVE_TO_ERC_ABI = require('../contracts/build/contracts/ForeignBridgeNativeToErc')
-const HOME_NATIVE_TO_ERC_ABI = require(`${path}HomeBridgeNativeToErc`).abi
+  .abi
-const FOREIGN_NATIVE_TO_ERC_ABI = require(`${path}ForeignBridgeNativeToErc`).abi
+const HOME_ERC_TO_ERC_ABI = require('../contracts/build/contracts/HomeBridgeErcToErc').abi
-const HOME_ERC_TO_ERC_ABI = require(`${path}HomeBridgeErcToErc`).abi
+const FOREIGN_ERC_TO_ERC_ABI = require('../contracts/build/contracts/ForeignBridgeErc677ToErc677')
-const FOREIGN_ERC_TO_ERC_ABI = require(`${path}ForeignBridgeErc677ToErc677`).abi
+  .abi
-const HOME_ERC_TO_NATIVE_ABI = require(`${path}HomeBridgeErcToNative`).abi
+const HOME_ERC_TO_NATIVE_ABI = require('../contracts/build/contracts/HomeBridgeErcToNative').abi
-const FOREIGN_ERC_TO_NATIVE_ABI = require(`${path}ForeignBridgeErcToNative`).abi
+const FOREIGN_ERC_TO_NATIVE_ABI = require('../contracts/build/contracts/ForeignBridgeErcToNative')
-const ERC20_ABI = require(`${path}ERC20`).abi
+  .abi
-const ERC677_ABI = require(`${path}ERC677`).abi
+const ERC20_ABI = require('../contracts/build/contracts/ERC20').abi
-const ERC677_BRIDGE_TOKEN_ABI = require(`${path}ERC677BridgeToken`).abi
+const ERC677_ABI = require('../contracts/build/contracts/ERC677').abi
-const BLOCK_REWARD_ABI = require(`${path}IBlockReward`).abi
+const ERC677_BRIDGE_TOKEN_ABI = require('../contracts/build/contracts/ERC677BridgeToken').abi
-const BRIDGE_VALIDATORS_ABI = require(`${path}BridgeValidators`).abi
+const BLOCK_REWARD_ABI = require('../contracts/build/contracts/IBlockReward').abi
-const REWARDABLE_VALIDATORS_ABI = require(`${path}RewardableValidators`).abi
+const BRIDGE_VALIDATORS_ABI = require('../contracts/build/contracts/BridgeValidators').abi
+const REWARDABLE_VALIDATORS_ABI = require('../contracts/build/contracts/RewardableValidators').abi
 
 const { homeV1Abi, foreignViAbi } = require('./v1Abis')
 const { BRIDGE_MODES } = require('./constants')

ui/Dockerfile

@@ -3,6 +3,7 @@ FROM node:8
 WORKDIR /mono
 COPY package.json .
 COPY contracts/package.json ./contracts/
+COPY commons/package.json ./commons/
 COPY ui/package.json ./ui/
 COPY ui/lib/web3-eth/index.js ./ui/lib/web3-eth/index.js
 COPY yarn.lock .
@@ -12,6 +13,8 @@ COPY ./contracts ./contracts
 RUN yarn run compile:contracts
 RUN mv ./contracts/build ./ && rm -rf ./contracts/* ./contracts/.[!.]* && mv ./build ./contracts/
 
+COPY ./commons ./commons
+
 COPY ./ui ./ui
 WORKDIR /mono/ui
 CMD echo "To start a UI application run:" \

ui/src/components/Bridge.js

@@ -4,7 +4,7 @@ import { toHex } from 'web3-utils'
 import foreignLogoPurple from '../assets/images/logos/logo-poa-20-purple@2x.png'
 import homeLogoPurple from '../assets/images/logos/logo-poa-sokol-purple@2x.png'
 import swal from 'sweetalert'
-import { BRIDGE_MODES, ERC_TYPES } from '../stores/utils/bridgeMode'
+import { BRIDGE_MODES, ERC_TYPES } from '../../../commons'
 import { BridgeAddress } from './index'
 import { BridgeForm } from './index'
 import { BridgeNetwork } from './index'

ui/src/components/StatisticsPage.js

@@ -1,6 +1,6 @@
 import React from 'react'
 import yn from './utils/yn'
-import { BRIDGE_MODES } from '../stores/utils/bridgeMode'
+import { BRIDGE_MODES } from '../../../commons'
 import { BridgeStatistics } from './index'
 import { Redirect } from 'react-router'
 import { TransactionsStatistics } from './TransactionsStatistics'

ui/src/stores/ForeignStore.js

@@ -1,6 +1,14 @@
 import { action, observable } from 'mobx'
-import { abi as ERC677_ABI } from '../../../contracts/build/contracts/ERC677BridgeToken.json'
 import { getBlockNumber } from './utils/web3'
+import {
+  BRIDGE_VALIDATORS_ABI,
+  ERC677_BRIDGE_TOKEN_ABI,
+  BRIDGE_MODES,
+  FEE_MANAGER_MODE,
+  getUnit,
+  decodeFeeManagerMode,
+  getBridgeABIs
+} from '../../../commons'
 import {
   getMaxPerTxLimit,
   getMinPerTxLimit,
@@ -26,14 +34,6 @@ import {
 } from './utils/contract'
 import { balanceLoaded, removePendingTransaction } from './utils/testUtils'
 import sleep from './utils/sleep'
-import {
-  getBridgeABIs,
-  getUnit,
-  BRIDGE_MODES,
-  decodeFeeManagerMode,
-  FEE_MANAGER_MODE
-} from './utils/bridgeMode'
-import { abi as BRIDGE_VALIDATORS_ABI } from '../../../contracts/build/contracts/BridgeValidators'
 import ERC20Bytes32Abi from './utils/ERC20Bytes32.abi'
 import BN from 'bignumber.js'
 import { processLargeArrayAsync } from './utils/array'
@@ -186,7 +186,10 @@ class ForeignStore {
         this.rootStore.bridgeMode === BRIDGE_MODES.ERC_TO_NATIVE
           ? await getErc20TokenAddress(this.foreignBridge)
           : await getErc677TokenAddress(this.foreignBridge)
-      this.tokenContract = new this.foreignWeb3.eth.Contract(ERC677_ABI, this.tokenAddress)
+      this.tokenContract = new this.foreignWeb3.eth.Contract(
+        ERC677_BRIDGE_TOKEN_ABI,
+        this.tokenAddress
+      )
       this.tokenType = await getTokenType(this.tokenContract, this.FOREIGN_BRIDGE_ADDRESS)
       const alternativeContract = new this.foreignWeb3.eth.Contract(
         ERC20Bytes32Abi,

ui/src/stores/HomeStore.js

@@ -1,9 +1,16 @@
 import { action, observable } from 'mobx'
-import { abi as BRIDGE_VALIDATORS_ABI } from '../../../contracts/build/contracts/BridgeValidators.json'
-import { abi as ERC677_ABI } from '../../../contracts/build/contracts/ERC677BridgeToken.json'
-import { abi as BLOCK_REWARD_ABI } from '../../../contracts/build/contracts/IBlockReward'
 import { getBlockNumber, getBalance } from './utils/web3'
 import { fromDecimals } from './utils/decimals'
+import {
+  BRIDGE_VALIDATORS_ABI,
+  ERC677_BRIDGE_TOKEN_ABI,
+  BLOCK_REWARD_ABI,
+  BRIDGE_MODES,
+  FEE_MANAGER_MODE,
+  getUnit,
+  decodeFeeManagerMode,
+  getBridgeABIs
+} from '../../../commons'
 import {
   getMaxPerTxLimit,
   getMinPerTxLimit,
@@ -33,13 +40,6 @@ import {
 import { balanceLoaded, removePendingTransaction } from './utils/testUtils'
 import sleep from './utils/sleep'
 import BN from 'bignumber.js'
-import {
-  getBridgeABIs,
-  getUnit,
-  BRIDGE_MODES,
-  decodeFeeManagerMode,
-  FEE_MANAGER_MODE
-} from './utils/bridgeMode'
 import ERC20Bytes32Abi from './utils/ERC20Bytes32.abi'
 import { processLargeArrayAsync } from './utils/array'
 import { getRewardableData } from './utils/rewardable'
@@ -193,7 +193,10 @@ class HomeStore {
   async getTokenInfo() {
     try {
       this.tokenAddress = await getErc677TokenAddress(this.homeBridge)
-      this.tokenContract = new this.homeWeb3.eth.Contract(ERC677_ABI, this.tokenAddress)
+      this.tokenContract = new this.homeWeb3.eth.Contract(
+        ERC677_BRIDGE_TOKEN_ABI,
+        this.tokenAddress
+      )
       this.symbol = await getSymbol(this.tokenContract)
       this.tokenName = await getName(this.tokenContract)
       const alternativeContract = new this.homeWeb3.eth.Contract(ERC20Bytes32Abi, this.tokenAddress)

ui/src/stores/RootStore.js

@@ -5,8 +5,7 @@ import ForeignStore from './ForeignStore'
 import AlertStore from './AlertStore'
 import GasPriceStore from './GasPriceStore'
 import TxStore from './TxStore'
-import { abi as HOME_ERC_ABI } from '../../../contracts/build/contracts/HomeBridgeErcToErc'
+import { decodeBridgeMode, HOME_ERC_TO_ERC_ABI } from '../../../commons'
-import { decodeBridgeMode } from './utils/bridgeMode'
 import { getWeb3Instance } from './utils/web3'
 
 class RootStore {
@@ -25,7 +24,7 @@ class RootStore {
   async setBridgeMode() {
     const homeWeb3 = getWeb3Instance(process.env.REACT_APP_HOME_HTTP_PARITY_URL)
     const homeBridge = new homeWeb3.eth.Contract(
-      HOME_ERC_ABI,
+      HOME_ERC_TO_ERC_ABI,
       process.env.REACT_APP_HOME_BRIDGE_ADDRESS
     )
     const bridgeModeHash = await homeBridge.methods.getBridgeMode().call()

ui/src/stores/TxStore.js

@@ -1,7 +1,7 @@
 import { action, observable } from 'mobx'
 import { estimateGas } from './utils/web3'
 import { addPendingTransaction, removePendingTransaction } from './utils/testUtils'
-import { getUnit } from './utils/bridgeMode'
+import { getUnit } from '../../../commons'
 import yn from '../components/utils/yn'
 
 class TxStore {

ui/src/stores/Web3Store.js

@@ -1,7 +1,7 @@
 import { action, observable } from 'mobx'
 import getWeb3, { getBalance, getWeb3Instance, getNetwork } from './utils/web3'
 import { balanceLoaded } from './utils/testUtils'
-import { BRIDGE_MODES } from './utils/bridgeMode'
+import { BRIDGE_MODES } from '../../../commons'
 
 class Web3Store {
   @observable

ui/src/stores/__tests__/HomeStore.test.js

@@ -1,7 +1,7 @@
 import Web3 from 'web3'
 import BN from 'bignumber.js'
 import HomeStore from '../HomeStore'
-import { BRIDGE_MODES } from '../utils/bridgeMode'
+import { BRIDGE_MODES } from '../../../../commons'
 import * as contract from '../utils/contract'
 import * as web3StoreUtils from '../utils/web3'
 

ui/src/stores/utils/__tests__/contract.test.js

@@ -1,6 +1,6 @@
 import BN from 'bignumber.js'
 import { getTokenType, mintedTotallyByBridge } from '../contract'
-import { ERC_TYPES } from '../bridgeMode'
+import { ERC_TYPES } from '../../../../../commons'
 
 describe('getTokenType', () => {
   it('should return ERC677 if bridgeContract is equal to bridgeAddress', async () => {

ui/src/stores/utils/__tests__/rewardable.test.js

@@ -1,5 +1,5 @@
 import { getFeeToApply, validFee, getRewardableData } from '../rewardable'
-import { FEE_MANAGER_MODE } from '../bridgeMode'
+import { FEE_MANAGER_MODE } from '../../../../../commons'
 import BN from 'bignumber.js'
 
 describe('validFee', () => {

ui/src/stores/utils/bridgeMode.js

@@ -1,85 +0,0 @@
-import { abi as HOME_NATIVE_TO_ERC_ABI } from '../../../../contracts/build/contracts/HomeBridgeNativeToErc.json'
-import { abi as FOREIGN_NATIVE_TO_ERC_ABI } from '../../../../contracts/build/contracts/ForeignBridgeNativeToErc.json'
-import { abi as HOME_ERC_TO_ERC_ABI } from '../../../../contracts/build/contracts/HomeBridgeErcToErc.json'
-import { abi as FOREIGN_ERC_TO_ERC_ABI } from '../../../../contracts/build/contracts/ForeignBridgeErcToErc.json'
-import { abi as HOME_ERC_TO_NATIVE_ABI } from '../../../../contracts/build/contracts/HomeBridgeErcToNative.json'
-import { abi as FOREIGN_ERC_TO_NATIVE_ABI } from '../../../../contracts/build/contracts/ForeignBridgeErcToNative.json'
-
-export const BRIDGE_MODES = {
-  NATIVE_TO_ERC: 'NATIVE_TO_ERC',
-  ERC_TO_ERC: 'ERC_TO_ERC',
-  ERC_TO_NATIVE: 'ERC_TO_NATIVE'
-}
-
-export const FEE_MANAGER_MODE = {
-  ONE_DIRECTION: 'ONE_DIRECTION',
-  BOTH_DIRECTIONS: 'BOTH_DIRECTIONS',
-  UNDEFINED: 'UNDEFINED'
-}
-
-export const ERC_TYPES = {
-  ERC677: 'ERC677',
-  ERC20: 'ERC20'
-}
-
-export const getBridgeABIs = bridgeMode => {
-  let HOME_ABI = null
-  let FOREIGN_ABI = null
-  if (bridgeMode === BRIDGE_MODES.NATIVE_TO_ERC) {
-    HOME_ABI = HOME_NATIVE_TO_ERC_ABI
-    FOREIGN_ABI = FOREIGN_NATIVE_TO_ERC_ABI
-  } else if (bridgeMode === BRIDGE_MODES.ERC_TO_ERC) {
-    HOME_ABI = HOME_ERC_TO_ERC_ABI
-    FOREIGN_ABI = FOREIGN_ERC_TO_ERC_ABI
-  } else if (bridgeMode === BRIDGE_MODES.ERC_TO_NATIVE) {
-    HOME_ABI = HOME_ERC_TO_NATIVE_ABI
-    FOREIGN_ABI = FOREIGN_ERC_TO_NATIVE_ABI
-  } else {
-    throw new Error(`Unrecognized bridge mode: ${bridgeMode}`)
-  }
-
-  return { HOME_ABI, FOREIGN_ABI }
-}
-
-export const decodeBridgeMode = bridgeModeHash => {
-  switch (bridgeModeHash) {
-    case '0x92a8d7fe':
-      return BRIDGE_MODES.NATIVE_TO_ERC
-    case '0xba4690f5':
-      return BRIDGE_MODES.ERC_TO_ERC
-    case '0x18762d46':
-      return BRIDGE_MODES.ERC_TO_NATIVE
-    default:
-      throw new Error(`Unrecognized bridge mode hash: '${bridgeModeHash}'`)
-  }
-}
-
-export const getUnit = bridgeMode => {
-  let unitHome = null
-  let unitForeign = null
-  if (bridgeMode === BRIDGE_MODES.NATIVE_TO_ERC) {
-    unitHome = 'Native coins'
-    unitForeign = 'Tokens'
-  } else if (bridgeMode === BRIDGE_MODES.ERC_TO_ERC) {
-    unitHome = 'Tokens'
-    unitForeign = 'Tokens'
-  } else if (bridgeMode === BRIDGE_MODES.ERC_TO_NATIVE) {
-    unitHome = 'Native coins'
-    unitForeign = 'Tokens'
-  } else {
-    throw new Error(`Unrecognized bridge mode: ${bridgeMode}`)
-  }
-
-  return { unitHome, unitForeign }
-}
-
-export const decodeFeeManagerMode = managerModeHash => {
-  switch (managerModeHash) {
-    case '0xf2aed8f7':
-      return FEE_MANAGER_MODE.ONE_DIRECTION
-    case '0xd7de965f':
-      return FEE_MANAGER_MODE.BOTH_DIRECTIONS
-    default:
-      throw new Error(`Unrecognized fee manager mode hash: '${managerModeHash}'`)
-  }
-}

ui/src/stores/utils/contract.js

@@ -1,8 +1,7 @@
 import BN from 'bignumber.js'
 import { fromDecimals } from './decimals'
 import { fromWei } from 'web3-utils'
-import { abi as rewardableValidatorsAbi } from '../../../../contracts/build/contracts/RewardableValidators'
+import { ERC_TYPES, REWARDABLE_VALIDATORS_ABI } from '../../../../commons'
-import { ERC_TYPES } from './bridgeMode'
 
 export const ZERO_ADDRESS = '0x0000000000000000000000000000000000000000'
 
@@ -64,7 +63,7 @@ export const totalBurntCoins = async contract => {
 }
 
 export const getValidatorList = async (address, eth) => {
-  const validatorsContract = new eth.Contract(rewardableValidatorsAbi, address)
+  const validatorsContract = new eth.Contract(REWARDABLE_VALIDATORS_ABI, address)
   const validators = await validatorList(validatorsContract)
 
   if (validators.length) {

ui/src/stores/utils/rewardable.js

@@ -1,5 +1,5 @@
 import BN from 'bignumber.js'
-import { FEE_MANAGER_MODE } from './bridgeMode'
+import { FEE_MANAGER_MODE } from '../../../../commons'
 
 export const validFee = fee => {
   const zeroBN = new BN(0)