Bypassing organization picker

Get Help
,
1

Hey everyone,

I have kind of a tricky one and I’m really hoping there’s an elegant solution. We have an application that handles both business accounts (associated with organizations) and individual accounts. When a business user logs into our application, it currently prompts them with the organization picker. We don’t think that’s a great user experience for our business users. We also find that the context basically always indicates whether or not the login we’re prompting should be for the personal account or organization account.

The question is basically, is there a way to programmatically set user type for a universal login screen to individual or business based on how we generate the login page? That would be the silver bullet solution for our problem. Failing that, how would you avoid the organization picker if you’ve decided it’s no longer acceptable to display it? Any help here would be appreciated. I’ve though about creating multiple applications, but that seems super tedious and I’d rather avoid that if I can help it.

Thanks a ton in advance for anyone’s help or thoughts on this! I’ve included a screenshot of the organization picker so you know what I mean

image
image852×702 28.2 KB

3

Hi @youssef1,

You can absolutely bypass the organization picker programmatically. When you initiate the login flow from your application, you’ll need to pass the organization parameter containing the specific org_id. This tells Auth0 exactly which organization the user should log into, skipping the picker.

You can control the login flow based on the context you already have in your application.

1. For a Business / Organization Login

When your application knows the user is logging in on behalf of a specific business, you will include the organization parameter in the authorization request. The value must be the ID of the user’s Auth0 Organization.

Here is an example of what this would look like in a web application using an Auth0 SDK (like auth0-spa-js or auth0-react):

// This is an example from auth0-spa-js
// Assume you have retrieved the organization ID for the user's company
const orgId = "org_xxxxxxxxxxxxxxxx";

// When the user clicks your "Business Login" button
await auth0.loginWithRedirect({
  authorizationParams: {
    organization: orgId
  }
});

When Auth0 receives this, it skips the picker and takes the user directly to the login flow for that specific organization.

2. For an Individual / Personal Login

When a user logs in with their personal account, you simply initiate the login request without the organization parameter.

// This is an example from auth0-spa-js
// When the user clicks your "Personal Login" button
await auth0.loginWithRedirect();

If the user logging in is a member of an organization, they will still see the picker with this method. This allows them to choose their context. If the user is not a member of any organization, they will bypass the picker and proceed directly.

If you have any other questions, feel free to reach out.

Have a good one,
Vlad

4

Hey Vlad,

Thanks for getting back to me, this is super helpful. The problem we have is that the organization id isn’t available to us until after the user logs in. We get the organization id by its association with the user. My thought process is that we once the user has logged in on the UL screen but before the org picker prompt, by that point the org ID is necessarily in the org picker (since it has to display the options). Our business users will only ever have one organization with which they are associated, so I was hoping there was a way auth0 could be smart enough to know that we’re trying to log them into the one organization they are associated with. Let me know if that makes sense and if you know of any ways around that problem.

Thanks again,

Youssef

5

Hi @youssef1,

By the looks of it, your business users and individual users are all stored in the same connection. As a result, you will always see the organization picker when logging in as a user who is also part of an organization. Such users will always be asked if they want to log in as an organization member or an individual user.

If you want your business users to avoid being presented with an organization picker screen, they must be stored in an Enterprise Connection. These connections are explicitly made for organization members and will not be confused with personal accounts, since they don’t store those.

Have a good one,
Vlad