Step 2 of 4

Wallet integration

Connect wallets, sign messages, and interact with smart contracts using the CinaCoin SDK.

1. Install the SDK.

Start by installing the CinaCoin SDK in your project. It provides a unified interface for connecting to multiple wallets and chains.

Terminal

npm install @cinacoin/sdk

2. Initialize the client.

Create a CinaCoin client instance with your project configuration. You can get your project ID from the CinaCoin dashboard.

src/lib/cinacoin.ts

import { CinaCoin } from '@cinacoin/sdk';

export const cinacoin = new CinaCoin({
  projectId: process.env.NEXT_PUBLIC_CINACOIN_PROJECT_ID!,
  chains: ['ethereum', 'polygon', 'bsc'],
  metadata: {
    name: 'My DApp',
    description: 'My awesome decentralized application',
    url: 'https://mydapp.com',
    icons: ['https://mydapp.com/icon.png'],
  },
});

3. Connect a wallet.

Use the SDK to connect a user's wallet. The SDK handles WalletConnect, MetaMask, and other popular wallets automatically.

src/hooks/useWallet.ts

'use client';
import { useState, useCallback } from 'react';
import { cinacoin } from '@/lib/cinacoin';

export function useWallet() {
  const [address, setAddress] = useState<string | null>(null);
  const [chainId, setChainId] = useState<string | null>(null);
  const [connecting, setConnecting] = useState(false);

  const connect = useCallback(async () => {
    setConnecting(true);
    try {
      const session = await cinacoin.connect();
      setAddress(session.address);
      setChainId(session.chainId);
    } catch (error) {
      console.error('Connection failed:', error);
    } finally {
      setConnecting(false);
    }
  }, []);

  const disconnect = useCallback(async () => {
    await cinacoin.disconnect();
    setAddress(null);
    setChainId(null);
  }, []);

  return { address, chainId, connecting, connect, disconnect };
}

4. Sign a message.

Once connected, you can ask the user to sign messages for authentication or other purposes. This proves ownership of the wallet address.

Signing a message.

import { cinacoin } from '@/lib/cinacoin';

async function signMessage(message: string) {
  const signature = await cinacoin.signMessage({
    message,
    // Optional: specify which chain to use
    chainId: 'ethereum',
  });

  // Verify the signature on your backend
  const isValid = await cinacoin.verifyMessage({
    message,
    signature,
    address: session.address,
  });

  return { signature, isValid };
}

5. Send a transaction.

Send transactions to interact with smart contracts or transfer tokens. The SDK handles gas estimation, nonce management, and confirmation tracking.

Sending a transaction.

import { cinacoin } from '@/lib/cinacoin';

async function sendTransaction() {
  const tx = await cinacoin.sendTransaction({
    to: '0x742d35Cc6634C0532925a3b844Bc9e7595f...',
    value: '0.1', // in native token (ETH, MATIC, etc.)
    chainId: 'ethereum',
    // Optional: call a smart contract
    data: '0x...', // ABI-encoded function call
  });

  // Wait for confirmation
  const receipt = await tx.wait();
}

6. Listen for events.

React to wallet and chain events in real-time. The SDK emits events for account changes, chain switches, and disconnections.

Event handling.

import { cinacoin } from '@/lib/cinacoin';

// Listen for account changes
cinacoin.on('accountsChanged', (accounts: string[]) => {
  // Handle account change
});

// Listen for chain switches
cinacoin.on('chainChanged', (chainId: string) => {
  // Handle chain change
});

// Listen for disconnection
cinacoin.on('disconnect', () => {
  // Clean up your app state
});