Basic vs Admin level access to SPA paths

Trying to implement the following scenario:

Have an (SPA React) app running on myapp.com, for which a user needs to be logged in to do anything. This part is pretty straight forward and I got it working by following the React API docs.

Now I would like to add a myapp.com/admin section to the site, where only “Admin” have access. Admin are defined using a separate (enterprise) connection compared to normal users who log in using a different OIDC connection.

How does one go about doing this? Do I need to create 2 separate Applications in auth0, or can it all be done in a single Application? Any examples of this anywhere? What I am trying to create is very similar to how Github protects certain parts of the app and requires an admin to login before proceeding.

Thanks

Hi @ramin. We don’t have an example of this.
As for the need of creating two applications or not, it will depend on certain design decisions. For example: can admin users use the “regular” part of the application?

If the answer to the above is yes, I would probably define just one application where users can choose how to log in. If the user logs in with the enterprise connection, then you would add custom claims in the ID token to reflect the admin status. In the app you would check for that claim when the user tries to access the /admin section, denying access if the user is not an admin.

The backend API will also need to check authorization policies, of course, verifying that the access token is valid to access the admin endpoints of the API. You can check this based on the sub claim that contains the user ID (if your API has knowledge of which user ID is an admin) or add the role information as a custom claim of the access token.