useWallets

type Request = {
  hook: 'useWallets',
  params: [options?: UseWalletsOptions]
}
 
type UseWalletsOptions = {
  onSuccess?: (data: SetActiveWalletResult | CreateWalletResult) => void
  onError?: (error: OpenfortError) => void
  onSettled?: (data: SetActiveWalletResult | CreateWalletResult | undefined | null, error: OpenfortError | null) => void
  throwOnError?: boolean
}
 
type OpenfortError = {
  message: string
  type: OpenfortErrorType
  data: { [key: string]: any }
  name: string
}
 
enum OpenfortErrorType {
  AUTHENTICATION_ERROR = "AUTHENTICATION_ERROR",
  WALLET_ERROR = "WALLET_ERROR",
  CONFIGURATION_ERROR = "CONFIGURATION_ERROR",
  VALIDATION_ERROR = "VALIDATION_ERROR",
}

type Response = UseWalletsReturn
 
type UseWalletsReturn = WalletFlowFlags & {
  isLoadingWallets: boolean
  wallets: UserWallet[]
  availableWallets: AvailableWallet[]
  activeWallet?: UserWallet
  reset(): void
  setActiveWallet(options: SetActiveWalletOptions | string): Promise<SetActiveWalletResult>
  createWallet(options?: CreateWalletOptions): Promise<CreateWalletResult>
  setRecovery(options: SetRecoveryOptions): Promise<SetActiveWalletResult>
  exportPrivateKey(): Promise<string>
}
 
type WalletFlowFlags = {
  error?: OpenfortError
  isError: boolean
  isSuccess: boolean
  isCreating: boolean
  isConnecting: boolean
}
 
type UserWallet = {
  address: `0x${string}`
  connectorType?: string
  walletClientType?: string
  connector?: Connector
  id: string
  isAvailable: boolean
  isActive?: boolean
  isConnecting?: boolean
  recoveryMethod?: RecoveryMethod
  accountId?: string
  accountType?: AccountTypeEnum
  ownerAddress?: `0x${string}`
  implementationType?: string
  createdAt?: number
  salt?: string
}
 
type AvailableWallet = {
  id: string
  connector: Connector
  name: string
  icon: any // React.ReactNode
  iconShape: 'circle' | 'square' | 'squircle' | string
  isInstalled?: boolean
  shortName?: string
  iconConnector?: any // React.ReactNode
  [key: string]: unknown
}
 
type WalletRecovery = {
  recoveryMethod: RecoveryMethod
  password?: string
}
 
type SetActiveWalletResult = {
  error?: OpenfortError
  wallet?: UserWallet
}
 
type SetActiveWalletOptions = {
  walletId: string | Connector
  recovery?: WalletRecovery
  address?: `0x${string}`
  showUI?: boolean
  onSuccess?: (data: SetActiveWalletResult) => void
  onError?: (error: OpenfortError) => void
  onSettled?: (data: SetActiveWalletResult | undefined | null, error: OpenfortError | null) => void
  throwOnError?: boolean
}
 
type CreateWalletResult = SetActiveWalletResult
 
type CreateWalletOptions = {
  recovery?: WalletRecovery
  accountType?: AccountTypeEnum
  onSuccess?: (data: CreateWalletResult) => void
  onError?: (error: OpenfortError) => void
  onSettled?: (data: CreateWalletResult | undefined | null, error: OpenfortError | null) => void
  throwOnError?: boolean
}
 
type SetRecoveryOptions = {
  previousRecovery: RecoveryParams
  newRecovery: RecoveryParams
  onSuccess?: (data: CreateWalletResult) => void
  onError?: (error: OpenfortError) => void
  onSettled?: (data: CreateWalletResult | undefined | null, error: OpenfortError | null) => void
  throwOnError?: boolean
}
 
type RecoveryParams = {
  recoveryMethod: RecoveryMethod.AUTOMATIC
  encryptionSession: string
} | {
  recoveryMethod: RecoveryMethod.PASSWORD
  password: string
} | {
  recoveryMethod: RecoveryMethod.PASSKEY
  passkeyInfo?: {
    passkeyId: string
  }
}
 
type Connector = {
  id: string
  name: string
  type: string
  // Connector type from wagmi - includes chain management, account handling, etc.
}
 
enum RecoveryMethod {
  AUTOMATIC = "automatic",
  PASSWORD = "password",
  PASSKEY = "passkey",
}
 
enum AccountTypeEnum {
  SMART_ACCOUNT = "Smart Account",
  EOA = "Externally Owned Account",
}

import { embeddedWalletId, useWallets } from "@openfort/react"
 
function WalletSelector() {
  const {
    wallets,
    availableWallets,
    activeWallet,
    setActiveWallet,
    createWallet,
    setRecovery,
    exportPrivateKey,
    isCreating,
    isConnecting,
    isError,
    error,
  } = useWallets({
    onSuccess: () => {},
    onError: () => {},
    onSettled: () => {},
    throwOnError: true
  })
 
  const connectEmbedded = async () => {
    await setActiveWallet({ walletId: embeddedWalletId, showUI: true })
  }
 
  const connectExternal = async (id: string) => {
    await setActiveWallet(id)
  }
 
  return (
    <WalletList
      wallets={wallets}
      activeWallet={activeWallet}
      availableWallets={availableWallets}
      createWallet={createWallet}
      connectEmbedded={connectEmbedded}
      connectExternal={connectExternal}
      setRecovery={setRecovery}
      exportPrivateKey={exportPrivateKey}
      isBusy={isCreating || isConnecting}
      error={isError ? error : undefined}
    />
  )
}