From 34aeef50a0519576da64f23d65afdfbfa278273d Mon Sep 17 00:00:00 2001
From: kumavis <aaron@kumavis.me>
Date: Wed, 14 Mar 2018 16:31:45 -0700
Subject: i18n - load locales manually

---
 ui/app/components/pending-tx/confirm-send-token.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'ui/app/components/pending-tx/confirm-send-token.js')

diff --git a/ui/app/components/pending-tx/confirm-send-token.js b/ui/app/components/pending-tx/confirm-send-token.js
index 69afa8094..3a7678aa3 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -6,7 +6,7 @@ const tokenAbi = require('human-standard-token-abi')
 const abiDecoder = require('abi-decoder')
 abiDecoder.addABI(tokenAbi)
 const actions = require('../../actions')
-const t = require('../../../i18n')
+const t = global.getMessage
 const clone = require('clone')
 const Identicon = require('../identicon')
 const ethUtil = require('ethereumjs-util')
-- 
cgit 


From 5fe0be722b6514692a68e920ee8058c5d572237d Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Thu, 15 Mar 2018 21:59:45 -0230
Subject: Handle i18n with redux.

---
 ui/app/components/pending-tx/confirm-send-token.js | 30 +++++++++++-----------
 1 file changed, 15 insertions(+), 15 deletions(-)

(limited to 'ui/app/components/pending-tx/confirm-send-token.js')

diff --git a/ui/app/components/pending-tx/confirm-send-token.js b/ui/app/components/pending-tx/confirm-send-token.js
index 3a7678aa3..bd1ad82ef 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -6,7 +6,7 @@ const tokenAbi = require('human-standard-token-abi')
 const abiDecoder = require('abi-decoder')
 abiDecoder.addABI(tokenAbi)
 const actions = require('../../actions')
-const t = global.getMessage
+const t = require('../../../i18n-helper').getMessage
 const clone = require('clone')
 const Identicon = require('../identicon')
 const ethUtil = require('ethereumjs-util')
@@ -134,7 +134,7 @@ ConfirmSendToken.prototype.getAmount = function () {
       ? +(sendTokenAmount * tokenExchangeRate * conversionRate).toFixed(2)
       : null,
     token: typeof value === 'undefined'
-      ? t('unknown')
+      ? t(this.props.localeMessages, 'unknown')
       : +sendTokenAmount.toFixed(decimals),
   }
 
@@ -205,7 +205,7 @@ ConfirmSendToken.prototype.getData = function () {
     },
     to: {
       address: value,
-      name: identities[value] ? identities[value].name : t('newRecipient'),
+      name: identities[value] ? identities[value].name : t(this.props.localeMessages, 'newRecipient'),
     },
     memo: txParams.memo || '',
   }
@@ -245,7 +245,7 @@ ConfirmSendToken.prototype.renderGasFee = function () {
 
   return (
     h('section.flex-row.flex-center.confirm-screen-row', [
-      h('span.confirm-screen-label.confirm-screen-section-column', [ t('gasFee') ]),
+      h('span.confirm-screen-label.confirm-screen-section-column', [ t(this.props.localeMessages, 'gasFee') ]),
       h('div.confirm-screen-section-column', [
         h('div.confirm-screen-row-info', `${fiatGas} ${currentCurrency}`),
 
@@ -267,8 +267,8 @@ ConfirmSendToken.prototype.renderTotalPlusGas = function () {
     ? (
       h('section.flex-row.flex-center.confirm-screen-total-box ', [
         h('div.confirm-screen-section-column', [
-          h('span.confirm-screen-label', [ t('total') + ' ' ]),
-          h('div.confirm-screen-total-box__subtitle', [ t('amountPlusGas') ]),
+          h('span.confirm-screen-label', [ t(this.props.localeMessages, 'total') + ' ' ]),
+          h('div.confirm-screen-total-box__subtitle', [ t(this.props.localeMessages, 'amountPlusGas') ]),
         ]),
 
         h('div.confirm-screen-section-column', [
@@ -280,8 +280,8 @@ ConfirmSendToken.prototype.renderTotalPlusGas = function () {
     : (
       h('section.flex-row.flex-center.confirm-screen-total-box ', [
         h('div.confirm-screen-section-column', [
-          h('span.confirm-screen-label', [ t('total') + ' ' ]),
-          h('div.confirm-screen-total-box__subtitle', [ t('amountPlusGas') ]),
+          h('span.confirm-screen-label', [ t(this.props.localeMessages, 'total') + ' ' ]),
+          h('div.confirm-screen-total-box__subtitle', [ t(this.props.localeMessages, 'amountPlusGas') ]),
         ]),
 
         h('div.confirm-screen-section-column', [
@@ -315,9 +315,9 @@ ConfirmSendToken.prototype.render = function () {
         h('div.page-container__header', [
           h('button.confirm-screen-back-button', {
             onClick: () => editTransaction(txMeta),
-          }, t('edit')),
-          h('div.page-container__title', t('confirm')),
-          h('div.page-container__subtitle', t('pleaseReviewTransaction')),
+          }, t(this.props.localeMessages, 'edit')),
+          h('div.page-container__title', t(this.props.localeMessages, 'confirm')),
+          h('div.page-container__subtitle', t(this.props.localeMessages, 'pleaseReviewTransaction')),
         ]),
         h('div.flex-row.flex-center.confirm-screen-identicons', [
           h('div.confirm-screen-account-wrapper', [
@@ -358,7 +358,7 @@ ConfirmSendToken.prototype.render = function () {
 
         h('div.confirm-screen-rows', [
           h('section.flex-row.flex-center.confirm-screen-row', [
-            h('span.confirm-screen-label.confirm-screen-section-column', [ t('from') ]),
+            h('span.confirm-screen-label.confirm-screen-section-column', [ t(this.props.localeMessages, 'from') ]),
             h('div.confirm-screen-section-column', [
               h('div.confirm-screen-row-info', fromName),
               h('div.confirm-screen-row-detail', `...${fromAddress.slice(fromAddress.length - 4)}`),
@@ -366,7 +366,7 @@ ConfirmSendToken.prototype.render = function () {
           ]),
 
           toAddress && h('section.flex-row.flex-center.confirm-screen-row', [
-            h('span.confirm-screen-label.confirm-screen-section-column', [ t('to') ]),
+            h('span.confirm-screen-label.confirm-screen-section-column', [ t(this.props.localeMessages, 'to') ]),
             h('div.confirm-screen-section-column', [
               h('div.confirm-screen-row-info', toName),
               h('div.confirm-screen-row-detail', `...${toAddress.slice(toAddress.length - 4)}`),
@@ -386,7 +386,7 @@ ConfirmSendToken.prototype.render = function () {
         // Cancel Button
         h('div.cancel.btn-light.confirm-screen-cancel-button.allcaps', {
           onClick: (event) => this.cancel(event, txMeta),
-        }, t('cancel')),
+        }, t(this.props.localeMessages, 'cancel')),
 
         // Accept Button
         h('button.confirm-screen-confirm-button.allcaps', [t('confirm')]),
@@ -406,7 +406,7 @@ ConfirmSendToken.prototype.onSubmit = function (event) {
   if (valid && this.verifyGasParams()) {
     this.props.sendTransaction(txMeta, event)
   } else {
-    this.props.dispatch(actions.displayWarning(t('invalidGasParams')))
+    this.props.dispatch(actions.displayWarning(t(this.props.localeMessages, 'invalidGasParams')))
     this.setState({ submitting: false })
   }
 }
-- 
cgit 


From 09260f9c5e0b2c460a214f00b87c8fafe0470419 Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Mon, 19 Mar 2018 16:23:54 -0230
Subject: Fixed t() calls where localeMessages is missing; and fix incorrect
 connect reference.

---
 ui/app/components/pending-tx/confirm-send-token.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'ui/app/components/pending-tx/confirm-send-token.js')

diff --git a/ui/app/components/pending-tx/confirm-send-token.js b/ui/app/components/pending-tx/confirm-send-token.js
index fe5c80711..238223321 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -1,5 +1,5 @@
 const Component = require('react').Component
-const { connect } = require('react-redux')
+const connect = require('../../metamask-connect')
 const h = require('react-hyperscript')
 const inherits = require('util').inherits
 const tokenAbi = require('human-standard-token-abi')
-- 
cgit 


From 2ddc2cc1fbe5249f70d80e2a74146cb87dcc8421 Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Mon, 19 Mar 2018 16:53:06 -0230
Subject: Lint fixes.

---
 ui/app/components/pending-tx/confirm-send-token.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

(limited to 'ui/app/components/pending-tx/confirm-send-token.js')

diff --git a/ui/app/components/pending-tx/confirm-send-token.js b/ui/app/components/pending-tx/confirm-send-token.js
index 238223321..4cd6f020b 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -378,7 +378,8 @@ ConfirmSendToken.prototype.render = function () {
 
             this.renderTotalPlusGas(),
 
-          ])
+          ]),
+          
         ]),
 
         h('form#pending-tx-form', {
-- 
cgit 


From d24a0590d363dbe88d383c8faec8eb28809242f0 Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Wed, 21 Mar 2018 22:11:47 -0230
Subject: i18n redux solution doesn't require importing t() and passing state
 to each t() call; t is just available on props.

---
 ui/app/components/pending-tx/confirm-send-token.js | 35 +++++++++++-----------
 1 file changed, 17 insertions(+), 18 deletions(-)

(limited to 'ui/app/components/pending-tx/confirm-send-token.js')

diff --git a/ui/app/components/pending-tx/confirm-send-token.js b/ui/app/components/pending-tx/confirm-send-token.js
index 54963ae9a..d53f8b32f 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -6,7 +6,6 @@ const tokenAbi = require('human-standard-token-abi')
 const abiDecoder = require('abi-decoder')
 abiDecoder.addABI(tokenAbi)
 const actions = require('../../actions')
-const t = require('../../../i18n-helper').getMessage
 const clone = require('clone')
 const Identicon = require('../identicon')
 const GasFeeDisplay = require('../send/gas-fee-display-v2.js')
@@ -22,7 +21,7 @@ const {
 } = require('../../token-util')
 
 const { MIN_GAS_PRICE_HEX } = require('../send/send-constants')
-
+//
 const {
   getTokenExchangeRate,
   getSelectedAddress,
@@ -168,7 +167,7 @@ ConfirmSendToken.prototype.getAmount = function () {
       ? +(sendTokenAmount * tokenExchangeRate * conversionRate).toFixed(2)
       : null,
     token: typeof value === 'undefined'
-      ? t(this.props.localeMessages, 'unknown')
+      ? this.props.t('unknown')
       : +sendTokenAmount.toFixed(decimals),
   }
 
@@ -240,7 +239,7 @@ ConfirmSendToken.prototype.getData = function () {
     },
     to: {
       address: value,
-      name: identities[value] ? identities[value].name : t(this.props.localeMessages, 'newRecipient'),
+      name: identities[value] ? identities[value].name : this.props.t('newRecipient'),
     },
     memo: txParams.memo || '',
   }
@@ -286,7 +285,7 @@ ConfirmSendToken.prototype.renderGasFee = function () {
 
   return (
     h('section.flex-row.flex-center.confirm-screen-row', [
-      h('span.confirm-screen-label.confirm-screen-section-column', [ t(this.props.localeMessages, 'gasFee') ]),
+      h('span.confirm-screen-label.confirm-screen-section-column', [ this.props.t('gasFee') ]),
       h('div.confirm-screen-section-column', [
         h(GasFeeDisplay, {
           gasTotal: gasTotal || gasFeeInHex,
@@ -308,8 +307,8 @@ ConfirmSendToken.prototype.renderTotalPlusGas = function () {
     ? (
       h('section.flex-row.flex-center.confirm-screen-row.confirm-screen-total-box ', [
         h('div.confirm-screen-section-column', [
-          h('span.confirm-screen-label', [ t(this.props.localeMessages, 'total') + ' ' ]),
-          h('div.confirm-screen-total-box__subtitle', [ t(this.props.localeMessages, 'amountPlusGas') ]),
+          h('span.confirm-screen-label', [ this.props.t('total') + ' ' ]),
+          h('div.confirm-screen-total-box__subtitle', [ this.props.t('amountPlusGas') ]),
         ]),
 
         h('div.confirm-screen-section-column', [
@@ -321,8 +320,8 @@ ConfirmSendToken.prototype.renderTotalPlusGas = function () {
     : (
       h('section.flex-row.flex-center.confirm-screen-row.confirm-screen-total-box ', [
         h('div.confirm-screen-section-column', [
-          h('span.confirm-screen-label', [ t(this.props.localeMessages, 'total') + ' ' ]),
-          h('div.confirm-screen-total-box__subtitle', [ t(this.props.localeMessages, 'amountPlusGas') ]),
+          h('span.confirm-screen-label', [ this.props.t('total') + ' ' ]),
+          h('div.confirm-screen-total-box__subtitle', [ this.props.t('amountPlusGas') ]),
         ]),
 
         h('div.confirm-screen-section-column', [
@@ -350,10 +349,10 @@ ConfirmSendToken.prototype.render = function () {
   this.inputs = []
 
   const isTxReprice = Boolean(txMeta.lastGasPrice)
-  const title = isTxReprice ? t(this.props.localeMessages, 'reprice:title') : t(this.props.localeMessages, 'confirm')
+  const title = isTxReprice ? this.props.t('reprice:title') : this.props.t('confirm')
   const subtitle = isTxReprice
-    ? t(this.props.localeMessages, 'reprice:subtitle')
-    : t(this.props.localeMessages, 'pleaseReviewTransaction')
+    ? this.props.t('reprice:subtitle')
+    : this.props.t('pleaseReviewTransaction')
 
   return (
     h('div.confirm-screen-container.confirm-send-token', [
@@ -362,7 +361,7 @@ ConfirmSendToken.prototype.render = function () {
         h('div.page-container__header', [
           !txMeta.lastGasPrice && h('button.confirm-screen-back-button', {
             onClick: () => editTransaction(txMeta),
-          }, t(this.props.localeMessages, 'edit')),
+          }, this.props.t('edit')),
           h('div.page-container__title', title),
           h('div.page-container__subtitle', subtitle),
         ]),
@@ -406,7 +405,7 @@ ConfirmSendToken.prototype.render = function () {
 
           h('div.confirm-screen-rows', [
             h('section.flex-row.flex-center.confirm-screen-row', [
-              h('span.confirm-screen-label.confirm-screen-section-column', [ t(this.props.localeMessages, 'from') ]),
+              h('span.confirm-screen-label.confirm-screen-section-column', [ this.props.t('from') ]),
               h('div.confirm-screen-section-column', [
                 h('div.confirm-screen-row-info', fromName),
                 h('div.confirm-screen-row-detail', `...${fromAddress.slice(fromAddress.length - 4)}`),
@@ -414,7 +413,7 @@ ConfirmSendToken.prototype.render = function () {
             ]),
 
             toAddress && h('section.flex-row.flex-center.confirm-screen-row', [
-              h('span.confirm-screen-label.confirm-screen-section-column', [ t(this.props.localeMessages, 'to') ]),
+              h('span.confirm-screen-label.confirm-screen-section-column', [ this.props.t('to') ]),
               h('div.confirm-screen-section-column', [
                 h('div.confirm-screen-row-info', toName),
                 h('div.confirm-screen-row-detail', `...${toAddress.slice(toAddress.length - 4)}`),
@@ -436,10 +435,10 @@ ConfirmSendToken.prototype.render = function () {
             // Cancel Button
             h('button.btn-cancel.page-container__footer-button.allcaps', {
               onClick: (event) => this.cancel(event, txMeta),
-            }, t(this.props.localeMessages, 'cancel')),
+            }, this.props.t('cancel')),
 
             // Accept Button
-            h('button.btn-confirm.page-container__footer-button.allcaps', [t(this.props.localeMessages, 'confirm')]),
+            h('button.btn-confirm.page-container__footer-button.allcaps', [this.props.t('confirm')]),
           ]),
         ]),
       ]),
@@ -456,7 +455,7 @@ ConfirmSendToken.prototype.onSubmit = function (event) {
   if (valid && this.verifyGasParams()) {
     this.props.sendTransaction(txMeta, event)
   } else {
-    this.props.dispatch(actions.displayWarning(t(this.props.localeMessages, 'invalidGasParams')))
+    this.props.dispatch(actions.displayWarning(this.props.t('invalidGasParams')))
     this.setState({ submitting: false })
   }
 }
-- 
cgit 


From a82631791efb496efc9f611a2a3edbac7123d221 Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Wed, 21 Mar 2018 23:48:10 -0230
Subject: Lint fixes

---
 ui/app/components/pending-tx/confirm-send-token.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'ui/app/components/pending-tx/confirm-send-token.js')

diff --git a/ui/app/components/pending-tx/confirm-send-token.js b/ui/app/components/pending-tx/confirm-send-token.js
index 50d803fc4..f9b6bb79e 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -327,7 +327,7 @@ ConfirmSendToken.prototype.renderTotalPlusGas = function () {
 
         h('div.confirm-screen-section-column', [
           h('div.confirm-screen-row-info', `${tokenAmount} ${symbol}`),
-          h('div.confirm-screen-row-detail', `+ ${fiatGas} ${currentCurrency} ${t('gas')}`),
+          h('div.confirm-screen-row-detail', `+ ${fiatGas} ${currentCurrency} ${this.props.t('gas')}`),
         ]),
       ])
     )
-- 
cgit 


From d613dfb43419ea1e18691659d39f6ac403c21d75 Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Thu, 22 Mar 2018 01:19:00 -0230
Subject: Correct reprice title and subtitle key names.

---
 ui/app/components/pending-tx/confirm-send-token.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'ui/app/components/pending-tx/confirm-send-token.js')

diff --git a/ui/app/components/pending-tx/confirm-send-token.js b/ui/app/components/pending-tx/confirm-send-token.js
index f9b6bb79e..9196f9ab1 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -350,9 +350,9 @@ ConfirmSendToken.prototype.render = function () {
   this.inputs = []
 
   const isTxReprice = Boolean(txMeta.lastGasPrice)
-  const title = isTxReprice ? this.props.t('reprice:title') : this.props.t('confirm')
+  const title = isTxReprice ? this.props.t('reprice_title') : this.props.t('confirm')
   const subtitle = isTxReprice
-    ? this.props.t('reprice:subtitle')
+    ? this.props.t('reprice_subtitle')
     : this.props.t('pleaseReviewTransaction')
 
   return (
-- 
cgit 


From be2254b880c8c7bc17a139c3137dbe1e11c6060d Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Tue, 27 Mar 2018 10:37:45 -0230
Subject: Remove comments and console.logs

---
 ui/app/components/pending-tx/confirm-send-token.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'ui/app/components/pending-tx/confirm-send-token.js')

diff --git a/ui/app/components/pending-tx/confirm-send-token.js b/ui/app/components/pending-tx/confirm-send-token.js
index 9196f9ab1..3e66705ae 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -21,7 +21,7 @@ const {
 } = require('../../token-util')
 
 const { MIN_GAS_PRICE_HEX } = require('../send/send-constants')
-//
+
 const {
   getTokenExchangeRate,
   getSelectedAddress,
-- 
cgit 


From 74ac3bb2a7130675a10e1701d569b2c35a948f8f Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Tue, 27 Mar 2018 23:23:57 -0230
Subject: Confirm send token detects if balance is sufficient for gas.

---
 ui/app/components/pending-tx/confirm-send-token.js | 59 ++++++++++++++++++++--
 1 file changed, 54 insertions(+), 5 deletions(-)

(limited to 'ui/app/components/pending-tx/confirm-send-token.js')

diff --git a/ui/app/components/pending-tx/confirm-send-token.js b/ui/app/components/pending-tx/confirm-send-token.js
index f9276e8a5..5cc2585f7 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -17,9 +17,14 @@ const {
   multiplyCurrencies,
   addCurrencies,
 } = require('../../conversion-util')
+const {
+  getGasTotal,
+  isBalanceSufficient,
+} = require('../send/send-utils')
 const {
   calcTokenAmount,
 } = require('../../token-util')
+const classnames = require('classnames')
 
 const { MIN_GAS_PRICE_HEX } = require('../send/send-constants')
 
@@ -41,9 +46,10 @@ function mapStateToProps (state, ownProps) {
     identities,
     currentCurrency,
   } = state.metamask
+  const accounts = state.metamask.accounts
   const selectedAddress = getSelectedAddress(state)
   const tokenExchangeRate = getTokenExchangeRate(state, symbol)
-
+  const { balance } = accounts[selectedAddress]
   return {
     conversionRate,
     identities,
@@ -53,6 +59,7 @@ function mapStateToProps (state, ownProps) {
     currentCurrency: currentCurrency.toUpperCase(),
     send: state.metamask.send,
     tokenContract: getSelectedTokenContract(state),
+    balance,
   }
 }
 
@@ -124,6 +131,7 @@ function mapDispatchToProps (dispatch, ownProps) {
       }))
       dispatch(actions.showModal({ name: 'CUSTOMIZE_GAS' }))
     },
+    updateSendErrors: error => dispatch(actions.updateSendErrors(error)),
   }
 }
 
@@ -301,7 +309,7 @@ ConfirmSendToken.prototype.renderGasFee = function () {
 }
 
 ConfirmSendToken.prototype.renderTotalPlusGas = function () {
-  const { token: { symbol }, currentCurrency } = this.props
+  const { token: { symbol }, currentCurrency, send: { errors } } = this.props
   const { fiat: fiatAmount, token: tokenAmount } = this.getAmount()
   const { fiat: fiatGas, token: tokenGas } = this.getGasFee()
 
@@ -321,7 +329,12 @@ ConfirmSendToken.prototype.renderTotalPlusGas = function () {
     )
     : (
       h('section.flex-row.flex-center.confirm-screen-row.confirm-screen-total-box ', [
-        h('div.confirm-screen-section-column', [
+        h('div', {
+          className: classnames({
+            'confirm-screen-section-column--with-error': errors['insufficientFunds'],
+            'confirm-screen-section-column': !errors['insufficientFunds'],
+          }),
+        }, [
           h('span.confirm-screen-label', [ t('total') + ' ' ]),
           h('div.confirm-screen-total-box__subtitle', [ t('amountPlusGas') ]),
         ]),
@@ -330,10 +343,20 @@ ConfirmSendToken.prototype.renderTotalPlusGas = function () {
           h('div.confirm-screen-row-info', `${tokenAmount} ${symbol}`),
           h('div.confirm-screen-row-detail', `+ ${fiatGas} ${currentCurrency} ${t('gas')}`),
         ]),
+
+        this.renderErrorMessage('insufficientFunds'),
       ])
     )
 }
 
+ConfirmSendToken.prototype.renderErrorMessage = function (message) {
+  const { send: { errors } } = this.props
+
+  return errors[message]
+    ? h('div.confirm-screen-error', [ errors[message] ])
+    : null
+}
+
 ConfirmSendToken.prototype.render = function () {
   const { editTransaction } = this.props
   const txMeta = this.gatherTxMeta()
@@ -448,18 +471,44 @@ ConfirmSendToken.prototype.render = function () {
 
 ConfirmSendToken.prototype.onSubmit = function (event) {
   event.preventDefault()
+  const { updateSendErrors } = this.props
   const txMeta = this.gatherTxMeta()
   const valid = this.checkValidity()
+  const balanceIsSufficient = this.isBalanceSufficient(txMeta)
   this.setState({ valid, submitting: true })
 
-  if (valid && this.verifyGasParams()) {
+  if (valid && this.verifyGasParams() && balanceIsSufficient) {
     this.props.sendTransaction(txMeta, event)
+  } else if (!balanceIsSufficient) {
+    updateSendErrors({ insufficientFunds: t('insufficientFunds') })
   } else {
-    this.props.dispatch(actions.displayWarning(t('invalidGasParams')))
+    updateSendErrors({ invalidGasParams: t('invalidGasParams') })
     this.setState({ submitting: false })
   }
 }
 
+ConfirmSendToken.prototype.isBalanceSufficient = function (txMeta) {
+  const {
+    balance,
+    conversionRate,
+  } = this.props
+  const {
+    txParams: {
+      gas,
+      gasPrice,
+    },
+  } = txMeta
+  const gasTotal = getGasTotal(gas, gasPrice)
+
+  return isBalanceSufficient({
+    amount: '0',
+    gasTotal,
+    balance,
+    conversionRate,
+  })
+}
+
+
 ConfirmSendToken.prototype.cancel = function (event, txMeta) {
   event.preventDefault()
   const { cancelTransaction } = this.props
-- 
cgit 


From 0a711f0de0e342b24988a5da4ca5c64342153210 Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Thu, 29 Mar 2018 12:30:44 -0230
Subject: Removes t from props via metamask-connect and instead places it on
 context via a provider.

---
 ui/app/components/pending-tx/confirm-send-token.js | 42 ++++++++++++----------
 1 file changed, 24 insertions(+), 18 deletions(-)

(limited to 'ui/app/components/pending-tx/confirm-send-token.js')

diff --git a/ui/app/components/pending-tx/confirm-send-token.js b/ui/app/components/pending-tx/confirm-send-token.js
index 3e66705ae..7fe260a61 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -1,5 +1,6 @@
 const Component = require('react').Component
-const connect = require('../../metamask-connect')
+const PropTypes = require('prop-types')
+const connect = require('react-redux').connect
 const h = require('react-hyperscript')
 const inherits = require('util').inherits
 const tokenAbi = require('human-standard-token-abi')
@@ -28,8 +29,13 @@ const {
   getSelectedTokenContract,
 } = require('../../selectors')
 
+ConfirmSendToken.contextTypes = {
+  t: PropTypes.func,
+}
+
 module.exports = connect(mapStateToProps, mapDispatchToProps)(ConfirmSendToken)
 
+
 function mapStateToProps (state, ownProps) {
   const { token: { symbol }, txData } = ownProps
   const { txParams } = txData || {}
@@ -168,7 +174,7 @@ ConfirmSendToken.prototype.getAmount = function () {
       ? +(sendTokenAmount * tokenExchangeRate * conversionRate).toFixed(2)
       : null,
     token: typeof value === 'undefined'
-      ? this.props.t('unknown')
+      ? this.context.t('unknown')
       : +sendTokenAmount.toFixed(decimals),
   }
 
@@ -240,7 +246,7 @@ ConfirmSendToken.prototype.getData = function () {
     },
     to: {
       address: value,
-      name: identities[value] ? identities[value].name : this.props.t('newRecipient'),
+      name: identities[value] ? identities[value].name : this.context.t('newRecipient'),
     },
     memo: txParams.memo || '',
   }
@@ -286,7 +292,7 @@ ConfirmSendToken.prototype.renderGasFee = function () {
 
   return (
     h('section.flex-row.flex-center.confirm-screen-row', [
-      h('span.confirm-screen-label.confirm-screen-section-column', [ this.props.t('gasFee') ]),
+      h('span.confirm-screen-label.confirm-screen-section-column', [ this.context.t('gasFee') ]),
       h('div.confirm-screen-section-column', [
         h(GasFeeDisplay, {
           gasTotal: gasTotal || gasFeeInHex,
@@ -308,8 +314,8 @@ ConfirmSendToken.prototype.renderTotalPlusGas = function () {
     ? (
       h('section.flex-row.flex-center.confirm-screen-row.confirm-screen-total-box ', [
         h('div.confirm-screen-section-column', [
-          h('span.confirm-screen-label', [ this.props.t('total') + ' ' ]),
-          h('div.confirm-screen-total-box__subtitle', [ this.props.t('amountPlusGas') ]),
+          h('span.confirm-screen-label', [ this.context.t('total') + ' ' ]),
+          h('div.confirm-screen-total-box__subtitle', [ this.context.t('amountPlusGas') ]),
         ]),
 
         h('div.confirm-screen-section-column', [
@@ -321,13 +327,13 @@ ConfirmSendToken.prototype.renderTotalPlusGas = function () {
     : (
       h('section.flex-row.flex-center.confirm-screen-row.confirm-screen-total-box ', [
         h('div.confirm-screen-section-column', [
-          h('span.confirm-screen-label', [ this.props.t('total') + ' ' ]),
-          h('div.confirm-screen-total-box__subtitle', [ this.props.t('amountPlusGas') ]),
+          h('span.confirm-screen-label', [ this.context.t('total') + ' ' ]),
+          h('div.confirm-screen-total-box__subtitle', [ this.context.t('amountPlusGas') ]),
         ]),
 
         h('div.confirm-screen-section-column', [
           h('div.confirm-screen-row-info', `${tokenAmount} ${symbol}`),
-          h('div.confirm-screen-row-detail', `+ ${fiatGas} ${currentCurrency} ${this.props.t('gas')}`),
+          h('div.confirm-screen-row-detail', `+ ${fiatGas} ${currentCurrency} ${this.context.t('gas')}`),
         ]),
       ])
     )
@@ -350,10 +356,10 @@ ConfirmSendToken.prototype.render = function () {
   this.inputs = []
 
   const isTxReprice = Boolean(txMeta.lastGasPrice)
-  const title = isTxReprice ? this.props.t('reprice_title') : this.props.t('confirm')
+  const title = isTxReprice ? this.context.t('reprice_title') : this.context.t('confirm')
   const subtitle = isTxReprice
-    ? this.props.t('reprice_subtitle')
-    : this.props.t('pleaseReviewTransaction')
+    ? this.context.t('reprice_subtitle')
+    : this.context.t('pleaseReviewTransaction')
 
   return (
     h('div.confirm-screen-container.confirm-send-token', [
@@ -362,7 +368,7 @@ ConfirmSendToken.prototype.render = function () {
         h('div.page-container__header', [
           !txMeta.lastGasPrice && h('button.confirm-screen-back-button', {
             onClick: () => editTransaction(txMeta),
-          }, this.props.t('edit')),
+          }, this.context.t('edit')),
           h('div.page-container__title', title),
           h('div.page-container__subtitle', subtitle),
         ]),
@@ -406,7 +412,7 @@ ConfirmSendToken.prototype.render = function () {
 
           h('div.confirm-screen-rows', [
             h('section.flex-row.flex-center.confirm-screen-row', [
-              h('span.confirm-screen-label.confirm-screen-section-column', [ this.props.t('from') ]),
+              h('span.confirm-screen-label.confirm-screen-section-column', [ this.context.t('from') ]),
               h('div.confirm-screen-section-column', [
                 h('div.confirm-screen-row-info', fromName),
                 h('div.confirm-screen-row-detail', `...${fromAddress.slice(fromAddress.length - 4)}`),
@@ -414,7 +420,7 @@ ConfirmSendToken.prototype.render = function () {
             ]),
 
             toAddress && h('section.flex-row.flex-center.confirm-screen-row', [
-              h('span.confirm-screen-label.confirm-screen-section-column', [ this.props.t('to') ]),
+              h('span.confirm-screen-label.confirm-screen-section-column', [ this.context.t('to') ]),
               h('div.confirm-screen-section-column', [
                 h('div.confirm-screen-row-info', toName),
                 h('div.confirm-screen-row-detail', `...${toAddress.slice(toAddress.length - 4)}`),
@@ -436,10 +442,10 @@ ConfirmSendToken.prototype.render = function () {
             // Cancel Button
             h('button.btn-cancel.page-container__footer-button.allcaps', {
               onClick: (event) => this.cancel(event, txMeta),
-            }, this.props.t('cancel')),
+            }, this.context.t('cancel')),
 
             // Accept Button
-            h('button.btn-confirm.page-container__footer-button.allcaps', [this.props.t('confirm')]),
+            h('button.btn-confirm.page-container__footer-button.allcaps', [this.context.t('confirm')]),
           ]),
         ]),
       ]),
@@ -456,7 +462,7 @@ ConfirmSendToken.prototype.onSubmit = function (event) {
   if (valid && this.verifyGasParams()) {
     this.props.sendTransaction(txMeta, event)
   } else {
-    this.props.dispatch(actions.displayWarning(this.props.t('invalidGasParams')))
+    this.props.dispatch(actions.displayWarning(this.context.t('invalidGasParams')))
     this.setState({ submitting: false })
   }
 }
-- 
cgit 


From a4594f6838a9ff38a9a6f1998850b27beebb2fbb Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Thu, 29 Mar 2018 15:30:03 -0230
Subject: Show insufficient funds on confirm screen on first render.

---
 ui/app/components/pending-tx/confirm-send-token.js | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

(limited to 'ui/app/components/pending-tx/confirm-send-token.js')

diff --git a/ui/app/components/pending-tx/confirm-send-token.js b/ui/app/components/pending-tx/confirm-send-token.js
index dd115e890..ed0be601e 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -142,12 +142,20 @@ function ConfirmSendToken () {
 }
 
 ConfirmSendToken.prototype.componentWillMount = function () {
-  const { tokenContract, selectedAddress } = this.props
+  const { tokenContract, selectedAddress, updateSendErrors} = this.props
+  const txMeta = this.gatherTxMeta()
+  const balanceIsSufficient = this.isBalanceSufficient(txMeta)
   tokenContract && tokenContract
     .balanceOf(selectedAddress)
     .then(usersToken => {
     })
   this.props.updateTokenExchangeRate()
+
+  updateSendErrors({
+    insufficientFunds: balanceIsSufficient
+      ? false
+      : this.props.t('insufficientFunds')
+  })
 }
 
 ConfirmSendToken.prototype.getAmount = function () {
-- 
cgit 


From 2be6f8bae0e516d49c83776a06dcbf82971a0a19 Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Fri, 30 Mar 2018 02:19:04 -0230
Subject: Fix lint and tests

---
 ui/app/components/pending-tx/confirm-send-token.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'ui/app/components/pending-tx/confirm-send-token.js')

diff --git a/ui/app/components/pending-tx/confirm-send-token.js b/ui/app/components/pending-tx/confirm-send-token.js
index 503c2b19d..dd9fdc23f 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -160,7 +160,7 @@ ConfirmSendToken.prototype.componentWillMount = function () {
   updateSendErrors({
     insufficientFunds: balanceIsSufficient
       ? false
-      : this.props.t('insufficientFunds')
+      : this.context.t('insufficientFunds'),
   })
 }
 
@@ -495,7 +495,7 @@ ConfirmSendToken.prototype.onSubmit = function (event) {
   if (valid && this.verifyGasParams() && balanceIsSufficient) {
     this.props.sendTransaction(txMeta, event)
   } else if (!balanceIsSufficient) {
-    updateSendErrors({ insufficientFunds: this.props.t('insufficientFunds') })
+    updateSendErrors({ insufficientFunds: this.context.t('insufficientFunds') })
   } else {
     updateSendErrors({ invalidGasParams: this.context.t('invalidGasParams') })
     this.setState({ submitting: false })
-- 
cgit 


From 1dc3c51b5445996e9111cabe863fb0eef65dcfc5 Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Mon, 2 Apr 2018 16:26:19 -0230
Subject: UpdateSendErrors only called when balance defined, recalled if
 balance updates.

---
 ui/app/components/pending-tx/confirm-send-token.js | 38 +++++++++++++++++-----
 1 file changed, 30 insertions(+), 8 deletions(-)

(limited to 'ui/app/components/pending-tx/confirm-send-token.js')

diff --git a/ui/app/components/pending-tx/confirm-send-token.js b/ui/app/components/pending-tx/confirm-send-token.js
index dd9fdc23f..814386c5c 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -147,21 +147,43 @@ function ConfirmSendToken () {
   this.onSubmit = this.onSubmit.bind(this)
 }
 
-ConfirmSendToken.prototype.componentWillMount = function () {
-  const { tokenContract, selectedAddress, updateSendErrors} = this.props
+ConfirmSendToken.prototype.updateComponentSendErrors = function (prevProps) {
+  const {
+    balance: oldBalance,
+    conversionRate: oldConversionRate,
+  } = prevProps
+  const {
+    updateSendErrors,
+    balance,
+    conversionRate,
+  } = this.props
   const txMeta = this.gatherTxMeta()
-  const balanceIsSufficient = this.isBalanceSufficient(txMeta)
+
+  const shouldUpdateBalanceSendErrors = balance && [
+    balance !== oldBalance,
+    conversionRate !== oldConversionRate,
+  ].some(x => Boolean(x))
+
+  if (shouldUpdateBalanceSendErrors) {
+    const balanceIsSufficient = this.isBalanceSufficient(txMeta)
+    updateSendErrors({
+      insufficientFunds: balanceIsSufficient ? false : this.context.t('insufficientFunds'),
+    })
+  }
+}
+
+ConfirmSendToken.prototype.componentWillMount = function () {
+  const { tokenContract, selectedAddress } = this.props
   tokenContract && tokenContract
     .balanceOf(selectedAddress)
     .then(usersToken => {
     })
   this.props.updateTokenExchangeRate()
+  this.updateComponentSendErrors({})
+}
 
-  updateSendErrors({
-    insufficientFunds: balanceIsSufficient
-      ? false
-      : this.context.t('insufficientFunds'),
-  })
+ConfirmSendToken.prototype.componentDidUpdate = function (prevProps) {
+  this.updateComponentSendErrors(prevProps)
 }
 
 ConfirmSendToken.prototype.getAmount = function () {
-- 
cgit 


From 7ccf6163fd4dda52d4c75f57cb36d1f4b05b50ea Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Mon, 2 Apr 2018 16:29:35 -0230
Subject: Adds simulation failure error messages to confirm screen.

---
 ui/app/components/pending-tx/confirm-send-token.js | 15 +++++++++++++++
 1 file changed, 15 insertions(+)

(limited to 'ui/app/components/pending-tx/confirm-send-token.js')

diff --git a/ui/app/components/pending-tx/confirm-send-token.js b/ui/app/components/pending-tx/confirm-send-token.js
index 814386c5c..19e591fd6 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -156,6 +156,11 @@ ConfirmSendToken.prototype.updateComponentSendErrors = function (prevProps) {
     updateSendErrors,
     balance,
     conversionRate,
+    send: {
+      errors: {
+        simulationFails,
+      },
+    },
   } = this.props
   const txMeta = this.gatherTxMeta()
 
@@ -170,6 +175,14 @@ ConfirmSendToken.prototype.updateComponentSendErrors = function (prevProps) {
       insufficientFunds: balanceIsSufficient ? false : this.context.t('insufficientFunds'),
     })
   }
+
+  const shouldUpdateSimulationSendError = Boolean(txMeta.simulationFails) !== Boolean(simulationFails)
+
+  if (shouldUpdateSimulationSendError) {
+    updateSendErrors({
+      simulationFails: !txMeta.simulationFails ? false : this.context.t('transactionError'),
+    })
+  }
 }
 
 ConfirmSendToken.prototype.componentWillMount = function () {
@@ -489,8 +502,10 @@ ConfirmSendToken.prototype.render = function () {
         ]),
 
         h('form#pending-tx-form', {
+          className: 'confirm-screen-form',
           onSubmit: this.onSubmit,
         }, [
+          this.renderErrorMessage('simulationFails'),
           h('.page-container__footer', [
             // Cancel Button
             h('button.btn-cancel.page-container__footer-button.allcaps', {
-- 
cgit