why i get error in setUsdtBalance(balance)?

Question

I have problem with this code @ setUsdtBalance(balance):

import React, { useState, useEffect } from 'react';
import Web3 from 'web3';

const web3 = new Web3('https://mainnet.infura.io/v3/759e4fcbf9b7449f854586fb65f43184');

function App() {
  const [lastBlockNumber, setLastBlockNumber] = useState<bigint | null>(null);
  const [usdtBalance, setUsdtBalance] = useState<string | null>(null);
  const [address, setAddress] = useState<string>('');

  useEffect(() => {
    const fetchLastBlockNumber = async () => {
      const blockNumber = await web3.eth.getBlockNumber();
      setLastBlockNumber(blockNumber);
    };

    fetchLastBlockNumber();
  }, []);

  const handleAddressChange = (e: React.ChangeEvent<HTMLInputElement>) => {
    setAddress(e.target.value);
  };

  const handleGetBalance = async () => {
    if (!address) return;

    const contractABI = [
      {
        "constant": true,
        "inputs": [{ "name": "_owner", "type": "address" }],
        "name": "balanceOf",
        "outputs": [{ "name": "balance", "type": "uint256" }],
        "payable": false,
        "stateMutability": "view",
        "type": "function"
      }
    ];

    const contractAddress = '0xdAC17F958D2ee523a2206206994597C13D831ec7';
    const usdtContract = new web3.eth.Contract(contractABI, contractAddress);
    const balance = await usdtContract.methods.balanceOf(address).call();
    setUsdtBalance(balance);
  };

This is the error:

Argument of type 'void | [] | (unknown[] & [])' is not assignable to parameter of type 'SetStateAction<string | null>'.
  Type 'void' is not assignable to type 'SetStateAction<string | null>'.ts(2345)

Answer 1

call is generic function that expects a single generic parameter. If no type arg is provided to call, then it defaults to void | [] | (unknown[] & []).

If you are confident that balance can only be a string then explicitly providing string to call should be enough to get rid of those errors

const balance = await usdtContract.methods.balanceOf(address).call<string>();