InfoThis documentation is just for PropelAuth Components, an optional library for those who want deeper design control over their UIs.Click here to view our standard documentation

Verify MFA For Login Component

PropelAuth's Verify MFA For Login component is to be used when a user needs to verify an MFA code during the login process. It is designed to be used when your user has a Login State of TWO_FACTOR_REQUIRED.

Two-Factor Authentication

Switch to Backup Code

Reference APIs

These are the APIs that are used by the above component. You can use these APIs directly in your own code.

verifyMfaBackupCodeForLogin

Verifies the user's MFA code for login.

Arguments

  • Name
    code *
    Type
    string
    Description
    The user's MFA backup code

Success Response

  • Name
    login_state
    Type
    LoginState
    Description
    Returns one of the following:
    • LOGIN_REQUIRED
    • TWO_FACTOR_REQUIRED
    • EMAIL_NOT_CONFIRMED_YET
    • USER_MISSING_REQUIRED_PROPERTIES
    • USER_MUST_BE_IN_AT_LEAST_ONE_ORG
    • UPDATE_PASSWORD_REQUIRED
    • TWO_FACTOR_ENROLLMENT_REQUIRED
    • LOGGED_IN

Response Functions

The response object has a handle function that you can use to handle the response. These functions can be async, and you can return values from them.

  • Name
    success
    Description
    Successful request.
  • Name
    invalidCode
    Description
    Invalid code provided.
  • Name
    mfaCookieTimeout
    Description
    The user's MFA session has timed out. They must log in again to continue.
  • Name
    userAccountDisabled
    Description
    User cannot login due to their account being disabled.
  • Name
    userAccountLocked
    Description
    User cannot login due to their account being locked.
  • Name
    unexpectedOrUnhandled
    Description
    An unexpected error occurred.

Request

const { verifyMfaBackupCodeForLogin } = useAuthFrontendApis()

const response = await verifyMfaBackupCodeForLogin({
    code: "123456",
})
response.handle({
    success() {
        // handle login state
    },
    invalidCode(error) {
        console.error('Invalid code provided', error)
    },
    userAccountDisabled(error) {
        console.error('User account disabled', error)
    },
    userAccountLocked(error) {
        console.error('User account locked', error)
    },
    mfaCookieTimeout(error) {
        console.error('Session timeout', error)
    },
    unexpectedOrUnhandled(error) {
        console.error('Unexpected or unhandled', error.user_facing_error)
    },
})

Successful Response

{
    "login_state": "Finished"
}

verifyMfaForLogin

Verifies the user's MFA code for login.

Arguments

  • Name
    code *
    Type
    string
    Description
    The MFA code generated by your user's authenticator.

Success Response

  • Name
    login_state
    Type
    LoginState
    Description
    Returns one of the following:
    • LOGIN_REQUIRED
    • TWO_FACTOR_REQUIRED
    • EMAIL_NOT_CONFIRMED_YET
    • USER_MISSING_REQUIRED_PROPERTIES
    • USER_MUST_BE_IN_AT_LEAST_ONE_ORG
    • UPDATE_PASSWORD_REQUIRED
    • TWO_FACTOR_ENROLLMENT_REQUIRED
    • LOGGED_IN

Response Functions

The response object has a handle function that you can use to handle the response. These functions can be async, and you can return values from them.

  • Name
    success
    Description
    Successful request.
  • Name
    mfaCookieTimeout
    Description
    The user's MFA session has timed out. They must log in again to continue.
  • Name
    userAccountDisabled
    Description
    User cannot login due to their account being disabled.
  • Name
    userAccountLocked
    Description
    User cannot login due to their account being locked.
  • Name
    badRequest
    Description
    Incorrect arguments provided or incorrect code provided.
  • Name
    unexpectedOrUnhandled
    Description
    An unexpected error occurred.

Request

const { verifyMfaForLogin } = useAuthFrontendApis()

const response = await verifyMfaForLogin({
    code: "123456",
})
response.handle({
    success() {
        // handle login state
    },
    userAccountDisabled(error) {
        console.error('User account disabled', error)
    },
    userAccountLocked(error) {
        console.error('User account locked', error)
    },
    mfaCookieTimeout(error) {
        console.error('Session timeout', error)
    },
    badRequest(error) {
        console.error('Bad request', error)
    },
    unexpectedOrUnhandled(error) {
        console.error('Unexpected or unhandled', error.user_facing_error)
    },
})

Successful Response

{
    "login_state": "Finished"
}