accounts-frontend/src/components/auth/activation/ActivationBody.js

64 lines
2.0 KiB
JavaScript
Raw Normal View History

2016-06-05 17:46:41 +05:30
import React, { PropTypes } from 'react';
2016-05-14 16:56:17 +05:30
import { FormattedMessage as Message } from 'react-intl';
import { Input } from 'components/ui/form';
import BaseAuthBody from 'components/auth/BaseAuthBody';
import styles from './activation.scss';
import messages from './Activation.intl.json';
export default class ActivationBody extends BaseAuthBody {
static displayName = 'ActivationBody';
static panelId = 'activation';
2016-06-05 17:46:41 +05:30
static propTypes = {
match: PropTypes.shape({
params: PropTypes.shape({
key: PropTypes.string
})
2016-06-05 17:46:41 +05:30
})
};
autoFocusField = this.props.match.params && this.props.match.params.key ? null : 'key';
2016-05-14 16:56:17 +05:30
render() {
const {key} = this.props.match.params;
const email = this.context.user.email;
2016-06-05 17:46:41 +05:30
2016-05-14 16:56:17 +05:30
return (
<div>
{this.renderErrors()}
<div className={styles.description}>
<div className={styles.descriptionImage} />
<div className={styles.descriptionText}>
{email
? (
<Message {...messages.activationMailWasSent} values={{
email: (<b>{email}</b>)
}} />
)
: (
<Message {...messages.activationMailWasSentNoEmail} />
)
}
2016-05-14 16:56:17 +05:30
</div>
</div>
<div className={styles.formRow}>
<Input {...this.bindField('key')}
color="blue"
center
2016-05-14 16:56:17 +05:30
required
2016-06-05 17:46:41 +05:30
value={key}
readOnly={!!key}
autoComplete="off"
2016-05-14 16:56:17 +05:30
placeholder={messages.enterTheCode}
/>
</div>
</div>
);
}
}