#135: switch register/login buttons in UserBar depending on current page

This commit is contained in:
SleepWalker 2016-06-05 13:31:17 +03:00
parent d0bfa9fdb8
commit e0ab116a9a
5 changed files with 40 additions and 7 deletions

View File

@ -1,3 +1,4 @@
{
"register": "Join"
"register": "Join",
"login": "Sign in"
}

View File

@ -1,4 +1,4 @@
import React, { Component } from 'react';
import React, { Component, PropTypes } from 'react';
import { Link } from 'react-router';
import { FormattedMessage as Message } from 'react-intl';
@ -15,19 +15,41 @@ import LoggedInPanel from './LoggedInPanel';
export default class Userbar extends Component {
static displayName = 'Userbar';
static propTypes = {
user: userShape
user: userShape,
guestAction: PropTypes.oneOf(['register', 'login'])
};
static defaultProps = {
guestAction: 'register'
};
render() {
const { user } = this.props;
let { guestAction } = this.props;
switch (guestAction) {
case 'login':
guestAction = (
<Link to="/login" className={buttons.blue}>
<Message {...messages.login} />
</Link>
);
break;
case 'register':
default:
guestAction = (
<Link to="/register" className={buttons.blue}>
<Message {...messages.register} />
</Link>
);
break;
}
return (
<div className={styles.userbar}>
{user.isGuest
? (
<Link to="/register" className={buttons.blue}>
<Message {...messages.register} />
</Link>
guestAction
)
: (
<LoggedInPanel {...this.props} />

View File

@ -114,6 +114,7 @@
"components.profile.preferencesDescription": "Here you can change the key preferences of your account. Please note that all actions must be confirmed by entering a password.",
"components.profile.projectRules": "project rules",
"components.profile.twoFactorAuth": "Two factor auth",
"components.userbar.login": "Sign in",
"components.userbar.logout": "Logout",
"components.userbar.register": "Join",
"pages.root.siteName": "Ely.by",

View File

@ -114,6 +114,7 @@
"components.profile.preferencesDescription": "Здесь вы можете сменить ключевые параметры вашего аккаунта. Обратите внимание, что для всех действий необходимо подтверждение при помощи ввода пароля.",
"components.profile.projectRules": "правилам проекта",
"components.profile.twoFactorAuth": "Двухфакторная аутентификация",
"components.userbar.login": "Вход",
"components.userbar.logout": "Выход",
"components.userbar.register": "Регистрация",
"pages.root.siteName": "Ely.by",

View File

@ -12,6 +12,8 @@ import styles from './root.scss';
import messages from './RootPage.intl.json';
function RootPage(props) {
const isRegisterPage = props.location.pathname === '/register';
return (
<div className={styles.root}>
<div id="view-port" className={classNames(styles.viewPort, {
@ -23,7 +25,10 @@ function RootPage(props) {
<Message {...messages.siteName} />
</Link>
<div className={styles.userbar}>
<Userbar {...props} onLogout={props.logout} />
<Userbar {...props}
onLogout={props.logout}
guestAction={isRegisterPage ? 'login' : 'register'}
/>
</div>
</div>
</div>
@ -38,6 +43,9 @@ function RootPage(props) {
RootPage.displayName = 'RootPage';
RootPage.propTypes = {
location: PropTypes.shape({
pathname: PropTypes.string
}).isRequired,
children: PropTypes.element,
logout: PropTypes.func.isRequired,
isPopupActive: PropTypes.bool