useTokenVerifyPopup

A custom React hook to launch a token verification popup for account-based verifications.

Using this hook will keep the Authento verification popup safe from being blocked by the built-in popup blockers of major browsers.

To make use of this hook, you must set up your own backend to handle verification tokens generation as described here.

Usage

import { useTokenVerifyPopup } from "authento-react";

export const MyComponent = () => {
  const { verify, status } = useTokenVerifyPopup({
    endpoint: "https://api.example.com/jwt",
    params: {
      verificationType: "BASIC",
      lang: "fr",
    },
  });
  
  return (
    <div>
      <button onClick={verify}>Verify</button>
      {status === "fetching" && <p>Fetching verification token</p>}
      {status === "success" && <p>Verification token fetched successfully</p>}
      {status === "error" && <p>Failed to fetch verification token</p>}
    </div>
  );
};

Configuration

The useTokenVerifyPopup hook accepts a configuration object with the following properties:

• endpoint (required): Your own endpoint for verification token generation.

• params (optional): Parameters for token generation requests.

• authentoUrl (optional): The URL of the Authento website (default: "https://app.authento.io"). For testing, this should be set to "https://demo-app.authento.io".

Return Value

The useTokenVerifyPopup hook returns an object with the following properties:

• verify: A function which launches verification popups using tokens fetched from the configured endpoint.

• status: The current status of the token generation process, which can be one of the following values: "unstarted", "fetching", "success", or "error".