Callbacks

To any of Privy's custom login hooks, you can also pass a callback to execute arbitrary logic after login completes. For example, you may want to generate a wallet for a user after they successfully log in, since embedded wallets will not be automatically created on whitelabel login. You can pass that logic to the hook as an onComplete callback.

onComplete

If set, the behavior of onComplete depends on if the user is already authenticated or not when the component is mounted to the page. Specifically:

1. If the user is already authenticated when the component is mounted, the callback will execute immediately, as soon as the component mounts.
2. If the user is not authenticated when the component is mounted, the callback will execute only after the user completes a successful login attempt and becomes authenticated.

onError

If set, the onError callback will execute after a user initiates a login attempt and there is an error, or if the user exits the login flow prematurely. Within this callback, you may access an error code with more information about the error.

Example usage

See an example of using callbacks on custom login below.

import {useLoginWithOAuth, usePrivy} from '@privy-io/react-auth';

export default function LoginWithSocial() {
  const {createWallet} = usePrivy();
  const {initOAuth} = useLoginWithOAuth({
    onComplete: (user, isNewUser, wasAlreadyAuthenticated, loginMethod, linkedAccount) => {
      // Any logic you'd like to execute if the user is/becomes authenticated while this
      // component is mounted
      createWallet();
    },
  });

  const handleInitOAuth = async () => {
    try {
      await initOAuth({provider: 'google'});
    } catch (err) {
      console.error(err);
    }
  };

  return <button onClick={handleInitOAuth}>Log in with Google</button>;
}