Redux is not passing state to reducer

Question

I'm trying to pass the state to the reducer, I'm not sure why I can't retrieve the value. I'm getting the following error

× Unhandled Rejection (TypeError): Cannot read property 'data' of undefined

action

export const getUser = () => {
    return async (dispatch) => {
      const url = await Axios.get(process.env.REACT_APP_GET_USER);
      const response = await url;
      const data = response.data; // renders auth:true or auth:false
      if(response){
          dispatch({type: GET_CURRENT_USER, data})
      }

    }
}

reducer

const initialState = {
    authError: null,
    isAuthenticated:localStorage.getItem('auth'),
    githubAuth:localStorage.getItem('gitAuth'),
    token: null,
    user: [],
    isAuthenticated2:false,
    redirectPath: null

}

 case GET_CURRENT_USER:
   return({
      ...state,
      isAuthenticated2:action.data.response.auth

   })

renders false when this.props.getUser is executed

Front end

import React, { Component } from 'react';
// import axios from 'axios';
import Navbar from './components/layout/Navbar';
import { withStyles } from '@material-ui/core/styles';
import {compose} from 'redux';
import { connect } from 'react-redux';
import { getUser, setCurrentUser} from './actions/';
import setAuthToken from './setAuthToken';
import jwt_decode from 'jwt-decode';
import Axios from './Axios';
import { runInThisContext } from 'vm';


const styles = theme => ({
  root: {
    flexGrow: 1,
    padding: 20
  },
  paper: {
    padding: theme.spacing.unit * 2,
    textAlign: 'center',
    color: theme.palette.text.secondary,
  },

  chip: {
    margin: theme.spacing.unit,
  },
});


class App extends Component {

  constructor(props){
    super(props);

    this.state = {
      user: "",
      isAuthenticated: false,
    }

}

componentWillMount(){

  if (localStorage.auth != null) {
    // Set auth token header auth
    setAuthToken(localStorage.auth);

    const token = localStorage.getItem('auth');
    // // Decode token and get user info and exp
    const decoded = jwt_decode(token);
    // console.log(decoded);
    // // Set user and isAuthenticated
    this.props.setCurrentUser(decoded);

  }



    this.props.getUser();

    console.log(this.props.isAuthenticated2);




}



  render() {

    const { classes, isAuthenticated } = this.props;


    return (

      <div className="App">

        <Navbar />



      </div>
    );
  }
}

const mapStateToProps = (state) => ({
  isAuthenticated: state.user.isAuthenticated,
  isAuthenticated2: state.user.isAuthenticated2


})

const mapDispatchToProps = (dispatch) => ({
  getUser: () => dispatch (getUser()),
  setCurrentUser: () => dispatch( setCurrentUser()),

});


export default compose(connect(mapStateToProps, mapDispatchToProps), withStyles(styles))(App);

Edit could it be returning false, because auth:true is an object not an actual boolean ?

Answer 1

As per image error occurs here

action.response.data.auth

and in your code change it to

action.data.response.auth

you should receive data in reducer action.data.auth

case GET_CURRENT_USER:
   return({
      ...state,
      isAuthenticated2: action.data.auth

   })