How to properly set up a redirect after authorization?

Question

React

The authorization token is stored in LocalStorage. Further in the editor, the flag is changed to true and React itself decides whether to redirect or render the component.

const isAuth = useSelector(state => state.user.auth)

return isAuth ? <Redirect to='/user' />  : <Component />

Everything works, but when the page is refreshed, a request occurs to check the token, it takes a fraction of a second, but this fraction of a second the login page is displayed, the server response comes - the token is valid - and even then the redirect occurs. How to organize a redirect correctly to remove the fleeting display of the login page?

Answer 1

As an option, set the isLoading true parameter in the store and display the loader based on it. As soon as the request passes, set isLoading to false and, accordingly, according to the results of the request, display the component or redirect where necessary