From e1077836ce916e2bd788451e3f365324024a1c0c Mon Sep 17 00:00:00 2001
From: Chi Kei Chan <chikeichan@gmail.com>
Date: Fri, 22 Sep 2017 14:34:56 -0700
Subject: Add Confirm Send token screen

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

(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
new file mode 100644
index 000000000..384ac92cc
--- /dev/null
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -0,0 +1,394 @@
+const Component = require('react').Component
+const { connect } = require('react-redux')
+const h = require('react-hyperscript')
+const inherits = require('util').inherits
+const abi = require('human-standard-token-abi')
+const abiDecoder = require('abi-decoder')
+abiDecoder.addABI(abi)
+const actions = require('../../actions')
+const clone = require('clone')
+const Identicon = require('../identicon')
+const ethUtil = require('ethereumjs-util')
+const BN = ethUtil.BN
+const hexToBn = require('../../../../app/scripts/lib/hex-to-bn')
+const { conversionUtil } = require('../../conversion-util')
+
+const MIN_GAS_PRICE_GWEI_BN = new BN(1)
+const GWEI_FACTOR = new BN(1e9)
+const MIN_GAS_PRICE_BN = MIN_GAS_PRICE_GWEI_BN.mul(GWEI_FACTOR)
+
+module.exports = connect(mapStateToProps, mapDispatchToProps)(ConfirmSendToken)
+
+function mapStateToProps (state, ownProps) {
+  const { token: { symbol }, txData } = ownProps
+  const { txParams } = txData || {}
+  const tokenData = txParams.data && abiDecoder.decodeMethod(txParams.data)
+  const {
+    conversionRate,
+    identities,
+  } = state.metamask
+  const accounts = state.metamask.accounts
+  const selectedAddress = state.metamask.selectedAddress || Object.keys(accounts)[0]
+  const tokenExchangeRates = state.metamask.tokenExchangeRates
+  const pair = `${symbol.toLowerCase()}_eth`
+  const { rate: tokenExchangeRate = 0 } = tokenExchangeRates[pair] || {}
+
+  return {
+    conversionRate,
+    identities,
+    selectedAddress,
+    tokenExchangeRate,
+    tokenData: tokenData || {},
+  }
+}
+
+function mapDispatchToProps (dispatch, ownProps) {
+  const { token: { symbol } } = ownProps
+
+  return {
+    backToAccountDetail: address => dispatch(actions.backToAccountDetail(address)),
+    cancelTransaction: ({ id }) => dispatch(actions.cancelTx({ id })),
+    updateTokenExchangeRate: () => dispatch(actions.updateTokenExchangeRate(symbol)),
+  }
+}
+
+inherits(ConfirmSendToken, Component)
+function ConfirmSendToken () {
+  Component.call(this)
+  this.state = {}
+  this.onSubmit = this.onSubmit.bind(this)
+}
+
+ConfirmSendToken.prototype.componentWillMount = function () {
+  this.props.updateTokenExchangeRate()
+}
+
+ConfirmSendToken.prototype.getAmount = function () {
+  const { conversionRate, tokenExchangeRate, token, tokenData } = this.props
+  const { params = [] } = tokenData
+  const { value } = params[1] || {}
+  const { decimals } = token
+  const multiplier = Math.pow(10, Number(decimals || 0))
+  const sendTokenAmount = Number(value / multiplier)
+
+  return {
+    fiat: tokenExchangeRate
+      ? +(sendTokenAmount * tokenExchangeRate * conversionRate).toFixed(2)
+      : null,
+    token: +sendTokenAmount.toFixed(decimals),
+  }
+
+}
+
+ConfirmSendToken.prototype.getGasFee = function () {
+  const { conversionRate, tokenExchangeRate, token } = this.props
+  const txMeta = this.gatherTxMeta()
+  const txParams = txMeta.txParams || {}
+  const { decimals } = token
+
+  // Gas
+  const gas = txParams.gas
+  const gasBn = hexToBn(gas)
+
+  // Gas Price
+  const gasPrice = txParams.gasPrice || MIN_GAS_PRICE_BN.toString(16)
+  const gasPriceBn = hexToBn(gasPrice)
+  const txFeeBn = gasBn.mul(gasPriceBn)
+
+
+  const USD = conversionUtil(txFeeBn, {
+    fromNumericBase: 'BN',
+    toNumericBase: 'dec',
+    fromDenomination: 'WEI',
+    fromCurrency: 'ETH',
+    toCurrency: 'USD',
+    numberOfDecimals: 2,
+    conversionRate,
+  })
+  const ETH = conversionUtil(txFeeBn, {
+    fromNumericBase: 'BN',
+    toNumericBase: 'dec',
+    fromDenomination: 'WEI',
+    fromCurrency: 'ETH',
+    toCurrency: 'ETH',
+    numberOfDecimals: 6,
+    conversionRate,
+  })
+
+  return {
+    fiat: +Number(USD).toFixed(2),
+    eth: ETH,
+    token: tokenExchangeRate
+      ? +(ETH * tokenExchangeRate).toFixed(decimals)
+      : null,
+  }
+}
+
+ConfirmSendToken.prototype.getData = function () {
+  const { identities } = this.props
+  const txMeta = this.gatherTxMeta()
+  const txParams = txMeta.txParams || {}
+
+  return {
+    from: {
+      address: txParams.from,
+      name: identities[txParams.from].name,
+    },
+    to: {
+      address: txParams.to,
+      name: identities[txParams.to] ? identities[txParams.to].name : 'New Recipient',
+    },
+    memo: txParams.memo || '',
+  }
+}
+
+ConfirmSendToken.prototype.renderHeroAmount = function () {
+  const { token: { symbol } } = this.props
+  const { fiat: fiatAmount, token: tokenAmount } = this.getAmount()
+  const txMeta = this.gatherTxMeta()
+  const txParams = txMeta.txParams || {}
+  const { memo = '' } = txParams
+
+  return fiatAmount
+    ? (
+      h('div.confirm-send-token__hero-amount-wrapper', [
+        h('h3.flex-center.confirm-screen-send-amount', `$${fiatAmount}`),
+        h('h3.flex-center.confirm-screen-send-amount-currency', 'USD'),
+        h('div.flex-center.confirm-memo-wrapper', [
+          h('h3.confirm-screen-send-memo', memo),
+        ]),
+      ])
+    )
+    : (
+      h('div.confirm-send-token__hero-amount-wrapper', [
+        h('h3.flex-center.confirm-screen-send-amount', tokenAmount),
+        h('h3.flex-center.confirm-screen-send-amount-currency', symbol),
+        h('div.flex-center.confirm-memo-wrapper', [
+          h('h3.confirm-screen-send-memo', memo),
+        ]),
+      ])
+    )
+}
+
+ConfirmSendToken.prototype.renderGasFee = function () {
+  const { token: { symbol } } = this.props
+  const { fiat: fiatGas, token: tokenGas, eth: ethGas } = this.getGasFee()
+
+  return (
+    h('section.flex-row.flex-center.confirm-screen-row', [
+      h('span.confirm-screen-label.confirm-screen-section-column', [ 'Gas Fee' ]),
+      h('div.confirm-screen-section-column', [
+        h('div.confirm-screen-row-info', `$${fiatGas} USD`),
+
+        h(
+          'div.confirm-screen-row-detail',
+          tokenGas ? `${tokenGas} ${symbol}` : `${ethGas} ETH`
+        ),
+      ]),
+    ])
+  )
+}
+
+ConfirmSendToken.prototype.renderTotalPlusGas = function () {
+  const { token: { symbol } } = this.props
+  const { fiat: fiatAmount, token: tokenAmount } = this.getAmount()
+  const { fiat: fiatGas, token: tokenGas } = this.getGasFee()
+
+  return fiatAmount && fiatGas
+    ? (
+      h('section.flex-row.flex-center.confirm-screen-total-box ', [
+        h('div.confirm-screen-section-column', [
+          h('span.confirm-screen-label', [ 'Total ' ]),
+          h('div.confirm-screen-total-box__subtitle', [ 'Amount + Gas' ]),
+        ]),
+
+        h('div.confirm-screen-section-column', [
+          h('div.confirm-screen-row-info', `$${fiatAmount + fiatGas} USD`),
+          h('div.confirm-screen-row-detail', `${tokenAmount + tokenGas} ${symbol}`),
+        ]),
+      ])
+    )
+    : (
+      h('section.flex-row.flex-center.confirm-screen-total-box ', [
+        h('div.confirm-screen-section-column', [
+          h('span.confirm-screen-label', [ 'Total ' ]),
+          h('div.confirm-screen-total-box__subtitle', [ 'Amount + Gas' ]),
+        ]),
+
+        h('div.confirm-screen-section-column', [
+          h('div.confirm-screen-row-info', `${tokenAmount} ${symbol}`),
+          h('div.confirm-screen-row-detail', `+ ${fiatGas} USD Gas`),
+        ]),
+      ])
+    )
+}
+
+ConfirmSendToken.prototype.render = function () {
+  const { backToAccountDetail, selectedAddress } = this.props
+  const txMeta = this.gatherTxMeta()
+  const txParams = txMeta.txParams || {}
+
+  const {
+    from: {
+      address: fromAddress,
+      name: fromName,
+    },
+    to: {
+      address: toAddress,
+      name: toName,
+    },
+  } = this.getData()
+
+  this.inputs = []
+
+  return (
+    h('div.flex-column.flex-grow.confirm-screen-container', {
+      style: { minWidth: '355px' },
+    }, [
+      // Main Send token Card
+      h('div.confirm-screen-wrapper.flex-column.flex-grow', [
+        h('h3.flex-center.confirm-screen-header', [
+          h('button.confirm-screen-back-button', {
+            onClick: () => backToAccountDetail(selectedAddress),
+          }, 'BACK'),
+          h('div.confirm-screen-title', 'Confirm Transaction'),
+        ]),
+        h('div.flex-row.flex-center.confirm-screen-identicons', [
+          h('div.confirm-screen-account-wrapper', [
+            h(
+              Identicon,
+              {
+                address: fromAddress,
+                diameter: 100,
+              },
+            ),
+            h('span.confirm-screen-account-name', fromName),
+            h('span.confirm-screen-account-number', fromAddress.slice(fromAddress.length - 4)),
+          ]),
+          h('i.fa.fa-arrow-right.fa-lg'),
+          h('div.confirm-screen-account-wrapper', [
+            h(
+              Identicon,
+              {
+                address: txParams.to,
+                diameter: 100,
+              },
+            ),
+            h('span.confirm-screen-account-name', toName),
+            h('span.confirm-screen-account-number', toAddress.slice(toAddress.length - 4)),
+          ]),
+        ]),
+
+        h('h3.flex-center.confirm-screen-sending-to-message', {
+          style: {
+            textAlign: 'center',
+            fontSize: '16px',
+          },
+        }, [
+          `You're sending to Recipient ...${toAddress.slice(toAddress.length - 4)}`,
+        ]),
+
+        this.renderHeroAmount(),
+
+        h('div.confirm-screen-rows', [
+          h('section.flex-row.flex-center.confirm-screen-row', [
+            h('span.confirm-screen-label.confirm-screen-section-column', [ '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)}`),
+            ]),
+          ]),
+
+          h('section.flex-row.flex-center.confirm-screen-row', [
+            h('span.confirm-screen-label.confirm-screen-section-column', [ '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)}`),
+            ]),
+          ]),
+
+          this.renderGasFee(),
+
+          this.renderTotalPlusGas(),
+
+        ]),
+      ]),
+
+      h('form#pending-tx-form.flex-column.flex-center', {
+        onSubmit: this.onSubmit,
+      }, [
+
+        // Accept Button
+        h('button.confirm-screen-confirm-button', ['CONFIRM']),
+
+        // Cancel Button
+        h('div.cancel.btn-light.confirm-screen-cancel-button', {
+          onClick: (event) => this.cancel(event, txMeta),
+        }, 'CANCEL'),
+      ]),
+    ])
+  )
+}
+
+ConfirmSendToken.prototype.onSubmit = function (event) {
+  event.preventDefault()
+  const txMeta = this.gatherTxMeta()
+  const valid = this.checkValidity()
+  this.setState({ valid, submitting: true })
+
+  if (valid && this.verifyGasParams()) {
+    this.props.sendTransaction(txMeta, event)
+  } else {
+    this.props.dispatch(actions.displayWarning('Invalid Gas Parameters'))
+    this.setState({ submitting: false })
+  }
+}
+
+ConfirmSendToken.prototype.cancel = function (event, txMeta) {
+  event.preventDefault()
+  this.props.cancelTransaction(txMeta)
+}
+
+ConfirmSendToken.prototype.checkValidity = function () {
+  const form = this.getFormEl()
+  const valid = form.checkValidity()
+  return valid
+}
+
+ConfirmSendToken.prototype.getFormEl = function () {
+  const form = document.querySelector('form#pending-tx-form')
+  // Stub out form for unit tests:
+  if (!form) {
+    return { checkValidity () { return true } }
+  }
+  return form
+}
+
+// After a customizable state value has been updated,
+ConfirmSendToken.prototype.gatherTxMeta = function () {
+  const props = this.props
+  const state = this.state
+  const txData = clone(state.txData) || clone(props.txData)
+
+  // log.debug(`UI has defaulted to tx meta ${JSON.stringify(txData)}`)
+  return txData
+}
+
+ConfirmSendToken.prototype.verifyGasParams = function () {
+  // We call this in case the gas has not been modified at all
+  if (!this.state) { return true }
+  return (
+    this._notZeroOrEmptyString(this.state.gas) &&
+    this._notZeroOrEmptyString(this.state.gasPrice)
+  )
+}
+
+ConfirmSendToken.prototype._notZeroOrEmptyString = function (obj) {
+  return obj !== '' && obj !== '0x0'
+}
+
+ConfirmSendToken.prototype.bnMultiplyByFraction = function (targetBN, numerator, denominator) {
+  const numBN = new BN(numerator)
+  const denomBN = new BN(denominator)
+  return targetBN.mul(numBN).div(denomBN)
+}
-- 
cgit v1.2.3


From c221f5ce79a1e24df4672e16bda8e85c434e11ba Mon Sep 17 00:00:00 2001
From: Chi Kei Chan <chikeichan@gmail.com>
Date: Tue, 10 Oct 2017 14:30:20 -0700
Subject: Confirm Token and Confirm Contract v2

---
 ui/app/components/pending-tx/confirm-send-token.js | 42 +++++++++++-----------
 1 file changed, 22 insertions(+), 20 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 384ac92cc..d6ff5a5af 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -155,7 +155,7 @@ ConfirmSendToken.prototype.renderHeroAmount = function () {
         h('h3.flex-center.confirm-screen-send-amount', `$${fiatAmount}`),
         h('h3.flex-center.confirm-screen-send-amount-currency', 'USD'),
         h('div.flex-center.confirm-memo-wrapper', [
-          h('h3.confirm-screen-send-memo', memo),
+          h('h3.confirm-screen-send-memo', [ memo ? `"${memo}"` : '' ]),
         ]),
       ])
     )
@@ -164,7 +164,7 @@ ConfirmSendToken.prototype.renderHeroAmount = function () {
         h('h3.flex-center.confirm-screen-send-amount', tokenAmount),
         h('h3.flex-center.confirm-screen-send-amount-currency', symbol),
         h('div.flex-center.confirm-memo-wrapper', [
-          h('h3.confirm-screen-send-memo', memo),
+          h('h3.confirm-screen-send-memo', [ memo ? `"${memo}"` : '' ]),
         ]),
       ])
     )
@@ -242,7 +242,7 @@ ConfirmSendToken.prototype.render = function () {
   this.inputs = []
 
   return (
-    h('div.flex-column.flex-grow.confirm-screen-container', {
+    h('div.confirm-screen-container', {
       style: { minWidth: '355px' },
     }, [
       // Main Send token Card
@@ -252,6 +252,7 @@ ConfirmSendToken.prototype.render = function () {
             onClick: () => backToAccountDetail(selectedAddress),
           }, 'BACK'),
           h('div.confirm-screen-title', 'Confirm Transaction'),
+          h('div.confirm-screen-header-tip'),
         ]),
         h('div.flex-row.flex-center.confirm-screen-identicons', [
           h('div.confirm-screen-account-wrapper', [
@@ -259,11 +260,11 @@ ConfirmSendToken.prototype.render = function () {
               Identicon,
               {
                 address: fromAddress,
-                diameter: 100,
+                diameter: 60,
               },
             ),
             h('span.confirm-screen-account-name', fromName),
-            h('span.confirm-screen-account-number', fromAddress.slice(fromAddress.length - 4)),
+            // h('span.confirm-screen-account-number', fromAddress.slice(fromAddress.length - 4)),
           ]),
           h('i.fa.fa-arrow-right.fa-lg'),
           h('div.confirm-screen-account-wrapper', [
@@ -271,22 +272,22 @@ ConfirmSendToken.prototype.render = function () {
               Identicon,
               {
                 address: txParams.to,
-                diameter: 100,
+                diameter: 60,
               },
             ),
             h('span.confirm-screen-account-name', toName),
-            h('span.confirm-screen-account-number', toAddress.slice(toAddress.length - 4)),
+            // h('span.confirm-screen-account-number', toAddress.slice(toAddress.length - 4)),
           ]),
         ]),
 
-        h('h3.flex-center.confirm-screen-sending-to-message', {
-          style: {
-            textAlign: 'center',
-            fontSize: '16px',
-          },
-        }, [
-          `You're sending to Recipient ...${toAddress.slice(toAddress.length - 4)}`,
-        ]),
+        // h('h3.flex-center.confirm-screen-sending-to-message', {
+        //   style: {
+        //     textAlign: 'center',
+        //     fontSize: '16px',
+        //   },
+        // }, [
+          // `You're sending to Recipient ...${toAddress.slice(toAddress.length - 4)}`,
+        // ]),
 
         this.renderHeroAmount(),
 
@@ -314,18 +315,19 @@ ConfirmSendToken.prototype.render = function () {
         ]),
       ]),
 
-      h('form#pending-tx-form.flex-column.flex-center', {
+      h('form#pending-tx-form', {
         onSubmit: this.onSubmit,
       }, [
-
-        // Accept Button
-        h('button.confirm-screen-confirm-button', ['CONFIRM']),
-
         // Cancel Button
         h('div.cancel.btn-light.confirm-screen-cancel-button', {
           onClick: (event) => this.cancel(event, txMeta),
         }, 'CANCEL'),
+
+        // Accept Button
+        h('button.confirm-screen-confirm-button', ['CONFIRM']),
       ]),
+
+
     ])
   )
 }
-- 
cgit v1.2.3


From d4343fe7e57de1652d1401f70bf4c0c823d53820 Mon Sep 17 00:00:00 2001
From: Chi Kei Chan <chikeichan@gmail.com>
Date: Tue, 10 Oct 2017 14:36:13 -0700
Subject: Fix recipient on send token

---
 ui/app/components/pending-tx/confirm-send-token.js | 6 ++++--
 1 file changed, 4 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 d6ff5a5af..92bba8f62 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -125,7 +125,9 @@ ConfirmSendToken.prototype.getGasFee = function () {
 }
 
 ConfirmSendToken.prototype.getData = function () {
-  const { identities } = this.props
+  const { identities, tokenData } = this.props
+  const { params = [] } = tokenData
+  const { value } = params[0] || {}
   const txMeta = this.gatherTxMeta()
   const txParams = txMeta.txParams || {}
 
@@ -136,7 +138,7 @@ ConfirmSendToken.prototype.getData = function () {
     },
     to: {
       address: txParams.to,
-      name: identities[txParams.to] ? identities[txParams.to].name : 'New Recipient',
+      name: identities[value] ? identities[value].name : 'New Recipient',
     },
     memo: txParams.memo || '',
   }
-- 
cgit v1.2.3


From 332c7441b656ec82ebfba863e3feb4dbf365d67b Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Wed, 18 Oct 2017 23:39:26 -0230
Subject: Get currency from state in account details, send and confirm screens.

---
 ui/app/components/pending-tx/confirm-send-token.js | 24 +++++++++++-----------
 1 file changed, 12 insertions(+), 12 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 92bba8f62..155242f56 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -81,7 +81,7 @@ ConfirmSendToken.prototype.getAmount = function () {
 }
 
 ConfirmSendToken.prototype.getGasFee = function () {
-  const { conversionRate, tokenExchangeRate, token } = this.props
+  const { conversionRate, tokenExchangeRate, token, currentCurrency } = this.props
   const txMeta = this.gatherTxMeta()
   const txParams = txMeta.txParams || {}
   const { decimals } = token
@@ -96,12 +96,12 @@ ConfirmSendToken.prototype.getGasFee = function () {
   const txFeeBn = gasBn.mul(gasPriceBn)
 
 
-  const USD = conversionUtil(txFeeBn, {
+  const FIAT = conversionUtil(txFeeBn, {
     fromNumericBase: 'BN',
     toNumericBase: 'dec',
     fromDenomination: 'WEI',
     fromCurrency: 'ETH',
-    toCurrency: 'USD',
+    toCurrency: currentCurrency,
     numberOfDecimals: 2,
     conversionRate,
   })
@@ -116,7 +116,7 @@ ConfirmSendToken.prototype.getGasFee = function () {
   })
 
   return {
-    fiat: +Number(USD).toFixed(2),
+    fiat: +Number(FIAT).toFixed(2),
     eth: ETH,
     token: tokenExchangeRate
       ? +(ETH * tokenExchangeRate).toFixed(decimals)
@@ -145,7 +145,7 @@ ConfirmSendToken.prototype.getData = function () {
 }
 
 ConfirmSendToken.prototype.renderHeroAmount = function () {
-  const { token: { symbol } } = this.props
+  const { token: { symbol }, currentCurrency } = this.props
   const { fiat: fiatAmount, token: tokenAmount } = this.getAmount()
   const txMeta = this.gatherTxMeta()
   const txParams = txMeta.txParams || {}
@@ -154,8 +154,8 @@ ConfirmSendToken.prototype.renderHeroAmount = function () {
   return fiatAmount
     ? (
       h('div.confirm-send-token__hero-amount-wrapper', [
-        h('h3.flex-center.confirm-screen-send-amount', `$${fiatAmount}`),
-        h('h3.flex-center.confirm-screen-send-amount-currency', 'USD'),
+        h('h3.flex-center.confirm-screen-send-amount', `${fiatAmount}`),
+        h('h3.flex-center.confirm-screen-send-amount-currency', currentCurrency),
         h('div.flex-center.confirm-memo-wrapper', [
           h('h3.confirm-screen-send-memo', [ memo ? `"${memo}"` : '' ]),
         ]),
@@ -173,14 +173,14 @@ ConfirmSendToken.prototype.renderHeroAmount = function () {
 }
 
 ConfirmSendToken.prototype.renderGasFee = function () {
-  const { token: { symbol } } = this.props
+  const { token: { symbol }, currentCurrency } = this.props
   const { fiat: fiatGas, token: tokenGas, eth: ethGas } = this.getGasFee()
 
   return (
     h('section.flex-row.flex-center.confirm-screen-row', [
       h('span.confirm-screen-label.confirm-screen-section-column', [ 'Gas Fee' ]),
       h('div.confirm-screen-section-column', [
-        h('div.confirm-screen-row-info', `$${fiatGas} USD`),
+        h('div.confirm-screen-row-info', `${fiatGas} ${currentCurrency}`),
 
         h(
           'div.confirm-screen-row-detail',
@@ -192,7 +192,7 @@ ConfirmSendToken.prototype.renderGasFee = function () {
 }
 
 ConfirmSendToken.prototype.renderTotalPlusGas = function () {
-  const { token: { symbol } } = this.props
+  const { token: { symbol }, currentCurrency } = this.props
   const { fiat: fiatAmount, token: tokenAmount } = this.getAmount()
   const { fiat: fiatGas, token: tokenGas } = this.getGasFee()
 
@@ -205,7 +205,7 @@ ConfirmSendToken.prototype.renderTotalPlusGas = function () {
         ]),
 
         h('div.confirm-screen-section-column', [
-          h('div.confirm-screen-row-info', `$${fiatAmount + fiatGas} USD`),
+          h('div.confirm-screen-row-info', `${fiatAmount + fiatGas} ${currentCurrency}`),
           h('div.confirm-screen-row-detail', `${tokenAmount + tokenGas} ${symbol}`),
         ]),
       ])
@@ -219,7 +219,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} USD Gas`),
+          h('div.confirm-screen-row-detail', `+ ${fiatGas} ${currentCurrency} Gas`),
         ]),
       ])
     )
-- 
cgit v1.2.3


From 89af385a352daf66ad1a6fb3bba75676fd3b9e7f Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Wed, 18 Oct 2017 15:38:53 -0230
Subject: Fix handling of arithmetic on token gas in confirm-send-token.

---
 ui/app/components/pending-tx/confirm-send-token.js | 49 +++++++++++++++-------
 1 file changed, 33 insertions(+), 16 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 92bba8f62..de716a26a 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -11,12 +11,22 @@ const Identicon = require('../identicon')
 const ethUtil = require('ethereumjs-util')
 const BN = ethUtil.BN
 const hexToBn = require('../../../../app/scripts/lib/hex-to-bn')
-const { conversionUtil } = require('../../conversion-util')
+const {
+  conversionUtil,
+  multiplyCurrencies,
+  addCurrencies,
+} = require('../../conversion-util')
 
 const MIN_GAS_PRICE_GWEI_BN = new BN(1)
 const GWEI_FACTOR = new BN(1e9)
 const MIN_GAS_PRICE_BN = MIN_GAS_PRICE_GWEI_BN.mul(GWEI_FACTOR)
 
+const {
+  getSelectedTokenExchangeRate,
+  getTokenExchangeRate,
+  getSelectedAddress,
+} = require('../../selectors')
+
 module.exports = connect(mapStateToProps, mapDispatchToProps)(ConfirmSendToken)
 
 function mapStateToProps (state, ownProps) {
@@ -28,10 +38,8 @@ function mapStateToProps (state, ownProps) {
     identities,
   } = state.metamask
   const accounts = state.metamask.accounts
-  const selectedAddress = state.metamask.selectedAddress || Object.keys(accounts)[0]
-  const tokenExchangeRates = state.metamask.tokenExchangeRates
-  const pair = `${symbol.toLowerCase()}_eth`
-  const { rate: tokenExchangeRate = 0 } = tokenExchangeRates[pair] || {}
+  const selectedAddress = getSelectedAddress(state)
+  const tokenExchangeRate = getTokenExchangeRate(state, symbol)
 
   return {
     conversionRate,
@@ -86,17 +94,14 @@ ConfirmSendToken.prototype.getGasFee = function () {
   const txParams = txMeta.txParams || {}
   const { decimals } = token
 
-  // Gas
   const gas = txParams.gas
-  const gasBn = hexToBn(gas)
-
-  // Gas Price
   const gasPrice = txParams.gasPrice || MIN_GAS_PRICE_BN.toString(16)
-  const gasPriceBn = hexToBn(gasPrice)
-  const txFeeBn = gasBn.mul(gasPriceBn)
-
+  const gasTotal = multiplyCurrencies(gas, gasPrice, {
+    multiplicandBase: 16,
+    multiplierBase: 16,
+  })
 
-  const USD = conversionUtil(txFeeBn, {
+  const USD = conversionUtil(gasTotal, {
     fromNumericBase: 'BN',
     toNumericBase: 'dec',
     fromDenomination: 'WEI',
@@ -105,7 +110,7 @@ ConfirmSendToken.prototype.getGasFee = function () {
     numberOfDecimals: 2,
     conversionRate,
   })
-  const ETH = conversionUtil(txFeeBn, {
+  const ETH = conversionUtil(gasTotal, {
     fromNumericBase: 'BN',
     toNumericBase: 'dec',
     fromDenomination: 'WEI',
@@ -114,12 +119,22 @@ ConfirmSendToken.prototype.getGasFee = function () {
     numberOfDecimals: 6,
     conversionRate,
   })
+  const tokenGas = multiplyCurrencies(gas, gasPrice, {
+    toNumericBase: 'dec',
+    multiplicandBase: 16,
+    multiplierBase: 16,
+    toCurrency: 'BAT',
+    conversionRate: tokenExchangeRate,
+    invertConversionRate: true,
+    fromDenomination: 'WEI',
+    numberOfDecimals: decimals || 4,
+  })
 
   return {
     fiat: +Number(USD).toFixed(2),
     eth: ETH,
     token: tokenExchangeRate
-      ? +(ETH * tokenExchangeRate).toFixed(decimals)
+      ? tokenGas
       : null,
   }
 }
@@ -196,6 +211,8 @@ ConfirmSendToken.prototype.renderTotalPlusGas = function () {
   const { fiat: fiatAmount, token: tokenAmount } = this.getAmount()
   const { fiat: fiatGas, token: tokenGas } = this.getGasFee()
 
+  const tokenTotal = addCurrencies(tokenAmount, tokenGas || '0')
+
   return fiatAmount && fiatGas
     ? (
       h('section.flex-row.flex-center.confirm-screen-total-box ', [
@@ -206,7 +223,7 @@ ConfirmSendToken.prototype.renderTotalPlusGas = function () {
 
         h('div.confirm-screen-section-column', [
           h('div.confirm-screen-row-info', `$${fiatAmount + fiatGas} USD`),
-          h('div.confirm-screen-row-detail', `${tokenAmount + tokenGas} ${symbol}`),
+          h('div.confirm-screen-row-detail', `${tokenTotal} ${symbol}`),
         ]),
       ])
     )
-- 
cgit v1.2.3


From 7362fb8dfc5b8d9f3ae9a3399f9448ea5720cd43 Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Wed, 18 Oct 2017 15:56:13 -0230
Subject: Identicon in send token show who you are sending to, not the token's
 identicon.

---
 ui/app/components/pending-tx/confirm-send-token.js | 6 +++---
 1 file changed, 3 insertions(+), 3 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 de716a26a..356da36c3 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -145,14 +145,14 @@ ConfirmSendToken.prototype.getData = function () {
   const { value } = params[0] || {}
   const txMeta = this.gatherTxMeta()
   const txParams = txMeta.txParams || {}
-
+  
   return {
     from: {
       address: txParams.from,
       name: identities[txParams.from].name,
     },
     to: {
-      address: txParams.to,
+      address: value,
       name: identities[value] ? identities[value].name : 'New Recipient',
     },
     memo: txParams.memo || '',
@@ -290,7 +290,7 @@ ConfirmSendToken.prototype.render = function () {
             h(
               Identicon,
               {
-                address: txParams.to,
+                address: toAddress,
                 diameter: 60,
               },
             ),
-- 
cgit v1.2.3


From 80025e278b6c02f87bcfce3b8d5443722f4f9e52 Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Fri, 20 Oct 2017 18:13:55 -0230
Subject: Fixes regression in confirm-send-token

---
 ui/app/components/pending-tx/confirm-send-token.js | 6 ++++--
 1 file changed, 4 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 42b676954..6fb4ddf70 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -36,6 +36,7 @@ function mapStateToProps (state, ownProps) {
   const {
     conversionRate,
     identities,
+    currentCurrency,
   } = state.metamask
   const accounts = state.metamask.accounts
   const selectedAddress = getSelectedAddress(state)
@@ -47,6 +48,7 @@ function mapStateToProps (state, ownProps) {
     selectedAddress,
     tokenExchangeRate,
     tokenData: tokenData || {},
+    currentCurrency: currentCurrency.toUpperCase(),
   }
 }
 
@@ -101,7 +103,7 @@ ConfirmSendToken.prototype.getGasFee = function () {
     multiplierBase: 16,
   })
 
-  const FIAT = conversionUtil(txFeeBn, {
+  const FIAT = conversionUtil(gasTotal, {
     fromNumericBase: 'BN',
     toNumericBase: 'dec',
     fromDenomination: 'WEI',
@@ -223,7 +225,7 @@ ConfirmSendToken.prototype.renderTotalPlusGas = function () {
 
         h('div.confirm-screen-section-column', [
           h('div.confirm-screen-row-info', `${fiatAmount + fiatGas} ${currentCurrency}`),
-          h('div.confirm-screen-row-detail', `${tokenAmount + tokenGas} ${symbol}`),
+          h('div.confirm-screen-row-detail', `${tokenTotal} ${symbol}`),
         ]),
       ])
     )
-- 
cgit v1.2.3


From 5eb3cf43bfab3728dde151bc84439993b1a93184 Mon Sep 17 00:00:00 2001
From: Chi Kei Chan <chikeichan@gmail.com>
Date: Fri, 20 Oct 2017 16:18:25 -0700
Subject: Add resiliency to confirm-send-token

---
 ui/app/components/pending-tx/confirm-send-token.js | 10 +++++-----
 1 file changed, 5 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 6fb4ddf70..a4c3d16e3 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -85,7 +85,9 @@ ConfirmSendToken.prototype.getAmount = function () {
     fiat: tokenExchangeRate
       ? +(sendTokenAmount * tokenExchangeRate * conversionRate).toFixed(2)
       : null,
-    token: +sendTokenAmount.toFixed(decimals),
+    token: typeof value === 'undefined'
+      ? 'Unknown'
+      : +sendTokenAmount.toFixed(decimals),
   }
 
 }
@@ -213,8 +215,6 @@ ConfirmSendToken.prototype.renderTotalPlusGas = function () {
   const { fiat: fiatAmount, token: tokenAmount } = this.getAmount()
   const { fiat: fiatGas, token: tokenGas } = this.getGasFee()
 
-  const tokenTotal = addCurrencies(tokenAmount, tokenGas || '0')
-
   return fiatAmount && fiatGas
     ? (
       h('section.flex-row.flex-center.confirm-screen-total-box ', [
@@ -225,7 +225,7 @@ ConfirmSendToken.prototype.renderTotalPlusGas = function () {
 
         h('div.confirm-screen-section-column', [
           h('div.confirm-screen-row-info', `${fiatAmount + fiatGas} ${currentCurrency}`),
-          h('div.confirm-screen-row-detail', `${tokenTotal} ${symbol}`),
+          h('div.confirm-screen-row-detail', `${addCurrencies(tokenAmount, tokenGas || '0')} ${symbol}`),
         ]),
       ])
     )
@@ -321,7 +321,7 @@ ConfirmSendToken.prototype.render = function () {
             ]),
           ]),
 
-          h('section.flex-row.flex-center.confirm-screen-row', [
+          toAddress && h('section.flex-row.flex-center.confirm-screen-row', [
             h('span.confirm-screen-label.confirm-screen-section-column', [ 'To' ]),
             h('div.confirm-screen-section-column', [
               h('div.confirm-screen-row-info', toName),
-- 
cgit v1.2.3


From b3dad510b7119c6bd89afb0059d95a6684402538 Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Fri, 20 Oct 2017 23:27:59 -0230
Subject: Improve precision in send and confirm.

---
 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 a4c3d16e3..cc4c5f5f4 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -224,7 +224,7 @@ ConfirmSendToken.prototype.renderTotalPlusGas = function () {
         ]),
 
         h('div.confirm-screen-section-column', [
-          h('div.confirm-screen-row-info', `${fiatAmount + fiatGas} ${currentCurrency}`),
+          h('div.confirm-screen-row-info', `${addCurrencies(fiatAmount, fiatGas)} ${currentCurrency}`),
           h('div.confirm-screen-row-detail', `${addCurrencies(tokenAmount, tokenGas || '0')} ${symbol}`),
         ]),
       ])
-- 
cgit v1.2.3


From 7c10cda8a4f8423a95f4c64024b07572d76dc266 Mon Sep 17 00:00:00 2001
From: Chi Kei Chan <chikeichan@gmail.com>
Date: Wed, 25 Oct 2017 00:24:26 -0700
Subject: Fix alignment on right arrow of confirm tx screens

---
 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 cc4c5f5f4..abb7a0770 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -263,7 +263,7 @@ ConfirmSendToken.prototype.render = function () {
   this.inputs = []
 
   return (
-    h('div.confirm-screen-container', {
+    h('div.confirm-screen-container.confirm-send-token', {
       style: { minWidth: '355px' },
     }, [
       // Main Send token Card
-- 
cgit v1.2.3


From 220da24f9ab4a57a10bc1fc3e249c511a98ecb46 Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Thu, 26 Oct 2017 13:36:34 -0230
Subject: Change min gas price to 0.1 GWEI

---
 ui/app/components/pending-tx/confirm-send-token.js | 6 ++----
 1 file changed, 2 insertions(+), 4 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 abb7a0770..19826f47c 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -17,9 +17,7 @@ const {
   addCurrencies,
 } = require('../../conversion-util')
 
-const MIN_GAS_PRICE_GWEI_BN = new BN(1)
-const GWEI_FACTOR = new BN(1e9)
-const MIN_GAS_PRICE_BN = MIN_GAS_PRICE_GWEI_BN.mul(GWEI_FACTOR)
+const { MIN_GAS_PRICE_HEX } = require('../send/send-constants')
 
 const {
   getSelectedTokenExchangeRate,
@@ -99,7 +97,7 @@ ConfirmSendToken.prototype.getGasFee = function () {
   const { decimals } = token
 
   const gas = txParams.gas
-  const gasPrice = txParams.gasPrice || MIN_GAS_PRICE_BN.toString(16)
+  const gasPrice = txParams.gasPrice || MIN_GAS_PRICE_HEX
   const gasTotal = multiplyCurrencies(gas, gasPrice, {
     multiplicandBase: 16,
     multiplierBase: 16,
-- 
cgit v1.2.3


From 5a94775b3fa22517a71232ebe229ee83e9debcf1 Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Thu, 2 Nov 2017 00:00:33 -0230
Subject: Lint fixes for NewUI-flat.

---
 ui/app/components/pending-tx/confirm-send-token.js | 4 ----
 1 file changed, 4 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 19826f47c..4a57553d7 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -10,7 +10,6 @@ const clone = require('clone')
 const Identicon = require('../identicon')
 const ethUtil = require('ethereumjs-util')
 const BN = ethUtil.BN
-const hexToBn = require('../../../../app/scripts/lib/hex-to-bn')
 const {
   conversionUtil,
   multiplyCurrencies,
@@ -20,7 +19,6 @@ const {
 const { MIN_GAS_PRICE_HEX } = require('../send/send-constants')
 
 const {
-  getSelectedTokenExchangeRate,
   getTokenExchangeRate,
   getSelectedAddress,
 } = require('../../selectors')
@@ -36,7 +34,6 @@ function mapStateToProps (state, ownProps) {
     identities,
     currentCurrency,
   } = state.metamask
-  const accounts = state.metamask.accounts
   const selectedAddress = getSelectedAddress(state)
   const tokenExchangeRate = getTokenExchangeRate(state, symbol)
 
@@ -245,7 +242,6 @@ ConfirmSendToken.prototype.renderTotalPlusGas = function () {
 ConfirmSendToken.prototype.render = function () {
   const { backToAccountDetail, selectedAddress } = this.props
   const txMeta = this.gatherTxMeta()
-  const txParams = txMeta.txParams || {}
 
   const {
     from: {
-- 
cgit v1.2.3


From 56e9f98bd05de8ae26f653d15eec4304f0c72155 Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Thu, 2 Nov 2017 09:45:59 -0230
Subject: More 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 4a57553d7..3b8ae7f7f 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -144,7 +144,7 @@ ConfirmSendToken.prototype.getData = function () {
   const { value } = params[0] || {}
   const txMeta = this.gatherTxMeta()
   const txParams = txMeta.txParams || {}
-  
+
   return {
     from: {
       address: txParams.from,
-- 
cgit v1.2.3


From 67bdfe87e31e695f8c4beab1659a3a4b764ccf24 Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Mon, 30 Oct 2017 15:18:50 -0230
Subject: Token balance in send state; validating sufficient tokens, validation
 updates on 'from' switching.

---
 ui/app/components/pending-tx/confirm-send-token.js | 6 ++++--
 1 file changed, 4 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 3b8ae7f7f..f14da38ef 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -15,6 +15,9 @@ const {
   multiplyCurrencies,
   addCurrencies,
 } = require('../../conversion-util')
+const {
+  calcTokenAmount,
+} = require('../../token-util')
 
 const { MIN_GAS_PRICE_HEX } = require('../send/send-constants')
 
@@ -73,8 +76,7 @@ ConfirmSendToken.prototype.getAmount = function () {
   const { params = [] } = tokenData
   const { value } = params[1] || {}
   const { decimals } = token
-  const multiplier = Math.pow(10, Number(decimals || 0))
-  const sendTokenAmount = Number(value / multiplier)
+  const sendTokenAmount = calcTokenAmount(value, decimals)
 
   return {
     fiat: tokenExchangeRate
-- 
cgit v1.2.3


From 4671f28476165fec43785ae23352c1e9a0776abc Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Thu, 9 Nov 2017 11:44:32 -0330
Subject: Allow editing of token transactions.

---
 ui/app/components/pending-tx/confirm-send-token.js | 95 ++++++++++++++++++++--
 1 file changed, 87 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 f14da38ef..aab45f2a4 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -2,9 +2,10 @@ const Component = require('react').Component
 const { connect } = require('react-redux')
 const h = require('react-hyperscript')
 const inherits = require('util').inherits
-const abi = require('human-standard-token-abi')
+const ethAbi = require('ethereumjs-abi')
+const tokenAbi = require('human-standard-token-abi')
 const abiDecoder = require('abi-decoder')
-abiDecoder.addABI(abi)
+abiDecoder.addABI(tokenAbi)
 const actions = require('../../actions')
 const clone = require('clone')
 const Identicon = require('../identicon')
@@ -24,6 +25,7 @@ const { MIN_GAS_PRICE_HEX } = require('../send/send-constants')
 const {
   getTokenExchangeRate,
   getSelectedAddress,
+  getSelectedTokenContract,
 } = require('../../selectors')
 
 module.exports = connect(mapStateToProps, mapDispatchToProps)(ConfirmSendToken)
@@ -32,6 +34,7 @@ function mapStateToProps (state, ownProps) {
   const { token: { symbol }, txData } = ownProps
   const { txParams } = txData || {}
   const tokenData = txParams.data && abiDecoder.decodeMethod(txParams.data)
+
   const {
     conversionRate,
     identities,
@@ -47,6 +50,8 @@ function mapStateToProps (state, ownProps) {
     tokenExchangeRate,
     tokenData: tokenData || {},
     currentCurrency: currentCurrency.toUpperCase(),
+    send: state.metamask.send,
+    tokenContract: getSelectedTokenContract(state),
   }
 }
 
@@ -57,6 +62,30 @@ function mapDispatchToProps (dispatch, ownProps) {
     backToAccountDetail: address => dispatch(actions.backToAccountDetail(address)),
     cancelTransaction: ({ id }) => dispatch(actions.cancelTx({ id })),
     updateTokenExchangeRate: () => dispatch(actions.updateTokenExchangeRate(symbol)),
+    editTransaction: txMeta => {
+      const { token: { address } } = ownProps
+      const { txParams, id } = txMeta
+      const tokenData = txParams.data && abiDecoder.decodeMethod(txParams.data)
+      const { params = [] } = tokenData
+      const { value } = params[1] || {}
+      const amount = conversionUtil(value, {
+        fromNumericBase: 'dec',
+        toNumericBase: 'hex',
+      })
+      const {
+        gas: gasLimit,
+        gasPrice,
+        to,
+      } = txParams
+      dispatch(actions.editTx(id))
+      dispatch(actions.updateGasLimit(gasLimit))
+      dispatch(actions.updateGasPrice(gasPrice))
+      dispatch(actions.updateSendTo(to))
+      dispatch(actions.updateSendAmount(amount))
+      dispatch(actions.updateSendErrors({ to: null, amount: null }))
+      dispatch(actions.setSelectedToken(address))
+      dispatch(actions.showSendTokenPage())
+    },
   }
 }
 
@@ -68,14 +97,33 @@ function ConfirmSendToken () {
 }
 
 ConfirmSendToken.prototype.componentWillMount = function () {
+  const { tokenContract, selectedAddress } = this.props
+  tokenContract && tokenContract
+    .balanceOf(selectedAddress)
+    .then(usersToken => {
+    })
   this.props.updateTokenExchangeRate()
 }
 
 ConfirmSendToken.prototype.getAmount = function () {
-  const { conversionRate, tokenExchangeRate, token, tokenData } = this.props
+  const {
+    conversionRate,
+    tokenExchangeRate,
+    token,
+    tokenData,
+    send: { amount, editingTransactionId },
+  } = this.props
   const { params = [] } = tokenData
-  const { value } = params[1] || {}
+  let { value } = params[1] || {}
   const { decimals } = token
+
+  if (editingTransactionId) {
+    value = conversionUtil(amount, {
+      fromNumericBase: 'hex',
+      toNumericBase: 'dec',
+    })
+  }
+
   const sendTokenAmount = calcTokenAmount(value, decimals)
 
   return {
@@ -242,9 +290,8 @@ ConfirmSendToken.prototype.renderTotalPlusGas = function () {
 }
 
 ConfirmSendToken.prototype.render = function () {
-  const { backToAccountDetail, selectedAddress } = this.props
+  const { editTransaction } = this.props
   const txMeta = this.gatherTxMeta()
-
   const {
     from: {
       address: fromAddress,
@@ -266,8 +313,8 @@ ConfirmSendToken.prototype.render = function () {
       h('div.confirm-screen-wrapper.flex-column.flex-grow', [
         h('h3.flex-center.confirm-screen-header', [
           h('button.confirm-screen-back-button', {
-            onClick: () => backToAccountDetail(selectedAddress),
-          }, 'BACK'),
+            onClick: () => editTransaction(txMeta),
+          }, 'EDIT'),
           h('div.confirm-screen-title', 'Confirm Transaction'),
           h('div.confirm-screen-header-tip'),
         ]),
@@ -389,6 +436,38 @@ ConfirmSendToken.prototype.gatherTxMeta = function () {
   const state = this.state
   const txData = clone(state.txData) || clone(props.txData)
 
+  if (props.send.editingTransactionId) {
+    const {
+      send: {
+        memo,
+        amount,
+        gasLimit: gas,
+        gasPrice,
+      },
+    } = props
+
+    const { txParams: { from, to } } = txData
+
+    const tokenParams = {
+      from: ethUtil.addHexPrefix(from),
+      value: '0',
+      gas: ethUtil.addHexPrefix(gas),
+      gasPrice: ethUtil.addHexPrefix(gasPrice),
+    }
+
+    const data = '0xa9059cbb' + Array.prototype.map.call(
+      ethAbi.rawEncode(['address', 'uint256'], [to, ethUtil.addHexPrefix(amount)]),
+      x => ('00' + x.toString(16)).slice(-2)
+    ).join('')
+
+    txData.txParams = {
+      ...tokenParams,
+      to: ethUtil.addHexPrefix(to),
+      memo: memo && ethUtil.addHexPrefix(memo),
+      data,
+    }
+  }
+
   // log.debug(`UI has defaulted to tx meta ${JSON.stringify(txData)}`)
   return txData
 }
-- 
cgit v1.2.3


From 9e3f921ba928a948c04b4156daa0a3f752ee2dde Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Fri, 10 Nov 2017 00:19:16 -0330
Subject: Create single action for updating all of send in redux state.

---
 ui/app/components/pending-tx/confirm-send-token.js | 15 +++++++++------
 1 file changed, 9 insertions(+), 6 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 aab45f2a4..cc2df8299 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -77,13 +77,16 @@ function mapDispatchToProps (dispatch, ownProps) {
         gasPrice,
         to,
       } = txParams
-      dispatch(actions.editTx(id))
-      dispatch(actions.updateGasLimit(gasLimit))
-      dispatch(actions.updateGasPrice(gasPrice))
-      dispatch(actions.updateSendTo(to))
-      dispatch(actions.updateSendAmount(amount))
-      dispatch(actions.updateSendErrors({ to: null, amount: null }))
       dispatch(actions.setSelectedToken(address))
+      dispatch(actions.updateSend({
+        gasLimit,
+        gasPrice,
+        gasTotal: null,
+        to,
+        amount,
+        errors: { to: null, amount: null },
+        editingTransactionId: id,
+      }))
       dispatch(actions.showSendTokenPage())
     },
   }
-- 
cgit v1.2.3


From 339eb7d1a687f141e822c745c568063783d44f15 Mon Sep 17 00:00:00 2001
From: Dan J Miller <danjm.com@gmail.com>
Date: Wed, 13 Dec 2017 02:54:41 -0330
Subject: Fix edit to field bug. (#2738)

---
 ui/app/components/pending-tx/confirm-send-token.js | 13 +++++++------
 1 file changed, 7 insertions(+), 6 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 cc2df8299..727cd260b 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -67,15 +67,15 @@ function mapDispatchToProps (dispatch, ownProps) {
       const { txParams, id } = txMeta
       const tokenData = txParams.data && abiDecoder.decodeMethod(txParams.data)
       const { params = [] } = tokenData
-      const { value } = params[1] || {}
-      const amount = conversionUtil(value, {
+      const { value: to } = params[0] || {}
+      const { value: tokenAmountInDec } = params[1] || {}
+      const tokenAmountInHex = conversionUtil(tokenAmountInDec, {
         fromNumericBase: 'dec',
         toNumericBase: 'hex',
       })
       const {
         gas: gasLimit,
         gasPrice,
-        to,
       } = txParams
       dispatch(actions.setSelectedToken(address))
       dispatch(actions.updateSend({
@@ -83,7 +83,7 @@ function mapDispatchToProps (dispatch, ownProps) {
         gasPrice,
         gasTotal: null,
         to,
-        amount,
+        amount: tokenAmountInHex,
         errors: { to: null, amount: null },
         editingTransactionId: id,
       }))
@@ -446,10 +446,11 @@ ConfirmSendToken.prototype.gatherTxMeta = function () {
         amount,
         gasLimit: gas,
         gasPrice,
+        to,
       },
     } = props
 
-    const { txParams: { from, to } } = txData
+    const { txParams: { from, to: tokenAddress } } = txData
 
     const tokenParams = {
       from: ethUtil.addHexPrefix(from),
@@ -465,7 +466,7 @@ ConfirmSendToken.prototype.gatherTxMeta = function () {
 
     txData.txParams = {
       ...tokenParams,
-      to: ethUtil.addHexPrefix(to),
+      to: ethUtil.addHexPrefix(tokenAddress),
       memo: memo && ethUtil.addHexPrefix(memo),
       data,
     }
-- 
cgit v1.2.3


From 1f1fc2c49ecbb5c6a0a1d925d5c02cf48f795b2f Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Tue, 19 Dec 2017 11:16:11 -0330
Subject: Canceled, edited transactions show edited amount.

---
 ui/app/components/pending-tx/confirm-send-token.js | 9 ++++++++-
 1 file changed, 8 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 727cd260b..e6ce3f6e6 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -89,6 +89,7 @@ function mapDispatchToProps (dispatch, ownProps) {
       }))
       dispatch(actions.showSendTokenPage())
     },
+    updateAndCancelTx: txMeta => dispatch(actions.updateAndCancelTx(txMeta)),
   }
 }
 
@@ -415,7 +416,13 @@ ConfirmSendToken.prototype.onSubmit = function (event) {
 
 ConfirmSendToken.prototype.cancel = function (event, txMeta) {
   event.preventDefault()
-  this.props.cancelTransaction(txMeta)
+  const { send, updateAndCancelTx, cancelTransaction } = this.props
+  
+  if (send.editingTransactionId) {
+    updateAndCancelTx(txMeta)
+  } else {
+    cancelTransaction(txMeta)
+  }
 }
 
 ConfirmSendToken.prototype.checkValidity = function () {
-- 
cgit v1.2.3


From bf4043c59bb67ea93599207d91cb7a4f4426e75f Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Wed, 20 Dec 2017 13:47:16 -0330
Subject: Adds updateTransaction to background and used it to update after
 editing in send-v2.

---
 ui/app/components/pending-tx/confirm-send-token.js | 42 ++--------------------
 1 file changed, 2 insertions(+), 40 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 e6ce3f6e6..a07835911 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -89,7 +89,6 @@ function mapDispatchToProps (dispatch, ownProps) {
       }))
       dispatch(actions.showSendTokenPage())
     },
-    updateAndCancelTx: txMeta => dispatch(actions.updateAndCancelTx(txMeta)),
   }
 }
 
@@ -416,13 +415,9 @@ ConfirmSendToken.prototype.onSubmit = function (event) {
 
 ConfirmSendToken.prototype.cancel = function (event, txMeta) {
   event.preventDefault()
-  const { send, updateAndCancelTx, cancelTransaction } = this.props
+  const { send, cancelTransaction } = this.props
   
-  if (send.editingTransactionId) {
-    updateAndCancelTx(txMeta)
-  } else {
-    cancelTransaction(txMeta)
-  }
+  cancelTransaction(txMeta)
 }
 
 ConfirmSendToken.prototype.checkValidity = function () {
@@ -446,39 +441,6 @@ ConfirmSendToken.prototype.gatherTxMeta = function () {
   const state = this.state
   const txData = clone(state.txData) || clone(props.txData)
 
-  if (props.send.editingTransactionId) {
-    const {
-      send: {
-        memo,
-        amount,
-        gasLimit: gas,
-        gasPrice,
-        to,
-      },
-    } = props
-
-    const { txParams: { from, to: tokenAddress } } = txData
-
-    const tokenParams = {
-      from: ethUtil.addHexPrefix(from),
-      value: '0',
-      gas: ethUtil.addHexPrefix(gas),
-      gasPrice: ethUtil.addHexPrefix(gasPrice),
-    }
-
-    const data = '0xa9059cbb' + Array.prototype.map.call(
-      ethAbi.rawEncode(['address', 'uint256'], [to, ethUtil.addHexPrefix(amount)]),
-      x => ('00' + x.toString(16)).slice(-2)
-    ).join('')
-
-    txData.txParams = {
-      ...tokenParams,
-      to: ethUtil.addHexPrefix(tokenAddress),
-      memo: memo && ethUtil.addHexPrefix(memo),
-      data,
-    }
-  }
-
   // log.debug(`UI has defaulted to tx meta ${JSON.stringify(txData)}`)
   return txData
 }
-- 
cgit v1.2.3


From 5fe3c5aae6756f225edd0f8646ac0a23c264a81c Mon Sep 17 00:00:00 2001
From: Dan <danjm.com@gmail.com>
Date: Wed, 20 Dec 2017 15:05:41 -0330
Subject: Lint fixes.

---
 ui/app/components/pending-tx/confirm-send-token.js | 3 +--
 1 file changed, 1 insertion(+), 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 a07835911..aa4f29fb0 100644
--- a/ui/app/components/pending-tx/confirm-send-token.js
+++ b/ui/app/components/pending-tx/confirm-send-token.js
@@ -2,7 +2,6 @@ const Component = require('react').Component
 const { connect } = require('react-redux')
 const h = require('react-hyperscript')
 const inherits = require('util').inherits
-const ethAbi = require('ethereumjs-abi')
 const tokenAbi = require('human-standard-token-abi')
 const abiDecoder = require('abi-decoder')
 abiDecoder.addABI(tokenAbi)
@@ -415,7 +414,7 @@ ConfirmSendToken.prototype.onSubmit = function (event) {
 
 ConfirmSendToken.prototype.cancel = function (event, txMeta) {
   event.preventDefault()
-  const { send, cancelTransaction } = this.props
+  const { cancelTransaction } = this.props
   
   cancelTransaction(txMeta)
 }
-- 
cgit v1.2.3