Connect 4337
Cometh ConnectCometh MarketplaceCometh Checkout
  • 🚀Quick start
    • What is Connect 4337
    • Getting started
    • Supported Networks
  • 🛠️CORE FEATURES
    • Create a Wallet
    • Send transactions
    • Go Gasless
    • Sign/Verify a message
    • Retrieve a wallet address
    • Handle owners
    • Import a safe into connect
  • 🥷ADVANCED
    • Session Keys
      • Tutorial
      • Policies
        • Sudo policy
        • Action policy
    • Social recovery
    • Add a passkey signer on a different OS
    • Capabilities
      • sendCalls
      • getCallsStatus
      • getCapabilities
      • grantPermissions
    • Other signers (Auth Providers)
      • EOA wallets (Metamask, Phantom...)
      • Magic signer
      • Web3Auth signer
      • Turnkey signer
      • Privy signer
  • 🔌Integrations
    • React hooks
      • ConnectProvider
      • useAccount
      • useConnect
      • useDisconnect
      • useGetGasPrice
      • useSendTransaction
      • useSignMessage
      • useVerifyMessage
      • useWriteContract
      • Handle owners
        • useRemoveOwner
        • useValidateAddDevice
        • useCreateNewSigner
        • useAddOwner
        • useGetOwners/EnrichedOwners
      • Session Keys
        • useGrantPermission
        • useSendPermission
        • useSessionKeyClient
        • useSessionKeySigner
      • Recovery
        • useIsRecoveryActive
        • useSetUpRecovery
        • useGetRecoveryRequest
        • useCancelRecoveryRequest
    • Mobile SDKs
      • IOS
      • Android
      • React Native
    • Wagmi
  • SDK Core
    • Signers (Auth Providers)
      • EOA wallets (Metamask, Phantom...)
      • Magic signer
      • Web3Auth signer
      • Turnkey signer
      • Privy signer
    • Handle owners
    • Capabilities
      • sendCalls
      • getCallsStatus
      • getCapabilities
  • SDK Session Keys
    • Setup Smart Account Client
    • Manage session keys
    • Policies
      • Sudo policy
      • Action policy
  • 📦Bundler
    • Bundler API
      • eth_sendUserOperation
      • eth_estimateUserOperationGas
      • eth_getUserOperationByHash
      • eth_getUserOperationReceipt
      • eth_supportedEntryPoints
  • 💳Paymaster
    • Paymaster API
  • 📖RESOURCES
    • Migrate from the connect legacy SDK
    • Connect Legacy SDKs (Unity, JS)
    • FAQ
Powered by GitBook
On this page
  • Install
  • Create a new wallet
  • Connect to an existing connect wallet
  • Advanced signer configuration
  1. CORE FEATURES

Create a Wallet

Onboard your user with a few lines of code

Install

npm i @cometh/connect-sdk-4337 @viem
yarn @cometh/connect-sdk-4337 @viem

Create a new wallet

import { createSafeSmartAccount, 
  createSmartAccountClient } from "@cometh/connect-sdk-4337";
import { http } from "viem"

const apiKey = process.env.COMETH_API_KEY;
const bundlerUrl = process.env.4337_BUNDLER_URL;
const publicClient = createPublicClient({
    chain,
    transport: http(),
    cacheTime: 60_000,
    batch: {
        multicall: { wait: 50 },
    },
});


const smartAccount = await createSafeSmartAccount({
    apiKey,
    publicClient,
    chain,
 });
 
const walletAddress = smartAccount.address

const smartAccountClient = createSmartAccountClient({
    account: smartAccount,
    chain,
    bundlerTransport: http(bundlerUrl),
})

You'll be prompted to create a passKey for your current domain. Depending on the user's device, the UX might be different.

Thanks to these credentials, your wallet address will be predicted and can already be used to receive funds.

However, note that at this point the wallet has not been created on-chain yet: the Safe is deployed on the first transaction of the wallet.

To get the address of the created wallet, you'll have to call:

const address = smartAccount.address

You must store the wallet address of your user. Not saving this address will prevent your user from accessing the wallet it in the future.

It is recommended to store the wallet address in your backend, linked to your user. For a quick demo or Proof of Concept (POC), you may use local storage.

Connect to an existing connect wallet

When you already have created your user's wallet through Cometh Connect, just pass the wallet address to the connect method in order to instantiate it.

import { createSafeSmartAccount, 
  createSmartAccountClient } from "@cometh/connect-sdk-4337";

const apiKey = process.env.COMETH_API_KEY;
const bundlerUrl = process.env.4337_BUNDLER_URL;
const publicClient = createPublicClient({
    chain,
    transport: http(),
    cacheTime: 60_000,
    batch: {
        multicall: { wait: 50 },
    },
});


const smartAccount = await createSafeSmartAccount({
    apiKey,
    publicClient,
    chain: arbitrumSepolia,
    smartAccountAddress: WALLET_ADDRESS,
 });
        

const smartAccountClient = createSmartAccountClient({
    account: smartAccount,
    chain,
    bundlerTransport: http(bundlerUrl)
})

Advanced signer configuration

When instantiating the sdk, you are able to configure some optional parameters:

  • disableEoaFallback: By default we provide a local wallet solution in the rare case of browser not fully supports platform authentication. You have the ability to disable that feature using this boolean.

  • passKeyName: Allows to name the webAuthn credential that you create through cometh connect.

  • sessionKeysEnabled: Allows to use sessionkeys for your project.

import { 
createSafeSmartAccount, 
createSmartAccountClient,
webAuthnOptions
} from "@cometh/connect-sdk-4337";

const publicClient = createPublicClient({
    chain,
    transport: http(),
    cacheTime: 60_000,
    batch: {
        multicall: { wait: 50 },
    },
});

const comethSignerConfig = {
// These are the default values we use
    webAuthnOptions: webAuthnOptions = {
    authenticatorSelection: {
      authenticatorAttachment:"platform",
      residentKey: "preferred",
      userVerification: "preferred",
    },
    }
    passKeyName: "Cometh Connect",
    disableEoaFallback: false
}

const sessionKeysEnabled = true
  
const smartAccount = await createSafeSmartAccount({
    apiKey,
    publicClient,
    chain,
    comethSignerConfig,
    sessionKeysEnabled
 });
        

const smartAccountClient = createSmartAccountClient({
    account: smartAccount,
    chain,
    bundlerTransport: http(bundlerUrl),
    publicClient,
})

PreviousSupported NetworksNextSend transactions

Last updated 3 months ago

webAuthnOptions: Allows you to customize your webAuthn credentials (, ...). By default we use , but you can customize it the way you like.

🛠️
authenticatorSelection
extensions
platform authentication