diff options
Diffstat (limited to 'mascara/src/app/first-time/import-seed-phrase-screen.js')
-rw-r--r-- | mascara/src/app/first-time/import-seed-phrase-screen.js | 59 |
1 files changed, 40 insertions, 19 deletions
diff --git a/mascara/src/app/first-time/import-seed-phrase-screen.js b/mascara/src/app/first-time/import-seed-phrase-screen.js index d9a9dc835..93c3f9203 100644 --- a/mascara/src/app/first-time/import-seed-phrase-screen.js +++ b/mascara/src/app/first-time/import-seed-phrase-screen.js @@ -1,7 +1,14 @@ -import React, {Component, PropTypes} from 'react' +import React, { Component } from 'react' +import PropTypes from 'prop-types' import {connect} from 'react-redux' import LoadingScreen from './loading-screen' -import {createNewVaultAndRestore, hideWarning, displayWarning} from '../../../../ui/app/actions' +import { + createNewVaultAndRestore, + hideWarning, + displayWarning, + unMarkPasswordForgotten, + clearNotices, +} from '../../../../ui/app/actions' class ImportSeedPhraseScreen extends Component { static propTypes = { @@ -22,7 +29,7 @@ class ImportSeedPhraseScreen extends Component { onClick = () => { const { password, seedPhrase, confirmPassword } = this.state - const { createNewVaultAndRestore, next, displayWarning } = this.props + const { createNewVaultAndRestore, next, displayWarning, leaveImportSeedScreenState } = this.props if (seedPhrase.split(' ').length !== 12) { this.warning = 'Seed Phrases are 12 words long' @@ -42,6 +49,7 @@ class ImportSeedPhraseScreen extends Component { return } this.warning = null + leaveImportSeedScreenState() createNewVaultAndRestore(password, seedPhrase) .then(next) } @@ -67,27 +75,37 @@ class ImportSeedPhraseScreen extends Component { <div className="import-account__selector-label"> Enter your secret twelve word phrase here to restore your vault. </div> - <textarea - className="import-account__secret-phrase" - onChange={e => this.setState({seedPhrase: e.target.value})} - /> + <div className="import-account__input-wrapper"> + <label className="import-account__input-label">Wallet Seed</label> + <textarea + className="import-account__secret-phrase" + onChange={e => this.setState({seedPhrase: e.target.value})} + placeholder="Separate each word with a single space" + /> + </div> <span className="error" > {this.props.warning} </span> - <input - className="first-time-flow__input" - type="password" - placeholder="New Password (min 8 characters)" - onChange={e => this.setState({password: e.target.value})} - /> - <input - className="first-time-flow__input create-password__confirm-input" - type="password" - placeholder="Confirm Password" - onChange={e => this.setState({confirmPassword: e.target.value})} - /> + <div className="import-account__input-wrapper"> + <label className="import-account__input-label">New Password</label> + <input + className="first-time-flow__input" + type="password" + placeholder="New Password (min 8 characters)" + onChange={e => this.setState({password: e.target.value})} + /> + </div> + <div className="import-account__input-wrapper"> + <label className="import-account__input-label">Confirm Password</label> + <input + className="first-time-flow__input" + type="password" + placeholder="Confirm Password" + onChange={e => this.setState({confirmPassword: e.target.value})} + /> + </div> <button className="first-time-flow__button" onClick={this.onClick} @@ -102,6 +120,9 @@ class ImportSeedPhraseScreen extends Component { export default connect( ({ appState: { isLoading, warning } }) => ({ isLoading, warning }), dispatch => ({ + leaveImportSeedScreenState: () => { + dispatch(unMarkPasswordForgotten()) + }, createNewVaultAndRestore: (pw, seed) => dispatch(createNewVaultAndRestore(pw, seed)), displayWarning: (warning) => dispatch(displayWarning(warning)), hideWarning: () => dispatch(hideWarning()), |