Auth React is powered by Wagmi, added during the Auth React installation. To access the connection capabilities to Wagmi’s default Ethereum wallets, Coinbase Wallet, MetaMask, WalletConnect, and the custom-built XRP wallet, Xaman, you must create and export a Wagmi configuration.

First, import createWagmiConfig from Wagmi.

Example:

import { createWagmiConfig } from '@futureverse/auth-react/wagmi';

Create and export the configuration for Wagmi.

Example:

import { FutureverseAuthClient } from '@futureverse/auth-react/auth';
import { createWagmiConfig } from '@futureverse/auth-react/wagmi';

const clientId = '<your-futureverse-client-id>';
const walletConnectProjectId = '<your-wallet-connect-project-id>';
const xamanAPIKey = '<your-xaman-application->';

export const authClient = new FutureverseAuthClient({
  clientId,
  environment: 'production',
  redirectUri: '<your-app-redirect-endpoint>',
});

export const getWagmiConfig = async () => {
  return createWagmiConfig({
    walletConnectProjectId,
    xamanAPIKey,
    authClient,
    // Optional if supporting SSR
    ssr: true,
    // Optional chains you wish to support
    chains: [mainnet, sepolia, polygonAmoy],
    // Optional if supporting SSR
    storage: createStorage({
      storage: cookieStorage,
    }),
  });
};

Parameters:

  • walletConnectProjectId: Your WalletConnect project ID.
  • xamanAPIKey: Your application’s API key for the custom XRP wallet, Xaman.
  • ssr: Enables server-side rendering if necessary. (Optional)
  • chains: Specify which chains to support, e.g., mainnet, sepolia, polygonAmoy. (Optional)
  • storage: Configure storage for SSR using cookieStorage. (Optional)

Was this page helpful?