import { BN, Provider, Wallet } from "fuels";
import { useEffect, useState } from "react";
 
function App() {
  const [balance, setBalance] = useState(0);
 
  useEffect(() => {
    const onPageLoad = async () => {
      const provider = new Provider("https://mainnet.fuel.network/v1/graphql");
 
      const wallet = Wallet.fromAddress("0x...", provider);
      const { balances } = await wallet.getBalances();
 
      setBalance(new BN(balances[0].amount).toNumber());
    };
 
    onPageLoad();
  }, []);
 
  return <div>My Balance: {balance}</div>;
}
 
export default App;