diff --git a/ui/app/actions.js b/ui/app/actions.js index 1231fc296..a6730db7f 100644 --- a/ui/app/actions.js +++ b/ui/app/actions.js @@ -349,9 +349,25 @@ function navigateToNewAccountScreen () { } } -function addNewAccount () { +function addNewAccount (oldIdentities) { log.debug(`background.addNewAccount`) - return callBackgroundThenUpdate(background.addNewAccount) + return (dispatch) => { + dispatch(actions.showLoadingIndication()) + return new Promise((resolve, reject) => { + background.addNewAccount((err, { identities: newIdentities}) => { + if (err) { + dispatch(actions.displayWarning(err.message)) + return reject(err) + } + const newAccountAddress = Object.keys(newIdentities).find(address => !oldIdentities[address]) + + dispatch(actions.hideLoadingIndication()) + + forceUpdateMetamaskState(dispatch) + return resolve(newAccountAddress) + }) + }); + } } function showInfoPage () { diff --git a/ui/app/components/modals/new-account-modal.js b/ui/app/components/modals/new-account-modal.js index 910f3c0ca..1adc9e7c7 100644 --- a/ui/app/components/modals/new-account-modal.js +++ b/ui/app/components/modals/new-account-modal.js @@ -8,6 +8,7 @@ function mapStateToProps (state) { return { network: state.metamask.network, address: state.metamask.selectedAddress, + identities: state.metamask.identities, } } @@ -19,9 +20,12 @@ function mapDispatchToProps (dispatch) { hideModal: () => { dispatch(actions.hideModal()) }, - createAccount: () => { - dispatch(actions.addNewAccount()) - dispatch(actions.hideModal()) + createAccount: (identities, newAccountName) => { + dispatch(actions.addNewAccount(identities)) + .then((newAccountAddress) => { + dispatch(actions.saveAccountLabel(newAccountAddress, newAccountName)) + dispatch(actions.hideModal()) + }) }, } } @@ -29,11 +33,18 @@ 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 { identities } = this.props + const { newAccountName } = this.state + return h('div', {}, [ h('div.new-account-modal-wrapper', { }, [ @@ -52,6 +63,7 @@ NewAccountModal.prototype.render = function () { 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 }) }, []), ]), @@ -65,7 +77,7 @@ NewAccountModal.prototype.render = function () { h('div.new-account-modal-content.button', {}, [ h('button.btn-clear', { - onClick: this.props.createAccount + onClick: () => this.props.createAccount(identities, newAccountName) }, [ 'SAVE', ]), diff --git a/ui/app/css/itcss/components/modal.scss b/ui/app/css/itcss/components/modal.scss index 5e3f9cc08..c0a5aa1ef 100644 --- a/ui/app/css/itcss/components/modal.scss +++ b/ui/app/css/itcss/components/modal.scss @@ -325,7 +325,7 @@ border: 1px solid $alto; width: 100%; font-size: 1em; - color: $alto; + color: $dusty-gray; font-family: Montserrat Light; font-size: 17px; margin: 0 60px;