A wallet configurator for Smart Wallet which allows integrating the wallet with React Native

import { smartWallet, metamaskWallet } from "@thirdweb-dev/react-native";

const walletConfig = metamaskWallet(); // or use any other wallet

const smartWalletConfig = smartWallet(walletConfig, {
  factoryAddress: "0x...",
  gasless: true,
});

To allow users to connect to this wallet using the ConnectWallet component, you can add it to ThirdwebProvider's supportedWallets prop.

import {
  smartWallet,
  metamaskWallet,
  walletConnect,
} from "@thirdweb-dev/react-native";

const config = {
  factoryAddress: "0x...",
  gasless: true,
}

<ThirdwebProvider
  supportedWallets={[
    smartWallet(metamaskWallet(), config),
    smartWallet(walletConnect(), config),
  ]}
  clientId="your-client-id"
>
  <YourApp />
</ThirdwebProvider>;

you can use the useSmartWallet hook to programmatically connect to the smart wallet without using the ConnectWallet component.

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

import { useSmartWallet, metamaskWallet } from "@thirdweb-dev/react-native";

function Example() {
  // here we're using metamask as the personal wallet
  // can be any other wallet, including localWallet(), embeddedWallet(), etc
  const { connect } = useSmartWallet(metamaskWallet(), {
    factoryAddress: "your-factory-address",
    gasless: true,
  });

  return (
    <button
      onClick={async () => {
        const smartWallet = await connect();
        console.log(
          "connected to smart wallet",
          await smartWallet.getAddress(),
        );
      }}
    >
      Connect
    </button>
  );
}