Wallet hooks

Thin wrappers over wagmi’s wallet hooks, with the SDK’s chain-awareness and error normalization layered on top.

The page is split into two groups:

• Reads — useWalletAccount.
• Writes — useConnectWallet, useDisconnectWallet, useSwitchToSymmioChain. These are “actions” rather than TanStack mutations, but they still trigger side effects (wallet popups, chain switches) so the split applies.

Reads

useWalletAccount

Read the connected wallet’s state plus an isOnExpectedChain flag.

import { useWalletAccount } from "@symmio/trading-react";
 
const { address, chainId, isConnected, isReconnecting, isOnExpectedChain } = useWalletAccount();
 
if (!isConnected) return <ConnectButton />;
if (!isOnExpectedChain) return <SwitchNetworkPrompt />;
return <Dashboard address={address} />;

isOnExpectedChain is true iff the wallet’s chainId matches the SDK’s configured chain — saves you from manually comparing in every component.

Writes

useConnectWallet

import { useConnectWallet } from "@symmio/trading-react";
 
const { connectors, connect, status, error } = useConnectWallet();
 
return connectors.map((connector) => (
  <button key={connector.uid} onClick={() => connect(connector)} disabled={status === "pending"}>
    Connect {connector.name}
  </button>
));

connectors is whatever the host’s wagmi config registered (injected(), walletConnect(), mock(), …). The SDK does not pick connectors for you. Errors thrown from connect() are already normalized to SymmioRequestError.

useDisconnectWallet

const { disconnect } = useDisconnectWallet();
<button onClick={disconnect}>Disconnect</button>;

useSwitchToSymmioChain

Ask the wallet to switch to the chain configured in SymmioProvider. Convenience wrapper over wagmi’s useSwitchChain that pulls the target chain id from the SDK config.

const { isOnExpectedChain } = useWalletAccount();
const { switchChain, status } = useSwitchToSymmioChain();
 
if (!isOnExpectedChain) {
  return (
    <button onClick={switchChain} disabled={status === "pending"}>
      Switch to {/* chain name from config */} HyperEVM
    </button>
  );
}

Errors are normalized — error?.kind === "user-rejected" when the user dismisses the prompt.