.jpeg%3Falt%3Dmedia%26token%3Dd72ce4e1-1184-4295-8899-47a80e09863b)
.jpeg%3Falt%3Dmedia%26token%3Dd72ce4e1-1184-4295-8899-47a80e09863b)
📖
Overview
Open up multiple login options for your users with our connectors
0xPass provides native authentication support for users with wallets and spins up embedded wallets using Magic and other providers for users without wallets. Even better, all of this requires minimal dev effort!
This way, you can open your dapp up to both users with and without wallets.
import {
arbitrum,
mainnet,
optimism,
polygon,
goerli
} from "wagmi/chains"
import {alchemyProvider} from "wagmi/providers/alchemy"
import {publicProvider} from "wagmi/providers/public"
import {
emailMagicWallet,
googleMagicWallet,
ledgerWallet,
metaMaskWallet
} from "0xpass/wallets"
b) Import wagmi and 0xPass configs
import { WagmiConfig, configureChains, createConfig } from "wagmi"
import { PassProvider, connectorsForWallets, createClient } from "0xpass"
c) Configure chains and client for your root component
const {chains, publicClient } = configureChains(
[ goerli,
mainnet,
optimism
], [
alchemyProvider({apiKey: "{{ALCHEMY_KEY_HERE}}",}),
publicProvider()
]
);
d) Configure list of wallets you want to enable for your app.
const connectors = connectorsForWallets([
{
groupName: "Social",
wallets: [
emailMagicWallet({magicApiKey, chains}),
googleMagicWallet({magicApiKey, chains})
]
}, {
groupName: "Others",
wallets: [
metaMaskWallet({projectId, chains}),
ledgerWallet({projectId, chains})
]
}
])
const passClient = createClient({apiKey: apiKey, chains,});
e) Initialize WAGMI config
const wagmiConfig = createConfig({
autoConnect: true,
connectors,
publicClient
})