diff options
Diffstat (limited to 'ui/app/components/modals')
-rw-r--r-- | ui/app/components/modals/account-details-modal.js | 2 | ||||
-rw-r--r-- | ui/app/components/modals/export-private-key-modal.js | 1 | ||||
-rw-r--r-- | ui/app/components/modals/modal.js | 2 | ||||
-rw-r--r-- | ui/app/components/modals/new-account-modal.js | 141 | ||||
-rw-r--r-- | ui/app/components/modals/shapeshift-deposit-tx-modal.js | 2 |
5 files changed, 81 insertions, 67 deletions
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/modals/modal.js b/ui/app/components/modals/modal.js index e15dd6c1b..842081f40 100644 --- a/ui/app/components/modals/modal.js +++ b/ui/app/components/modals/modal.js @@ -220,7 +220,7 @@ Modal.prototype.render = function () { const children = modal.contents const modalStyle = modal[isMobileView() ? 'mobileModalStyle' : 'laptopModalStyle'] - const contentStyle = modal.contentStyle || {}; + const contentStyle = modal.contentStyle || {} return h(FadeModal, { diff --git a/ui/app/components/modals/new-account-modal.js b/ui/app/components/modals/new-account-modal.js index b78de1d8d..fc1fd413d 100644 --- a/ui/app/components/modals/new-account-modal.js +++ b/ui/app/components/modals/new-account-modal.js @@ -1,17 +1,88 @@ -const Component = require('react').Component +const { Component } = require('react') +const PropTypes = require('prop-types') const h = require('react-hyperscript') -const inherits = require('util').inherits -const connect = require('react-redux').connect +const { connect } = require('react-redux') const actions = require('../../actions') -function mapStateToProps (state) { +class NewAccountModal extends Component { + constructor (props) { + super(props) + const { numberOfExistingAccounts = 0 } = props + const newAccountNumber = numberOfExistingAccounts + 1 + + this.state = { + newAccountName: `Account ${newAccountNumber}`, + } + } + + render () { + const { newAccountName } = this.state + + return h('div', [ + h('div.new-account-modal-wrapper', { + }, [ + h('div.new-account-modal-header', {}, [ + 'New Account', + ]), + + h('div.modal-close-x', { + onClick: this.props.hideModal, + }), + + h('div.new-account-modal-content', {}, [ + 'Account Name', + ]), + + h('div.new-account-input-wrapper', {}, [ + h('input.new-account-input', { + value: this.state.newAccountName, + placeholder: 'E.g. My new account', + onChange: event => this.setState({ newAccountName: event.target.value }), + }, []), + ]), + + h('div.new-account-modal-content.after-input', {}, [ + 'or', + ]), + + h('div.new-account-modal-content.after-input.pointer', { + onClick: () => { + this.props.hideModal() + this.props.showImportPage() + }, + }, 'Import an account'), + + h('div.new-account-modal-content.button', {}, [ + h('button.btn-clear', { + onClick: () => this.props.createAccount(newAccountName), + }, [ + 'SAVE', + ]), + ]), + ]), + ]) + } +} + +NewAccountModal.propTypes = { + hideModal: PropTypes.func, + showImportPage: PropTypes.func, + createAccount: PropTypes.func, + numberOfExistingAccounts: PropTypes.number, +} + +const mapStateToProps = state => { + const { metamask: { network, selectedAddress, identities = {} } } = state + const numberOfExistingAccounts = Object.keys(identities).length + return { - network: state.metamask.network, - address: state.metamask.selectedAddress, + network, + address: selectedAddress, + numberOfExistingAccounts, } } -function mapDispatchToProps (dispatch) { +const mapDispatchToProps = dispatch => { return { toCoinbase: (address) => { dispatch(actions.buyEth({ network: '1', address, amount: 0 })) @@ -32,60 +103,4 @@ function mapDispatchToProps (dispatch) { } } -inherits(NewAccountModal, Component) -function NewAccountModal () { - Component.call(this) - - this.state = { - newAccountName: '', - } -} - module.exports = connect(mapStateToProps, mapDispatchToProps)(NewAccountModal) - -NewAccountModal.prototype.render = function () { - const { newAccountName } = this.state - - return h('div', {}, [ - h('div.new-account-modal-wrapper', { - }, [ - h('div.new-account-modal-header', {}, [ - 'New Account', - ]), - - h('div.modal-close-x', { - onClick: this.props.hideModal, - }), - - h('div.new-account-modal-content', {}, [ - 'Account Name', - ]), - - h('div.new-account-input-wrapper', {}, [ - h('input.new-account-input', { - placeholder: 'E.g. My new account', - onChange: event => this.setState({ newAccountName: event.target.value }), - }, []), - ]), - - h('div.new-account-modal-content.after-input', {}, [ - 'or', - ]), - - h('div.new-account-modal-content.after-input.pointer', { - onClick: () => { - this.props.hideModal() - this.props.showImportPage() - }, - }, 'Import an account'), - - h('div.new-account-modal-content.button', {}, [ - h('button.btn-clear', { - onClick: () => this.props.createAccount(newAccountName), - }, [ - 'SAVE', - ]), - ]), - ]), - ]) -} diff --git a/ui/app/components/modals/shapeshift-deposit-tx-modal.js b/ui/app/components/modals/shapeshift-deposit-tx-modal.js index 1fd1ade00..24af5a0de 100644 --- a/ui/app/components/modals/shapeshift-deposit-tx-modal.js +++ b/ui/app/components/modals/shapeshift-deposit-tx-modal.js @@ -35,6 +35,6 @@ ShapeshiftDepositTxModal.prototype.render = function () { }, [ h('div', {}, [ h(QrView, {key: 'qr', Qr}), - ]) + ]), ]) } |