Skip to content

useAuthenticate

The useAuthenticate hook is used to authenticate your user and initialize the AlchemySigner provided by the AlchemyAccountContext. If your user is not already logged in, then you must use this hook before any other hook will work.

Import

ts
import { useAuthenticate } from "@alchemy/aa-alchemy/react";

Usage

tsx
import { useAuthenticate } from "@alchemy/aa-alchemy/react";
import { useState } from "react";

export function Login() {
  const [email, setEmail] = useState("");
  const { authenticate, isPending } = useAuthenticate({
    onSuccess: (user) => {
      // [optional] Do something with the user info
    },
    onError: (error) => {
      // [optional] Do something with the error
    },
  });

  return (
    <div>
      <input
        placeholder="enter your email..."
        value={email}
        onChange={(e) => setEmail(e.target.value)}
      ></input>
      <button
        onClick={() =>
          authenticate({
            type: "email",
            email,
          })
        }
        disabled={isPending}
      >
        {isPending ? "Loading..." : "Login"}
      </button>
    </div>
  );
}

Params

You can optionally specify any of the React Query useMutation parameters as parameters to this hook.

Return Type

ts
import { type UseAuthenticateResult } from "@alchemy/aa-alchemy/react";

authenticate

A function that you can call to authenticate your user.

isPending

A boolean that is true when the authentication is in progress.

error

an error object that is populated when the authentication fails.