useCoinbaseWallet

Hook that prompts users to connect their Coinbase Wallet to your dApp.

import { useCoinbaseWallet } from "@thirdweb-dev/react";

The coinbaseWallet also needs to be added in ThirdwebProvider's supportedWallets if you want the wallet to auto-connect on next page load.

Usage

Call the function returned by the useCoinbaseWallet hook to prompt the user to connect their Coinbase wallet to your dApp.

You can then use the useAddress hook to get the user's address.

import { useCoinbaseWallet } from "@thirdweb-dev/react";

function App() {
  const connectWithCoinbase = useCoinbaseWallet();

  return (
    <button onClick={() => connectWithCoinbase()}>Connect Coinbase</button>
  );
}

Configuration

chainId

To connect to a specific chain when connecting the wallet, pass the chainId in a configuration object as shown below.

This will prompt the user to switch to the given network after they connect.

import { useCoinbaseWallet } from "@thirdweb-dev/react";
import { Dogechain } from "@thirdweb-dev/chains";

function App() {
  const connectWithCoinbase = useCoinbaseWallet();

  return (
    <button
      onClick={() =>
        connectWithCoinbase({
          chainId: Dogechain.chainId,
        })
      }
    >
      Connect Coinbase
    </button>
  );
}

If the chain is not configured in the user’s wallet, you must add this chain in ThirdwebProvider’s supportedChains prop:

import { ThirdwebProvider } from "@thirdweb-dev/react";
import { Dogechain } from "@thirdweb-dev/chains";

export function YourApp() {
  return (
    <ThirdwebProvider
      supportedChains={[Dogechain]}
      clientId="your-client-id"
    >
      <App />
    </ThirdwebProvider>
  );
}