mirror of
https://github.com/elyby/accounts-frontend.git
synced 2024-09-13 15:25:35 +05:30
73 lines
2.2 KiB
JavaScript
73 lines
2.2 KiB
JavaScript
import React from 'react';
|
|
|
|
import { FormattedMessage as Message } from 'react-intl';
|
|
|
|
import { Input, Checkbox } from 'components/ui/form';
|
|
import BaseAuthBody from 'components/auth/BaseAuthBody';
|
|
import passwordMessages from 'components/auth/password/Password.intl.json';
|
|
|
|
import messages from './Register.intl.json';
|
|
|
|
// TODO: password and username can be validate for length and sameness
|
|
|
|
export default class RegisterBody extends BaseAuthBody {
|
|
static displayName = 'RegisterBody';
|
|
static panelId = 'register';
|
|
|
|
autoFocusField = 'username';
|
|
|
|
render() {
|
|
return (
|
|
<div>
|
|
{this.renderErrors()}
|
|
|
|
<Input {...this.bindField('username')}
|
|
icon="user"
|
|
color="blue"
|
|
type="text"
|
|
required
|
|
placeholder={messages.yourNickname}
|
|
/>
|
|
|
|
<Input {...this.bindField('email')}
|
|
icon="envelope"
|
|
color="blue"
|
|
type="email"
|
|
required
|
|
placeholder={messages.yourEmail}
|
|
/>
|
|
|
|
<Input {...this.bindField('password')}
|
|
icon="key"
|
|
color="blue"
|
|
type="password"
|
|
required
|
|
placeholder={passwordMessages.accountPassword}
|
|
/>
|
|
|
|
<Input {...this.bindField('rePassword')}
|
|
icon="key"
|
|
color="blue"
|
|
type="password"
|
|
required
|
|
placeholder={messages.repeatPassword}
|
|
/>
|
|
|
|
<Checkbox {...this.bindField('rulesAgreement')}
|
|
color="blue"
|
|
required
|
|
label={
|
|
<Message {...messages.acceptRules} values={{
|
|
link: (
|
|
<a href="#">
|
|
<Message {...messages.termsOfService} />
|
|
</a>
|
|
)
|
|
}} />
|
|
}
|
|
/>
|
|
</div>
|
|
);
|
|
}
|
|
}
|