@auth0/auth0-acul-react - v1.10.0
    Preparing search index...

    Interface LoginEmailVerificationMembers

    LoginEmailVerificationMembers description Defines the members (properties and methods) available for interacting with the Login Email Verification screen. This screen is a crucial part of email verification processes, typically during login, where a user must prove ownership of an email address by providing a one-time code. The SDK facilitates submitting this code or requesting a new one.

    The universal_login_context for this screen (window.universal_login_context) will contain:

    • client: Information about the Auth0 application.
    • organization (optional): Details if the authentication is for a specific organization.
    • prompt: Context of the current authentication prompt (e.g., 'login').
    • screen: UI texts and general screen information. No screen-specific data fields are uniquely defined for login-email-verification beyond standard ones.
    • transaction: Details of the ongoing transaction, including state and any errors from previous attempts (e.g., "invalid-code").
    interface LoginEmailVerificationMembers {
        branding: BrandingMembers;
        client: ClientMembers;
        countryCodes?: CountryCodesMembers;
        experiment?: ExperimentMembers | null;
        organization: OrganizationMembers;
        prompt: PromptMembers;
        screen: ScreenMembers;
        tenant: TenantMembers;
        transaction: TransactionMembers;
        user: UserMembers;
        untrustedData: UntrustedDataMembers;
        getErrors(): Error[];
        changeLanguage(options: LanguageChangeOptions): Promise<void>;
        continueWithCode(payload: ContinueWithCodeOptionPayload): Promise<void>;
        resendCode(payload?: ResendCodeOptionsPayload): Promise<void>;
        resendManager(options?: StartResendOptions): ResendControl;
    }

    Hierarchy (View Summary)

    Index

    Properties

    branding: BrandingMembers
    countryCodes?: CountryCodesMembers

    Optional on the interface so existing implementors of BaseMembers (e.g. test mocks) keep compiling. Always populated at runtime by the BaseContext constructor.

    experiment?: ExperimentMembers | null

    The active Experiment Center experiment for the current screen, or null when none is active (or the screen has not opted in via context_configuration).

    Optional on the interface so existing implementors of BaseMembers (e.g. test mocks) keep compiling. Always populated at runtime by the BaseContext constructor.

    organization: OrganizationMembers
    transaction: TransactionMembers
    untrustedData: UntrustedDataMembers

    Methods

    • Returns Error[]

    • Submits the email verification code entered by the user. This action corresponds to the user entering the code they received via email and clicking a "Continue" or "Verify" button. The SDK will then POST this code to the Auth0 /u/login-email-verification endpoint.

      If the code is valid, Auth0 will typically redirect the user to the next step in the authentication flow. If the code is invalid, expired, or another error occurs, Auth0 will usually re-render the login-email-verification screen, and the transaction.errors array in the SDK's context will be updated with details about the failure (e.g., error code invalid-code).

      Parameters

      • payload: ContinueWithCodeOptionPayload

        An object containing the code string entered by the user. It can also include any CustomOptions for extensibility.

      Returns Promise<void>

      A promise that resolves when the form submission is initiated. It does not return data directly upon resolution, as a redirect or page re-render is the common outcome.

      Throws an error if payload.code is not provided or is not a string, or if the FormHandler encounters an unrecoverable issue during submission (e.g., network error). Validation errors from Auth0 (like an invalid code) are not thrown as JavaScript errors but are reflected in this.transaction.errors after the operation.

      // Assuming 'manager' is an instance of LoginEmailVerification
      const userInputCode = "123456";
      try {
      await manager.continueWithCode({ code: userInputCode });
      // If successful, page redirects. No further client-side action needed here.
      } catch (error) {
      // This catch is for unexpected errors, not for Auth0 validation errors.
      console.error("Failed to submit the verification code:", error);
      }
      // After the await, always check manager.transaction.errors for server-side validation issues.
      if (manager.transaction.errors && manager.transaction.errors.length > 0) {
      manager.transaction.errors.forEach(err => {
      if (err.code === 'invalid-code') {
      // Display "The code you entered is invalid" to the user.
      }
      });
      }
    • Requests Auth0 to send a new verification code to the user's email address.

      Parameters

      Returns Promise<void>

      A promise that resolves once the form is submitted, before the page reloads. It doesn't confirm that a new code was sent.

      Submits a form POST with action: "resend-code". Auth0 responds by rendering this screen again, so the browser reloads the page and the current JavaScript context, including component state and timers, is lost.

      Code after await resendCode() may still run, but anything it sets up, such as a "code sent" message or a countdown, is gone after the reload. Server-side errors, such as rate limits, appear in transaction.errors (or useErrors() in React) on the reloaded page. They don't reject the returned promise.

      To add a cooldown between resends, use resendManager() (or useResend() in React). It stores its countdown in localStorage, so the countdown survives the reload.

    • Gets resend functionality with timeout management for this screen

      Parameters

      Returns ResendControl