The React SDK gave you useSwitchNetwork() and, when a wallet couldn’t switch programmatically, automatically opened a “switch in your wallet” modal. It also exposed the configured networks through a hook. The JavaScript SDK exposes the same data and actions as functions (and matching React hooks) and leaves the UI — including the manual-switch prompt — to you.
What maps to what
Reading the active network
getActiveNetworkData({ walletAccount }) returns { networkData } for the wallet’s current network (displayName, iconUrl, nativeCurrency, networkId), per the WalletAccount your app supplies. getNetworksData() returns every network enabled for your project. The React hook useGetActiveNetworkData refetches on the networkChanged event, so your UI stays correct even when the user switches networks from inside their wallet — the behavior the widget used to give you automatically.
Switching networks
useSwitchNetwork() becomes switchActiveNetwork({ networkId, walletAccount }) (or the useSwitchActiveNetwork() mutation). The one migration difference that matters: the React SDK silently opened a network-not-supported-manual modal when the wallet couldn’t switch on its own. The JavaScript SDK throws NetworkSwitchingUnavailableError instead, so you check isProgrammaticNetworkSwitchAvailable({ walletAccount }) first — call switchActiveNetwork() when it’s true, and render your own “switch in your wallet” prompt (showing the target network’s displayName) when it’s false, confirming the result with getActiveNetworkData().
Validate the network right before you send a transaction, not just on page load — a user can switch networks in their wallet at any time.
Building it
The picker, the validate-before-an-action guard, and error handling are the same build in any JavaScript SDK app, so they aren’t duplicated here. Network switching & validation (Building UI) walks through them end to end:
- Showing the active network — render the enabled networks from
getNetworksData(), mark the active one from getActiveNetworkData(), and re-read after each switch.
- Validating before an action — the “wrong network” guard that drives a programmatic or manual switch before letting a transaction proceed.
- Handling errors —
NetworkSwitchingUnavailableError, a rejected switch, an unconfigured target network, and undefined network data.
See also
