import { withTranslation } from 'react-i18next';
import Box from './Box';
+import Records from './Records';
+import EditNicknameButton from './EditNicknameButton';
import EditStreamLinkButton from './EditStreamLinkButton';
import Participation from './Participation';
import Icon from '../common/Icon';
import i18n from '../../i18n';
const Profile = ({ user }) => <Container>
- <h1>{user.username}</h1>
+ <h1>
+ {user.nickname || user.username}
+ {' '}
+ <EditNicknameButton user={user} />
+ </h1>
<Row>
- <Col md={6}>
+ <Col md={6} className="mb-5">
<h2>{i18n.t('users.discordTag')}</h2>
<Box discriminator user={user} />
</Col>
- <Col md={6}>
+ <Col md={6} className="mb-5">
<h2>{i18n.t('users.streamLink')}</h2>
<p>
{user.stream_link ?
<EditStreamLinkButton user={user} />
</p>
</Col>
- <Col md={12}>
+ <Col md={6} className="mb-5">
+ <h2>{i18n.t('users.tournamentRecords')}</h2>
+ <Records
+ first={user.tournament_first_count}
+ second={user.tournament_second_count}
+ third={user.tournament_third_count}
+ />
+ </Col>
+ <Col md={6} className="mb-5">
+ <h2>{i18n.t('users.roundRecords')}</h2>
+ <Records
+ first={user.round_first_count}
+ second={user.round_second_count}
+ third={user.round_third_count}
+ />
+ </Col>
+ <Col md={12} className="mb-5">
<h2>{i18n.t('users.tournaments')}</h2>
<Participation user={user} />
</Col>
Profile.propTypes = {
user: PropTypes.shape({
+ nickname: PropTypes.string,
participation: PropTypes.arrayOf(PropTypes.shape({
})),
+ round_first_count: PropTypes.number,
+ round_second_count: PropTypes.number,
+ round_third_count: PropTypes.number,
stream_link: PropTypes.string,
+ tournament_first_count: PropTypes.number,
+ tournament_second_count: PropTypes.number,
+ tournament_third_count: PropTypes.number,
username: PropTypes.string,
}),
};