Clean up send.js and eth-balance.js with es6.

ui/app/actions.js

@@ -352,16 +352,16 @@ function showInfoPage () {
 
 function setCurrentCurrency (currencyCode) {
   return (dispatch) => {
-    dispatch(this.showLoadingIndication())
+    dispatch(actions.showLoadingIndication())
     log.debug(`background.setCurrentCurrency`)
     background.setCurrentCurrency(currencyCode, (err, data) => {
-      dispatch(this.hideLoadingIndication())
+      dispatch(actions.hideLoadingIndication())
       if (err) {
         log.error(err.stack)
         return dispatch(actions.displayWarning(err.message))
       }
       dispatch({
-        type: this.SET_CURRENT_FIAT,
+        type: actions.SET_CURRENT_FIAT,
         value: {
           currentCurrency: data.currentCurrency,
           conversionRate: data.conversionRate,

ui/app/components/eth-balance.js

@@ -1,8 +1,10 @@
-const Component = require('react').Component
+const { Component } = require('react')
 const h = require('react-hyperscript')
-const inherits = require('util').inherits
+const { inherits } = require('util')
-const formatBalance = require('../util').formatBalance
+const {
-const generateBalanceObject = require('../util').generateBalanceObject
+  formatBalance,
+  generateBalanceObject
+} = require('../util')
 const Tooltip = require('./tooltip.js')
 const FiatValue = require('./fiat-value.js')
 
@@ -14,11 +16,10 @@ function EthBalanceComponent () {
 }
 
 EthBalanceComponent.prototype.render = function () {
-  var props = this.props
+  const props = this.props
-  let { value } = props
+  const { value, style, width, needsParse = true } = props
-  const { style, width } = props
+
-  var needsParse = this.props.needsParse !== undefined ? this.props.needsParse : true
+  const formattedValue = value ? formatBalance(value, 6, needsParse) : '...'
-  value = value ? formatBalance(value, 6, needsParse) : '...'
 
   return (
 
@@ -30,13 +31,15 @@ EthBalanceComponent.prototype.render = function () {
           display: 'inline',
           width,
         },
-      }, this.renderBalance(value)),
+      }, this.renderBalance(formattedValue)),
     ])
 
   )
 }
 EthBalanceComponent.prototype.renderBalance = function (value) {
-  var props = this.props
+  if (value === 'None') return value
+  if (value === '...') return value
+
   const {
     conversionRate,
     shorten,
@@ -44,34 +47,22 @@ EthBalanceComponent.prototype.renderBalance = function (value) {
     currentCurrency,
     hideTooltip,
     styleOveride,
-  } = props
+    showFiat = true,
-
+  } = this.props
   const { fontSize, color, fontFamily, lineHeight } = styleOveride
 
-  if (value === 'None') return value
+  const { shortBalance, balance, label } = generateBalanceObject(value, shorten ? 1 : 3)
-  if (value === '...') return value
+  const balanceToRender = shorten ? shortBalance : balance
-  var balanceObj = generateBalanceObject(value, shorten ? 1 : 3)
-  var balance
-  var splitBalance = value.split(' ')
-  var ethNumber = splitBalance[0]
-  var ethSuffix = splitBalance[1]
-  const showFiat = 'showFiat' in props ? props.showFiat : true
 
-  if (shorten) {
+  const [ethNumber, ethSuffix] = value.split(' ')
-    balance = balanceObj.shortBalance
+  const containerProps = hideTooltip ? {} : {
-  } else {
-    balance = balanceObj.balance
-  }
-
-  var label = balanceObj.label
-  const tooltipProps = hideTooltip ? {} : {
     position: 'bottom',
     title: `${ethNumber} ${ethSuffix}`,
   };
 
   return (
     h(hideTooltip ? 'div' : Tooltip,
-      tooltipProps,
+      containerProps,
       h('div.flex-column', [
         h('.flex-row', {
           style: {
@@ -88,7 +79,7 @@ EthBalanceComponent.prototype.renderBalance = function (value) {
               fontSize: fontSize || 'inherit',
               color: color || 'inherit',
             },
-          }, incoming ? `+${balance}` : balance),
+          }, incoming ? `+${balanceToRender}` : balanceToRender),
           h('div', {
             style: {
               color: color || '#AEAEAE',
@@ -98,7 +89,8 @@ EthBalanceComponent.prototype.renderBalance = function (value) {
           }, label),
         ]),
 
-        showFiat ? h(FiatValue, { value: props.value, conversionRate, currentCurrency }) : null,
+        showFiat ? h(FiatValue, { value: this.props.value, conversionRate, currentCurrency }) : null,
-      ]))
+      ])
+    )
   )
 }

ui/app/send.js

@@ -1,49 +1,68 @@
-const inherits = require('util').inherits
+const { inherits } = require('util')
 const PersistentForm = require('../lib/persistent-form')
 const h = require('react-hyperscript')
 const connect = require('react-redux').connect
 const Identicon = require('./components/identicon')
-const actions = require('./actions')
-const util = require('./util')
-const ethUtil = require('ethereumjs-util')
-const BN = ethUtil.BN
 const hexToBn = require('../../app/scripts/lib/hex-to-bn')
-const numericBalance = require('./util').numericBalance
-const addressSummary = require('./util').addressSummary
-const bnMultiplyByFraction = require('./util').bnMultiplyByFraction
-const isHex = require('./util').isHex
 const EthBalance = require('./components/eth-balance')
 const EnsInput = require('./components/ens-input')
-const FiatValue = require('./components/fiat-value.js')
+const FiatValue = require('./components/fiat-value')
-const GasTooltip = require('./components/gas-tooltip.js')
+const GasTooltip = require('./components/gas-tooltip')
 const { getSelectedIdentity } = require('./selectors')
-const getTxFeeBn = require('./util').getTxFeeBn
+
+const {
+  setCurrentCurrency,
+  showAccountsPage,
+  backToAccountDetail,
+  displayWarning,
+  hideWarning,
+  addToAddressBook,
+  signTx,
+} = require('./actions')
+const { stripHexPrefix, addHexPrefix, BN } = require('ethereumjs-util')
+const {
+  addressSummary,
+  bnMultiplyByFraction,
+  getTxFeeBn,
+  isHex,
+  numericBalance,
+} = require('./util')
 
 const ARAGON = '960b236A07cf122663c4303350609A66A7B288C0'
 
 module.exports = connect(mapStateToProps)(SendTransactionScreen)
 
 function mapStateToProps (state) {
-  var result = {
+  const {
-    selectedIdentity: getSelectedIdentity(state),
+    selectedAddress: address,
-    address: state.metamask.selectedAddress,
+    accounts,
-    accounts: state.metamask.accounts,
+    identities,
-    identities: state.metamask.identities,
+    network,
-    warning: state.appState.warning,
+    addressBook,
-    network: state.metamask.network,
+    conversionRate,
-    addressBook: state.metamask.addressBook,
+    currentCurrency,
-    conversionRate: state.metamask.conversionRate,
+    currentBlockGasLimit: blockGasLimit,
-    currentCurrency: state.metamask.currentCurrency,
+  } = state.metamask
-    blockGasLimit: state.metamask.currentBlockGasLimit,
+  const { warning } = state.appState
+  const selectedIdentity = getSelectedIdentity(state)
+  const account = accounts[address]
+
+  return {
+    address,
+    accounts,
+    identities,
+    network,
+    addressBook,
+    conversionRate,
+    currentCurrency,
+    blockGasLimit,
+    warning,
+    selectedIdentity,
+    error: warning && warning.split('.')[0],
+    account,
+    identity: identities[address],
+    balance: account ? numericBalance(account.balance) : null,
   }
-
-  result.error = result.warning && result.warning.split('.')[0]
-
-  result.account = result.accounts[result.address]
-  result.identity = result.identities[result.address]
-  result.balance = result.account ? numericBalance(result.account.balance) : null
-
-  return result
 }
 
 inherits(SendTransactionScreen, PersistentForm)
@@ -588,17 +607,17 @@ SendTransactionScreen.prototype.closeTooltip = function () {
 }
 
 SendTransactionScreen.prototype.setCurrentCurrency = function (newCurrency) {
-  this.props.dispatch(actions.setCurrentCurrency(newCurrency))
+  this.props.dispatch(setCurrentCurrency(newCurrency))
 }
 
 SendTransactionScreen.prototype.navigateToAccounts = function (event) {
   event.stopPropagation()
-  this.props.dispatch(actions.showAccountsPage())
+  this.props.dispatch(showAccountsPage())
 }
 
 SendTransactionScreen.prototype.back = function () {
   var address = this.props.address
-  this.props.dispatch(actions.backToAccountDetail(address))
+  this.props.dispatch(backToAccountDetail(address))
 }
 
 SendTransactionScreen.prototype.recipientDidChange = function (recipient, nickname) {
@@ -644,14 +663,14 @@ SendTransactionScreen.prototype.onSubmit = function () {
   //   return this.props.dispatch(actions.displayWarning(message))
   // }
 
-  if (txData && !isHex(ethUtil.stripHexPrefix(txData))) {
+  if (txData && !isHex(stripHexPrefix(txData))) {
     message = 'Transaction data must be hex string.'
-    return this.props.dispatch(actions.displayWarning(message))
+    return this.props.dispatch(displayWarning(message))
   }
 
-  this.props.dispatch(actions.hideWarning())
+  this.props.dispatch(hideWarning())
 
-  this.props.dispatch(actions.addToAddressBook(recipient, nickname))
+  this.props.dispatch(addToAddressBook(recipient, nickname))
 
   // var txParams = {
   //   // from: this.props.address,
@@ -672,8 +691,8 @@ SendTransactionScreen.prototype.onSubmit = function () {
     value: '0x0',
   }
 
-  if (recipient) txParams.to = ethUtil.addHexPrefix(recipient)
+  if (recipient) txParams.to = addHexPrefix(recipient)
   if (txData) txParams.data = txData
 
-  this.props.dispatch(actions.signTx(txParams))
+  this.props.dispatch(signTx(txParams))
 }