Newer
Older
// Copyright 2015-2019 Parity Technologies (UK) Ltd.
import { AccountCard, Card, Form as FetherForm } from 'fether-ui';
import Blockies from 'react-blockies';
import { inject, observer } from 'mobx-react';
import i18n, { packageNS } from '../../../i18n';
Axel Chalon
committed
import loading from '../../../assets/img/icons/loading.svg';
import withAccountsInfo from '../../../utils/withAccountsInfo';
Axel Chalon
committed
class AccountName extends Component {
const { createAccountStore } = this.props;
// Generate a new public address if there's none yet
if (!createAccountStore.address) {
createAccountStore.generateNewAccount();
}
this.props.createAccountStore.setName(value);
// Save Signer account to Parity without asking for a password
createAccountStore
.saveAccountToParity()
.then(res => {
createAccountStore.clear();
history.push('/accounts');
})
.catch(err => {
console.error(err);
this.setState({
error: err.text
});
});
} else {
// Ask for a password otherwise
history.push(`/accounts/new/${+currentStep + 1}`);
}
render () {
const {
createAccountStore: { isImport }
} = this.props;
Amaury Martiny
committed
return isImport ? this.renderCardWhenImported() : this.renderCardWhenNew();
renderCardWhenImported = () => {
const {
createAccountStore: { address, name, noPrivateKey }
name={name || i18n.t(`${packageNS}:account.existing.no_name`)}
i18n={i18n}
packageNS={packageNS}
/>
);
};
renderCardWhenNew = () => {
const {
createAccountStore: { address, generateNewAccount }
} = this.props;
return (
<Card drawers={[this.renderDrawer()]}>
<div className='account'>
<div className='account_avatar'>
Axel Chalon
committed
{address ? (
<Blockies seed={address.toLowerCase()} />
) : (
<img
className='account_avatar_loading'
alt='loading'
src={loading}
/>
)}
<div className='account_change_blockies'>
<button className='button -back' onClick={generateNewAccount}>
{i18n.t(`${packageNS}:account.create.change_icon`)}
</div>
</Card>
);
};
renderDrawer = () => {
const {
Axel Chalon
committed
createAccountStore: { address, name },
const currentStep = pathname.slice(-1);
const accountNameExists = !!Object.values(accountsInfo).find(
info => info.name.toLowerCase() === name.toLowerCase()
);
<form key='createAccount' noValidate onSubmit={this.handleSubmit}>
<p>{i18n.t(`${packageNS}:account.create.label_name_msg`)}</p>
label={i18n.t(`${packageNS}:account.create.label_name`)}
onChange={this.handleChangeName}
required
type='text'
value={name}
/>
{accountNameExists && (
<p>
{i18n.t(`${packageNS}:account.create.error_msg_duplicate_name`)}
</p>
)}
<nav className='form-nav -space-around'>
{currentStep > 1 && (
onClick={history.goBack}
type='button'
>
{i18n.t(`${packageNS}:navigation.back`)}
{name && address && !accountNameExists ? (
<button className='button'>
{i18n.t(`${packageNS}:navigation.next`)}
</button>
{i18n.t(`${packageNS}:navigation.next`)}