Wallet Adapters

How ChainPortal SDK abstracts wallet connections across 6 blockchain ecosystems.

Overview

The SDK includes 7 wallet adapters that provide a unified interface for interacting with different blockchain wallets. Each adapter translates SDK operations into ecosystem-specific wallet calls.

Adapter Architecture

Your dApp
  └── @chainportal/sdk hooks
       └── Wallet Adapters
            ├── EVM Adapter (wagmi/viem)
            ├── Solana Adapter (@solana/wallet-adapter)
            ├── Cosmos Adapter (@cosmjs)
            ├── Aptos Adapter (@aptos-labs/wallet-adapter)
            ├── SUI Adapter (@mysten/dapp-kit)
            ├── NEAR Adapter (@near-wallet-selector)
            └── types.ts (shared interface)

Setup Steps

Install provider packages

Add the wallet provider packages for each ecosystem you want to support (wagmi, @solana/wallet-adapter-react, etc.).

Wrap your app in providers

Add each ecosystem's provider to your root layout. Non-EVM providers must always be present — they cannot be conditionally rendered.

Create the adapter

Inside a component, call createEVMAdapter() or the equivalent for your ecosystem, passing the connected wallet client.

Pass to SDK hooks

The SDK hooks automatically detect the active adapter from context — no manual wiring needed.

Creating an Adapter

import { createEVMAdapter } from '@chainportal/sdk';
 
// The EVM adapter wraps wagmi's hooks
const evmAdapter = createEVMAdapter({
  publicClient,   // from wagmi's usePublicClient()
  walletClient,   // from wagmi's useWalletClient()
  chainId,        // current chain ID
});

Adapter Interface

All adapters implement this shared interface:

interface ChainAdapter {
  // Read operations
  readContract(params: ReadParams): Promise<unknown>;
 
  // Write operations
  writeContract(params: WriteParams): Promise<string>; // returns tx hash
 
  // Wait for transaction confirmation
  waitForTransaction(hash: string): Promise<TransactionReceipt>;
 
  // Get connected address
  getAddress(): string;
 
  // Get chain info
  getChainId(): number | string;
}

Provider Setup

Each ecosystem needs its own provider wrapping your app:

// In your app's root layout
import { WagmiProvider } from 'wagmi';
import { SolanaWalletProvider } from '@solana/wallet-adapter-react';
import { ChainProvider as CosmosProvider } from '@cosmos-kit/react';
import { AptosWalletProvider } from '@aptos-labs/wallet-adapter-react';
import { SuiClientProvider } from '@mysten/dapp-kit';
 
export function Providers({ children }) {
  return (
    <WagmiProvider config={wagmiConfig}>
      <SolanaWalletProvider wallets={solanaWallets}>
        <CosmosProvider chains={cosmosChains}>
          <AptosWalletProvider plugins={aptosWallets}>
            <SuiClientProvider networks={suiNetworks}>
              {children}
            </SuiClientProvider>
          </AptosWalletProvider>
        </CosmosProvider>
      </SolanaWalletProvider>
    </WagmiProvider>
  );
}

Important: Non-EVM providers (Aptos, Cosmos, SUI, Solana) must ALWAYS wrap children -- they cannot be conditionally rendered. Pages using their hooks crash during Next.js SSG prerendering if providers are missing.