Feature log out

application/src/components/main/main.js

@@ -9,7 +9,6 @@ const mapStateToProps = state => ({
 
 class Main extends Component {
   render() {
-    console.log('props', this.props);
     return (
       <div className="main-body">
         <h1>Bruce's Diner Ordering Application</h1>

application/src/components/nav/nav.js

@@ -1,8 +1,10 @@
 import React from "react";
 import { Link } from "react-router-dom";
+import { connect } from "react-redux";
 import "./nav.css";
+import { logoutUser } from "../../redux/actions/authActions";
 
-const Nav = (props) => {
+const Nav = ({ logoutUser }) => {
     return (
         <div className="nav-strip">
             <Link to={"/order"} className="nav-link">
@@ -17,11 +19,15 @@ const Nav = (props) => {
             </Link>
             <Link to={"/login"} className="nav-link">
                 <div className="nav-link-style">
-                    <label className="nav-label">Log Out</label>
+                    <label className="nav-label" onClick={() => logoutUser()}>Log Out</label>
                 </div>
             </Link>
         </div>
     );
 }
 
-export default Nav;
+const mapDispatchToProps = dispatch => ({
+  logoutUser: e => dispatch(logoutUser(e))
+})
+
+export default connect(null, mapDispatchToProps)(Nav);

application/src/redux/reducers/authReducer.js

@@ -3,12 +3,12 @@ import { LOGIN, LOGOUT } from '../actions/types'
 const INITIAL_STATE = { email: null, token: null };
 
 export default (state = INITIAL_STATE, action) => {
-    switch (action.type) {
-        case LOGIN:
-            return { ...state, email: action.payload.login, token: action.payload.token }
-        case LOGOUT:
-            return { ...state, ...INITIAL_STATE }
-        default:
-            return state;
-    }
+  switch (action.type) {
+    case LOGIN:
+      return { ...state, email: action.payload.email, token: action.payload.token }
+    case LOGOUT:
+      return { ...INITIAL_STATE }
+    default:
+      return state;
+  }
 }