useSendVerificationEmail

Overview

useSendVerificationEmail wraps auth.sendVerificationEmail({ email }) with the same loading / error / success pattern as other mutation hooks.

Signature

export function useSendVerificationEmail()

Parameters

This hook takes no parameters.

Returns

Field	Type	Description
`sendVerificationEmail`	`(email: string) => Promise<unknown>`	Sends the verification email to the trimmed address.
`data`	`unknown`	Last successful response when present.
`error`	`string \| null`	Human-readable error when the request fails.
`isError`	`boolean`	Convenience flag from `error`.
`isLoading`	`boolean`	True while the request runs.
`isSuccess`	`boolean`	True after a successful send.
`reset`	`() => void`	Clears hook state.

Example

"use client"

import { useSendVerificationEmail } from "@/components/simpleauth"

export function ResendVerification() {
  const { sendVerificationEmail, isLoading, error } = useSendVerificationEmail()

  return (
    <button
      type="button"
      disabled={isLoading}
      onClick={() => sendVerificationEmail("user@example.com")}
    >
      {isLoading ? "Sending…" : "Resend verification email"}
      {error ? <span>{error}</span> : null}
    </button>
  )
}

How it works

Uses useSimpleAuthClient() and maps failures into error.

Shipped by

npx @simpleauthjs/react add verify-email

Source

components/simpleauth/hooks/use-send-verification-email.ts

"use client"

import { useState } from "react"
import { SimpleAuthError, type SuccessResponse } from "@simpleauthjs/core"
import { useSimpleAuthClient } from "../provider"

function getErrorMessage(error: unknown) {
  if (error instanceof SimpleAuthError) {
    return error.message
  }

  if (error instanceof Error) {
    return error.message
  }

  return "Unable to send verification email."
}

export function useSendVerificationEmail() {
  const auth = useSimpleAuthClient()
  const [isLoading, setIsLoading] = useState(false)
  const [error, setError] = useState<string | null>(null)
  const [data, setData] = useState<SuccessResponse | null>(null)

  async function sendVerificationEmail(email: string) {
    setIsLoading(true)
    setError(null)

    try {
      const response = await auth.sendVerificationEmail({ email: email.trim() })
      setData(response)
      return response
    } catch (requestError) {
      setData(null)
      setError(getErrorMessage(requestError))
      throw requestError
    } finally {
      setIsLoading(false)
    }
  }

  function reset() {
    setData(null)
    setError(null)
    setIsLoading(false)
  }

  return {
    sendVerificationEmail,
    data,
    error,
    isError: Boolean(error),
    isLoading,
    isSuccess: Boolean(data?.success),
    reset,
  }
}

useSendVerificationEmail

On this page