import React, {Component} from 'react'
import {NavLink} from 'react-router-dom'
import {connect} from 'react-redux'
import {bindActionCreators} from 'redux'

import * as sessionsActions from '../actions/sessionsActions'
import Auth from '../auth/authenticator'
import '../styles/Navbar.css'




class Navbar extends Component {
  constructor(props) {
    super();
    this.logout = this.logout.bind(this)
  }

  logout(event) {
    event.preventDefault();
    this.props.actions.logOutUser();
  }

  render() {
    if (this.props.auth.isAuthenticated) {
      return (
        <nav className="navbar">
            <NavLink
              className="navlink"
              to="/newsfeed"
            >Newsfeed</NavLink>
            <NavLink
              className="navlink"
              to="/sources"
            >Sources</NavLink>
            <a href="#"
              className="navlink"
              onClick={(e) => {this.logout(e)}}
            >Logout</a>
        </nav>
      )
    } else {
      return (
        <nav className="navbar">
            <NavLink
              className="navlink"
              to="/"
            >Login</NavLink>
            <NavLink
              className="navlink"
              to="/signup"
            >Sign Up</NavLink>
        </nav>
      )
    }
  }


}

const mapStateToProps = (state) => {
  return {auth: state.auth}
}

const mapDispatchToProps = (dispatch) => {
  return {actions: bindActionCreators(sessionsActions, dispatch)}
}
export default connect(mapStateToProps, mapDispatchToProps)(Navbar)

@@ -673,16 +673,15 @@
 o=%22/
-newsfeed
+sources
 %22%0A  
@@ -695,129 +695,19 @@
    %3E
-Newsfeed%3C/NavLink%3E%0A            %3CNavLink%0A              className=%22navlink%22%0A              to=%22/sources%22%0A            %3ESource
+Add Channel
 s%3C/N

Refactor nav