diff options
author | Thomas <tmashuang@gmail.com> | 2018-04-11 23:35:31 +0800 |
---|---|---|
committer | Thomas <tmashuang@gmail.com> | 2018-04-11 23:35:31 +0800 |
commit | f82c51c2c4782f54fb1d690f2dc1c309fafefe65 (patch) | |
tree | 84e5d2a1b989459f3dbb6f74e1921b4b83f705a0 /ui/app/components/pages/create-account/new-account.js | |
parent | 30474ccd35d5d7f30ffb8dff0acc8fbc77f44731 (diff) | |
parent | 29dab1e9e00c1c1e6ad834026df51b2839d3171d (diff) | |
download | tangerine-wallet-browser-f82c51c2c4782f54fb1d690f2dc1c309fafefe65.tar.gz tangerine-wallet-browser-f82c51c2c4782f54fb1d690f2dc1c309fafefe65.tar.zst tangerine-wallet-browser-f82c51c2c4782f54fb1d690f2dc1c309fafefe65.zip |
Merge branch 'master' into testing
Diffstat (limited to 'ui/app/components/pages/create-account/new-account.js')
-rw-r--r-- | ui/app/components/pages/create-account/new-account.js | 103 |
1 files changed, 103 insertions, 0 deletions
diff --git a/ui/app/components/pages/create-account/new-account.js b/ui/app/components/pages/create-account/new-account.js new file mode 100644 index 000000000..40fa584be --- /dev/null +++ b/ui/app/components/pages/create-account/new-account.js @@ -0,0 +1,103 @@ +const { Component } = require('react') +const PropTypes = require('prop-types') +const h = require('react-hyperscript') +const connect = require('react-redux').connect +const actions = require('../../../actions') +const { DEFAULT_ROUTE } = require('../../../routes') + +class NewAccountCreateForm extends Component { + constructor (props, context) { + super(props) + + const { numberOfExistingAccounts = 0 } = props + const newAccountNumber = numberOfExistingAccounts + 1 + + this.state = { + newAccountName: '', + defaultAccountName: context.t('newAccountNumberName', [newAccountNumber]), + } + } + + render () { + const { newAccountName, defaultAccountName } = this.state + const { history, createAccount } = this.props + + return h('div.new-account-create-form', [ + + h('div.new-account-create-form__input-label', {}, [ + this.context.t('accountName'), + ]), + + h('div.new-account-create-form__input-wrapper', {}, [ + h('input.new-account-create-form__input', { + value: newAccountName, + placeholder: defaultAccountName, + onChange: event => this.setState({ newAccountName: event.target.value }), + }, []), + ]), + + h('div.new-account-create-form__buttons', {}, [ + + h('button.btn-secondary--lg.new-account-create-form__button', { + onClick: () => history.push(DEFAULT_ROUTE), + }, [ + this.context.t('cancel'), + ]), + + h('button.btn-primary--lg.new-account-create-form__button', { + onClick: () => { + createAccount(newAccountName || defaultAccountName) + .then(() => history.push(DEFAULT_ROUTE)) + }, + }, [ + this.context.t('create'), + ]), + + ]), + + ]) + } +} + +NewAccountCreateForm.propTypes = { + hideModal: PropTypes.func, + showImportPage: PropTypes.func, + createAccount: PropTypes.func, + numberOfExistingAccounts: PropTypes.number, + history: PropTypes.object, + t: PropTypes.func, +} + +const mapStateToProps = state => { + const { metamask: { network, selectedAddress, identities = {} } } = state + const numberOfExistingAccounts = Object.keys(identities).length + + return { + network, + address: selectedAddress, + numberOfExistingAccounts, + } +} + +const mapDispatchToProps = dispatch => { + return { + toCoinbase: address => dispatch(actions.buyEth({ network: '1', address, amount: 0 })), + hideModal: () => dispatch(actions.hideModal()), + createAccount: newAccountName => { + return dispatch(actions.addNewAccount()) + .then(newAccountAddress => { + if (newAccountName) { + dispatch(actions.saveAccountLabel(newAccountAddress, newAccountName)) + } + }) + }, + showImportPage: () => dispatch(actions.showImportPage()), + } +} + +NewAccountCreateForm.contextTypes = { + t: PropTypes.func, +} + +module.exports = connect(mapStateToProps, mapDispatchToProps)(NewAccountCreateForm) + |