runContractFunction no action

Hello guys,

I have a problem interacting with my contract in reactjs. The thing is if I set up my funcitons in a InteractWithContract.js file and add it to my mint page as <InteractWithContract/> it works just fine.

if I add the function in my mint page there is no reaction when calling the runContractFunction. The onSuccess, onComplete, onError of the runContractFunction are firing immediately. I already spent multiple hours now, just cant get it working.

here is my code (contractAddress I have changed to myContract for placing it here)

 //interact start
    const { runContractFunction: enterRaffle, data: enterTxResponse, error, isLoading, isFetching } = useWeb3Contract({
        abi: abi,
        contractAddress: "myContract",
        functionName: "addAddress",
        params: {
            _addressToBeAdded: account
        },
    }

    );

    const InteractContract = async () => {
        console.log("abi", abi);
        console.log("web3en", isWeb3Enabled)
        console.log("raffleresult", await enterRaffle(
            {
                onSuccess: console.log("success"),
                onComplete: console.log("complete"),
                //onError: () => { handleError(JSON.stringify(error)) },
                onError: console.log("error")
            }
        ))
        await enterRaffle(
            {
                onSuccess: console.log("success"),
                onComplete: console.log("complete"),
                //onError: () => { handleError(JSON.stringify(error)) },
                onError: console.log("error")
            }
        )
    }

and for activating it:

<button
                    className="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded ml-auto"
                    onClick={async () =>
                        await InteractContract()
                    }
                    disabled={isLoading || isFetching}
                >enter raffle</button>

Could you try the solution in this below thread.

And can you share the error if you are receiving any in the console?

Oh thanks mate for the reply, sorry I completly missed it…
I already saw that mentioned thread and couldnt get it working, just because I didnt know how to link the tx and react on it. But I made it then and got it working with this:

export async function RunContractJoinRaffle(contractFunction, errorInformation) {
    console.log("runContractjoinraffle entered")
    const tx1 = await globalEnterRaffle(
        {
            onSuccess: () => handleSuccess(tx1),
            onError: (tx) => globalResult = handleError(tx, errorInformation),
        }
    )
    return (globalResult);
}

then I can wait for the tx going through in my handleSuccess

const handleSuccess = async (tx) => {
    await tx.wait(1);
    console.log("success entered")
    globalResult = ['success', tx];
    return ['success', tx];
    // setApeAssistent = 'success';
}

hope this helps anybody else. And thanks for the reply, appreciate it

1 Like