Different UI for MFA

[benny]

Hi, we want to activate MFA.
We want to works this way:

1. If user signed up with social login (Gmail) - don’t activate MFA.
2. Otherwise (username + password), on the first login (not on signup) if MFA is not enabled, enroll the user with MFA.
3. From the 2nd login, show MFA.

We build an onExecutePostLogin action.
The problem:
api.authentication.enrollWithAny and api.multifactor.enable('any', { allowRememberBrowser: true }) show different UIs:

enrollWithAny:

api.multifactor.enable:

We probably doing something in a wrong way.
This is our code:
exports.onExecutePostLogin = async (event, api) => {
    const isSocialLogin = event.connection.name !== 'Username-Password-Authentication';
    if (isSocialLogin) return;

    const authenticationMethods = event.authentication?.methods || [];
    const sessionAuthenticatedWithMFA = authenticationMethods.some((method) => method.name === 'mfa');
    if (sessionAuthenticatedWithMFA) return;

    const CHALLENGE_TYPES = [
      { type: 'phone' },
      { type: 'otp' },
      { type: 'push-notification' },
      { type: 'push' }
    ];

    const enrolledFactors = event.user.enrolledFactors?.filter((f) => f.type !== 'email')?.map((f) => ({ type: f.type })) || [];
    
    if (enrolledFactors.length === 0) {
        api.authentication.enrollWithAny(CHALLENGE_TYPES);
        return;
    }
    
    api.multifactor.enable('any', { allowRememberBrowser: true })
};

Questions:

1. Is there a better way to achieve it other than the code above? (we check manually different stuff that looks redundant).
2. Why the UIs are different?
3. How to know that the action run in signup context so we can continue without MFA?

[dawid.matuszczyk]

Hi There!

Thank you for posting your question, generally speaking api.multifactor.enable() is the old way and usually it is used on it’s own, it handles enrolment and challenge.

enrollWithAny() is the new way designed to be used alongside challengeWith() or challengeWithAny() see docs here →

Customize MFA Selection for Universal Login

2. This is expected behaviour based on the difference between “new” and “old” methods

3. The best way to check if the login is a sign-up in the post-login action is to check the event.stats.logins_count. If it is equal to 1, then a sign-up event is taking place

Thanks
Dawid