wisemapping-frontend/packages/login/src/Header.jsx

58 lines
1.7 KiB
React
Raw Normal View History

import React from 'react';
import { FormattedMessage } from 'react-intl'
import logo from './images/header-logo.png'
class Header extends React.Component {
constructor(props) {
super(props);
this.state = {
type: props.type
};
}
render() {
let signUpButton;
let signInButton;
let text;
const pageType = this.state.type;
if (pageType === 'only-signup') {
text = <span className="header-area-content-span"><span><FormattedMessage id="header.donthaveaccount" defaultMessage="Don't have an account ?" /></span></span>;
signUpButton = <SignUpButton className="header-area-right2" />;
} else if (pageType === 'only-signin') {
text = <span className="header-area-content-span"><span><FormattedMessage id="header.haveaccount" defaultMessage="Already have an account?" /></span></span>;
signUpButton = <SignInButton className="header-area-right2" />;
} else {
signUpButton = <SignUpButton />
signInButton = <SignInButton />;
}
return (
<nav>
<div className="header">
<span className="header-logo"><a href="/"><img src={logo} alt="logo" /></a></span>
{text}
{signUpButton}
{signInButton}
</div>
</nav>
)
};
}
const SignInButton = (props) => {
return (
<span className={`button-style1 ${props.className}`}>
<a href="/c/login"><FormattedMessage id="login.signin" defaultMessage="Sign In" /></a>
</span>);
}
const SignUpButton = (props) => {
return (
<span className={`button-style1 ${props.className}`}>
<a href="/c/user/registration"><FormattedMessage id="login.signup" defaultMessage="Sign Up" /></a>
</span>);
}
export default Header;