[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)

  updateUIValues()

  handleNewNotification(tx)

}
<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("");

...

setUiValues("success");

...
// return/render
<p>{uiValues}</p> 

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