[SOLVED] How to change UI after a contract call

const { runContractFunction: approve, data: enterTxResponse, error, isLoading, isFetching } = useWeb3Contract({

    abi: abiCode,

    contractAddress: "address",

    functionName: "approve",

    params: {

      _spender: "address",

      _value: 1,




const handleSuccess = async (tx) => {

  await tx.wait(1)



<Button ml="4" className="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded ml-auto"

                        onClick={async () =>

                            await approve({

                                onSuccess: handleSuccess,



                        disabled={isLoading || isFetching}>Get It!</Button>

hi, please here are my codes.

here is the error message i got after running the code

You have no function called updateUIValues. If you want to set a state to update your UI, you could do something like:

const [uiValues, setUiValues] = useState("");



// return/render

Sorry for the late reply. Thanks it’s now working.