Connected wallets management

Show a user’s connected wallets, let them choose which one to act on, and remove wallets they no longer want.

Prerequisites

Before this page: create and initialize a Dynamic client (see Creating a Dynamic client, Initializing the Dynamic client), and let users connect external wallets. This page manages the wallets that are already connected.

What you’ll build

A wallet manager: a list of every wallet on the account, a way to choose which wallet your app acts on, and a way to remove a wallet. Your app decides which wallet is selected and keeps that choice in your own state — the SDK doesn’t track a “current” wallet for you.

Each wallet is a WalletAccount with an address, a walletProviderKey, a chain, and a verifiedCredentialId — non-null when the wallet’s ownership has been verified.

Listing wallets

getWalletAccounts returns every connected wallet. Your app keeps track of which one the user has selected and passes that wallet into the operations that act on it.

TypeScript

import {
  getWalletAccounts,
  removeWalletAccount,
  type WalletAccount,
} from '@dynamic-labs-sdk/client';

function renderWallets(
  container: HTMLElement,
  selectedId: string | undefined,
  onSelect: (wallet: WalletAccount) => void,
) {
  const wallets = getWalletAccounts();

  container.replaceChildren();
  for (const wallet of wallets) {
    const row = document.createElement('li');

    const label = wallet.verifiedCredentialId ? 'Verified' : 'Unverified';
    const selected = wallet.id === selectedId ? ' · Selected' : '';
    row.textContent = `${wallet.address} (${label}${selected}) `;

    if (wallet.id !== selectedId) {
      const select = document.createElement('button');
      select.textContent = 'Use this wallet';
      select.addEventListener('click', () => onSelect(wallet));
      row.append(select);
    }

    const remove = document.createElement('button');
    remove.textContent = 'Remove';
    remove.addEventListener('click', async () => {
      await removeWalletAccount({ walletAccount: wallet });
    });
    row.append(remove);

    container.append(row);
  }
}

React

import { type WalletAccount } from '@dynamic-labs-sdk/client';
import {
  useGetWalletAccounts,
  useRemoveWalletAccount,
} from '@dynamic-labs-sdk/react-hooks';

function WalletManager({
  selectedId,
  onSelect,
}: {
  selectedId: string | undefined;
  onSelect: (wallet: WalletAccount) => void;
}) {
  const { data: wallets = [] } = useGetWalletAccounts();
  const { mutateAsync: removeWallet } = useRemoveWalletAccount();

  return (
    <ul>
      {wallets.map((wallet) => (
        <li key={wallet.id}>
          <span>{wallet.address}</span>
          <span>{wallet.verifiedCredentialId ? 'Verified' : 'Unverified'}</span>
          {wallet.id === selectedId ? (
            <span>Selected</span>
          ) : (
            <button type="button" onClick={() => onSelect(wallet)}>
              Use this wallet
            </button>
          )}
          <button
            type="button"
            onClick={() => removeWallet({ walletAccount: wallet })}
          >
            Remove
          </button>
        </li>
      ))}
    </ul>
  );
}

useGetWalletAccounts re-renders whenever a wallet connects, verifies, or is removed, so the list stays current without manual refreshes.

An unverified wallet is connected but hasn’t proven ownership, so it isn’t a trusted credential. If you need it verified, run the verify step from Connecting external wallets.

Choosing which wallet to act on

The JS SDK doesn’t keep a “current” wallet. Your app decides which wallet it’s acting on, stores that choice in your own state, and passes that WalletAccount into balance, network, and transaction calls.

Keep the selection in one place — React state, a store, or context — and pass the selected WalletAccount down, rather than each component picking its own wallet. That keeps your balance, network, and transaction screens all acting on the same wallet.

Handling errors

Situation	What to do
Removing the selected wallet	After removal, update your selection (e.g. pick the first remaining wallet) or clear it so no screen acts on a removed wallet.
Removing the last wallet	Decide your app’s behavior — for a wallet-only login this may end the session; otherwise the user simply has no wallet connected.
removeWalletAccount rejects	Leave the wallet in the list and surface a retry; the account is unchanged.

See also

• Connecting external wallets — add wallets to the account
• Token balances & display — show balances for a wallet
• Transaction confirmation & simulation — send from the selected wallet