useAuthenticateOAuthWithExpoWebBrowser

The React Native counterpart of useAuthenticateOAuth. Instead of the web popup flow, it opens the system auth browser via expo-web-browser and completes the flow when the OAuth redirect deep-links back into the app — whichever arrives first, the browser result or the deep link.

Requires the expo-web-browser and expo-linking peer dependencies. See Google OAuth on React Native for the full setup, including the callback route and Dashboard allowlisting.

Import

import { useAuthenticateOAuthWithExpoWebBrowser } from "@zerodev/wallet-react/react-native/oauth/with-expo-web-browser";

Usage

import { OAUTH_PROVIDERS } from "@zerodev/wallet-react";
import { useAuthenticateOAuthWithExpoWebBrowser } from "@zerodev/wallet-react/react-native/oauth/with-expo-web-browser";
import * as Linking from "expo-linking";
import { Button } from "react-native";
import { useAccount } from "wagmi";
 
function OAuthLogin() {
  const auth = useAuthenticateOAuthWithExpoWebBrowser({
    redirectUri: Linking.createURL("oauth-callback"),
  });
  const { isConnected } = useAccount();
 
  if (isConnected) return null;
 
  return (
    <Button
      title={auth.isPending ? "Signing in..." : "Sign in with Google"}
      disabled={auth.isPending}
      onPress={() => auth.mutate({ provider: OAUTH_PROVIDERS.GOOGLE })}
    />
  );
}

Parameters

redirectUri

string

Required. The URI the OAuth flow redirects back to after sign-in. Either a custom-scheme deep link (e.g. Linking.createURL('oauth-callback')) or a verified https link on your domain (e.g. https://<your domain>/oauth-callback — delivered as an App Link on Android and via the auth session's https callback on iOS 17.4+). The URL must be allowlisted on the ZeroDev Dashboard, and your app must have a route that catches it.

Mutation Parameters

provider

OAuthProvider

Required. The OAuth provider to authenticate with, passed to mutate/mutateAsync. Use the OAUTH_PROVIDERS constant:

• OAUTH_PROVIDERS.GOOGLE — Google OAuth

Return Types

TanStack Query mutation docs

mutate

(variables: { provider: OAuthProvider }) => void

The mutation function to start the OAuth flow. Opens the system auth browser for the user to sign in.

mutateAsync

(variables: { provider: OAuthProvider }) => Promise<void>

Similar to mutate but returns a promise. Resolves when the OAuth flow completes and the wallet is connected.

data

void

This mutation does not return data. On success, the Wagmi connector is connected and the account is available via useAccount.

error

Error | null

The error object for the mutation, if an error was encountered.

isError / isIdle / isPending / isSuccess

boolean

Boolean variables derived from status.

isPaused

boolean

• will be true if the mutation has been paused.
• see Network Mode for more information.

status

'idle' | 'pending' | 'error' | 'success'

• 'idle' initial status prior to the mutation function executing.
• 'pending' if the mutation is currently executing.
• 'error' if the last mutation attempt resulted in an error.
• 'success' if the last mutation attempt was successful.

reset

() => void

A function to clean the mutation internal state (e.g. it resets the mutation to its initial state).