Tokens
useTransferTokens()

Use this hook to transfer SOL tokens or any SPL tokens, by defining only the address to send, token symbol (or token mint address), and amount to send. It also can return the transaction gas fee, which can be enabled at the 4th parameter with a true flag.

Current official tokens supported:

  • SOL
  • USDC
  • USDT

Either way if your token is not on the above list, you can send any token mint address directly.

Example for SOL token

import { useTransferTokens } from '@lndgalante/solutils';
import { useConnection, useWallet } from '@solana/wallet-adapter-react';
import { WalletMultiButton, WalletDisconnectButton } from '@solana/wallet-adapter-react-ui';
 
export default function Home() {
  // solana hooks
  const { connection } = useConnection();
  const { publicKey, sendTransaction } = useWallet();
 
  // solutils hooks
  const { getTransferTokensReceipt, result, status, error } = useTransferTokens(publicKey, connection, sendTransaction);
 
  // constants
  const AMOUNT_TO_SEND = 0.001;
  const TOKEN_TO_SEND = 'SOL';
  const ADDRESS_TO_SEND = '5NSJUuR9Pn1yiFYGPWonqrVh72xxX8D2yADKrUf1USRc';
 
  // handlers
  function handleTransferSolTokens() {
    getTransferTokensReceipt(ADDRESS_TO_SEND, TOKEN_TO_SEND, AMOUNT_TO_SEND);
  }
 
  return (
    <div>
      <WalletMultiButton />
      <WalletDisconnectButton />
 
      <main>
        <button onClick={handleTransferSolTokens}>Send {SOL_TO_SEND} SOL tokens</button>
        {status === 'iddle' ? <p>Haven&apos;t sent any SOL yet</p> : null}
        {status === 'loading' ? <p>Sending your SOL tokens</p> : null}
        {status === 'success' && result ? (
          <div>
            <p>We successfully sent: {AMOUNT_TO_SEND} SOL</p>
            <p>Transaction signature: {result.transactionSignature}</p>
            <a href={result.urls.solanaExplorerUrl} target='_blank' rel='noreferrer'>
              Solana Explorer
            </a>
          </div>
        ) : null}
        {status === 'error' ? <p>{error}</p> : null}
      </main>
    </div>
  );
}

Repo Example (opens in a new tab)

Example for USDC token

import { useTransferTokens } from '@lndgalante/solutils';
import { useConnection, useWallet } from '@solana/wallet-adapter-react';
import { WalletMultiButton, WalletDisconnectButton } from '@solana/wallet-adapter-react-ui';
 
export default function Home() {
  // solana hooks
  const { connection } = useConnection();
  const { publicKey, sendTransaction } = useWallet();
 
  // solutils hooks
  const { getTransferTokensReceipt, result, status, error } = useTransferTokens(publicKey, connection, sendTransaction);
 
  // constants
  const AMOUNT_TO_SEND = 1;
  const TOKEN_TO_SEND = 'USDC';
  const ADDRESS_TO_SEND = '5NSJUuR9Pn1yiFYGPWonqrVh72xxX8D2yADKrUf1USRc';
 
  // handlers
  function handleTransferUsdcTokens() {
    getTransferTokensReceipt(ADDRESS_TO_SEND, TOKEN_TO_SEND, AMOUNT_TO_SEND);
  }
 
  return (
    <div>
      <WalletMultiButton />
      <WalletDisconnectButton />
 
      <main>
        <button onClick={handleTransferUsdcTokens}>Send {AMOUNT_TO_SEND} USDC tokens</button>
        {status === 'iddle' ? <p>Haven&apos;t sent any USDC yet</p> : null}
        {status === 'loading' ? <p>Sending your USDC tokens</p> : null}
        {status === 'success' && result ? (
          <div>
            <p>We successfully sent: {USDC_TO_SEND} USDC</p>
            <p>Transaction signature: {result.transactionSignature}</p>
            <a href={result.urls.solanaExplorerUrl} target='_blank' rel='noreferrer'>
              Solana Explorer
            </a>
          </div>
        ) : null}
        {status === 'error' ? <p>{error}</p> : null}
      </main>
    </div>
  );
}

Repo Example (opens in a new tab)

Example for a token mint address SBR token

import { useTransferTokens } from '@lndgalante/solutils';
import { useConnection, useWallet } from '@solana/wallet-adapter-react';
import { WalletMultiButton, WalletDisconnectButton } from '@solana/wallet-adapter-react-ui';
 
export default function Home() {
  // solana hooks
  const { connection } = useConnection();
  const { publicKey, sendTransaction } = useWallet();
 
  // solutils hooks
  const { getTransferTokensReceipt, result, status, error } = useTransferTokens(publicKey, connection, sendTransaction);
 
  // constants
  const AMOUNT_TO_SEND = 1;
  const ADDRESS_TO_SEND = '5NSJUuR9Pn1yiFYGPWonqrVh72xxX8D2yADKrUf1USRc';
  const TOKEN_MINT_ADDRESS = 'Saber2gLauYim4Mvftnrasomsv6NvAuncvMEZwcLpD1';
 
  // handlers
  function handleTransferToTokenMintAddress() {
    getTransferTokensReceipt(ADDRESS_TO_SEND, TOKEN_MINT_ADDRESS, AMOUNT_TO_SEND);
  }
 
  return (
    <div>
      <WalletMultiButton />
      <WalletDisconnectButton />
 
      <main>
        <button onClick={handleTransferToTokenMintAddress}>Send {AMOUNT_TO_SEND} SBR tokens</button>
        {status === 'iddle' ? <p>Haven&apos;t sent any SBR yet</p> : null}
        {status === 'loading' ? <p>Sending your SBR tokens</p> : null}
        {status === 'success' && result ? (
          <div>
            <p>We successfully sent: {AMOUNT_TO_SEND} SBR</p>
            <p>Transaction signature: {result.transactionSignature}</p>
            <a href={result.urls.solanaExplorerUrl} target='_blank' rel='noreferrer'>
              Solana Explorer
            </a>
          </div>
        ) : null}
        {status === 'error' ? <p>{error}</p> : null}
      </main>
    </div>
  );
}

Repo Example (opens in a new tab)