How to differentiate between 'local' and 'social' user types after login via Azure AD B2C?

I have a Node.js/Express application that uses Azure AD B2C for authentication.

Currently, two types of users can login:

• Local accounts - EXTERNAL users in the Azure AD B2C tenant
• Social accounts - INTERNAL users from a single Azure AD tenant

Desired Behaviour

I want to display different frontend user interface elements based on the type of user that has logged in.

• Local accounts will be able to call endpoints relevant to EXTERNAL users
• Social accounts will be able to call endpoints relevant to INTERNAL users

What is the recommended way to differentiate between who logged in?

I can see that the authToken object that is returned from msal-node's acquireTokenByCode() method is different depending on which type of user logged in.

Should I use a property from the authToken object to differentiate between user types?

If so, which property is the best one to use?

And, so that I can perform relevant UI actions accordingly, is it acceptable to store this value as a cookie in the browser (eg 'user_type': 'EXTERNAL' or 'user_type': 'INTERNAL') using something like js-cookie?

Below is a redacted version of the authToken object that is returned after login.

All values are the same for different users types, unless otherwise specified.

Notably, these two properties are only present after a 'social account' login:

• idp_access_token
• idp

{
    "authority": "https://<my-azure-ad-b2c-tenant>.b2clogin.com/<my-azure-ad-b2c-tenant>.onmicrosoft.com/b2c_1_signin1/",
    "uniqueId": "*******",  // <-- different for each user, this is the object id of the user as represented in the Azure AD B2C tenant
    "tenantId": "",
    "scopes":
    [
        "https://<my-azure-ad-b2c-tenant>.onmicrosoft.com/my-web-app-api/tasks.write", // <-- these are the api permissions granted to my web app
        "https://<my-azure-ad-b2c-tenant>.onmicrosoft.com/my-web-app-api/tasks.read"  // <-- these are the api permissions granted to my web app
    ],
    "account":
    {
        "homeAccountId": "***uniqueId***-b2c_1_signin1.<the-directory-id-of-my-azure-ad-b2c-tenant>", // unique id is different for each user  
        "environment": "<my-azure-ad-b2c-tenant>.b2clogin.com",
        "tenantId": "",
        "username": "<user-email-address>", // different for each user  
        "localAccountId": "***uniqueId***", // different for each user  
        "idTokenClaims":
        {
            "exp": 1673069519,
            "nbf": 1673065919,
            "ver": "1.0",
            "iss": "https://<my-azure-ad-b2c-tenant>.b2clogin.com/<the-directory-id-of-my-azure-ad-b2c-tenant>/v2.0/",
            "sub": "***uniqueId***", // different for each user  
            "aud": "<the-application/client id of my web app>",
            "iat": 1673065919,
            "auth_time": 1673065918,
            "idp_access_token": "********", // <-- this property is ONLY present in the authToken returned from the SOCIAL login  
            "idp": "https://login.microsoftonline.com/<the-directory-id-of-my-azure-ad-tenant>/v2.0", // <-- this property is ONLY present in the authToken returned from the SOCIAL login  
            "emails":
            [
                "<user-email-address>" // different for each user  
            ],
            "tfp": "B2C_1_signin1",
            "at_hash": "*******" // different for each user  
        }
    },
    "idToken": "*******", // different for each user  
    "idTokenClaims":
    {
        "exp": 1673069519,
        "nbf": 1673065919,
        "ver": "1.0",
        "iss": "https://<my-azure-ad-b2c-tenant>.b2clogin.com/<the-directory-id-of-my-azure-ad-b2c-tenant>/v2.0/",
        "sub": "***uniqueId***", // different for each user  
        "aud": "<the-application/client id of my web app>",
        "iat": 1673065919,
        "auth_time": 1673065918,
        "idp_access_token": "********", // <-- this property is ONLY present in the authToken returned from the SOCIAL login  
        "idp": "https://login.microsoftonline.com/<the-directory-id-of-my-azure-ad-tenant>/v2.0", // <-- this property is ONLY present in the authToken returned from the SOCIAL login  
        "emails":
        [
            "<user-email-address>" // different for each user  
        ],
        "tfp": "B2C_1_signin1", // different for each user  
        "at_hash": "*******"
    },
    "accessToken": "*******", // different for each user  
    "fromCache": false,
    "expiresOn": "2023-01-07T05:31:57.000Z",
    "correlationId": "*******", // different for each user  
    "requestId": "",
    "extExpiresOn": "2023-01-07T05:31:57.000Z",
    "familyId": "",
    "tokenType": "Bearer",
    "state": "",
    "cloudGraphHostName": "",
    "msGraphHost": "",
    "fromNativeBroker": false
}

For Reference

For reference, below are the steps I took to:

• Enable login from a single Azure AD tenant
• Enable Azure AD users to be able to call Graph API in their own tenant

I added a single Azure AD tenant as an Identity Provider by going to:

Azure Portal > Azure AD B2C Tenant > Azure AD B2C > Identity Providers > + New OpenID Connect provider > [ fill in required fields and click 'Save' ]

Detailed steps on adding an Azure AD tenant as an identity provider can be found here:

https://learn.microsoft.com/en-us/azure/active-directory-b2c/identity-provider-azure-ad-single-tenant?pivots=b2c-user-flow#configure-azure-ad-as-an-identity-provider

In the Scope field, I added the scopes that I wanted the Azure AD users to be able to use in their own tenant, i.e:

openid profile User.ReadWrite.All Directory.ReadWrite.All Team.ReadBasic.All TeamSettings.ReadWrite.All

Then I went to the relevant 'user flow' at:

Azure Portal > Azure AD B2C Tenant > Azure AD B2C > User flows > B2C_1_signin1 > Identity providers > [ check the recently added OpenID connect provider ] > [ click 'Save' ]

In order for Azure AD users to be able to make Graph API calls to their own tenant, I did the following to make sure that an idp_token was returned when they logged in - I believe this is essentially an 'access token' for their tenant:

Azure Portal > Azure AD B2C Tenant > Azure AD B2C > User flows > B2C_1_signin1 > Application claims > [ select 'Identity Provider Access Token' ] > [ click 'Save' ]

The idp claim is the one that you are looking for since it will be set of all external providers of the Azure AD B2C tenant.

Note that the idp_access_token claim is present when pass through is enabled but is only supported for OAuth 2.0 providers, so it may be blank for some.