A problem to get data from store in react-redux - reactjs

Question

I'm creating to do list app so I created API using laravel and it works fine . The scenario is when user login I dispatch an action to check his email and password then update the store in redux with the user tasks . The tasks reach to the reducer fine but I cannot get it in the TasksComponent I get undefined when console.log(this.props.tasks) or even console.log(this.props.isLoading)
The reducer login
import * as ActionTypes from './ActionTypes';
export const Login = (state = {
tasks: [],
categories: [],
error: null,
isLoading: true
}, action) => {
switch(action.type) {
case ActionTypes.AUTH_LOADING:
return {...state, tasks:[], categories:[], error: null, isLoading: true}
case ActionTypes.AUTH_SUCCESS:
console.log(action.payload.user.tasks)
return {...state, tasks: action.payload.user.tasks, categories: action.payload.user.categories,error: null, isLoading: false}
case ActionTypes.AUTH_FAIL:
return {...state, tasks:[], categories:[], error: action.error, isLoading: false}
default:
return state;
}
}
The Action creator
import * as ActionTypes from './ActionTypes';
import { baseUrl } from '../shared/baseUrl';
export const authSuccess = (authData) => ({
type: ActionTypes.AUTH_SUCCESS,
payload: authData
});
export const authFail = (error) => ({
type: ActionTypes.AUTH_FAIL,
error: error
});
export const authLoading = () =>({
type: ActionTypes.AUTH_LOADING
})
export const auth = (email, password) => dispatch => {
dispatch(authLoading());
const user = {
email: email,
password: password
}
return fetch('http://localhost:8000/api/users/login',{
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(user)
})
.then(data => data.json())
.then(user => {
dispatch(authSuccess(user));
})
.catch(error => dispatch(authFail(error)));
}
The tasks component
import React, {Component} from 'react';
import { connect } from 'react-redux';
import { Loading } from './LoadingComponent';
class Tasks extends Component {
constructor(props) {
super(props);
}
render() {
if(this.props.isLoading) {
<Loading />
} else {
return(<h1>Yes</h1>)
}
}
}
const mapStateToProps = state =>{
return {
isLoading: state.isLoading // Always get undefined
}
}
export default connect(mapStateToProps)(Tasks);