aboutsummaryrefslogtreecommitdiffstats
path: root/ui/app/components/send_/send-content
diff options
context:
space:
mode:
Diffstat (limited to 'ui/app/components/send_/send-content')
-rw-r--r--ui/app/components/send_/send-content/send-amount-row/amount-max-button/amount-max-button.component.js4
-rw-r--r--ui/app/components/send_/send-content/send-amount-row/amount-max-button/amount-max-button.container.js1
-rw-r--r--ui/app/components/send_/send-content/send-amount-row/send-amount-row.component.js27
-rw-r--r--ui/app/components/send_/send-content/send-amount-row/send-amount-row.container.js37
-rw-r--r--ui/app/components/send_/send-content/send-amount-row/send-amount-row.selectors.js21
-rw-r--r--ui/app/components/send_/send-content/send-amount-row/send-amount-row.utils.js23
-rw-r--r--ui/app/components/send_/send-content/send-content.component.js11
-rw-r--r--ui/app/components/send_/send-content/send-from-row/from-dropdown/from-dropdown.component.js75
-rw-r--r--ui/app/components/send_/send-content/send-from-row/send-from-row.component.js8
-rw-r--r--ui/app/components/send_/send-content/send-from-row/send-from-row.container.js19
-rw-r--r--ui/app/components/send_/send-content/send-from-row/send-from-row.utils.js2
-rw-r--r--ui/app/components/send_/send-content/send-gas-row/send-gas-row.component.js13
-rw-r--r--ui/app/components/send_/send-content/send-gas-row/send-gas-row.container.js10
-rw-r--r--ui/app/components/send_/send-content/send-gas-row/send-gas-row.selectors.js2
-rw-r--r--ui/app/components/send_/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.component.js5
-rw-r--r--ui/app/components/send_/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.container.js1
-rw-r--r--ui/app/components/send_/send-content/send-row-wrapper/send-row-wrapper.component.js11
-rw-r--r--ui/app/components/send_/send-content/send-to-row/send-to-row.component.js17
-rw-r--r--ui/app/components/send_/send-content/send-to-row/send-to-row.container.js10
19 files changed, 209 insertions, 88 deletions
diff --git a/ui/app/components/send_/send-content/send-amount-row/amount-max-button/amount-max-button.component.js b/ui/app/components/send_/send-content/send-amount-row/amount-max-button/amount-max-button.component.js
index 59a1fd6db..6705a332d 100644
--- a/ui/app/components/send_/send-content/send-amount-row/amount-max-button/amount-max-button.component.js
+++ b/ui/app/components/send_/send-content/send-amount-row/amount-max-button/amount-max-button.component.js
@@ -31,7 +31,7 @@ export default class AmountMaxButton extends Component {
}
render () {
- const { setMaxModeTo } = this.props
+ const { setMaxModeTo, maxModeOn } = this.props
return (
<div
@@ -42,7 +42,7 @@ export default class AmountMaxButton extends Component {
this.setAmountToMax()
}}
>
- {!maxModeOn ? this.context.t('max') : '' ])}
+ {!maxModeOn ? this.context.t('max') : ''}
</div>
);
}
diff --git a/ui/app/components/send_/send-content/send-amount-row/amount-max-button/amount-max-button.container.js b/ui/app/components/send_/send-content/send-amount-row/amount-max-button/amount-max-button.container.js
index 572e1fc46..1b694902f 100644
--- a/ui/app/components/send_/send-content/send-amount-row/amount-max-button/amount-max-button.container.js
+++ b/ui/app/components/send_/send-content/send-amount-row/amount-max-button/amount-max-button.container.js
@@ -1,3 +1,4 @@
+import { connect } from 'react-redux'
import {
getSelectedToken,
getGasTotal,
diff --git a/ui/app/components/send_/send-content/send-amount-row/send-amount-row.component.js b/ui/app/components/send_/send-content/send-amount-row/send-amount-row.component.js
index 78038f714..544664dc8 100644
--- a/ui/app/components/send_/send-content/send-amount-row/send-amount-row.component.js
+++ b/ui/app/components/send_/send-content/send-amount-row/send-amount-row.component.js
@@ -1,15 +1,14 @@
import React, { Component } from 'react'
import PropTypes from 'prop-types'
import SendRowWrapper from '../send-row-wrapper/send-row-wrapper.component'
-import AmountMaxButton from '../amount-max-button/amount-max-button.component'
+import AmountMaxButton from './amount-max-button/amount-max-button.component'
import CurrencyDisplay from '../../../send/currency-display'
export default class SendAmountRow extends Component {
static propTypes = {
- amountConversionRate: PropTypes.string,
- conversionRate: PropTypes.string,
- from: PropTypes.object,
+ amountConversionRate: PropTypes.number,
+ conversionRate: PropTypes.number,
gasTotal: PropTypes.string,
primaryCurrency: PropTypes.string,
selectedToken: PropTypes.object,
@@ -23,7 +22,7 @@ export default class SendAmountRow extends Component {
const {
amountConversionRate,
conversionRate,
- from: { balance },
+ balance,
gasTotal,
primaryCurrency,
selectedToken,
@@ -69,16 +68,16 @@ export default class SendAmountRow extends Component {
showError={inError}
errorType={'amount'}
>
- !inError && gasTotal && <AmountMaxButton />
+ {!inError && gasTotal && <AmountMaxButton />}
<CurrencyDisplay
- inError={inError},
- primaryCurrency={primaryCurrency},
- convertedCurrency={convertedCurrency},
- selectedToken={selectedToken},
- value={amount || '0x0'},
- conversionRate={amountConversionRate},
- handleChange={this.handleAmountChange},
- >
+ inError={inError}
+ primaryCurrency={primaryCurrency}
+ convertedCurrency={convertedCurrency}
+ selectedToken={selectedToken}
+ value={amount || '0x0'}
+ conversionRate={amountConversionRate}
+ handleChange={newAmount => this.handleAmountChange(newAmount)}
+ />
</SendRowWrapper>
);
}
diff --git a/ui/app/components/send_/send-content/send-amount-row/send-amount-row.container.js b/ui/app/components/send_/send-content/send-amount-row/send-amount-row.container.js
index 098855a02..55df68e69 100644
--- a/ui/app/components/send_/send-content/send-amount-row/send-amount-row.container.js
+++ b/ui/app/components/send_/send-content/send-amount-row/send-amount-row.container.js
@@ -1,41 +1,44 @@
+import { connect } from 'react-redux'
import {
getSelectedToken,
- getPrimaryCurrency,
- getAmountConversionRate,
getConvertedCurrency,
getSendAmount,
getGasTotal,
getSelectedBalance,
getTokenBalance,
getSendFromBalance,
+ getConversionRate,
} from '../../send.selectors.js'
import {
getMaxModeOn,
sendAmountIsInError,
+ getPrimaryCurrency,
+ getAmountConversionRate,
} from './send-amount-row.selectors.js'
import { getAmountErrorObject } from './send-amount-row.utils.js'
import {
updateSendAmount,
setMaxModeTo,
-} from '../../../actions'
+ updateSendErrors,
+} from '../../../../actions'
import SendAmountRow from './send-amount-row.component'
-export default connect(mapStateToProps, mapDispatchToProps)(SendToRow)
+export default connect(mapStateToProps, mapDispatchToProps)(SendAmountRow)
function mapStateToProps (state) {
-updateSendTo
-return {
- selectedToken: getSelectedToken(state),
- primaryCurrency: getPrimaryCurrency(state),
- convertedCurrency: getConvertedCurrency(state),
- amountConversionRate: getAmountConversionRate(state),
- inError: sendAmountIsInError(state),
- amount: getSendAmount(state),
- maxModeOn: getMaxModeOn(state),
- gasTotal: getGasTotal(state),
- tokenBalance: getTokenBalance(state),
- balance: getSendFromBalance(state),
-}
+ return {
+ selectedToken: getSelectedToken(state),
+ primaryCurrency: getPrimaryCurrency(state),
+ convertedCurrency: getConvertedCurrency(state),
+ amountConversionRate: getAmountConversionRate(state),
+ inError: sendAmountIsInError(state),
+ amount: getSendAmount(state),
+ maxModeOn: getMaxModeOn(state),
+ gasTotal: getGasTotal(state),
+ tokenBalance: getTokenBalance(state),
+ balance: getSendFromBalance(state),
+ conversionRate: getConversionRate(state),
+ }
}
function mapDispatchToProps (dispatch) {
diff --git a/ui/app/components/send_/send-content/send-amount-row/send-amount-row.selectors.js b/ui/app/components/send_/send-content/send-amount-row/send-amount-row.selectors.js
index 724f345af..c2620b4dc 100644
--- a/ui/app/components/send_/send-content/send-amount-row/send-amount-row.selectors.js
+++ b/ui/app/components/send_/send-content/send-amount-row/send-amount-row.selectors.js
@@ -1,6 +1,14 @@
+import {
+ getSelectedToken,
+ getSelectedTokenToFiatRate,
+ getConversionRate,
+} from '../../send.selectors.js'
+
const selectors = {
getMaxModeOn,
sendAmountIsInError,
+ getPrimaryCurrency,
+ getAmountConversionRate,
}
module.exports = selectors
@@ -10,5 +18,16 @@ function getMaxModeOn (state) {
}
function sendAmountIsInError (state) {
- return Boolean(state.metamask.send.errors.amount)
+ return Boolean(state.metamask.send.errors.amount)
+}
+
+function getPrimaryCurrency (state) {
+ const selectedToken = getSelectedToken(state)
+ return selectedToken && selectedToken.symbol
+}
+
+function getAmountConversionRate (state) {
+ return Boolean(getSelectedToken(state))
+ ? getSelectedTokenToFiatRate(state)
+ : getConversionRate(state)
}
diff --git a/ui/app/components/send_/send-content/send-amount-row/send-amount-row.utils.js b/ui/app/components/send_/send-content/send-amount-row/send-amount-row.utils.js
index 5b01b4594..418b98c18 100644
--- a/ui/app/components/send_/send-content/send-amount-row/send-amount-row.utils.js
+++ b/ui/app/components/send_/send-content/send-amount-row/send-amount-row.utils.js
@@ -1,4 +1,11 @@
const { isValidAddress } = require('../../../../util')
+const {
+ conversionGreaterThan,
+} = require('../../../../conversion-util')
+const {
+ isBalanceSufficient,
+ isTokenBalanceSufficient,
+} = require('../../send.utils')
function getAmountErrorObject ({
amount,
@@ -10,6 +17,14 @@ function getAmountErrorObject ({
gasTotal,
tokenBalance,
}) {
+ console.log(`#& getAmountErrorObject amount`, amount);
+ console.log(`#& getAmountErrorObject balance`, balance);
+ console.log(`#& getAmountErrorObject amountConversionRate`, amountConversionRate);
+ console.log(`#& getAmountErrorObject conversionRate`, conversionRate);
+ console.log(`#& getAmountErrorObject primaryCurrency`, primaryCurrency);
+ console.log(`#& getAmountErrorObject selectedToken`, selectedToken);
+ console.log(`#& getAmountErrorObject gasTotal`, gasTotal);
+ console.log(`#& getAmountErrorObject tokenBalance`, tokenBalance);
let insufficientFunds = false
if (gasTotal && conversionRate) {
insufficientFunds = !isBalanceSufficient({
@@ -40,11 +55,11 @@ function getAmountErrorObject ({
let amountError = null
if (insufficientFunds) {
- amountError = this.context.t('insufficientFunds')
- } else if (insufficientTokens) {
- amountError = this.context.t('insufficientTokens')
+ amountError = 'insufficientFunds'
+ } else if (inSufficientTokens) {
+ amountError = 'insufficientTokens'
} else if (amountLessThanZero) {
- amountError = this.context.t('negativeETH')
+ amountError = 'negativeETH'
}
return { amount: amountError }
diff --git a/ui/app/components/send_/send-content/send-content.component.js b/ui/app/components/send_/send-content/send-content.component.js
index ad6b4a982..2d1fa52e9 100644
--- a/ui/app/components/send_/send-content/send-content.component.js
+++ b/ui/app/components/send_/send-content/send-content.component.js
@@ -1,13 +1,14 @@
import React, { Component } from 'react'
-import PageContainerContent from '../../page-container/page-container-header.component'
-import SendFromRow from './send-from-row/send-from-row.component'
-import SendToRow from './send-to-row/send-to-row.component'
-import SendAmountRow from './send-amount-row/send-amount-row.component'
-import SendGasRow from './send-gas-row/send-gas-row.component'
+import PageContainerContent from '../../page-container/page-container-content.component'
+import SendFromRow from './send-from-row/send-from-row.container'
+import SendToRow from './send-to-row/send-to-row.container'
+import SendAmountRow from './send-amount-row/send-amount-row.container'
+import SendGasRow from './send-gas-row/send-gas-row.container'
export default class SendContent extends Component {
render () {
+ console.log('111222333444555666777888999')
return (
<PageContainerContent>
<div className='.send-v2__form'>
diff --git a/ui/app/components/send_/send-content/send-from-row/from-dropdown/from-dropdown.component.js b/ui/app/components/send_/send-content/send-from-row/from-dropdown/from-dropdown.component.js
index e69de29bb..f215179ba 100644
--- a/ui/app/components/send_/send-content/send-from-row/from-dropdown/from-dropdown.component.js
+++ b/ui/app/components/send_/send-content/send-from-row/from-dropdown/from-dropdown.component.js
@@ -0,0 +1,75 @@
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
+import AccountListItem from '../../../account-list-item/account-list-item.container'
+
+export default class FromDropdown extends Component {
+
+ static propTypes = {
+ accounts: PropTypes.array,
+ closeDropdown: PropTypes.func,
+ dropdownOpen: PropTypes.bool,
+ onSelect: PropTypes.func,
+ openDropdown: PropTypes.func,
+ selectedAccount: PropTypes.object,
+ };
+
+ renderListItemIcon (icon, color) {
+ return <i className={`fa ${icon} fa-lg`} style={ { color } }/>
+ }
+
+ getListItemIcon (currentAccount, selectedAccount) {
+ return currentAccount.address === selectedAccount.address
+ ? this.renderListItemIcon('fa-check', '#02c9b1')
+ : null
+ }
+
+ renderDropdown () {
+ const {
+ accounts,
+ selectedAccount,
+ closeDropdown,
+ onSelect,
+ } = this.props
+
+ return (<div>
+ <div
+ className='send-v2__from-dropdown__close-area'
+ onClick={() => closeDropdown}
+ />
+ <div className='send-v2__from-dropdown__list'>
+ {...accounts.map(account => <AccountListItem
+ className='account-list-item__dropdown'
+ account={account}
+ handleClick={() => {
+ onSelect(account)
+ closeDropdown()
+ }}
+ icon={this.getListItemIcon(account, selectedAccount.address)}
+ />)}
+ </div>
+ </div>)
+ }
+
+ render () {
+ const {
+ selectedAccount,
+ openDropdown,
+ dropdownOpen,
+ } = this.props
+ console.log(`&*& openDropdown`, openDropdown);
+ console.log(`&*& dropdownOpen`, dropdownOpen);
+ return <div className='send-v2__from-dropdown'>
+ <AccountListItem
+ account={selectedAccount}
+ handleClick={openDropdown}
+ icon={this.renderListItemIcon('fa-caret-down', '#dedede')}
+ />
+ {dropdownOpen && this.renderDropdown()},
+ </div>
+ }
+
+}
+
+FromDropdown.contextTypes = {
+ t: PropTypes.func,
+}
diff --git a/ui/app/components/send_/send-content/send-from-row/send-from-row.component.js b/ui/app/components/send_/send-content/send-from-row/send-from-row.component.js
index b17f749a6..0ae72c4ae 100644
--- a/ui/app/components/send_/send-content/send-from-row/send-from-row.component.js
+++ b/ui/app/components/send_/send-content/send-from-row/send-from-row.component.js
@@ -1,14 +1,14 @@
import React, { Component } from 'react'
import PropTypes from 'prop-types'
import SendRowWrapper from '../send-row-wrapper/send-row-wrapper.component'
-import FromDropdown from '../../../send/from-dropdown'
+import FromDropdown from './from-dropdown/from-dropdown.component'
export default class SendFromRow extends Component {
static propTypes = {
closeFromDropdown: PropTypes.func,
- conversionRate: PropTypes.string,
- from: PropTypes.string,
+ conversionRate: PropTypes.number,
+ from: PropTypes.object,
fromAccounts: PropTypes.array,
fromDropdownOpen: PropTypes.bool,
openFromDropdown: PropTypes.func,
@@ -41,7 +41,7 @@ export default class SendFromRow extends Component {
openFromDropdown,
closeFromDropdown,
} = this.props
-
+ console.log(`$% SendFromRow fromAccounts`, fromAccounts);
return (
<SendRowWrapper label={`${this.context.t('from')}:`}>
<FromDropdown
diff --git a/ui/app/components/send_/send-content/send-from-row/send-from-row.container.js b/ui/app/components/send_/send-content/send-from-row/send-from-row.container.js
index eeeb51629..e2815a01f 100644
--- a/ui/app/components/send_/send-content/send-from-row/send-from-row.container.js
+++ b/ui/app/components/send_/send-content/send-from-row/send-from-row.container.js
@@ -1,27 +1,30 @@
+import { connect } from 'react-redux'
import {
- getSendFrom,
getConversionRate,
getSelectedTokenContract,
- getCurrentAccountWithSendEtherInfo,
accountsWithSendEtherInfoSelector,
+ getSendFromObject,
} from '../../send.selectors.js'
-import { getFromDropdownOpen } from './send-from-row.selectors.js'
+import {
+ getFromDropdownOpen,
+} from './send-from-row.selectors.js'
import { calcTokenUpdateAmount } from './send-from-row.utils.js'
import {
updateSendTokenBalance,
updateSendFrom,
-} from '../../../actions'
+} from '../../../../actions'
import {
openFromDropdown,
closeFromDropdown,
-} from '../../../ducks/send'
+} from '../../../../ducks/send'
import SendFromRow from './send-from-row.component'
export default connect(mapStateToProps, mapDispatchToProps)(SendFromRow)
function mapStateToProps (state) {
+ console.log(`$% mapStateToProps accountsWithSendEtherInfoSelector`, accountsWithSendEtherInfoSelector);
return {
- from: getSendFrom(state) || getCurrentAccountWithSendEtherInfo(state),
+ from: getSendFromObject(state),
fromAccounts: accountsWithSendEtherInfoSelector(state),
conversionRate: getConversionRate(state),
fromDropdownOpen: getFromDropdownOpen(state),
@@ -38,7 +41,7 @@ function mapDispatchToProps (dispatch) {
dispatch(updateSendTokenBalance(tokenBalance))
},
updateSendFrom: newFrom => dispatch(updateSendFrom(newFrom)),
- openFromDropdown: () => dispatch(()),
- closeFromDropdown: () => dispatch(()),
+ openFromDropdown: () => dispatch(openFromDropdown()),
+ closeFromDropdown: () => dispatch(closeFromDropdown()),
}
}
diff --git a/ui/app/components/send_/send-content/send-from-row/send-from-row.utils.js b/ui/app/components/send_/send-content/send-from-row/send-from-row.utils.js
index 2be25816f..4faae48dc 100644
--- a/ui/app/components/send_/send-content/send-from-row/send-from-row.utils.js
+++ b/ui/app/components/send_/send-content/send-from-row/send-from-row.utils.js
@@ -1,6 +1,6 @@
const {
calcTokenAmount,
-} = require('../../token-util')
+} = require('../../../../token-util')
function calcTokenUpdateAmount (usersToken, selectedToken) {
const { decimals } = selectedToken || {}
diff --git a/ui/app/components/send_/send-content/send-gas-row/send-gas-row.component.js b/ui/app/components/send_/send-content/send-gas-row/send-gas-row.component.js
index 8c1f14f48..056a04aae 100644
--- a/ui/app/components/send_/send-content/send-gas-row/send-gas-row.component.js
+++ b/ui/app/components/send_/send-content/send-gas-row/send-gas-row.component.js
@@ -7,7 +7,7 @@ export default class SendGasRow extends Component {
static propTypes = {
closeFromDropdown: PropTypes.func,
- conversionRate: PropTypes.string,
+ conversionRate: PropTypes.number,
from: PropTypes.string,
fromAccounts: PropTypes.array,
fromDropdownOpen: PropTypes.bool,
@@ -15,6 +15,7 @@ export default class SendGasRow extends Component {
tokenContract: PropTypes.object,
updateSendFrom: PropTypes.func,
updateSendTokenBalance: PropTypes.func,
+ gasLoadingError: PropTypes.bool,
};
async handleFromChange (newFrom) {
@@ -43,11 +44,11 @@ export default class SendGasRow extends Component {
return (
<SendRowWrapper label={`${this.context.t('gasFee')}:`}>
<GasFeeDisplay
- gasTotal={gasTotal},
- conversionRate={conversionRate},
- convertedCurrency={convertedCurrency},
- onClick={() => showCustomizeGasModal()},
- gasLoadingError={gasLoadingError},
+ gasTotal={gasTotal}
+ conversionRate={conversionRate}
+ convertedCurrency={convertedCurrency}
+ onClick={() => showCustomizeGasModal()}
+ gasLoadingError={gasLoadingError}
/>
</SendRowWrapper>
);
diff --git a/ui/app/components/send_/send-content/send-gas-row/send-gas-row.container.js b/ui/app/components/send_/send-content/send-gas-row/send-gas-row.container.js
index 7fb3a68be..20d3daa59 100644
--- a/ui/app/components/send_/send-content/send-gas-row/send-gas-row.container.js
+++ b/ui/app/components/send_/send-content/send-gas-row/send-gas-row.container.js
@@ -1,12 +1,12 @@
+import { connect } from 'react-redux'
import {
getConversionRate,
getConvertedCurrency,
getGasTotal,
} from '../../send.selectors.js'
-import { getGasLoadingError } from './send-gas-row.selectors.js'
-import { calcTokenUpdateAmount } from './send-gas-row.utils.js'
-import { showModal } from '../../../actions'
-import SendGasRow from './send-from-row.component'
+import { sendGasIsInError } from './send-gas-row.selectors.js'
+import { showModal } from '../../../../actions'
+import SendGasRow from './send-gas-row.component'
export default connect(mapStateToProps, mapDispatchToProps)(SendGasRow)
@@ -15,7 +15,7 @@ function mapStateToProps (state) {
conversionRate: getConversionRate(state),
convertedCurrency: getConvertedCurrency(state),
gasTotal: getGasTotal(state),
- gasLoadingError: getGasLoadingError(state),
+ gasLoadingError: sendGasIsInError(state),
}
}
diff --git a/ui/app/components/send_/send-content/send-gas-row/send-gas-row.selectors.js b/ui/app/components/send_/send-content/send-gas-row/send-gas-row.selectors.js
index d069ae8c6..ad4ef4877 100644
--- a/ui/app/components/send_/send-content/send-gas-row/send-gas-row.selectors.js
+++ b/ui/app/components/send_/send-content/send-gas-row/send-gas-row.selectors.js
@@ -5,5 +5,5 @@ const selectors = {
module.exports = selectors
function sendGasIsInError (state) {
- return state.send.errors.gasLoading
+ return state.metamask.send.errors.gasLoading
}
diff --git a/ui/app/components/send_/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.component.js b/ui/app/components/send_/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.component.js
index 08f830cc5..e553ae67e 100644
--- a/ui/app/components/send_/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.component.js
+++ b/ui/app/components/send_/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.component.js
@@ -1,3 +1,6 @@
+import React, { Component } from 'react'
+import PropTypes from 'prop-types'
+
export default class SendRowErrorMessage extends Component {
static propTypes = {
@@ -11,7 +14,7 @@ export default class SendRowErrorMessage extends Component {
return (
errorMessage
- ? <div className='send-v2__error'>{errorMessage}</div>
+ ? <div className='send-v2__error'>{this.context.t(errorMessage)}</div>
: null
);
}
diff --git a/ui/app/components/send_/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.container.js b/ui/app/components/send_/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.container.js
index 2278dbe63..002426904 100644
--- a/ui/app/components/send_/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.container.js
+++ b/ui/app/components/send_/send-content/send-row-wrapper/send-row-error-message/send-row-error-message.container.js
@@ -1,3 +1,4 @@
+import { connect } from 'react-redux'
import { getSendErrors } from '../../../send.selectors'
import SendRowErrorMessage from './send-row-error-message.component'
diff --git a/ui/app/components/send_/send-content/send-row-wrapper/send-row-wrapper.component.js b/ui/app/components/send_/send-content/send-row-wrapper/send-row-wrapper.component.js
index 92382da01..99134a466 100644
--- a/ui/app/components/send_/send-content/send-row-wrapper/send-row-wrapper.component.js
+++ b/ui/app/components/send_/send-content/send-row-wrapper/send-row-wrapper.component.js
@@ -19,19 +19,14 @@ export default class SendRowWrapper extends Component {
children,
} = this.props
- let formField = children[0]
- let customLabelContent = null
-
- if (children.length === 2) {
- formField = children[1]
- customLabelContent = children[0]
- }
+ let formField = Array.isArray(children) ? children[1] || children[0] : children
+ let customLabelContent = children.length === 1 ? children[0] : null
return (
<div className="send-v2__form-row">
<div className="send-v2__form-label">
{label}
- (showError && <SendRowErrorMessage errorType={errorType}/>)
+ {showError && <SendRowErrorMessage errorType={errorType}/>}
{customLabelContent}
</div>
<div className="send-v2__form-field">
diff --git a/ui/app/components/send_/send-content/send-to-row/send-to-row.component.js b/ui/app/components/send_/send-content/send-to-row/send-to-row.component.js
index 5f81402d8..a20bbf434 100644
--- a/ui/app/components/send_/send-content/send-to-row/send-to-row.component.js
+++ b/ui/app/components/send_/send-content/send-to-row/send-to-row.component.js
@@ -1,7 +1,7 @@
import React, { Component } from 'react'
import PropTypes from 'prop-types'
import SendRowWrapper from '../send-row-wrapper/send-row-wrapper.component'
-import ToDropdown from '../../../ens-input'
+import EnsInput from '../../../ens-input'
export default class SendToRow extends Component {
@@ -14,19 +14,20 @@ export default class SendToRow extends Component {
updateSendToError: PropTypes.func,
openToDropdown: PropTypes.func,
closeToDropdown: PropTypes.func,
- network: PropTypes.number,
+ network: PropTypes.string,
};
handleToChange (to, nickname = '') {
const { updateSendTo, updateSendToError } = this.props
updateSendTo(to, nickname)
- updateSendErrors(to)
+ updateSendToError(to)
}
render () {
const {
from,
fromAccounts,
+ toAccounts,
conversionRate,
fromDropdownOpen,
tokenContract,
@@ -34,6 +35,8 @@ export default class SendToRow extends Component {
closeToDropdown,
network,
inError,
+ to,
+ toDropdownOpen,
} = this.props
return (
@@ -44,14 +47,14 @@ export default class SendToRow extends Component {
>
<EnsInput
name={'address'}
- placeholder={this.context.t('recipient Address')}
- network={network},
- to={to},
+ placeholder={this.context.t('recipientAddress')}
+ network={network}
+ to={to}
accounts={toAccounts}
dropdownOpen={toDropdownOpen}
openDropdown={() => openToDropdown()}
closeDropdown={() => closeToDropdown()}
- onChange={this.handleToChange}
+ onChange={(newTo, newNickname) => this.handleToChange(newTo, newNickname)}
inError={inError}
/>
</SendRowWrapper>
diff --git a/ui/app/components/send_/send-content/send-to-row/send-to-row.container.js b/ui/app/components/send_/send-content/send-to-row/send-to-row.container.js
index 1c446c168..661ec1f0c 100644
--- a/ui/app/components/send_/send-content/send-to-row/send-to-row.container.js
+++ b/ui/app/components/send_/send-content/send-to-row/send-to-row.container.js
@@ -1,7 +1,9 @@
+import { connect } from 'react-redux'
import {
getSendTo,
getToAccounts,
getCurrentNetwork,
+ getSendToAccounts,
} from '../../send.selectors.js'
import {
getToDropdownOpen,
@@ -11,11 +13,11 @@ import { getToErrorObject } from './send-to-row.utils.js'
import {
updateSendErrors,
updateSendTo,
-} from '../../../actions'
+} from '../../../../actions'
import {
openToDropdown,
closeToDropdown,
-} from '../../../ducks/send'
+} from '../../../../ducks/send'
import SendToRow from './send-to-row.component'
export default connect(mapStateToProps, mapDispatchToProps)(SendToRow)
@@ -37,7 +39,7 @@ function mapDispatchToProps (dispatch) {
dispatch(updateSendErrors(getToErrorObject(to)))
},
updateSendTo: (to, nickname) => dispatch(updateSendTo(to, nickname)),
- openToDropdown: () => dispatch(()),
- closeToDropdown: () => dispatch(()),
+ openToDropdown: () => dispatch(openToDropdown()),
+ closeToDropdown: () => dispatch(closeToDropdown()),
}
} \ No newline at end of file