React-admin - How can I force the Dasbhoard to ask for login if not authenticated

Question

In the Admin component I would like to have a dashboard like so:

<Admin dashboard={Dashboard}>
    <Resource name="list" list={MyList} />
</Admin>

How can I force the dashboard to ask for login if the user is not already authenticated? Is there an easy way to achieve this?

Answer 1

When an api endpoint returns a 401 or 403 http statuscode react-admin will show the login page. From the Authentication page in the react-admin documentation:

By default, an react-admin app doesn’t require authentication. But if the REST API ever returns a 401 (Unauthorized) or a 403 (Forbidden) response, then the user is redirected to the /login route. You have nothing to do - it’s already built in.

The authentication is configure by the authProvider prop.

<Admin dashboard={Dashboard} authProvider={authProvider}>
    <Resource name="list" list={MyList} />
</Admin>

The auth provider is called each time the user navigates. So you can implement your authProvider which checks if the user is logged or rout to the login page.

From the Authentication page - Checking Credentials During Navigation:

Redirecting to the login page whenever a REST response uses a 401 status code is usually not enough, because react-admin keeps data on the client side, and could display stale data while contacting the server - even after the credentials are no longer valid.

Fortunately, each time the user navigates, react-admin calls the authProvider with the AUTH_CHECK type, so it’s the ideal place to check for credentials.