useSendOTP

Import

import { useSendOTP } from '@zerodev/wallet-react'

Usage

import { useState } from 'react'
import { useSendOTP } from '@zerodev/wallet-react'
 
function SendCode() {
  const [email, setEmail] = useState('')
  const sendOTP = useSendOTP()
 
  return (
    <div>
      <input
        type="email"
        value={email}
        onChange={(e) => setEmail(e.target.value)}
        placeholder="Enter your email"
      />
      <button
        onClick={async () => {
          const result = await sendOTP.mutateAsync({ email })
          // Pass result.otpId and result.otpEncryptionTargetBundle to useVerifyOTP
        }}
        disabled={sendOTP.isPending || !email}
      >
        {sendOTP.isPending ? 'Sending...' : 'Send Code'}
      </button>
    </div>
  )
}

Mutation Parameters

email

string

Required. The email address to send the verification code to.

connector

Connector | undefined

Optional Wagmi connector to send the OTP with. If omitted, the hook uses the configured ZeroDev connector.

Return Types

TanStack Query mutation docs

mutate

(variables: { email: string; connector?: Connector }) => void

The mutation function to send the OTP.

mutateAsync

(variables: { email: string; connector?: Connector }) => Promise<{ otpId: string; otpEncryptionTargetBundle: string }>

Similar to mutate but returns a promise.

data

{ otpId: string; otpEncryptionTargetBundle: string } | undefined

• Defaults to undefined
• The data returned from the mutation on success.

otpId

string

The identifier for this OTP verification attempt. Pass this to useVerifyOTP to complete authentication.

otpEncryptionTargetBundle

string

The encryption target bundle for this OTP verification. Store this value with otpId and pass both to useVerifyOTP.

error

Error | null

The error object for the mutation, if an error was encountered.

isError / isIdle / isPending / isSuccess

boolean

Boolean variables derived from status.

isPaused

boolean

• will be true if the mutation has been paused.
• see Network Mode for more information.

status

'idle' | 'pending' | 'error' | 'success'

• 'idle' initial status prior to the mutation function executing.
• 'pending' if the mutation is currently executing.
• 'error' if the last mutation attempt resulted in an error.
• 'success' if the last mutation attempt was successful.

reset

() => void

A function to clean the mutation internal state (e.g. it resets the mutation to its initial state).