This commit is contained in:
Daniel Ternyak 2017-06-20 01:13:21 -05:00
parent 3cee501da1
commit 3644cb5515

View File

@ -1,21 +1,22 @@
import React, {Component} from 'react'; import React, { Component } from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import {Field, reduxForm} from 'redux-form'; import { Field, reduxForm } from 'redux-form';
import GenerateWalletPasswordInputComponent from './GenerateWalletPasswordInputComponent'; import GenerateWalletPasswordInputComponent from './GenerateWalletPasswordInputComponent';
import LedgerTrezorWarning from './LedgerTrezorWarning'; import LedgerTrezorWarning from './LedgerTrezorWarning';
import translate from 'translations'; import translate from 'translations';
// VALIDATORS // VALIDATORS
const minLength = min => value => { const minLength = min => value => {
return value && value.length < min ? `Must be ${min} characters or more` : undefined return value && value.length < min
? `Must be ${min} characters or more`
: undefined;
}; };
const minLength9 = minLength(9); const minLength9 = minLength(9);
const required = value => value ? undefined : 'Required'; const required = value => (value ? undefined : 'Required');
class GenerateWalletPasswordComponent extends Component { class GenerateWalletPasswordComponent extends Component {
constructor(props) { constructor(props) {
super(props) super(props);
} }
static propTypes = { static propTypes = {
@ -36,17 +37,14 @@ class GenerateWalletPasswordComponent extends Component {
generateWalletConfirmContinueToPaper: PropTypes.func generateWalletConfirmContinueToPaper: PropTypes.func
}; };
continueToPaper() {}
continueToPaper() {
}
downloaded() { downloaded() {
let nextState = this.state; let nextState = this.state;
nextState.hasDownloadedWalletFile = true; nextState.hasDownloadedWalletFile = true;
this.setState(nextState) this.setState(nextState);
} }
render() { render() {
const { const {
generateWalletPassword, generateWalletPassword,
@ -57,16 +55,14 @@ class GenerateWalletPasswordComponent extends Component {
generateWalletGenerateFile, generateWalletGenerateFile,
generateWalletDownloadFile, generateWalletDownloadFile,
generateWalletConfirmContinueToPaper generateWalletConfirmContinueToPaper
} = this.props; } = this.props;
return ( return (
<section className="container" style={{minHeight: '50%'}}> <section className="container" style={{ minHeight: '50%' }}>
<div className="tab-content"> <div className="tab-content">
<main className="tab-pane active text-center" role="main"> <main className="tab-pane active text-center" role="main">
<br/> <br />
{ {!generateWalletFile &&
!generateWalletFile && (
<div> <div>
<section className="row"> <section className="row">
<h1 aria-live="polite">{translate('NAV_GenerateWallet')}</h1> <h1 aria-live="polite">{translate('NAV_GenerateWallet')}</h1>
@ -78,57 +74,83 @@ class GenerateWalletPasswordComponent extends Component {
showPassword={showPassword} showPassword={showPassword}
generateWalletShowPassword={generateWalletShowPassword} generateWalletShowPassword={generateWalletShowPassword}
name="password" name="password"
type="text"/> type="text"
<br/> />
<button onClick={() => generateWalletGenerateFile()} <br />
disabled={generateWalletPassword ? generateWalletPassword.syncErrors : true} <button
className="btn btn-primary btn-block"> onClick={() => generateWalletGenerateFile()}
disabled={
generateWalletPassword
? generateWalletPassword.syncErrors
: true
}
className="btn btn-primary btn-block"
>
{translate('NAV_GenerateWallet')} {translate('NAV_GenerateWallet')}
</button> </button>
</div> </div>
</section> </section>
<LedgerTrezorWarning/> <LedgerTrezorWarning />
</div> </div>}
) {generateWalletFile &&
}
{
generateWalletFile && (
<section role="main" className="row"> <section role="main" className="row">
<h1>{translate('GEN_Label_2')}</h1> <h1>{translate('GEN_Label_2')}</h1>
<br/> <br />
<div className="col-sm-8 col-sm-offset-2"> <div className="col-sm-8 col-sm-offset-2">
<div aria-hidden="true" className="account-help-icon"><img <div aria-hidden="true" className="account-help-icon">
src="https://myetherwallet.com/images/icon-help.svg" className="help-icon"/> <img
<p className="account-help-text">{translate('x_KeystoreDesc')}</p> src="https://myetherwallet.com/images/icon-help.svg"
className="help-icon"
/>
<p className="account-help-text">
{translate('x_KeystoreDesc')}
</p>
<h4>{translate('x_Keystore2')}</h4> <h4>{translate('x_Keystore2')}</h4>
</div> </div>
<a role="button" className="btn btn-primary btn-block" <a
role="button"
className="btn btn-primary btn-block"
href="blob:https://myetherwallet.com/2455ae32-916f-4224-a806-414bbe680168" href="blob:https://myetherwallet.com/2455ae32-916f-4224-a806-414bbe680168"
download="UTC--2017-04-26T23-07-03.538Z--c5b7fff4e1669e38e8d6bc8fffe7e562b2b70f43" download="UTC--2017-04-26T23-07-03.538Z--c5b7fff4e1669e38e8d6bc8fffe7e562b2b70f43"
aria-label="Download Keystore File (UTC / JSON · Recommended · Encrypted)" aria-label="Download Keystore File (UTC / JSON · Recommended · Encrypted)"
aria-describedby="x_KeystoreDesc" aria-describedby="x_KeystoreDesc"
onClick={() => generateWalletDownloadFile()}>{translate('x_Download')}</a> onClick={() => generateWalletDownloadFile()}
<p className="sr-only" id="x_KeystoreDesc">{translate('x_KeystoreDesc')}</p> >
<br/><br/><br/><br/> {translate('x_Download')}
</a>
<p className="sr-only" id="x_KeystoreDesc">
{translate('x_KeystoreDesc')}
</p>
<br /><br /><br /><br />
</div> </div>
<div className="col-xs-12 alert alert-danger"> <div className="col-xs-12 alert alert-danger">
<span> <span>
MyEtherWallet.com is not a web wallet &amp; does not store or transmit this secret information at any time. <br/> MyEtherWallet.com is not a web wallet &amp; does not store
<strong>If you do not save your wallet file and password, we cannot recover them.</strong><br/> or transmit this secret information at any time. <br />
Save your wallet file now &amp; back it up in a second location (not on your computer). <strong>
<br/><br/> If you do not save your wallet file and password, we
<a role="button" cannot recover them.
className={`btn btn-info ${hasDownloadedWalletFile ? '' : 'disabled'}`} </strong>
onClick={() => generateWalletConfirmContinueToPaper()}> I understand. Continue. </a> <br />
Save your wallet file now &amp; back it up in a second
location (not on your computer).
<br /><br />
<a
role="button"
className={`btn btn-info ${hasDownloadedWalletFile
? ''
: 'disabled'}`}
onClick={() => generateWalletConfirmContinueToPaper()}
>
{' '}I understand. Continue.{' '}
</a>
</span> </span>
</div> </div>
</section> </section>}
)
}
</main> </main>
</div> </div>
</section> </section>
) );
} }
} }