accounts-frontend/src/components/profile/Profile.jsx

90 lines
3.5 KiB
React
Raw Normal View History

import React, { Component } from 'react';
2016-03-20 14:00:58 +05:30
import { FormattedMessage as Message, FormattedRelative as Relative, FormattedHTMLMessage as HTMLMessage } from 'react-intl';
import Helmet from 'react-helmet';
import { userShape } from 'components/user/User';
import ProfileField from './ProfileField';
import styles from './profile.scss';
import profileForm from './profileForm.scss';
2016-03-20 14:00:58 +05:30
import messages from './Profile.messages';
export default class Profile extends Component {
static displayName = 'Profile';
static propTypes = {
user: userShape
};
render() {
const { user } = this.props;
return (
<div>
2016-03-20 14:00:58 +05:30
<Message {...messages.accountPreferencesTitle}>
{(pageTitle) => (
<h2 className={styles.indexTitle}>
2016-03-20 14:00:58 +05:30
<Helmet title={pageTitle} />
{pageTitle}
</h2>
)}
</Message>
<div className={styles.indexContent}>
<div className={styles.descriptionColumn}>
<div className={styles.indexDescription}>
<Message {...messages.accountDescription} />
</div>
</div>
<div className={styles.formColumn}>
<div className={profileForm.form}>
<div className={styles.item}>
<h3 className={profileForm.title}>
<Message {...messages.personalData} />
</h3>
<p className={profileForm.description}>
<Message {...messages.preferencesDescription} />
</p>
</div>
<ProfileField
label={<Message {...messages.nickname} />}
value={user.username}
warningMessage={<Message {...messages.mojangPriorityWarning} />}
/>
<ProfileField
label={'E-mail'}
value={user.email}
/>
<ProfileField
label={<Message {...messages.password} />}
link="/profile/change-password"
value={<Message {...messages.changedAt} values={{
at: (<Relative value={user.passwordChangedAt * 1000} />)
}} />}
warningMessage={user.shouldChangePassword ? (
<HTMLMessage {...messages.oldHashingAlgoWarning} />
) : ''}
/>
<ProfileField
label={<Message {...messages.twoFactorAuth} />}
value={<Message {...messages.disabled} />}
/>
<ProfileField
label={'UUID'}
value={user.uuid}
readonly
/>
</div>
</div>
</div>
</div>
);
}
}