Core of the refactor complete

6 files changed, 75 insertions, 38 deletions

diff --git a/ui/app/components/send_/send-content/send-amount-row/amount-max-button/amount-max-button.component.js b/ui/app/components/send_/send-content/send-amount-row/amount-max-button/amount-max-button.component.js
index 59a1fd6db..6705a332d 100644
--- a/ui/app/components/send_/send-content/send-amount-row/amount-max-button/amount-max-button.component.js
+++ b/ui/app/components/send_/send-content/send-amount-row/amount-max-button/amount-max-button.component.js
@@ -31,7 +31,7 @@ export default class AmountMaxButton extends Component {
   }
 
   render () {
-    const { setMaxModeTo } = this.props
+    const { setMaxModeTo, maxModeOn } = this.props
 
     return (
       <div
@@ -42,7 +42,7 @@ export default class AmountMaxButton extends Component {
           this.setAmountToMax()
         }}
       >
-        {!maxModeOn ? this.context.t('max') : '' ])}
+        {!maxModeOn ? this.context.t('max') : ''}
       </div>
     );
   }
diff --git a/ui/app/components/send_/send-content/send-amount-row/amount-max-button/amount-max-button.container.js b/ui/app/components/send_/send-content/send-amount-row/amount-max-button/amount-max-button.container.js
index 572e1fc46..1b694902f 100644
--- a/ui/app/components/send_/send-content/send-amount-row/amount-max-button/amount-max-button.container.js
+++ b/ui/app/components/send_/send-content/send-amount-row/amount-max-button/amount-max-button.container.js
@@ -1,3 +1,4 @@
+import { connect } from 'react-redux'
 import {
   getSelectedToken,
   getGasTotal,
diff --git a/ui/app/components/send_/send-content/send-amount-row/send-amount-row.component.js b/ui/app/components/send_/send-content/send-amount-row/send-amount-row.component.js
index 78038f714..544664dc8 100644
--- a/ui/app/components/send_/send-content/send-amount-row/send-amount-row.component.js
+++ b/ui/app/components/send_/send-content/send-amount-row/send-amount-row.component.js
@@ -1,15 +1,14 @@
 import React, { Component } from 'react'
 import PropTypes from 'prop-types'
 import SendRowWrapper from '../send-row-wrapper/send-row-wrapper.component'
-import AmountMaxButton from '../amount-max-button/amount-max-button.component'
+import AmountMaxButton from './amount-max-button/amount-max-button.component'
 import CurrencyDisplay from '../../../send/currency-display'
 
 export default class SendAmountRow extends Component {
 
   static propTypes = {
-    amountConversionRate: PropTypes.string,
-    conversionRate: PropTypes.string,
-    from: PropTypes.object,
+    amountConversionRate: PropTypes.number,
+    conversionRate: PropTypes.number,
     gasTotal: PropTypes.string,
     primaryCurrency: PropTypes.string,
     selectedToken: PropTypes.object,
@@ -23,7 +22,7 @@ export default class SendAmountRow extends Component {
     const {
       amountConversionRate,
       conversionRate,
-      from: { balance },
+      balance,
       gasTotal,
       primaryCurrency,
       selectedToken,
@@ -69,16 +68,16 @@ export default class SendAmountRow extends Component {
         showError={inError}
         errorType={'amount'}
       >
-        !inError && gasTotal && <AmountMaxButton />
+        {!inError && gasTotal && <AmountMaxButton />}
         <CurrencyDisplay
-          inError={inError},
-          primaryCurrency={primaryCurrency},
-          convertedCurrency={convertedCurrency},
-          selectedToken={selectedToken},
-          value={amount || '0x0'},
-          conversionRate={amountConversionRate},
-          handleChange={this.handleAmountChange},
-        >
+          inError={inError}
+          primaryCurrency={primaryCurrency}
+          convertedCurrency={convertedCurrency}
+          selectedToken={selectedToken}
+          value={amount || '0x0'}
+          conversionRate={amountConversionRate}
+          handleChange={newAmount => this.handleAmountChange(newAmount)}
+        />
       </SendRowWrapper>
     );
   }
diff --git a/ui/app/components/send_/send-content/send-amount-row/send-amount-row.container.js b/ui/app/components/send_/send-content/send-amount-row/send-amount-row.container.js
index 098855a02..55df68e69 100644
--- a/ui/app/components/send_/send-content/send-amount-row/send-amount-row.container.js
+++ b/ui/app/components/send_/send-content/send-amount-row/send-amount-row.container.js
@@ -1,41 +1,44 @@
+import { connect } from 'react-redux'
 import {
   getSelectedToken,
-  getPrimaryCurrency,
-  getAmountConversionRate,
   getConvertedCurrency,
   getSendAmount,
   getGasTotal,
   getSelectedBalance,
   getTokenBalance,
   getSendFromBalance,
+  getConversionRate,
 } from '../../send.selectors.js'
 import {
   getMaxModeOn,
   sendAmountIsInError,
+  getPrimaryCurrency,
+  getAmountConversionRate,
 } from './send-amount-row.selectors.js'
 import { getAmountErrorObject } from './send-amount-row.utils.js'
 import {
   updateSendAmount,
   setMaxModeTo,
-} from '../../../actions'
+  updateSendErrors,
+} from '../../../../actions'
 import SendAmountRow from './send-amount-row.component'
 
-export default connect(mapStateToProps, mapDispatchToProps)(SendToRow)
+export default connect(mapStateToProps, mapDispatchToProps)(SendAmountRow)
 
 function mapStateToProps (state) {
-updateSendTo
-return {
-  selectedToken: getSelectedToken(state),
-  primaryCurrency: getPrimaryCurrency(state),
-  convertedCurrency: getConvertedCurrency(state),
-  amountConversionRate: getAmountConversionRate(state),
-  inError: sendAmountIsInError(state),
-  amount: getSendAmount(state),
-  maxModeOn: getMaxModeOn(state),
-  gasTotal: getGasTotal(state),
-  tokenBalance: getTokenBalance(state),
-  balance: getSendFromBalance(state),
-}
+  return {
+    selectedToken: getSelectedToken(state),
+    primaryCurrency: getPrimaryCurrency(state),
+    convertedCurrency: getConvertedCurrency(state),
+    amountConversionRate: getAmountConversionRate(state),
+    inError: sendAmountIsInError(state),
+    amount: getSendAmount(state),
+    maxModeOn: getMaxModeOn(state),
+    gasTotal: getGasTotal(state),
+    tokenBalance: getTokenBalance(state),
+    balance: getSendFromBalance(state),
+    conversionRate: getConversionRate(state),
+  }
 }
 
 function mapDispatchToProps (dispatch) {
diff --git a/ui/app/components/send_/send-content/send-amount-row/send-amount-row.selectors.js b/ui/app/components/send_/send-content/send-amount-row/send-amount-row.selectors.js
index 724f345af..c2620b4dc 100644
--- a/ui/app/components/send_/send-content/send-amount-row/send-amount-row.selectors.js
+++ b/ui/app/components/send_/send-content/send-amount-row/send-amount-row.selectors.js
@@ -1,6 +1,14 @@
+import {
+  getSelectedToken,
+  getSelectedTokenToFiatRate,
+  getConversionRate,
+} from '../../send.selectors.js'
+
 const selectors = {
   getMaxModeOn,
   sendAmountIsInError,
+  getPrimaryCurrency,
+  getAmountConversionRate,
 }
 
 module.exports = selectors
@@ -10,5 +18,16 @@ function getMaxModeOn (state) {
 }
 
 function sendAmountIsInError (state) {
-    return Boolean(state.metamask.send.errors.amount)
+  return Boolean(state.metamask.send.errors.amount)
+}
+
+function getPrimaryCurrency (state) {
+  const selectedToken = getSelectedToken(state)
+  return selectedToken && selectedToken.symbol
+}
+
+function getAmountConversionRate (state) {
+  return Boolean(getSelectedToken(state))
+    ? getSelectedTokenToFiatRate(state)
+    : getConversionRate(state)
 }
diff --git a/ui/app/components/send_/send-content/send-amount-row/send-amount-row.utils.js b/ui/app/components/send_/send-content/send-amount-row/send-amount-row.utils.js
index 5b01b4594..418b98c18 100644
--- a/ui/app/components/send_/send-content/send-amount-row/send-amount-row.utils.js
+++ b/ui/app/components/send_/send-content/send-amount-row/send-amount-row.utils.js
@@ -1,4 +1,11 @@
 const { isValidAddress } = require('../../../../util')
+const {
+  conversionGreaterThan,
+} = require('../../../../conversion-util')
+const {
+  isBalanceSufficient,
+  isTokenBalanceSufficient,
+} = require('../../send.utils')
 
 function getAmountErrorObject ({
   amount,
@@ -10,6 +17,14 @@ function getAmountErrorObject ({
   gasTotal,
   tokenBalance,
 }) {
+  console.log(`#& getAmountErrorObject amount`, amount);
+  console.log(`#& getAmountErrorObject balance`, balance);
+  console.log(`#& getAmountErrorObject amountConversionRate`, amountConversionRate);
+  console.log(`#& getAmountErrorObject conversionRate`, conversionRate);
+  console.log(`#& getAmountErrorObject primaryCurrency`, primaryCurrency);
+  console.log(`#& getAmountErrorObject selectedToken`, selectedToken);
+  console.log(`#& getAmountErrorObject gasTotal`, gasTotal);
+  console.log(`#& getAmountErrorObject tokenBalance`, tokenBalance);
   let insufficientFunds = false
   if (gasTotal && conversionRate) {
     insufficientFunds = !isBalanceSufficient({
@@ -40,11 +55,11 @@ function getAmountErrorObject ({
   let amountError = null
 
   if (insufficientFunds) {
-    amountError = this.context.t('insufficientFunds')
-  } else if (insufficientTokens) {
-    amountError = this.context.t('insufficientTokens')
+    amountError = 'insufficientFunds'
+  } else if (inSufficientTokens) {
+    amountError = 'insufficientTokens'
   } else if (amountLessThanZero) {
-    amountError = this.context.t('negativeETH')
+    amountError = 'negativeETH'
   }
 
   return { amount: amountError }