useOtpCredential

Hook that creates an otp credential

browser

test coverage

Last changed: last month

TIP

This hook uses navigator.credentials browser api to provide enhanced functionality. Make sure to check for compatibility with different browsers when using this api

Installation

Library

CLI

Manual

import { useOtpCredential } from '@siberiacancode/reactuse';

Usage

useOtpCredential((credential) => console.log(credential));
// or
useOtpCredential({ onSuccess: (credential) => console.log(credential), onError: (error) => console.log(error) });

Demo

source

Api

Parameters

Name	Type	Default	Note
callback	UseOtpCredentialCallback	-	The callback function to be invoked

Returns

UseOtpCredentialReturn

Parameters

Name	Type	Default	Note
params.onSuccess	UseOtpCredentialCallback	-	The callback function to be invoked on success
params.onError	UseOtpCredentialCallback	-	The callback function to be invoked on error

Returns

UseOtpCredentialReturn

Type declaration

interface OTPOptions {
    readonly transport: string[];
  }

interface CredentialRequestOptions {
    readonly otp: OTPOptions;
  }

interface Credential {
    readonly code: string;
  }

export type UseOtpCredentialCallback = (otp: Credential | null) => void;

export interface UseOtpCredentialParams {
  /* The callback function to be invoked on error */
  onError: (error: any) => void;
  /* The callback function to be invoked on success */
  onSuccess: (credential: Credential | null) => void;
}

export interface UseOtpCredentialReturn {
  /* The abort function */
  abort: AbortController['abort'];
  /*  The aborted state of the query */
  aborted: boolean;
  /* The supported state of the otp credential */
  supported: boolean;
  /* The get otp credential function */
  get: () => Promise<Credential | null>;
}

export interface UseOtpCredential {
  (callback?: UseOtpCredentialCallback): UseOtpCredentialReturn;

  (params?: UseOtpCredentialParams): UseOtpCredentialReturn;
}

Source

Source • Demo

Contributors

D

debabin