Skip to content

useAddPasskey

The useAddPasskey hook adds a new passkey to a user's Embedded Account.

WARNING

This requires your user to be logged in. See useAuthenticate for more details.

Import

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

Usage

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

export function ComponentWithAddPasskey() {
  /**
   * Assumes the app has context of a signer with an authenticated user
   * by using the `AlchemyAccountProvider` from `@alchemy/aa-alchemy/react`.
   */
  const addPasskey = useAddPasskey({
    onSuccess: (authenticatorIds) => {
      // [optional] Do something with the authenticatorIds
    },
    onError: (error) => {
      // [optional] Do something with the error
    },
    // [optional] ...additional mutationArgs
  });

  return (
    <div>
      <button onClick={() => addPasskey}>Add Passkey</button>
    </div>
  );
}

Params

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

Return Type

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

Returns an object containing the following state.

addPasskey

UseMutateFunction A React query mutation function that returns a string[] list of all passkey authenticatorIds, including the newly added one. It takes in CredentialCreationOptions.

isAddingPasskey

boolean A flag that determines whether the mutation is still running or not.

error

Error | null A field that relays any errors from the mutation. It is null if there is no error.