diff options
Lint fixes for NewUI-flat.
Diffstat (limited to 'ui/app')
34 files changed, 703 insertions, 724 deletions
diff --git a/ui/app/actions.js b/ui/app/actions.js index 8da530a79..28ae40f20 100644 --- a/ui/app/actions.js +++ b/ui/app/actions.js @@ -224,6 +224,8 @@ var actions = { TOGGLE_ACCOUNT_MENU: 'TOGGLE_ACCOUNT_MENU', toggleAccountMenu, + + useEtherscanProvider, } module.exports = actions diff --git a/ui/app/app.js b/ui/app/app.js index 7264c79c7..1470e1ecf 100644 --- a/ui/app/app.js +++ b/ui/app/app.js @@ -2,7 +2,6 @@ const inherits = require('util').inherits const Component = require('react').Component const connect = require('react-redux').connect const h = require('react-hyperscript') -const { checkFeatureToggle } = require('../lib/feature-toggle-utils') const actions = require('./actions') // mascara const MascaraFirstTime = require('../../mascara/src/app/first-time').default @@ -12,9 +11,7 @@ const InitializeMenuScreen = require('./first-time/init-menu') const NewKeyChainScreen = require('./new-keychain') // accounts const MainContainer = require('./main-container') -const SendTransactionScreen = require('./send') const SendTransactionScreen2 = require('./components/send/send-v2-container') -const SendTokenScreen = require('./components/send-token') const ConfirmTxScreen = require('./conf-tx') // notice const NoticeScreen = require('./components/notice') @@ -27,7 +24,6 @@ const WalletView = require('./components/wallet-view') const Settings = require('./settings') const AddTokenScreen = require('./add-token') const Import = require('./accounts/import') -const InfoScreen = require('./info') const Loading = require('./components/loading') const NetworkIndicator = require('./components/network') const Identicon = require('./components/identicon') @@ -38,6 +34,7 @@ const RevealSeedConfirmation = require('./keychains/hd/recover-seed/confirmation const ReactCSSTransitionGroup = require('react-addons-css-transition-group') const NetworkDropdown = require('./components/dropdowns/network-dropdown') const AccountMenu = require('./components/account-menu') +const QrView = require('./components/qr-code') // Global Modals const Modal = require('./components/modals/index').Modal @@ -228,8 +225,6 @@ App.prototype.renderAppBar = function () { } const props = this.props - const state = this.state || {} - const isNetworkMenuOpen = state.isNetworkMenuOpen || false const {isMascara, isOnboarding} = props // Do not render header if user is in mascara onboarding diff --git a/ui/app/components/customize-gas-modal/gas-modal-card.js b/ui/app/components/customize-gas-modal/gas-modal-card.js index de181dc67..0172d8afb 100644 --- a/ui/app/components/customize-gas-modal/gas-modal-card.js +++ b/ui/app/components/customize-gas-modal/gas-modal-card.js @@ -2,7 +2,7 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits const InputNumber = require('../input-number.js') -const GasSlider = require('./gas-slider.js') +// const GasSlider = require('./gas-slider.js') module.exports = GasModalCard @@ -13,8 +13,7 @@ function GasModalCard () { GasModalCard.prototype.render = function () { const { - memo, - identities, + // memo, onChange, unitLabel, value, diff --git a/ui/app/components/customize-gas-modal/gas-slider.js b/ui/app/components/customize-gas-modal/gas-slider.js index e76e96545..7a9636094 100644 --- a/ui/app/components/customize-gas-modal/gas-slider.js +++ b/ui/app/components/customize-gas-modal/gas-slider.js @@ -1,50 +1,50 @@ -const Component = require('react').Component -const h = require('react-hyperscript') -const inherits = require('util').inherits - -module.exports = GasSlider - -inherits(GasSlider, Component) -function GasSlider () { - Component.call(this) -} - -GasSlider.prototype.render = function () { - const { - memo, - identities, - onChange, - unitLabel, - value, - id, - step, - max, - min, - } = this.props - - return h('div.gas-slider', [ - - h('input.gas-slider__input', { - type: 'range', - step, - max, - min, - value, - id: 'gasSlider', - onChange: event => onChange(event.target.value), - }, []), - - h('div.gas-slider__bar', [ - - h('div.gas-slider__low'), - - h('div.gas-slider__mid'), - - h('div.gas-slider__high'), - - ]), +// const Component = require('react').Component +// const h = require('react-hyperscript') +// const inherits = require('util').inherits + +// module.exports = GasSlider + +// inherits(GasSlider, Component) +// function GasSlider () { +// Component.call(this) +// } + +// GasSlider.prototype.render = function () { +// const { +// memo, +// identities, +// onChange, +// unitLabel, +// value, +// id, +// step, +// max, +// min, +// } = this.props + +// return h('div.gas-slider', [ + +// h('input.gas-slider__input', { +// type: 'range', +// step, +// max, +// min, +// value, +// id: 'gasSlider', +// onChange: event => onChange(event.target.value), +// }, []), + +// h('div.gas-slider__bar', [ + +// h('div.gas-slider__low'), + +// h('div.gas-slider__mid'), + +// h('div.gas-slider__high'), + +// ]), - ]) +// ]) -} +// } diff --git a/ui/app/components/customize-gas-modal/index.js b/ui/app/components/customize-gas-modal/index.js index 80ea98cc8..4bd9d079a 100644 --- a/ui/app/components/customize-gas-modal/index.js +++ b/ui/app/components/customize-gas-modal/index.js @@ -2,7 +2,6 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits const connect = require('react-redux').connect -const ethUtil = require('ethereumjs-util') const actions = require('../../actions') const GasModalCard = require('./gas-modal-card') @@ -191,7 +190,7 @@ CustomizeGasModal.prototype.convertAndSetGasPrice = function (newGasPrice) { } CustomizeGasModal.prototype.render = function () { - const { hideModal, conversionRate } = this.props + const { hideModal } = this.props const { gasPrice, gasLimit, gasTotal, error } = this.state const convertedGasPrice = conversionUtil(gasPrice, { diff --git a/ui/app/components/dropdowns/account-dropdown-mini.js b/ui/app/components/dropdowns/account-dropdown-mini.js index 96057d2b4..f403c56b9 100644 --- a/ui/app/components/dropdowns/account-dropdown-mini.js +++ b/ui/app/components/dropdowns/account-dropdown-mini.js @@ -1,7 +1,6 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits -const Identicon = require('../identicon') const AccountListItem = require('../send/account-list-item') module.exports = AccountDropdownMini @@ -53,10 +52,8 @@ AccountDropdownMini.prototype.renderDropdown = function () { AccountDropdownMini.prototype.render = function () { const { - accounts, selectedAccount, openDropdown, - closeDropdown, dropdownOpen, } = this.props diff --git a/ui/app/components/dropdowns/account-options-dropdown.js b/ui/app/components/dropdowns/account-options-dropdown.js index 50e793d87..f74c0a2d4 100644 --- a/ui/app/components/dropdowns/account-options-dropdown.js +++ b/ui/app/components/dropdowns/account-options-dropdown.js @@ -19,7 +19,7 @@ AccountOptionsDropdown.prototype.render = function () { return h(AccountDropdowns, { enableAccountOptions: true, enableAccountsSelector: false, - selected: selectedAddress, + selected, network, identities, style: style || {}, diff --git a/ui/app/components/dropdowns/account-selection-dropdown.js b/ui/app/components/dropdowns/account-selection-dropdown.js index 7a8502d18..2f6452b15 100644 --- a/ui/app/components/dropdowns/account-selection-dropdown.js +++ b/ui/app/components/dropdowns/account-selection-dropdown.js @@ -19,7 +19,7 @@ AccountSelectionDropdown.prototype.render = function () { return h(AccountDropdowns, { enableAccountOptions: false, enableAccountsSelector: true, - selected: selectedAddress, + selected, network, identities, style: style || {}, diff --git a/ui/app/components/dropdowns/components/account-dropdowns.js b/ui/app/components/dropdowns/components/account-dropdowns.js index e2eed1e4b..58326b13c 100644 --- a/ui/app/components/dropdowns/components/account-dropdowns.js +++ b/ui/app/components/dropdowns/components/account-dropdowns.js @@ -425,6 +425,21 @@ AccountDropdowns.propTypes = { identities: PropTypes.objectOf(PropTypes.object), selected: PropTypes.string, keyrings: PropTypes.array, + accounts: PropTypes.object, + menuItemStyles: PropTypes.object, + actions: PropTypes.object, + // actions.showAccountDetail: , + useCssTransition: PropTypes.bool, + innerStyle: PropTypes.object, + sidebarOpen: PropTypes.bool, + dropdownWrapperStyle: PropTypes.string, + // actions.showAccountDetailModal: , + network: PropTypes.number, + // actions.showExportPrivateKeyModal: , + style: PropTypes.object, + enableAccountsSelector: PropTypes.bool, + enableAccountOption: PropTypes.bool, + enableAccountOptions: PropTypes.bool, } const mapDispatchToProps = (dispatch) => { diff --git a/ui/app/components/dropdowns/components/dropdown.js b/ui/app/components/dropdowns/components/dropdown.js index ca68e55f7..ddcb7998f 100644 --- a/ui/app/components/dropdowns/components/dropdown.js +++ b/ui/app/components/dropdowns/components/dropdown.js @@ -68,6 +68,7 @@ Dropdown.propTypes = { onClickOutside: PropTypes.func, innerStyle: PropTypes.object, useCssTransition: PropTypes.bool, + containerClassName: PropTypes.string, } class DropdownMenuItem extends Component { diff --git a/ui/app/components/dropdowns/simple-dropdown.js b/ui/app/components/dropdowns/simple-dropdown.js index 8cea78518..7bb48e57b 100644 --- a/ui/app/components/dropdowns/simple-dropdown.js +++ b/ui/app/components/dropdowns/simple-dropdown.js @@ -1,4 +1,5 @@ -const { Component, PropTypes } = require('react') +const { Component } = require('react') +const PropTypes = require('react').PropTypes const h = require('react-hyperscript') const classnames = require('classnames') const R = require('ramda') diff --git a/ui/app/components/loading.js b/ui/app/components/loading.js index e6d841aa0..587212015 100644 --- a/ui/app/components/loading.js +++ b/ui/app/components/loading.js @@ -1,5 +1,6 @@ const { Component } = require('react') const h = require('react-hyperscript') +const PropTypes = require('react').PropTypes class LoadingIndicator extends Component { renderMessage () { @@ -35,4 +36,8 @@ class LoadingIndicator extends Component { } } +LoadingIndicator.propTypes = { + loadingMessage: PropTypes.string, +} + module.exports = LoadingIndicator diff --git a/ui/app/components/modals/account-details-modal.js b/ui/app/components/modals/account-details-modal.js index e3c936702..4bf671834 100644 --- a/ui/app/components/modals/account-details-modal.js +++ b/ui/app/components/modals/account-details-modal.js @@ -4,7 +4,7 @@ const inherits = require('util').inherits const connect = require('react-redux').connect const actions = require('../../actions') const AccountModalContainer = require('./account-modal-container') -const { getSelectedIdentity, getSelectedAddress } = require('../../selectors') +const { getSelectedIdentity } = require('../../selectors') const genAccountLink = require('../../../lib/account-link.js') const QrView = require('../qr-code') const EditableLabel = require('../editable-label') diff --git a/ui/app/components/modals/export-private-key-modal.js b/ui/app/components/modals/export-private-key-modal.js index 2d8470634..193755df5 100644 --- a/ui/app/components/modals/export-private-key-modal.js +++ b/ui/app/components/modals/export-private-key-modal.js @@ -92,7 +92,6 @@ ExportPrivateKeyModal.prototype.renderButtons = function (privateKey, password, ExportPrivateKeyModal.prototype.render = function () { const { selectedIdentity, - network, warning, showAccountDetailModal, hideModal, 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: { diff --git a/ui/app/components/send-token/index.js b/ui/app/components/send-token/index.js index a95a0a6d8..c5c7a0b46 100644 --- a/ui/app/components/send-token/index.js +++ b/ui/app/components/send-token/index.js @@ -144,7 +144,6 @@ SendTokenScreen.prototype.validate = function () { } SendTokenScreen.prototype.setErrorsFor = function (field) { - const { balance, selectedToken } = this.props const { errors: previousErrors } = this.state const { diff --git a/ui/app/components/send/currency-display.js b/ui/app/components/send/currency-display.js index 5dba6a8dd..34939c767 100644 --- a/ui/app/components/send/currency-display.js +++ b/ui/app/components/send/currency-display.js @@ -1,7 +1,6 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits -const Identicon = require('../identicon') const { conversionUtil, multiplyCurrencies } = require('../../conversion-util') module.exports = CurrencyDisplay @@ -48,8 +47,6 @@ CurrencyDisplay.prototype.render = function () { conversionRate, primaryCurrency, convertedCurrency, - convertedPrefix = '', - placeholder = '0', readOnly = false, inError = false, value: initValue, diff --git a/ui/app/components/send/from-dropdown.js b/ui/app/components/send/from-dropdown.js index 6f2b9da68..b404dde14 100644 --- a/ui/app/components/send/from-dropdown.js +++ b/ui/app/components/send/from-dropdown.js @@ -1,7 +1,6 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits -const Identicon = require('../identicon') const AccountListItem = require('./account-list-item') module.exports = FromDropdown @@ -51,10 +50,8 @@ FromDropdown.prototype.renderDropdown = function () { FromDropdown.prototype.render = function () { const { - accounts, selectedAccount, openDropdown, - closeDropdown, dropdownOpen, } = this.props diff --git a/ui/app/components/send/gas-fee-display-v2.js b/ui/app/components/send/gas-fee-display-v2.js index 0e23b63ac..0b4377d29 100644 --- a/ui/app/components/send/gas-fee-display-v2.js +++ b/ui/app/components/send/gas-fee-display-v2.js @@ -23,7 +23,7 @@ GasFeeDisplay.prototype.render = function () { gasTotal ? h(CurrencyDisplay, { - primaryCurrency: 'ETH', + primaryCurrency, convertedCurrency, value: gasTotal, conversionRate, diff --git a/ui/app/components/send/memo-textarea.js b/ui/app/components/send/memo-textarea.js index 4005b9493..f5fe5e790 100644 --- a/ui/app/components/send/memo-textarea.js +++ b/ui/app/components/send/memo-textarea.js @@ -1,33 +1,33 @@ -const Component = require('react').Component -const h = require('react-hyperscript') -const inherits = require('util').inherits -const Identicon = require('../identicon') +// const Component = require('react').Component +// const h = require('react-hyperscript') +// const inherits = require('util').inherits +// const Identicon = require('../identicon') -module.exports = MemoTextArea +// module.exports = MemoTextArea -inherits(MemoTextArea, Component) -function MemoTextArea () { - Component.call(this) -} +// inherits(MemoTextArea, Component) +// function MemoTextArea () { +// Component.call(this) +// } -MemoTextArea.prototype.render = function () { - const { memo, identities, onChange } = this.props +// MemoTextArea.prototype.render = function () { +// const { memo, identities, onChange } = this.props - return h('div.send-v2__memo-text-area', [ +// return h('div.send-v2__memo-text-area', [ - h('textarea.send-v2__memo-text-area__input', { - placeholder: 'Optional', - value: memo, - onChange, - // onBlur: () => { - // this.setErrorsFor('memo') - // }, - onFocus: event => { - // this.clearErrorsFor('memo') - }, - }), +// h('textarea.send-v2__memo-text-area__input', { +// placeholder: 'Optional', +// value: memo, +// onChange, +// // onBlur: () => { +// // this.setErrorsFor('memo') +// // }, +// onFocus: event => { +// // this.clearErrorsFor('memo') +// }, +// }), - ]) +// ]) -} +// } diff --git a/ui/app/components/send/send-constants.js b/ui/app/components/send/send-constants.js index 471e01e2a..0a4f85bc9 100644 --- a/ui/app/components/send/send-constants.js +++ b/ui/app/components/send/send-constants.js @@ -1,5 +1,4 @@ const ethUtil = require('ethereumjs-util') -const Identicon = require('../identicon') const { conversionUtil, multiplyCurrencies } = require('../../conversion-util') const MIN_GAS_PRICE_HEX = (100000000).toString(16) diff --git a/ui/app/components/send/send-utils.js b/ui/app/components/send/send-utils.js index bf096d610..2def62842 100644 --- a/ui/app/components/send/send-utils.js +++ b/ui/app/components/send/send-utils.js @@ -27,7 +27,6 @@ function isBalanceSufficient({ fromNumericBase: 'hex', conversionRate: amountConversionRate, fromCurrency: selectedToken || primaryCurrency, - conversionRate: amountConversionRate, }, ) diff --git a/ui/app/components/send/send-v2-container.js b/ui/app/components/send/send-v2-container.js index fb2634de2..efdf69795 100644 --- a/ui/app/components/send/send-v2-container.js +++ b/ui/app/components/send/send-v2-container.js @@ -3,17 +3,12 @@ const actions = require('../../actions') const abi = require('ethereumjs-abi') const SendEther = require('../../send-v2') -const { multiplyCurrencies } = require('../../conversion-util') - const { accountsWithSendEtherInfoSelector, getCurrentAccountWithSendEtherInfo, conversionRateSelector, getSelectedToken, - getSelectedTokenExchangeRate, getSelectedAddress, - getGasPrice, - getGasLimit, getAddressBook, getSendFrom, getCurrentCurrency, @@ -26,7 +21,6 @@ function mapStateToProps (state) { const fromAccounts = accountsWithSendEtherInfoSelector(state) const selectedAddress = getSelectedAddress(state) const selectedToken = getSelectedToken(state) - const tokenExchangeRates = state.metamask.tokenExchangeRates const conversionRate = conversionRateSelector(state) let data; diff --git a/ui/app/components/send/to-autocomplete.js b/ui/app/components/send/to-autocomplete.js index ab490155b..ebc63a7c5 100644 --- a/ui/app/components/send/to-autocomplete.js +++ b/ui/app/components/send/to-autocomplete.js @@ -1,7 +1,6 @@ const Component = require('react').Component const h = require('react-hyperscript') const inherits = require('util').inherits -const Identicon = require('../identicon') const AccountListItem = require('./account-list-item') module.exports = ToAutoComplete @@ -23,7 +22,6 @@ ToAutoComplete.prototype.getListItemIcon = function (listItemAddress, toAddress) ToAutoComplete.prototype.renderDropdown = function () { const { - accounts, closeDropdown, onChange, to, @@ -86,9 +84,6 @@ ToAutoComplete.prototype.componentDidUpdate = function (nextProps, nextState) { ToAutoComplete.prototype.render = function () { const { to, - accounts, - openDropdown, - closeDropdown, dropdownOpen, onChange, inError, diff --git a/ui/app/components/signature-request.js b/ui/app/components/signature-request.js index e617fdbd6..529449ff0 100644 --- a/ui/app/components/signature-request.js +++ b/ui/app/components/signature-request.js @@ -6,9 +6,7 @@ const connect = require('react-redux').connect const ethUtil = require('ethereumjs-util') const classnames = require('classnames') -const PendingTxDetails = require('./pending-personal-msg-details') const AccountDropdownMini = require('./dropdowns/account-dropdown-mini') -const BinaryRenderer = require('./binary-renderer') const actions = require('../actions') const { conversionUtil } = require('../conversion-util') @@ -135,8 +133,6 @@ SignatureRequest.prototype.renderRequestIcon = function () { } SignatureRequest.prototype.renderRequestInfo = function () { - const { requester } = this.props - return h('div.request-signature__request-info', [ h('div.request-signature__headline', [ @@ -206,7 +202,6 @@ SignatureRequest.prototype.renderBody = function () { SignatureRequest.prototype.renderFooter = function () { const { - goHome, signPersonalMessage, signTypedMessage, cancelPersonalMessage, diff --git a/ui/app/components/tab-bar.js b/ui/app/components/tab-bar.js index fe4076ed0..0edced119 100644 --- a/ui/app/components/tab-bar.js +++ b/ui/app/components/tab-bar.js @@ -1,5 +1,6 @@ const { Component } = require('react') const h = require('react-hyperscript') +const PropTypes = require('react').PropTypes const classnames = require('classnames') class TabBar extends Component { @@ -37,4 +38,10 @@ class TabBar extends Component { } } +TabBar.propTypes = { + defaultTab: PropTypes.string, + tabs: PropTypes.array, + tabSelected: PropTypes.func, +} + module.exports = TabBar diff --git a/ui/app/components/token-list.js b/ui/app/components/token-list.js index 4959f1cd5..b6a27fd5a 100644 --- a/ui/app/components/token-list.js +++ b/ui/app/components/token-list.js @@ -3,7 +3,6 @@ const h = require('react-hyperscript') const inherits = require('util').inherits const TokenTracker = require('eth-token-tracker') const TokenCell = require('./token-cell.js') -const normalizeAddress = require('eth-sig-util').normalize const connect = require('react-redux').connect const selectors = require('../selectors') @@ -38,6 +37,7 @@ function TokenList () { } TokenList.prototype.render = function () { + const { userAddress } = this.props const state = this.state const { tokens, isLoading, error } = state @@ -162,15 +162,15 @@ TokenList.prototype.componentWillUnmount = function () { this.tracker.stop() } -function uniqueMergeTokens (tokensA, tokensB = []) { - const uniqueAddresses = [] - const result = [] - tokensA.concat(tokensB).forEach((token) => { - const normal = normalizeAddress(token.address) - if (!uniqueAddresses.includes(normal)) { - uniqueAddresses.push(normal) - result.push(token) - } - }) - return result -} +// function uniqueMergeTokens (tokensA, tokensB = []) { +// const uniqueAddresses = [] +// const result = [] +// tokensA.concat(tokensB).forEach((token) => { +// const normal = normalizeAddress(token.address) +// if (!uniqueAddresses.includes(normal)) { +// uniqueAddresses.push(normal) +// result.push(token) +// } +// }) +// return result +// } diff --git a/ui/app/components/transaction-list-item.js b/ui/app/components/transaction-list-item.js index 21f2b8236..255f0e5eb 100644 --- a/ui/app/components/transaction-list-item.js +++ b/ui/app/components/transaction-list-item.js @@ -142,7 +142,7 @@ function formatDate (date) { } function renderErrorOrWarning (transaction) { - const { status, err, warning } = transaction + const { status } = transaction // show rejected if (status === 'rejected') { @@ -151,31 +151,31 @@ function renderErrorOrWarning (transaction) { if (transaction.err || transaction.warning) { const { err, warning = {} } = transaction const errFirst = !!((err && warning) || err) - const message = errFirst ? err.message : warning.message errFirst ? err.message : warning.message - // show error - if (err) { - const message = err.message || '' - return ( - h(Tooltip, { - title: message, - position: 'bottom', - }, [ - h(`span.error`, ` (Failed)`), - ]) - ) - } - - // show warning - if (warning) { - const message = warning.message - return h(Tooltip, { - title: message, - position: 'bottom', - }, [ - h(`span.warning`, ` (Warning)`), - ]) + // show error + if (err) { + const message = err.message || '' + return ( + h(Tooltip, { + title: message, + position: 'bottom', + }, [ + h(`span.error`, ` (Failed)`), + ]) + ) + } + + // show warning + if (warning) { + const message = warning.message + return h(Tooltip, { + title: message, + position: 'bottom', + }, [ + h(`span.warning`, ` (Warning)`), + ]) + } } } diff --git a/ui/app/components/tx-list-item.js b/ui/app/components/tx-list-item.js index a59b6509b..ac7944ba2 100644 --- a/ui/app/components/tx-list-item.js +++ b/ui/app/components/tx-list-item.js @@ -6,7 +6,6 @@ const classnames = require('classnames') const abi = require('human-standard-token-abi') const abiDecoder = require('abi-decoder') abiDecoder.addABI(abi) -const prefixForNetwork = require('../../lib/etherscan-prefix-for-network') const Identicon = require('./identicon') const contractMap = require('eth-contract-metadata') @@ -127,7 +126,6 @@ TxListItem.prototype.getTokenInfo = async function () { TxListItem.prototype.getSendTokenTotal = async function () { const { txParams = {}, - tokens, conversionRate, tokenExchangeRates, currentCurrency, diff --git a/ui/app/components/tx-list.js b/ui/app/components/tx-list.js index 2f6c1fee8..6ea8776af 100644 --- a/ui/app/components/tx-list.js +++ b/ui/app/components/tx-list.js @@ -6,7 +6,7 @@ const prefixForNetwork = require('../../lib/etherscan-prefix-for-network') const selectors = require('../selectors') const TxListItem = require('./tx-list-item') const ShiftListItem = require('./shift-list-item') -const { formatBalance, formatDate } = require('../util') +const { formatDate } = require('../util') const { showConfTxPage } = require('../actions') const classnames = require('classnames') const { tokenInfoGetter } = require('../token-util') @@ -36,9 +36,6 @@ TxList.prototype.componentWillMount = function () { } TxList.prototype.render = function () { - - const { txsToRender, showConfTxPage } = this.props - return h('div.flex-column.tx-list-container', {}, [ h('div.flex-row.tx-list-header-wrapper', [ @@ -98,7 +95,6 @@ TxList.prototype.renderTransactionListItem = function (transaction, conversionRa txParams: transaction.txParams, transactionStatus, transActionId, - key: transActionId, dateString, address, transactionAmount, diff --git a/ui/app/conf-tx.js b/ui/app/conf-tx.js index 97e0646e8..a91a1a1f9 100644 --- a/ui/app/conf-tx.js +++ b/ui/app/conf-tx.js @@ -114,7 +114,7 @@ ConfirmTxScreen.prototype.render = function () { function currentTxView (opts) { log.info('rendering current tx view') const { txData } = opts - const { txParams, msgParams, type } = txData + const { txParams, msgParams } = txData if (txParams) { log.debug('txParams detected, rendering pending tx') diff --git a/ui/app/conversion-util.js b/ui/app/conversion-util.js index cb715460f..3a7788ad1 100644 --- a/ui/app/conversion-util.js +++ b/ui/app/conversion-util.js @@ -22,6 +22,8 @@ */ const BigNumber = require('bignumber.js') +const ethUtil = require('ethereumjs-util') +const BN = ethUtil.BN const R = require('ramda') const { stripHexPrefix } = require('ethereumjs-util') @@ -133,7 +135,7 @@ const addCurrencies = (a, b, options = {}) => { const { aBase, bBase, - ...conversionOptions, + ...conversionOptions } = options const value = (new BigNumber(a, aBase)).add(b, bBase); @@ -147,7 +149,7 @@ const multiplyCurrencies = (a, b, options = {}) => { const { multiplicandBase, multiplierBase, - ...conversionOptions, + ...conversionOptions } = options const bigNumberA = new BigNumber(String(a), multiplicandBase) @@ -157,7 +159,7 @@ const multiplyCurrencies = (a, b, options = {}) => { return converter({ value, - ...conversionOptions, + ...conversionOptions }) } diff --git a/ui/app/send-v2.js b/ui/app/send-v2.js index e772477ae..686de3209 100644 --- a/ui/app/send-v2.js +++ b/ui/app/send-v2.js @@ -1,8 +1,6 @@ const { inherits } = require('util') const PersistentForm = require('../lib/persistent-form') const h = require('react-hyperscript') -const connect = require('react-redux').connect -const classnames = require('classnames') const Identicon = require('./components/identicon') const FromDropdown = require('./components/send/from-dropdown') @@ -13,12 +11,9 @@ const GasFeeDisplay = require('./components/send/gas-fee-display-v2') const { MIN_GAS_TOTAL } = require('./components/send/send-constants') -const { showModal } = require('./actions') - const { multiplyCurrencies, conversionGreaterThan, - addCurrencies, } = require('./conversion-util') const { isBalanceSufficient, @@ -154,7 +149,6 @@ SendTransactionScreen.prototype.renderFromRow = function () { from, fromAccounts, conversionRate, - setSelectedAddress, updateSendFrom, } = this.props @@ -243,7 +237,6 @@ SendTransactionScreen.prototype.validateAmount = function (value) { amountConversionRate, conversionRate, primaryCurrency, - toCurrency, selectedToken, gasTotal, } = this.props @@ -440,7 +433,6 @@ SendTransactionScreen.prototype.onSubmit = function (event) { signTokenTx, signTx, selectedToken, - toAccounts, clearSend, errors: { amount: amountError, to: toError }, } = this.props diff --git a/ui/app/send.js b/ui/app/send.js index 5643d927b..ce496d289 100644 --- a/ui/app/send.js +++ b/ui/app/send.js @@ -1,547 +1,547 @@ -const { inherits } = require('util') -const PersistentForm = require('../lib/persistent-form') -const h = require('react-hyperscript') -const connect = require('react-redux').connect -const Identicon = require('./components/identicon') -const EnsInput = require('./components/ens-input') -const GasTooltip = require('./components/send/gas-tooltip') -const CurrencyToggle = require('./components/send/currency-toggle') -const GasFeeDisplay = require('./components/send/gas-fee-display') -const { getSelectedIdentity } = require('./selectors') - -const { - showAccountsPage, - backToAccountDetail, - displayWarning, - hideWarning, - addToAddressBook, - signTx, - estimateGas, - getGasPrice, -} = require('./actions') -const { stripHexPrefix, addHexPrefix } = require('ethereumjs-util') -const { isHex, numericBalance, isValidAddress, allNull } = require('./util') -const { conversionUtil, conversionGreaterThan } = require('./conversion-util') - -module.exports = connect(mapStateToProps)(SendTransactionScreen) - -function mapStateToProps (state) { - const { - selectedAddress: address, - accounts, - identities, - network, - addressBook, - conversionRate, - currentBlockGasLimit: blockGasLimit, - } = state.metamask - const { warning } = state.appState - const selectedIdentity = getSelectedIdentity(state) - const account = accounts[address] - - return { - address, - accounts, - identities, - network, - addressBook, - conversionRate, - blockGasLimit, - warning, - selectedIdentity, - error: warning && warning.split('.')[0], - account, - identity: identities[address], - balance: account ? account.balance : null, - } -} - -inherits(SendTransactionScreen, PersistentForm) -function SendTransactionScreen () { - PersistentForm.call(this) - - // [WIP] These are the bare minimum of tx props needed to sign a transaction - // We will need a few more for contract-related interactions - this.state = { - newTx: { - from: '', - to: '', - amountToSend: '0x0', - gasPrice: null, - gas: null, - amount: '0x0', - txData: null, - memo: '', - }, - activeCurrency: 'USD', - tooltipIsOpen: false, - errors: {}, - isValid: false, - } - - this.back = this.back.bind(this) - this.closeTooltip = this.closeTooltip.bind(this) - this.onSubmit = this.onSubmit.bind(this) - this.setActiveCurrency = this.setActiveCurrency.bind(this) - this.toggleTooltip = this.toggleTooltip.bind(this) - this.validate = this.validate.bind(this) - this.getAmountToSend = this.getAmountToSend.bind(this) - this.setErrorsFor = this.setErrorsFor.bind(this) - this.clearErrorsFor = this.clearErrorsFor.bind(this) - - this.renderFromInput = this.renderFromInput.bind(this) - this.renderToInput = this.renderToInput.bind(this) - this.renderAmountInput = this.renderAmountInput.bind(this) - this.renderGasInput = this.renderGasInput.bind(this) - this.renderMemoInput = this.renderMemoInput.bind(this) - this.renderErrorMessage = this.renderErrorMessage.bind(this) -} - -SendTransactionScreen.prototype.componentWillMount = function () { - const { newTx } = this.state - const { address } = this.props - - Promise.all([ - this.props.dispatch(getGasPrice()), - this.props.dispatch(estimateGas({ - from: address, - gas: '746a528800', - })), - ]) - .then(([blockGasPrice, estimatedGas]) => { - console.log({ blockGasPrice, estimatedGas}) - this.setState({ - newTx: { - ...newTx, - gasPrice: blockGasPrice, - gas: estimatedGas, - }, - }) - }) -} - -SendTransactionScreen.prototype.renderErrorMessage = function(errorType, warning) { - const { errors } = this.state - const errorMessage = errors[errorType]; - - return errorMessage || warning - ? h('div.send-screen-input-wrapper__error-message', [ errorMessage || warning ]) - : null -} - -SendTransactionScreen.prototype.renderFromInput = function (from, identities) { - return h('div.send-screen-input-wrapper', [ - - h('div', 'From:'), - - h('input.large-input.send-screen-input', { - list: 'accounts', - placeholder: 'Account', - value: from, - onChange: (event) => { - this.setState({ - newTx: { - ...this.state.newTx, - from: event.target.value, - }, - }) - }, - onBlur: () => this.setErrorsFor('from'), - onFocus: event => { - this.clearErrorsFor('from') - this.state.newTx.from && event.target.select() - }, - }), - - h('datalist#accounts', [ - Object.entries(identities).map(([key, { address, name }]) => { - return h('option', { - value: address, - label: name, - key: address, - }) - }), - ]), - - this.renderErrorMessage('from'), - - ]) -} - -SendTransactionScreen.prototype.renderToInput = function (to, identities, addressBook) { - return h('div.send-screen-input-wrapper', [ - - h('div', 'To:'), - - h('input.large-input.send-screen-input', { - name: 'address', - list: 'addresses', - placeholder: 'Address', - value: to, - onChange: (event) => { - this.setState({ - newTx: { - ...this.state.newTx, - to: event.target.value, - }, - }) - }, - onBlur: () => { - this.setErrorsFor('to') - }, - onFocus: event => { - this.clearErrorsFor('to') - this.state.newTx.to && event.target.select() - }, - }), - - h('datalist#addresses', [ - // Corresponds to the addresses owned. - ...Object.entries(identities).map(([key, { address, name }]) => { - return h('option', { - value: address, - label: name, - key: address, - }) - }), - // Corresponds to previously sent-to addresses. - ...addressBook.map(({ address, name }) => { - return h('option', { - value: address, - label: name, - key: address, - }) - }), - ]), - - this.renderErrorMessage('to'), - - ]) -} - -SendTransactionScreen.prototype.renderAmountInput = function (activeCurrency) { - return h('div.send-screen-input-wrapper', [ - - h('div.send-screen-amount-labels', [ - h('span', 'Amount'), - h(CurrencyToggle, { - activeCurrency, - onClick: (newCurrency) => this.setActiveCurrency(newCurrency), - }), // holding on icon from design - ]), - - h('input.large-input.send-screen-input', { - placeholder: `0 ${activeCurrency}`, - type: 'number', - onChange: (event) => { - const amountToSend = event.target.value - ? this.getAmountToSend(event.target.value) - : '0x0' - - this.setState({ - newTx: Object.assign( - this.state.newTx, - { - amount: event.target.value, - amountToSend: amountToSend, - } - ), - }) - }, - onBlur: () => { - this.setErrorsFor('amount') - }, - onFocus: () => this.clearErrorsFor('amount'), - }), - - this.renderErrorMessage('amount'), - - ]) -} - -SendTransactionScreen.prototype.renderGasInput = function (gasPrice, gas, activeCurrency, conversionRate, blockGasLimit) { - return h('div.send-screen-input-wrapper', [ - this.state.tooltipIsOpen && h(GasTooltip, { - className: 'send-tooltip', - gasPrice, - gasLimit: gas, - onClose: this.closeTooltip, - onFeeChange: ({gasLimit, gasPrice}) => { - this.setState({ - newTx: { - ...this.state.newTx, - gas: gasLimit, - gasPrice, - }, - }) - }, - }), - - h('div.send-screen-gas-labels', [ - h('span', [ - h('i.fa.fa-bolt'), - 'Gas fee:', - ]), - h('span', 'What\'s this?'), - ]), - - // TODO: handle loading time when switching to USD - h('div.large-input.send-screen-gas-input', {}, [ - h(GasFeeDisplay, { - activeCurrency, - conversionRate, - gas, - gasPrice, - blockGasLimit, - }), - h('div.send-screen-gas-input-customize', { - onClick: this.toggleTooltip, - }, [ - 'Customize', - ]), - ]), - - ]) -} - -SendTransactionScreen.prototype.renderMemoInput = function () { - return h('div.send-screen-input-wrapper', [ - h('div', 'Transaction memo (optional)'), - h('input.large-input.send-screen-input', { - onChange: () => { - this.setState({ - newTx: Object.assign( - this.state.newTx, - { - memo: event.target.value, - } - ), - }) - }, - }), - ]) -} - -SendTransactionScreen.prototype.render = function () { - this.persistentFormParentId = 'send-tx-form' - - const props = this.props - const { - warning, - identities, - addressBook, - conversionRate, - } = props - - const { - blockGasLimit, - newTx, - activeCurrency, - isValid, - } = this.state - const { gas, gasPrice } = newTx - - return ( - - h('div.send-screen-wrapper', [ - // Main Send token Card - h('div.send-screen-card', [ - - h('img.send-eth-icon', { src: '../images/eth_logo.svg' }), - - h('div.send-screen__title', 'Send'), - - h('div.send-screen__subtitle', 'Send Ethereum to anyone with an Ethereum account'), - - this.renderFromInput(this.state.newTx.from, identities), - - this.renderToInput(this.state.newTx.to, identities, addressBook), - - this.renderAmountInput(activeCurrency), - - this.renderGasInput( - gasPrice || '0x0', - gas || '0x0', - activeCurrency, - conversionRate, - blockGasLimit - ), - - this.renderMemoInput(), - - this.renderErrorMessage(null, warning), - - ]), - - // Buttons underneath card - h('section.flex-column.flex-center', [ - h('button.btn-secondary.send-screen__send-button', { - className: !isValid && 'send-screen__send-button__disabled', - onClick: (event) => isValid && this.onSubmit(event), - }, 'Next'), - h('button.btn-tertiary.send-screen__cancel-button', { - onClick: this.back, - }, 'Cancel'), - ]), - ]) - - ) -} - -SendTransactionScreen.prototype.toggleTooltip = function () { - this.setState({ tooltipIsOpen: !this.state.tooltipIsOpen }) -} - -SendTransactionScreen.prototype.closeTooltip = function () { - this.setState({ tooltipIsOpen: false }) -} - -SendTransactionScreen.prototype.setActiveCurrency = function (newCurrency) { - this.setState({ activeCurrency: newCurrency }) -} - -SendTransactionScreen.prototype.back = function () { - var address = this.props.address - this.props.dispatch(backToAccountDetail(address)) -} - -SendTransactionScreen.prototype.validate = function (balance, amountToSend, { to, from }) { - const sufficientBalance = conversionGreaterThan( - { - value: balance, - fromNumericBase: 'hex', - }, - { - value: amountToSend, - fromNumericBase: 'hex', - }, - ) - - const amountLessThanZero = conversionGreaterThan( - { - value: 0, - fromNumericBase: 'dec', - }, - { - value: amountToSend, - fromNumericBase: 'hex', - }, - ) - - const errors = {} - - if (!sufficientBalance) { - errors.amount = 'Insufficient funds.' - } - - if (amountLessThanZero) { - errors.amount = 'Can not send negative amounts of ETH.' - } - - if (!from) { - errors.from = 'Required' - } - - if (from && !isValidAddress(from)) { - errors.from = 'Sender address is invalid.' - } - - if (!to) { - errors.to = 'Required' - } - - if (to && !isValidAddress(to)) { - errors.to = 'Recipient address is invalid.' - } - - // if (txData && !isHex(stripHexPrefix(txData))) { - // message = 'Transaction data must be hex string.' - // return this.props.dispatch(displayWarning(message)) - // } - - return { - isValid: allNull(errors), - errors, - } -} - -SendTransactionScreen.prototype.getAmountToSend = function (amount) { - const { activeCurrency } = this.state - const { conversionRate } = this.props - - return conversionUtil(amount, { - fromNumericBase: 'dec', - toNumericBase: 'hex', - fromCurrency: activeCurrency, - toCurrency: 'ETH', - toDenomination: 'WEI', - conversionRate, - invertConversionRate: activeCurrency !== 'ETH', - }) -} - -SendTransactionScreen.prototype.setErrorsFor = function (field) { - const { balance } = this.props - const { newTx, errors: previousErrors } = this.state - const { amountToSend } = newTx - - const { - isValid, - errors: newErrors - } = this.validate(balance, amountToSend, newTx) - - const nextErrors = Object.assign({}, previousErrors, { - [field]: newErrors[field] || null - }) - - if (!isValid) { - this.setState({ - errors: nextErrors, - isValid, - }) - } -} - -SendTransactionScreen.prototype.clearErrorsFor = function (field) { - const { errors: previousErrors } = this.state - const nextErrors = Object.assign({}, previousErrors, { - [field]: null - }) - - this.setState({ - errors: nextErrors, - isValid: allNull(nextErrors), - }) -} - -SendTransactionScreen.prototype.onSubmit = function (event) { - event.preventDefault() - const { warning, balance } = this.props - const state = this.state || {} - - const recipient = state.newTx.to - const sender = state.newTx.from - const nickname = state.nickname || ' ' - - // TODO: convert this to hex when created and include it in send - const txData = state.newTx.memo - - this.props.dispatch(hideWarning()) - - this.props.dispatch(addToAddressBook(recipient, nickname)) - - var txParams = { - from: this.state.newTx.from, - to: this.state.newTx.to, - - value: this.state.newTx.amountToSend, - - gas: this.state.newTx.gas, - gasPrice: this.state.newTx.gasPrice, - } - - if (recipient) txParams.to = addHexPrefix(recipient) - if (txData) txParams.data = txData - - this.props.dispatch(signTx(txParams)) -} +// const { inherits } = require('util') +// const PersistentForm = require('../lib/persistent-form') +// const h = require('react-hyperscript') +// const connect = require('react-redux').connect +// const Identicon = require('./components/identicon') +// const EnsInput = require('./components/ens-input') +// const GasTooltip = require('./components/send/gas-tooltip') +// const CurrencyToggle = require('./components/send/currency-toggle') +// const GasFeeDisplay = require('./components/send/gas-fee-display') +// const { getSelectedIdentity } = require('./selectors') + +// const { +// showAccountsPage, +// backToAccountDetail, +// displayWarning, +// hideWarning, +// addToAddressBook, +// signTx, +// estimateGas, +// getGasPrice, +// } = require('./actions') +// const { stripHexPrefix, addHexPrefix } = require('ethereumjs-util') +// const { isHex, numericBalance, isValidAddress, allNull } = require('./util') +// const { conversionUtil, conversionGreaterThan } = require('./conversion-util') + +// module.exports = connect(mapStateToProps)(SendTransactionScreen) + +// function mapStateToProps (state) { +// const { +// selectedAddress: address, +// accounts, +// identities, +// network, +// addressBook, +// conversionRate, +// currentBlockGasLimit: blockGasLimit, +// } = state.metamask +// const { warning } = state.appState +// const selectedIdentity = getSelectedIdentity(state) +// const account = accounts[address] + +// return { +// address, +// accounts, +// identities, +// network, +// addressBook, +// conversionRate, +// blockGasLimit, +// warning, +// selectedIdentity, +// error: warning && warning.split('.')[0], +// account, +// identity: identities[address], +// balance: account ? account.balance : null, +// } +// } + +// inherits(SendTransactionScreen, PersistentForm) +// function SendTransactionScreen () { +// PersistentForm.call(this) + +// // [WIP] These are the bare minimum of tx props needed to sign a transaction +// // We will need a few more for contract-related interactions +// this.state = { +// newTx: { +// from: '', +// to: '', +// amountToSend: '0x0', +// gasPrice: null, +// gas: null, +// amount: '0x0', +// txData: null, +// memo: '', +// }, +// activeCurrency: 'USD', +// tooltipIsOpen: false, +// errors: {}, +// isValid: false, +// } + +// this.back = this.back.bind(this) +// this.closeTooltip = this.closeTooltip.bind(this) +// this.onSubmit = this.onSubmit.bind(this) +// this.setActiveCurrency = this.setActiveCurrency.bind(this) +// this.toggleTooltip = this.toggleTooltip.bind(this) +// this.validate = this.validate.bind(this) +// this.getAmountToSend = this.getAmountToSend.bind(this) +// this.setErrorsFor = this.setErrorsFor.bind(this) +// this.clearErrorsFor = this.clearErrorsFor.bind(this) + +// this.renderFromInput = this.renderFromInput.bind(this) +// this.renderToInput = this.renderToInput.bind(this) +// this.renderAmountInput = this.renderAmountInput.bind(this) +// this.renderGasInput = this.renderGasInput.bind(this) +// this.renderMemoInput = this.renderMemoInput.bind(this) +// this.renderErrorMessage = this.renderErrorMessage.bind(this) +// } + +// SendTransactionScreen.prototype.componentWillMount = function () { +// const { newTx } = this.state +// const { address } = this.props + +// Promise.all([ +// this.props.dispatch(getGasPrice()), +// this.props.dispatch(estimateGas({ +// from: address, +// gas: '746a528800', +// })), +// ]) +// .then(([blockGasPrice, estimatedGas]) => { +// console.log({ blockGasPrice, estimatedGas}) +// this.setState({ +// newTx: { +// ...newTx, +// gasPrice: blockGasPrice, +// gas: estimatedGas, +// }, +// }) +// }) +// } + +// SendTransactionScreen.prototype.renderErrorMessage = function(errorType, warning) { +// const { errors } = this.state +// const errorMessage = errors[errorType]; + +// return errorMessage || warning +// ? h('div.send-screen-input-wrapper__error-message', [ errorMessage || warning ]) +// : null +// } + +// SendTransactionScreen.prototype.renderFromInput = function (from, identities) { +// return h('div.send-screen-input-wrapper', [ + +// h('div', 'From:'), + +// h('input.large-input.send-screen-input', { +// list: 'accounts', +// placeholder: 'Account', +// value: from, +// onChange: (event) => { +// this.setState({ +// newTx: { +// ...this.state.newTx, +// from: event.target.value, +// }, +// }) +// }, +// onBlur: () => this.setErrorsFor('from'), +// onFocus: event => { +// this.clearErrorsFor('from') +// this.state.newTx.from && event.target.select() +// }, +// }), + +// h('datalist#accounts', [ +// Object.entries(identities).map(([key, { address, name }]) => { +// return h('option', { +// value: address, +// label: name, +// key: address, +// }) +// }), +// ]), + +// this.renderErrorMessage('from'), + +// ]) +// } + +// SendTransactionScreen.prototype.renderToInput = function (to, identities, addressBook) { +// return h('div.send-screen-input-wrapper', [ + +// h('div', 'To:'), + +// h('input.large-input.send-screen-input', { +// name: 'address', +// list: 'addresses', +// placeholder: 'Address', +// value: to, +// onChange: (event) => { +// this.setState({ +// newTx: { +// ...this.state.newTx, +// to: event.target.value, +// }, +// }) +// }, +// onBlur: () => { +// this.setErrorsFor('to') +// }, +// onFocus: event => { +// this.clearErrorsFor('to') +// this.state.newTx.to && event.target.select() +// }, +// }), + +// h('datalist#addresses', [ +// // Corresponds to the addresses owned. +// ...Object.entries(identities).map(([key, { address, name }]) => { +// return h('option', { +// value: address, +// label: name, +// key: address, +// }) +// }), +// // Corresponds to previously sent-to addresses. +// ...addressBook.map(({ address, name }) => { +// return h('option', { +// value: address, +// label: name, +// key: address, +// }) +// }), +// ]), + +// this.renderErrorMessage('to'), + +// ]) +// } + +// SendTransactionScreen.prototype.renderAmountInput = function (activeCurrency) { +// return h('div.send-screen-input-wrapper', [ + +// h('div.send-screen-amount-labels', [ +// h('span', 'Amount'), +// h(CurrencyToggle, { +// activeCurrency, +// onClick: (newCurrency) => this.setActiveCurrency(newCurrency), +// }), // holding on icon from design +// ]), + +// h('input.large-input.send-screen-input', { +// placeholder: `0 ${activeCurrency}`, +// type: 'number', +// onChange: (event) => { +// const amountToSend = event.target.value +// ? this.getAmountToSend(event.target.value) +// : '0x0' + +// this.setState({ +// newTx: Object.assign( +// this.state.newTx, +// { +// amount: event.target.value, +// amountToSend: amountToSend, +// } +// ), +// }) +// }, +// onBlur: () => { +// this.setErrorsFor('amount') +// }, +// onFocus: () => this.clearErrorsFor('amount'), +// }), + +// this.renderErrorMessage('amount'), + +// ]) +// } + +// SendTransactionScreen.prototype.renderGasInput = function (gasPrice, gas, activeCurrency, conversionRate, blockGasLimit) { +// return h('div.send-screen-input-wrapper', [ +// this.state.tooltipIsOpen && h(GasTooltip, { +// className: 'send-tooltip', +// gasPrice, +// gasLimit: gas, +// onClose: this.closeTooltip, +// onFeeChange: ({gasLimit, gasPrice}) => { +// this.setState({ +// newTx: { +// ...this.state.newTx, +// gas: gasLimit, +// gasPrice, +// }, +// }) +// }, +// }), + +// h('div.send-screen-gas-labels', [ +// h('span', [ +// h('i.fa.fa-bolt'), +// 'Gas fee:', +// ]), +// h('span', 'What\'s this?'), +// ]), + +// // TODO: handle loading time when switching to USD +// h('div.large-input.send-screen-gas-input', {}, [ +// h(GasFeeDisplay, { +// activeCurrency, +// conversionRate, +// gas, +// gasPrice, +// blockGasLimit, +// }), +// h('div.send-screen-gas-input-customize', { +// onClick: this.toggleTooltip, +// }, [ +// 'Customize', +// ]), +// ]), + +// ]) +// } + +// SendTransactionScreen.prototype.renderMemoInput = function () { +// return h('div.send-screen-input-wrapper', [ +// h('div', 'Transaction memo (optional)'), +// h('input.large-input.send-screen-input', { +// onChange: () => { +// this.setState({ +// newTx: Object.assign( +// this.state.newTx, +// { +// memo: event.target.value, +// } +// ), +// }) +// }, +// }), +// ]) +// } + +// SendTransactionScreen.prototype.render = function () { +// this.persistentFormParentId = 'send-tx-form' + +// const props = this.props +// const { +// warning, +// identities, +// addressBook, +// conversionRate, +// } = props + +// const { +// blockGasLimit, +// newTx, +// activeCurrency, +// isValid, +// } = this.state +// const { gas, gasPrice } = newTx + +// return ( + +// h('div.send-screen-wrapper', [ +// // Main Send token Card +// h('div.send-screen-card', [ + +// h('img.send-eth-icon', { src: '../images/eth_logo.svg' }), + +// h('div.send-screen__title', 'Send'), + +// h('div.send-screen__subtitle', 'Send Ethereum to anyone with an Ethereum account'), + +// this.renderFromInput(this.state.newTx.from, identities), + +// this.renderToInput(this.state.newTx.to, identities, addressBook), + +// this.renderAmountInput(activeCurrency), + +// this.renderGasInput( +// gasPrice || '0x0', +// gas || '0x0', +// activeCurrency, +// conversionRate, +// blockGasLimit +// ), + +// this.renderMemoInput(), + +// this.renderErrorMessage(null, warning), + +// ]), + +// // Buttons underneath card +// h('section.flex-column.flex-center', [ +// h('button.btn-secondary.send-screen__send-button', { +// className: !isValid && 'send-screen__send-button__disabled', +// onClick: (event) => isValid && this.onSubmit(event), +// }, 'Next'), +// h('button.btn-tertiary.send-screen__cancel-button', { +// onClick: this.back, +// }, 'Cancel'), +// ]), +// ]) + +// ) +// } + +// SendTransactionScreen.prototype.toggleTooltip = function () { +// this.setState({ tooltipIsOpen: !this.state.tooltipIsOpen }) +// } + +// SendTransactionScreen.prototype.closeTooltip = function () { +// this.setState({ tooltipIsOpen: false }) +// } + +// SendTransactionScreen.prototype.setActiveCurrency = function (newCurrency) { +// this.setState({ activeCurrency: newCurrency }) +// } + +// SendTransactionScreen.prototype.back = function () { +// var address = this.props.address +// this.props.dispatch(backToAccountDetail(address)) +// } + +// SendTransactionScreen.prototype.validate = function (balance, amountToSend, { to, from }) { +// const sufficientBalance = conversionGreaterThan( +// { +// value: balance, +// fromNumericBase: 'hex', +// }, +// { +// value: amountToSend, +// fromNumericBase: 'hex', +// }, +// ) + +// const amountLessThanZero = conversionGreaterThan( +// { +// value: 0, +// fromNumericBase: 'dec', +// }, +// { +// value: amountToSend, +// fromNumericBase: 'hex', +// }, +// ) + +// const errors = {} + +// if (!sufficientBalance) { +// errors.amount = 'Insufficient funds.' +// } + +// if (amountLessThanZero) { +// errors.amount = 'Can not send negative amounts of ETH.' +// } + +// if (!from) { +// errors.from = 'Required' +// } + +// if (from && !isValidAddress(from)) { +// errors.from = 'Sender address is invalid.' +// } + +// if (!to) { +// errors.to = 'Required' +// } + +// if (to && !isValidAddress(to)) { +// errors.to = 'Recipient address is invalid.' +// } + +// // if (txData && !isHex(stripHexPrefix(txData))) { +// // message = 'Transaction data must be hex string.' +// // return this.props.dispatch(displayWarning(message)) +// // } + +// return { +// isValid: allNull(errors), +// errors, +// } +// } + +// SendTransactionScreen.prototype.getAmountToSend = function (amount) { +// const { activeCurrency } = this.state +// const { conversionRate } = this.props + +// return conversionUtil(amount, { +// fromNumericBase: 'dec', +// toNumericBase: 'hex', +// fromCurrency: activeCurrency, +// toCurrency: 'ETH', +// toDenomination: 'WEI', +// conversionRate, +// invertConversionRate: activeCurrency !== 'ETH', +// }) +// } + +// SendTransactionScreen.prototype.setErrorsFor = function (field) { +// const { balance } = this.props +// const { newTx, errors: previousErrors } = this.state +// const { amountToSend } = newTx + +// const { +// isValid, +// errors: newErrors +// } = this.validate(balance, amountToSend, newTx) + +// const nextErrors = Object.assign({}, previousErrors, { +// [field]: newErrors[field] || null +// }) + +// if (!isValid) { +// this.setState({ +// errors: nextErrors, +// isValid, +// }) +// } +// } + +// SendTransactionScreen.prototype.clearErrorsFor = function (field) { +// const { errors: previousErrors } = this.state +// const nextErrors = Object.assign({}, previousErrors, { +// [field]: null +// }) + +// this.setState({ +// errors: nextErrors, +// isValid: allNull(nextErrors), +// }) +// } + +// SendTransactionScreen.prototype.onSubmit = function (event) { +// event.preventDefault() +// const { warning, balance } = this.props +// const state = this.state || {} + +// const recipient = state.newTx.to +// const sender = state.newTx.from +// const nickname = state.nickname || ' ' + +// // TODO: convert this to hex when created and include it in send +// const txData = state.newTx.memo + +// this.props.dispatch(hideWarning()) + +// this.props.dispatch(addToAddressBook(recipient, nickname)) + +// var txParams = { +// from: this.state.newTx.from, +// to: this.state.newTx.to, + +// value: this.state.newTx.amountToSend, + +// gas: this.state.newTx.gas, +// gasPrice: this.state.newTx.gasPrice, +// } + +// if (recipient) txParams.to = addHexPrefix(recipient) +// if (txData) txParams.data = txData + +// this.props.dispatch(signTx(txParams)) +// } |