Query Wallet Balances with Solana Libraries

import { useParaSolanaV2 } from './hooks/useParaSolanaV2';
import { address, lamports } from '@solana/web3.js';
import { getAccount, getAssociatedTokenAddress } from '@solana/spl-token';

function WalletBalance() {
  const { rpc, signer } = useParaSolanaV2();
  const [solBalance, setSolBalance] = useState(0);
  const [tokenBalance, setTokenBalance] = useState(0);
  
  const fetchBalances = async () => {
    try {
      // Get SOL balance
      const { value } = await rpc.getBalance(signer.address).send();
      setSolBalance(Number(value) / 1e9);
      
      // Get SPL token balance
      const usdcMint = address("EPjFWdd5AufqSSqeM2qN1xzybapC8G4wEGGkZwyTDt1v");
      const tokenAccount = await getAssociatedTokenAddress(
        usdcMint,
        signer.address
      );
      
      const { value: accountData } = await rpc.getAccountInfo(tokenAccount).send();
      if (accountData && accountData.data) {
        const parsed = JSON.parse(accountData.data);
        setTokenBalance(Number(parsed.parsed.info.tokenAmount.amount) / 1e6);
      } else {
        setTokenBalance(0);
      }
    } catch (error) {
      console.error("Error fetching balances:", error);
    }
  };
  
  return (
    <div>
      <button onClick={fetchBalances}>Refresh Balances</button>
      <p>SOL Balance: {solBalance}</p>
      <p>USDC Balance: {tokenBalance}</p>
    </div>
  );
}

import { useParaAnchor } from './hooks/useParaAnchor';
import { LAMPORTS_PER_SOL, PublicKey } from '@solana/web3.js';
import { TOKEN_PROGRAM_ID, getAccount, getAssociatedTokenAddress } from '@solana/spl-token';

function WalletBalance() {
  const provider = useParaAnchor();
  const [solBalance, setSolBalance] = useState(0);
  const [tokenBalance, setTokenBalance] = useState(0);
  
  const fetchBalances = async () => {
    try {
      // Get SOL balance
      const balance = await provider.connection.getBalance(provider.publicKey);
      setSolBalance(balance / LAMPORTS_PER_SOL);
      
      // Get SPL token balance
      const usdcMint = new PublicKey("EPjFWdd5AufqSSqeM2qN1xzybapC8G4wEGGkZwyTDt1v");
      const tokenAccount = await getAssociatedTokenAddress(
        usdcMint,
        provider.publicKey
      );
      
      try {
        const accountInfo = await getAccount(provider.connection, tokenAccount);
        setTokenBalance(Number(accountInfo.amount) / 1e6);
      } catch (error) {
        console.log("Token account not found");
        setTokenBalance(0);
      }
    } catch (error) {
      console.error("Error fetching balances:", error);
    }
  };
  
  return (
    <div>
      <button onClick={fetchBalances}>Refresh Balances</button>
      <p>SOL Balance: {solBalance}</p>
      <p>USDC Balance: {tokenBalance}</p>
    </div>
  );
}