Skip to main content

​
Import

import { useWallets } from '@0xsequence/connect'

​
Features

This hook provides a unified interface for managing connected wallets. The user is prompted to sign a transaction with their active wallet in order to link wallets, enabling read-only functionality. Key features:
  • Get information about all connected wallets
  • Set a specific wallet as active
  • Disconnect wallets
  • View linked wallets for embedded wallets
  • Refresh the list of linked wallets
For embedded wallets (Wallet-as-a-Service), the hook automatically fetches linked wallets if available. Linked wallets are additional wallets that have been connected to the primary embedded wallet.

​
Usage

import { useWallets } from '@0xsequence/connect'

function App() {
  const {
    wallets,
    linkedWallets,
    setActiveWallet,
    disconnectWallet,
    refetchLinkedWallets
  } = useWallets()

  return (
    <div>
      <h2>Connected Wallets</h2>
      <div>
        {wallets.map(wallet => (
          <div key={wallet.address}>
            <span>
              {wallet.name}: {wallet.address.slice(0, 6)}...{wallet.address.slice(-4)}
            </span>
            {wallet.isActive ? ' (Active)' : ''}
            {wallet.isEmbedded ? ' (Embedded)' : ''}
            <button onClick={() => setActiveWallet(wallet.address)}>
              Set Active
            </button>
            <button onClick={() => disconnectWallet(wallet.address)}>
              Disconnect
            </button>
          </div>
        ))}
      </div>

      {linkedWallets && linkedWallets.length > 0 && (
        <>
          <h2>Linked Wallets</h2>
          <button onClick={refetchLinkedWallets}>Refresh</button>
          <div>
            {linkedWallets.map(linkedWallet => (
              <div key={linkedWallet.walletAddress}>
                {linkedWallet.walletAddress.slice(0, 6)}...{linkedWallet.walletAddress.slice(-4)}
              </div>
            ))}
          </div>
        </>
      )}
    </div>
  )
}

​
Return Type: UseWalletsReturnType

interface UseWalletsReturnType {
  wallets: ConnectedWallet[]
  linkedWallets: LinkedWallet[] | undefined
  setActiveWallet: (address: string) => Promise<void>
  disconnectWallet: (address: string) => Promise<void>
  refetchLinkedWallets: () => Promise<void>
}

​
Properties

​
wallets

ConnectedWallet[] Array of all connected wallets. 
interface ConnectedWallet {
  id: string        // Unique identifier for the wallet (connector id)
  name: string      // Display name of the wallet
  address: string   // The wallet's Ethereum address
  isActive: boolean // Whether this wallet is currently active
  isEmbedded: boolean // Whether this is an embedded wallet (WaaS)
  signInMethod: string // Login method for this wallet
}

​
linkedWallets

LinkedWallet[] | undefined Array of linked wallets for the active embedded wallet, if any. Only available when using a WaaS wallet. 
interface LinkedWallet {
  id: number;
  walletType?: string;
  walletAddress: string;
  linkedWalletAddress: string;
  createdAt?: string;
}

​
setActiveWallet

(address: string) => Promise<void> Sets a wallet as active by its Ethereum address.

​
disconnectWallet

(address: string) => Promise<void> Disconnects a wallet by its Ethereum address.

​
refetchLinkedWallets

() => Promise<void> Refreshes the list of linked wallets. Useful after linking a new wallet.