mirror of
https://github.com/status-im/MyCrypto.git
synced 2025-01-11 11:34:26 +00:00
format
This commit is contained in:
Daniel Ternyak
parent
3cee501da1
commit
3644cb5515
@ -1,137 +1,159 @@
|
||||
import React, {Component} from 'react';
|
||||
import React, { Component } from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import {Field, reduxForm} from 'redux-form';
|
||||
import { Field, reduxForm } from 'redux-form';
|
||||
import GenerateWalletPasswordInputComponent from './GenerateWalletPasswordInputComponent';
|
||||
import LedgerTrezorWarning from './LedgerTrezorWarning';
|
||||
import translate from 'translations';
|
||||
|
||||
// VALIDATORS
|
||||
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 required = value => value ? undefined : 'Required';
|
||||
|
||||
const required = value => (value ? undefined : 'Required');
|
||||
|
||||
class GenerateWalletPasswordComponent extends Component {
|
||||
constructor(props) {
|
||||
super(props)
|
||||
}
|
||||
constructor(props) {
|
||||
super(props);
|
||||
}
|
||||
|
||||
static propTypes = {
|
||||
// state
|
||||
title: PropTypes.string,
|
||||
body: PropTypes.string,
|
||||
userId: PropTypes.number,
|
||||
id: PropTypes.number,
|
||||
generateWalletPassword: PropTypes.object,
|
||||
showPassword: PropTypes.bool,
|
||||
generateWalletFile: PropTypes.bool,
|
||||
hasDownloadedWalletFile: PropTypes.bool,
|
||||
canProceedToPaper: PropTypes.bool,
|
||||
// actions
|
||||
generateWalletShowPassword: PropTypes.func,
|
||||
generateWalletGenerateFile: PropTypes.func,
|
||||
generateWalletDownloadFile: PropTypes.func,
|
||||
generateWalletConfirmContinueToPaper: PropTypes.func
|
||||
};
|
||||
static propTypes = {
|
||||
// state
|
||||
title: PropTypes.string,
|
||||
body: PropTypes.string,
|
||||
userId: PropTypes.number,
|
||||
id: PropTypes.number,
|
||||
generateWalletPassword: PropTypes.object,
|
||||
showPassword: PropTypes.bool,
|
||||
generateWalletFile: PropTypes.bool,
|
||||
hasDownloadedWalletFile: PropTypes.bool,
|
||||
canProceedToPaper: PropTypes.bool,
|
||||
// actions
|
||||
generateWalletShowPassword: PropTypes.func,
|
||||
generateWalletGenerateFile: PropTypes.func,
|
||||
generateWalletDownloadFile: PropTypes.func,
|
||||
generateWalletConfirmContinueToPaper: PropTypes.func
|
||||
};
|
||||
|
||||
continueToPaper() {}
|
||||
|
||||
continueToPaper() {
|
||||
}
|
||||
downloaded() {
|
||||
let nextState = this.state;
|
||||
nextState.hasDownloadedWalletFile = true;
|
||||
this.setState(nextState);
|
||||
}
|
||||
|
||||
downloaded() {
|
||||
let nextState = this.state;
|
||||
nextState.hasDownloadedWalletFile = true;
|
||||
this.setState(nextState)
|
||||
}
|
||||
render() {
|
||||
const {
|
||||
generateWalletPassword,
|
||||
showPassword,
|
||||
generateWalletFile,
|
||||
hasDownloadedWalletFile,
|
||||
generateWalletShowPassword,
|
||||
generateWalletGenerateFile,
|
||||
generateWalletDownloadFile,
|
||||
generateWalletConfirmContinueToPaper
|
||||
} = this.props;
|
||||
|
||||
|
||||
render() {
|
||||
const {
|
||||
generateWalletPassword,
|
||||
showPassword,
|
||||
generateWalletFile,
|
||||
hasDownloadedWalletFile,
|
||||
generateWalletShowPassword,
|
||||
generateWalletGenerateFile,
|
||||
generateWalletDownloadFile,
|
||||
generateWalletConfirmContinueToPaper
|
||||
|
||||
} = this.props;
|
||||
|
||||
return (
|
||||
<section className="container" style={{minHeight: '50%'}}>
|
||||
<div className="tab-content">
|
||||
<main className="tab-pane active text-center" role="main">
|
||||
<br/>
|
||||
{
|
||||
!generateWalletFile && (
|
||||
<div>
|
||||
<section className="row">
|
||||
<h1 aria-live="polite">{translate('NAV_GenerateWallet')}</h1>
|
||||
<div className="col-sm-8 col-sm-offset-2">
|
||||
<h4>{translate('HELP_1_Desc_3')}</h4>
|
||||
<Field
|
||||
validate={[required, minLength9]}
|
||||
component={GenerateWalletPasswordInputComponent}
|
||||
showPassword={showPassword}
|
||||
generateWalletShowPassword={generateWalletShowPassword}
|
||||
name="password"
|
||||
type="text"/>
|
||||
<br/>
|
||||
<button onClick={() => generateWalletGenerateFile()}
|
||||
disabled={generateWalletPassword ? generateWalletPassword.syncErrors : true}
|
||||
className="btn btn-primary btn-block">
|
||||
{translate('NAV_GenerateWallet')}
|
||||
</button>
|
||||
</div>
|
||||
</section>
|
||||
<LedgerTrezorWarning/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
{
|
||||
generateWalletFile && (
|
||||
<section role="main" className="row">
|
||||
<h1>{translate('GEN_Label_2')}</h1>
|
||||
<br/>
|
||||
<div className="col-sm-8 col-sm-offset-2">
|
||||
<div aria-hidden="true" className="account-help-icon"><img
|
||||
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>
|
||||
</div>
|
||||
<a role="button" className="btn btn-primary btn-block"
|
||||
href="blob:https://myetherwallet.com/2455ae32-916f-4224-a806-414bbe680168"
|
||||
download="UTC--2017-04-26T23-07-03.538Z--c5b7fff4e1669e38e8d6bc8fffe7e562b2b70f43"
|
||||
aria-label="Download Keystore File (UTC / JSON · Recommended · Encrypted)"
|
||||
aria-describedby="x_KeystoreDesc"
|
||||
onClick={() => generateWalletDownloadFile()}>{translate('x_Download')}</a>
|
||||
<p className="sr-only" id="x_KeystoreDesc">{translate('x_KeystoreDesc')}</p>
|
||||
<br/><br/><br/><br/>
|
||||
</div>
|
||||
<div className="col-xs-12 alert alert-danger">
|
||||
<span>
|
||||
MyEtherWallet.com is not a web wallet & does not store or transmit this secret information at any time. <br/>
|
||||
<strong>If you do not save your wallet file and password, we cannot recover them.</strong><br/>
|
||||
Save your wallet file now & 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>
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
</main>
|
||||
return (
|
||||
<section className="container" style={{ minHeight: '50%' }}>
|
||||
<div className="tab-content">
|
||||
<main className="tab-pane active text-center" role="main">
|
||||
<br />
|
||||
{!generateWalletFile &&
|
||||
<div>
|
||||
<section className="row">
|
||||
<h1 aria-live="polite">{translate('NAV_GenerateWallet')}</h1>
|
||||
<div className="col-sm-8 col-sm-offset-2">
|
||||
<h4>{translate('HELP_1_Desc_3')}</h4>
|
||||
<Field
|
||||
validate={[required, minLength9]}
|
||||
component={GenerateWalletPasswordInputComponent}
|
||||
showPassword={showPassword}
|
||||
generateWalletShowPassword={generateWalletShowPassword}
|
||||
name="password"
|
||||
type="text"
|
||||
/>
|
||||
<br />
|
||||
<button
|
||||
onClick={() => generateWalletGenerateFile()}
|
||||
disabled={
|
||||
generateWalletPassword
|
||||
? generateWalletPassword.syncErrors
|
||||
: true
|
||||
}
|
||||
className="btn btn-primary btn-block"
|
||||
>
|
||||
{translate('NAV_GenerateWallet')}
|
||||
</button>
|
||||
</div>
|
||||
</section>
|
||||
<LedgerTrezorWarning />
|
||||
</div>}
|
||||
{generateWalletFile &&
|
||||
<section role="main" className="row">
|
||||
<h1>{translate('GEN_Label_2')}</h1>
|
||||
<br />
|
||||
<div className="col-sm-8 col-sm-offset-2">
|
||||
<div aria-hidden="true" className="account-help-icon">
|
||||
<img
|
||||
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>
|
||||
</div>
|
||||
<a
|
||||
role="button"
|
||||
className="btn btn-primary btn-block"
|
||||
href="blob:https://myetherwallet.com/2455ae32-916f-4224-a806-414bbe680168"
|
||||
download="UTC--2017-04-26T23-07-03.538Z--c5b7fff4e1669e38e8d6bc8fffe7e562b2b70f43"
|
||||
aria-label="Download Keystore File (UTC / JSON · Recommended · Encrypted)"
|
||||
aria-describedby="x_KeystoreDesc"
|
||||
onClick={() => generateWalletDownloadFile()}
|
||||
>
|
||||
{translate('x_Download')}
|
||||
</a>
|
||||
<p className="sr-only" id="x_KeystoreDesc">
|
||||
{translate('x_KeystoreDesc')}
|
||||
</p>
|
||||
<br /><br /><br /><br />
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
<div className="col-xs-12 alert alert-danger">
|
||||
<span>
|
||||
MyEtherWallet.com is not a web wallet & does not store
|
||||
or transmit this secret information at any time. <br />
|
||||
<strong>
|
||||
If you do not save your wallet file and password, we
|
||||
cannot recover them.
|
||||
</strong>
|
||||
<br />
|
||||
Save your wallet file now & 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>
|
||||
</div>
|
||||
</section>}
|
||||
</main>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default reduxForm({
|
||||
form: 'generateWalletPassword' // a unique name for this form
|
||||
form: 'generateWalletPassword' // a unique name for this form
|
||||
})(GenerateWalletPasswordComponent);
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user