From 8b1f0b7cf40fc50d912103e6b117aca389e62636 Mon Sep 17 00:00:00 2001 From: Nicolas Gotchac Date: Thu, 18 May 2017 11:50:16 +0200 Subject: [PATCH 1/7] Add Recover button to Accounts and warnings (#5645) * Add Recover button to Accounts // Add Warnings * Change to 11 * Add test net checks for empty recovery phrase * Fix failing tests --- .../CreationType/creationType.js | 15 - .../RecoveryPhrase/recoveryPhrase.js | 284 +++++++++++------- js/src/modals/CreateAccount/createAccount.js | 69 +++-- .../CreateAccount/createAccount.test.js | 6 +- js/src/modals/CreateAccount/store.js | 9 +- js/src/modals/CreateAccount/store.spec.js | 2 +- js/src/modals/FirstRun/firstRun.js | 2 +- js/src/ui/Icons/index.js | 1 + js/src/views/Accounts/accounts.js | 46 ++- 9 files changed, 284 insertions(+), 150 deletions(-) diff --git a/js/src/modals/CreateAccount/CreationType/creationType.js b/js/src/modals/CreateAccount/CreationType/creationType.js index 8869e6e63..24e85bba1 100644 --- a/js/src/modals/CreateAccount/CreationType/creationType.js +++ b/js/src/modals/CreateAccount/CreationType/creationType.js @@ -39,21 +39,6 @@ const TYPES = [ ), key: 'fromNew' }, - { - description: ( - - ), - label: ( - - ), - key: 'fromPhrase' - }, { description: ( - - } - label={ - - } - onChange={ this.onEditPhrase } - value={ phrase } - /> - - } - label={ - - } - onChange={ this.onEditName } - value={ name } - /> - - } - label={ - - } - onChange={ this.onEditPasswordHint } - value={ passwordHint } - /> -
-
- + { this.renderWarning() } +
+ - } - label={ - - } - onChange={ this.onEditPassword } - type='password' - value={ password } - /> + ) + : null + } + hint={ + + } + label={ + + } + onChange={ this.onEditPhrase } + value={ phrase } + /> + + } + label={ + + } + onChange={ this.onEditName } + value={ name } + /> + + } + label={ + + } + onChange={ this.onEditPasswordHint } + value={ passwordHint } + /> +
+
+ + } + label={ + + } + onChange={ this.onEditPassword } + type='password' + value={ password } + /> +
+
+ + } + label={ + + } + onChange={ this.onEditPasswordRepeat } + type='password' + value={ passwordRepeat } + /> +
-
- - } - label={ - - } - onChange={ this.onEditPasswordRepeat } - type='password' - value={ passwordRepeat } - /> -
-
- - - - } - onCheck={ this.onToggleWindowsPhrase } - /> - + + + + } + onCheck={ this.onToggleWindowsPhrase } + /> + +
); } + renderWarning () { + const { isTest, phrase } = this.props.createStore; + + if (!isTest && phrase.length === 0) { + return ( + + } + /> + ); + } + + if (phrase.length === 0) { + return ( + + } + /> + ); + } + + const words = phrase.split(' '); + + if (words.length < 11) { + return ( + + } + /> + ); + } + + return null; + } + onToggleWindowsPhrase = (event) => { const { createStore } = this.props; diff --git a/js/src/modals/CreateAccount/createAccount.js b/js/src/modals/CreateAccount/createAccount.js index 56f1db751..06809adf0 100644 --- a/js/src/modals/CreateAccount/createAccount.js +++ b/js/src/modals/CreateAccount/createAccount.js @@ -63,8 +63,14 @@ const TITLES = { ), import: ( + ), + restore: ( + ), qr: ( @@ -76,25 +82,37 @@ const TITLES = { }; const STAGE_NAMES = [TITLES.type, TITLES.create, TITLES.info]; const STAGE_IMPORT = [TITLES.type, TITLES.import, TITLES.info]; +const STAGE_RESTORE = [TITLES.restore, TITLES.info]; const STAGE_QR = [TITLES.type, TITLES.qr, TITLES.info]; @observer class CreateAccount extends Component { static contextTypes = { api: PropTypes.object.isRequired - } + }; static propTypes = { accounts: PropTypes.object.isRequired, + isTest: PropTypes.bool.isRequired, newError: PropTypes.func.isRequired, onClose: PropTypes.func, - onUpdate: PropTypes.func - } + onUpdate: PropTypes.func, + restore: PropTypes.bool + }; - createStore = new Store(this.context.api, this.props.accounts); + static defaultProps = { + restore: false + }; + + createStore = new Store(this.context.api, this.props.accounts, this.props.isTest); vaultStore = VaultStore.get(this.context.api); componentWillMount () { + if (this.props.restore) { + this.createStore.setCreateType('fromPhrase'); + this.createStore.nextStage(); + } + return this.vaultStore.loadVaults(); } @@ -107,6 +125,8 @@ class CreateAccount extends Component { steps = STAGE_NAMES; } else if (createType === 'fromQr') { steps = STAGE_QR; + } else if (createType === 'fromPhrase') { + steps = STAGE_RESTORE; } return ( @@ -199,6 +219,7 @@ class CreateAccount extends Component { } renderDialogActions () { + const { restore } = this.props; const { createType, canCreate, isBusy, stage } = this.createStore; const cancelBtn = ( @@ -215,6 +236,22 @@ class CreateAccount extends Component { /> ); + const backBtn = restore + ? null + : ( +