'use strict';

const React = require('react');
const {Link} = require('react-router');

const UserAction = require('../actions/UserAction');

module.exports = React.createClass({

  displayName: 'NavComponent',

  contextTypes: {
    router: React.PropTypes.func.isRequired,
    getStore: React.PropTypes.func.isRequired,
    executeAction: React.PropTypes.func.isRequired
  },

  componentDidMount() {
    if (!this.props.account) {
      this.context.executeAction(UserAction, {
        actionType: UserAction.actionTypes.READ_CURRENT_USER
      });
    }
  },

  render() {
    return (
      <nav>
        <div style={{float: 'left'}}>
          <Link to='home'>Home</Link>
          <Link to='page'>Page</Link>
        </div>
        <div style={{float: 'right'}}>
          {(() => {
            if (this.props.account) {
              return <a href='/session/signout'>logged in as {this.props.account.unique_name}</a>;
            } else {
              return <a href='/session/signin'>Sign in</a>;
            }
          })()}
        </div>
      </nav>
    );
  }

});
