useResetPassword

Overview

useResetPassword wraps auth.resetPassword({ token, password }) with loading, success, and error helpers.

Signature

export function useResetPassword()

Parameters

This hook takes no parameters.

Returns

Field	Type	Description
`resetPassword`	`(input: { token: string; password: string }) => Promise<unknown>`	Submits the new password with the reset token.
`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 reset request runs.
`isSuccess`	`boolean`	True after a successful reset.
`reset`	`() => void`	Clears hook state.

Example

"use client"

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

export function FinishReset({ token }: { token: string }) {
  const { resetPassword, isLoading, error } = useResetPassword()

  async function onSubmit(password: string) {
    await resetPassword({ token, password })
  }

  return (
    <form
      onSubmit={(e) => {
        e.preventDefault()
        const fd = new FormData(e.currentTarget)
        void onSubmit(String(fd.get("password") ?? ""))
      }}
    >
      <input name="password" type="password" required minLength={8} />
      {error ? <p>{error}</p> : null}
      <button type="submit" disabled={isLoading}>
        {isLoading ? "Updating…" : "Update password"}
      </button>
    </form>
  )
}

How it works

Uses useSimpleAuthClient() and normalizes failures into error.

Shipped by

npx @simpleauthjs/react add reset-password

Source

components/simpleauth/hooks/use-reset-password.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 reset password."
}

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

  async function resetPassword(input: { token: string; password: string }) {
    setIsLoading(true)
    setError(null)

    try {
      const response = await auth.resetPassword(input)
      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 {
    resetPassword,
    data,
    error,
    isError: Boolean(error),
    isLoading,
    isSuccess: Boolean(data?.success),
    reset,
  }
}

useResetPassword

On this page