How to get USDC balance in a Phantom Wallet?

Question

I have some code in reactjs which gets the sol balance from a Phantom wallet (Content Functional Component), how can this be changed to get the USDC balance in the same wallet? Here is the code example -

import { WalletAdapterNetwork, WalletNotConnectedError } from '@solana/wallet-adapter-base';
import { ConnectionProvider, WalletProvider, useConnection, useWallet } from '@solana/wallet-adapter-react';
import { WalletModalProvider, WalletMultiButton, WalletDisconnectButton } from '@solana/wallet-adapter-react-ui';
import { UnsafeBurnerWalletAdapter, PhantomWalletAdapter } from '@solana/wallet-adapter-wallets';
import { Connection, Keypair, SystemProgram, Transaction, sendAndConfirmTransaction, clusterApiUrl, PublicKey, LAMPORTS_PER_SOL } from '@solana/web3.js';
import React, { FC, ReactNode, useEffect, useMemo, useState } from 'react';
  
const App: FC = () => {
    return (
        <Context>
            <Content />
        </Context>
    );
};
export default App;

const Context: FC<{ children: ReactNode }> = ({ children }) => {
    // The network can be set to 'devnet', 'testnet', or 'mainnet-beta'.
    const network = WalletAdapterNetwork.Devnet;

    // You can also provide a custom RPC endpoint.
    const endpoint = useMemo(() => clusterApiUrl(network), [network]);

    const wallets = useMemo(
        () => [
     
            new PhantomWalletAdapter(),
            new UnsafeBurnerWalletAdapter(),
        ],
        // eslint-disable-next-line react-hooks/exhaustive-deps
        [network]
    );

    return (
        <ConnectionProvider endpoint={endpoint}>
            <WalletProvider wallets={wallets} autoConnect>
                <WalletModalProvider>{children}</WalletModalProvider>
            </WalletProvider>
        </ConnectionProvider>
    );
};

const Content: FC = () => {

    //.... code 
     const fetchBalance = async () => {
    
          if (publicKey) {
             const balance1 = await connection.getBalance(publicKey); // gets sol balance
             
             const lamportBalance=(balance1/LAMPORTS_PER_SOL);
             setBalance(lamportBalance);
 
         //  setBalance(balance1);
     };

     

    ```

Answer 1

You can fetch the balance for your USDC associated token account (ATA)

First, you have to get the USDC ATA address. Use getAssociatedTokenAccount that is provided with the @solana/spl-token library.

function get ataBalance(walletPubkey:PublicKey) {
  const ata = await getAssociatedTokenAccount(USDC_MINT,walletPubkey);
  let accountData = await getAccount(connection, ata, "confirmed");
  return accountData.amount;
}

you can import getAccount from @solana/web3.js.

USDC_MINT is EPjFWdd5AufqSSqeM2qN1xzybapC8G4wEGGkZwyTDt1v

https://explorer.solana.com/address/EPjFWdd5AufqSSqeM2qN1xzybapC8G4wEGGkZwyTDt1v