+++ /dev/null
-import React from 'react'
-import {connect} from 'react-redux'
-import {ErrorBanner, TextField, PasswordField} from 'features/shared/components'
-import actions from 'actions'
-import styles from './Register.scss'
-import {reduxForm} from 'redux-form'
-import {chainClient} from 'utility/environment'
-import {withNamespaces} from 'react-i18next'
-
-class Register extends React.Component {
- constructor(props) {
- super(props)
- this.connection = chainClient().connection
-
- this.submitWithErrors = this.submitWithErrors.bind(this)
- }
-
- componentDidMount() {
- this.setState({
- init: true
- })
- }
-
- submitWithErrors(data) {
- return new Promise((resolve, reject) => {
- this.props.registerKey(data)
- .catch((err) => reject({_error: err.message}))
- })
- }
-
- setMode(isInit) {
- this.setState({
- init: isInit
- })
- }
-
- restore() {
- const element = document.getElementById('bytom-restore-file-upload-init')
- element.click()
- }
-
- handleFileChange(event) {
- const files = event.target.files
- if (files.length <= 0) {
- this.setState({key: null})
- return
- }
-
- const fileReader = new FileReader()
- fileReader.onload = fileLoadedEvent => {
- const backupData = JSON.parse(fileLoadedEvent.target.result)
- this.connection.request('/restore-wallet', backupData).then(resp => {
- if (resp.status === 'fail') {
- this.props.showError(new Error(resp.msg))
- return
- }
- this.props.success()
- })
- }
- fileReader.readAsText(files[0], 'UTF-8')
-
- const fileElement = document.getElementById('bytom-restore-file-upload-init')
- fileElement.value = ''
- }
-
- render() {
- const t = this.props.t
-
- const {
- fields: {keyAlias, password, repeatPassword, accountAlias},
- error,
- handleSubmit,
- submitting
- } = this.props
-
- return (
- <div className={styles.main}>
- {
- this.state && this.state.init &&
- <div>
- <h2 className={styles.title}>{t('init.title')}</h2>
- <div className={styles.formWarpper}>
- <form className={styles.form} onSubmit={handleSubmit(this.submitWithErrors)}>
- <TextField
- title={t('form.accountAlias')}
- placeholder={t('init.accountPlaceholder')}
- fieldProps={accountAlias} />
- <TextField
- title={t('form.keyAlias')}
- placeholder={t('init.keyPlaceholder')}
- fieldProps={keyAlias}/>
- <PasswordField
- title={t('init.keyPassword')}
- placeholder={t('init.passwordPlaceholder')}
- fieldProps={password} />
- <PasswordField
- title={t('init.repeatKeyPassword')}
- placeholder={t('init.repeatPlaceHolder')}
- fieldProps={repeatPassword} />
-
- {error &&
- <ErrorBanner
- title={t('init.errorTitle')}
- error={error}/>}
-
- <button type='submit' className='btn btn-primary' disabled={submitting}>
- {t('init.register')}
- </button>
- <a className={`${styles.choice} ${(this.state && this.state.init) ? '' : styles.active}`}
- href='javascript:;' onClick={this.setMode.bind(this, false)}>
- {t('init.restoreWallet')}
- </a>
- </form>
- </div>
- </div>
- }
- {
- this.state && !this.state.init &&
- <div>
- <h2 className={styles.title}>{t('init.restoreWallet')}</h2>
- <div className={styles.formWarpper}>
- <form className={styles.form} onSubmit={handleSubmit(this.submitWithErrors)}>
- <button className='btn btn-primary' onClick={this.restore.bind(this)}>
- {t('init.restore')}
- </button>
- <a className={`${styles.choice} ${(this.state && this.state.init) ? styles.active : ''}`}
- href='javascript:;' onClick={this.setMode.bind(this, true)}>
- {t('init.title')}
- </a>
-
- <p></p>
- <p>{t('init.restoreLabel')}</p>
-
- <input id='bytom-restore-file-upload-init' type='file' style={{'display': 'none'}}
- onChange={this.handleFileChange.bind(this)}/>
- </form>
- </div>
- </div>
- }
- </div>
- )
- }
-}
-
-const validate = (values, props) => {
- const errors = {}
- const t = props.t
-
- if (!values.keyAlias) {
- errors.keyAlias = t('key.aliasRequired')
- }
- if (!values.password) {
- errors.password = t('key.passwordRequired')
- } else if (values.password.length < 5) {
- errors.password = ( t('key.reset.newPWarning') )
- }
- if (values.password !== values.repeatPassword) {
- errors.repeatPassword = ( t('key.reset.repeatPWarning') )
- }
- if (!values.accountAlias) {
- errors.accountAlias = ( t('account.new.aliasWarning') )
- }
-
- return errors
-}
-
-export default withNamespaces('translations')( connect(
- () => ({}),
- (dispatch) => ({
- registerKey: (token) => dispatch(actions.core.registerKey(token)),
- showError: (err) => dispatch({type: 'ERROR', payload: err}),
- success: () => dispatch({type: 'CREATE_REGISTER_ACCOUNT'})
- })
-)(reduxForm({
- form: 'initDefaultPassword',
- fields: ['keyAlias', 'password', 'repeatPassword', 'accountAlias'],
- validate
-})(Register)))
+++ /dev/null
-.main {
- background: $background-inverse-color;
- position: absolute;
- top: 0;
- bottom: 0;
- left: 0;
- right: 0;
- padding-top: 50px;
- display: block;
- overflow: auto;
-}
-
-.choice {
- margin-left: 10px;
-}
-
-.image {
- width: 150px;
- position: absolute;
- top: calc(50px);
- left: calc(50% - 75px);
-}
-
-.title{
- text-align: center;
- color: white;
-}
-
-.switch {
- display: flex;
- justify-content: space-around;
-
- margin-top: 10px;
-}
-
-.formWarpper {
- display: flex;
- justify-content: space-around;
-
- margin-top: 30px;
-}
-
-.form {
- background: $background-color;
- border-radius: $border-radius-standard;
- width: 500px;
- padding: 30px;
-}
import actions from 'actions'
import styles from './Register.scss'
import {reduxForm} from 'redux-form'
-import {chainClient} from 'utility/environment'
import {withNamespaces} from 'react-i18next'
class Register extends React.Component {
constructor(props) {
super(props)
- this.connection = chainClient().connection
-
this.submitWithErrors = this.submitWithErrors.bind(this)
}
- componentDidMount() {
- this.setState({
- init: true
- })
- }
-
submitWithErrors(data) {
return new Promise((resolve, reject) => {
this.props.registerKey(data)
})
}
- setMode(isInit) {
- this.setState({
- init: isInit
- })
- }
-
- restore() {
- const element = document.getElementById('bytom-restore-file-upload-init')
- element.click()
- }
-
- handleFileChange(event) {
- const files = event.target.files
- if (files.length <= 0) {
- this.setState({key: null})
- return
- }
-
- const fileReader = new FileReader()
- fileReader.onload = fileLoadedEvent => {
- const backupData = JSON.parse(fileLoadedEvent.target.result)
- this.connection.request('/restore-wallet', backupData).then(resp => {
- if (resp.status === 'fail') {
- this.props.showError(new Error(resp.msg))
- return
- }
- this.props.success()
- })
- }
- fileReader.readAsText(files[0], 'UTF-8')
-
- const fileElement = document.getElementById('bytom-restore-file-upload-init')
- fileElement.value = ''
- }
-
render() {
const t = this.props.t
return (
<div className={styles.main}>
- {
- this.state && this.state.init &&
- <div>
- <h2 className={styles.title}>{t('init.title')}</h2>
- <div className={styles.formWarpper}>
- <form className={styles.form} onSubmit={handleSubmit(this.submitWithErrors)}>
- <TextField
- title={t('form.accountAlias')}
- placeholder={t('init.accountPlaceholder')}
- fieldProps={accountAlias} />
- <TextField
- title={t('form.keyAlias')}
- placeholder={t('init.keyPlaceholder')}
- fieldProps={keyAlias}/>
- <PasswordField
- title={t('init.keyPassword')}
- placeholder={t('init.passwordPlaceholder')}
- fieldProps={password} />
- <PasswordField
- title={t('init.repeatKeyPassword')}
- placeholder={t('init.repeatPlaceHolder')}
- fieldProps={repeatPassword} />
-
- {error &&
- <ErrorBanner
- title={t('init.errorTitle')}
- error={error}/>}
-
- <button type='submit' className='btn btn-primary' disabled={submitting}>
- {t('init.register')}
- </button>
- <a className={`${styles.choice} ${(this.state && this.state.init) ? '' : styles.active}`}
- href='javascript:;' onClick={this.setMode.bind(this, false)}>
- {t('init.restoreWallet')}
- </a>
- </form>
- </div>
- </div>
- }
- {
- this.state && !this.state.init &&
- <div>
- <h2 className={styles.title}>{t('init.restoreWallet')}</h2>
- <div className={styles.formWarpper}>
- <form className={styles.form} onSubmit={handleSubmit(this.submitWithErrors)}>
- <button className='btn btn-primary' onClick={this.restore.bind(this)}>
- {t('init.restore')}
- </button>
- <a className={`${styles.choice} ${(this.state && this.state.init) ? styles.active : ''}`}
- href='javascript:;' onClick={this.setMode.bind(this, true)}>
- {t('init.title')}
- </a>
-
- <p></p>
- <p>{t('init.restoreLabel')}</p>
-
- <input id='bytom-restore-file-upload-init' type='file' style={{'display': 'none'}}
- onChange={this.handleFileChange.bind(this)}/>
- </form>
- </div>
+ <div>
+ <h2 className={styles.title}>{t('init.title')}</h2>
+ <div className={styles.formWarpper}>
+ <form className={styles.form} onSubmit={handleSubmit(this.submitWithErrors)}>
+ <TextField
+ title={t('form.accountAlias')}
+ placeholder={t('init.accountPlaceholder')}
+ fieldProps={accountAlias} />
+ <TextField
+ title={t('form.keyAlias')}
+ placeholder={t('init.keyPlaceholder')}
+ fieldProps={keyAlias}/>
+ <PasswordField
+ title={t('init.keyPassword')}
+ placeholder={t('init.passwordPlaceholder')}
+ fieldProps={password} />
+ <PasswordField
+ title={t('init.repeatKeyPassword')}
+ placeholder={t('init.repeatPlaceHolder')}
+ fieldProps={repeatPassword} />
+
+ {error &&
+ <ErrorBanner
+ title={t('init.errorTitle')}
+ error={error}/>}
+
+ <button type='submit' className='btn btn-primary' disabled={submitting}>
+ {t('init.register')}
+ </button>
+ </form>
</div>
- }
+ </div>
</div>
)
}
export default withNamespaces('translations')( connect(
() => ({}),
(dispatch) => ({
- registerKey: (token) => dispatch(actions.core.registerKey(token)),
- showError: (err) => dispatch({type: 'ERROR', payload: err}),
- success: () => dispatch({type: 'CREATE_REGISTER_ACCOUNT'})
+ registerKey: (token) => dispatch(actions.initialization.registerKey(token))
})
)(reduxForm({
form: 'initDefaultPassword',
--- /dev/null
+import React from 'react'
+import { Link } from 'react-router'
+
+class Resotre extends React.Component {
+ constructor(props) {
+ super(props)
+ }
+
+ render() {
+ return(
+ <div>
+ <Link to='/initialization/restoreKeystore'>
+ Restore by keystore
+ </Link>
+ <Link to='/initialization/restoreMnemonic'>
+ Restore by Mnemonic
+ </Link>
+
+ <Link to='/initialization'>
+ cancel
+ </Link>
+ </div>
+ )
+ }
+}
+
+
+export default Resotre
--- /dev/null
+import React from 'react'
+import {connect} from 'react-redux'
+import {ErrorBanner, PasswordField, TextField, TextareaField} from 'features/shared/components'
+import actions from 'actions'
+import {reduxForm} from 'redux-form'
+import {withNamespaces} from 'react-i18next'
+import { Link } from 'react-router'
+
+class RestoreMnemonic extends React.Component {
+ constructor(props) {
+ super(props)
+ this.submitWithErrors = this.submitWithErrors.bind(this)
+ }
+
+ submitWithErrors(data) {
+ return new Promise((resolve, reject) => {
+ this.props.restoreMnemonic(data)
+ .catch((err) => reject({_error: err}))
+ })
+ }
+
+ render() {
+ const t = this.props.t
+
+ const {
+ fields: {mnemonic, keyAlias, password, confirmPassword},
+ error,
+ handleSubmit,
+ submitting
+ } = this.props
+
+
+ return (
+ <div >
+ <div>
+ <h2 >{t('init.restoreWallet')}</h2>
+ <div>
+ <form onSubmit={handleSubmit(this.submitWithErrors)}>
+
+ <TextareaField
+ title={'mnemonic'}
+ fieldProps={mnemonic}
+ />
+ <TextField
+ title={t('form.keyAlias')}
+ placeholder={t('init.keyPlaceholder')}
+ fieldProps={keyAlias}/>
+ <PasswordField
+ title={t('init.keyPassword')}
+ placeholder={t('init.passwordPlaceholder')}
+ fieldProps={password} />
+ <PasswordField
+ title={t('init.repeatKeyPassword')}
+ placeholder={t('init.repeatPlaceHolder')}
+ fieldProps={confirmPassword} />
+
+ {error &&
+ <ErrorBanner
+ title={t('init.errorTitle')}
+ error={error}/>}
+
+ <button type='submit' className='btn btn-primary' disabled={submitting}>
+ {t('init.restore')}
+ </button>
+ <Link to='/initialization/restore'>
+ cancel
+ </Link>
+
+ </form>
+ </div>
+ </div>
+ </div>
+ )
+ }
+}
+
+const validate = (values, props) => {
+ const errors = {}
+ const t = props.t
+
+ if (!values.mnemonic) {
+ errors.mnemonic = 'random'
+ }
+ if (!values.keyAlias) {
+ errors.keyAlias = t('key.aliasRequired')
+ }
+ if (!values.password) {
+ errors.password = t('key.passwordRequired')
+ } else if (values.password.length < 5) {
+ errors.password = ( t('key.reset.newPWarning') )
+ }
+ if (values.password !== values.confirmPassword) {
+ errors.confirmPassword = ( t('key.reset.repeatPWarning') )
+ }
+
+ return errors
+}
+
+
+export default withNamespaces('translations')( connect(
+ () => ({}),
+ (dispatch) => ({
+ restoreMnemonic: (token) => dispatch(actions.initialization.restoreMnemonic(token)),
+ })
+)(reduxForm({
+ form: 'restoreMnemonic',
+ fields: [
+ 'mnemonic',
+ 'keyAlias',
+ 'password',
+ 'confirmPassword',
+ ],
+ validate
+})(RestoreMnemonic)))
OSDN Git Service
