Skip to main content

usePaperWallet

Hook that prompts users to connect Paper Wallet to your app which allows users to connect to your app using their email address

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

Usage

Call the function returned by the usePaperWallet hook to prompt the user to connect Paper wallet to your app.

once connected, you can use the useAddress hook to get the user's address and usePaperWalletUserEmail hook to get the user's email address.

Paper SDK requires a clientId for instantiation. You can create a clientId for your app on paper.xyz

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

function App() {
const connectWithPaperWallet = usePaperWallet();

return (
<button
onClick={() =>
connectWithPaperWallet({
clientId: "<YOUR_CLIENT_ID>",
})
}
>
Connect with Paper Wallet
</button>
);
}

Configuration

chainId

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

Paper Wallet only supports 5 chains at the moment: Ethereum (1), Polygon (137), Avalanche(43114) , Goerli (5) and Mumbai (80001). If no chainId is specified, Ethereum (1) is used by default.

chainId: 1 | 137 | 43114 | 5 | 80001;
import { usePaperWallet } from "@thirdweb-dev/react";
import { Polygon } from "@thirdweb-dev/chains";

function App() {
const connectWithPaperWallet = usePaperWallet();

return (
<button
onClick={() =>
connectWithPaperWallet({
clientId: "<YOUR_CLIENT_ID>",
chainId: Polygon.chainId,
})
}
>
Connect Wallet
</button>
);
}

You must add this chain in ThirdwebProviders supportedChains prop as shown below

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

export function YourApp() {
return (
<ThirdwebProvider supportedChains={[Polygon]}>
<App />
</ThirdwebProvider>
);
}