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.