Conectando e Desconectando
Gerencie state de conexão de wallet e seleção multi-wallet.
Receita
"use client";
import { useWallet } from "@solana/wallet-adapter-react";
const { connect, disconnect, connected, connecting, wallet, select } = useWallet();Quando usar:
- Botões connect, chips de conta e reset de sessão.
- Trocar wallets sem reload completo da página.
- Limpar state no logout.
Exemplo Funcional
"use client";
import { useCallback } from "react";
import { useWallet } from "@solana/wallet-adapter-react";
import { useWalletModal } from "@solana/wallet-adapter-react-ui";
export function WalletControls() {
const { connected, disconnect, wallet } = useWallet();
const { setVisible } = useWalletModal();
const handleConnect = useCallback(() => setVisible(true), [setVisible]);
if (!connected) {
return <button onClick={handleConnect}>Select wallet</button>;
}
return (
<div>
<span>{wallet?.adapter.name}</span>
<button onClick={() => disconnect()}>Disconnect</button>
</div>
);
}O que isso demonstra:
- Modal trata seleção multi-wallet.
disconnectlimpa sessão do adapter.- Mostre nome do adapter para debug de suporte.
Aprofundamento
Como Funciona
- Connect negocia com adapter selecionado via Wallet Standard.
- State propaga através de context React.
- Disconnect deve limpar caches do app keyed por pubkey.
- Reconnect pode reusar adapter anterior quando autoConnect habilitado.
Erros Comuns
- Pubkey obsoleta em state global após disconnect - dados de usuário errados. Correção: reset stores no disconnect.
- connect() sem modal com múltiplas wallets - adapter ambíguo. Correção: sempre mostre picker.
- Ignorar flag connecting - erros de double-click. Correção: desabilite botão enquanto connecting.
- Deep link mobile não retornando - connecting preso. Correção: timeout + copy de retry.
- Assumir connect = permissão de sign - cada tx ainda precisa aprovação.
Alternativas
| Alternativa | Use Quando | Não Use Quando |
|---|---|---|
| Embedded wallet (Phantom embedded) | Onboarding consumer | Posicionamento self-custody total |
| SIWS + sessão server | Login estilo Web2 | Apenas auth totalmente on-chain |
FAQs
Devnet ou mainnet?
Corresponda RPC URL, rede da wallet e program IDs a um cluster.
kit vs web3.js?
Use @solana/kit 7.0.0 para código frontend novo.
Testes?
Surfpool 0.12.0 ou devnet com SOL de faucet.
Nível de commitment?
confirmed para UX; finalized para reads de alto valor.
Next.js App Router?
Providers em layout client; reads podem ser server-side.
Wallet rejeitou sign?
Mostre retry; nunca assuma aprovação.
Priority fees?
Instructions compute budget em mainnet congestionada.
Mobile?
Use Mobile Wallet Adapter para apps React Native.
Segurança?
Nunca exponha keypairs de servidor ao browser.
Mudanças de IDL?
Regenere clients tipados em CI.
Relacionado
- Autoconnect e UX de Sessão - sessões persistentes
- Wallet Adapter - setup de provider
- Assinando Transações e Mensagens - após connect
Versões do stack: Esta página foi escrita para Agave 4.1.1, Solana CLI 3.0.10, Anchor 0.32.1, anchor-lang 0.32.1, Rust 1.91.1, @solana/kit 7.0.0, Surfpool 0.12.0 e LiteSVM 0.6.x.