Skip to content

useExportAccount

The useExportAccount hook exports the user's Embedded Account's recovery details to be viewable on the application.

WARNING

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

Import

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

Usage

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

export function ComponentWithExportAccount() {
  /**
   * Assumes the app has context of a signer with an authenticated user
   * by using the `AlchemyAccountProvider` from `@alchemy/aa-alchemy/react`.
   */
  const { exportAccount, isExported, isExporting, ExportAccountComponent } =
    useExportAccount({
      onSuccess: (hasSuccessfullyExported) => {
        // [optional] Do something after the account credentials have been exported
      },
      onError: (error) => {
        // [optional] Do something with the error
      },
      // [optional] ...additional mutationArgs
    });

  return (
    <div>
      {!isExported ? (
        <button onClick={() => exportAccount()} disabled={isExporting}>
          Export Account
        </button>
      ) : (
        <strong>Seed Phrase</strong>
      )}
      <ExportAccountComponent className="w-full" isExported={isExported} />
    </div>
  );
}

Params

An object containing the following fields.

params

An optional config object containing iframeContainerId as the container ID for the iframe that reveals the account's recovery details, and an [optional] iframeElementIdas the element ID for the iframe that reveals the account's recovery details. Defaults to turnkey-export-iframe.

If params is not passed in, the default iframe config will just have an iframeContainerId that defaults to alchemy-signer-iframe-container.

...mutationArgs

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

Return Type

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

Returns an object containing the following state.

exportAccount

UseMutateFunction A React query mutation function to export the user's account recovery details. It returns a boolean to flag whether or not the account's private key or recovery phrase was correctly exported.

isExported

boolean A flag that determines whether the account recovery details were successfully exported and now viewable in the application.

ExportAccountComponent

JSX.Element A React component you can use to render the exported account recovery details in an iFrame. It takes in props to determine the the styling of the iframee and parent element, and a boolean flag to show the details if they successfully rendered using the mutation function above.

isExporting

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.