content: import React from 'react';
  import { FormattedMessage } from 'react-intl';
  import { connect } from 'react-redux';
  import { createStructuredSelector } from 'reselect';
  
  import A from './A';
  import Img from './Img';
  import NavBar from './NavBar';
  import HeaderLink from './HeaderLink';
  import messages from './messages';
  import TitleBar from './TitleBar';
  import TitleLink from './TitleLink';
  import { selectCurrentUser } from '../../containers/App/selectors';
  import { submitLogout } from '../../containers/App/actions';
  
  class Header extends React.Component { // eslint-disable-line react/prefer-stateless-function
    render() {
      return (
        <div>
          <TitleBar><TitleLink to="/">Lamp Experiment</TitleLink></TitleBar>
          <NavBar>
            {this.props.loggedUser === "admin" ?
              <HeaderLink to="/researcherDashboard">
                <FormattedMessage {...messages.researcherDashboard} />
              </HeaderLink> : null}
            {this.props.loggedUser && this.props.loggedUser !== "" ?
              <HeaderLink to="/experiment">
                <FormattedMessage {...messages.experiment} />
              </HeaderLink> : null}
            {this.props.loggedUser && this.props.loggedUser !== "" ?
              <HeaderLink to="/" onClick={this.props.onLogoutClick}>
                <FormattedMessage {...messages.logout} />
              </HeaderLink> : null}
          </NavBar>
        </div>
      );
    }
  }
  
  const mapStateToProps = createStructuredSelector({
    loggedUser: selectCurrentUser(),
  });
  
  function mapDispatchToProps(dispatch) {
    return {
      onLogoutClick: (evt) => dispatch(submitLogout()),
    };
  }
  
  // Wrap the component to inject dispatch and state into it
  export default connect(mapStateToProps, mapDispatchToProps)(Header);
  