React is redirecting after refresh using Redux

Viewed 84

I am building simple authentication application using MERN + Redux in which after user successfully logs in is redirected to Home Page in which I dispatch an action which returns cookie ( login successful is equal to cookie = true, and vice versa )

This is code in Home Page

const dispatch = useDispatch();
const cookie_info = useSelector( state => state.is_user_logged_in );
const { cookie, loading } = cookie_info;
React.useEffect(()=>{
    dispatch(get_cookie_action());
},[]);

return (
    <>
        {
            loading 
            ?
            <h1>LOADING</h1>
            :
            (
                cookie
                ?
                (
                   <div>
                        <Navbar/>
                   </div>
                )
                :
                <Redirect to="/login"/>
            )
        }
    </>
);

The problem is after user logs in everything works but after I refresh home page I am redirected to login page again, It seams that React does not wait for redux state change of cookie from false to true and immediately 'fires'

   <Redirect to="/login"/> 

part of code. My initial state of cookie in reducers is false.

0 Answers
Related