Wagmi write contract

Question

I have this code here

import React from 'react';
import { usePrepareContractWrite, useContractWrite } from 'wagmi';
import lottoABI from './lottoABI.json';
import { parseEther } from 'viem';
    
// Your component code here
    
function Write() {
    const { config, error } = usePrepareContractWrite({
        address: '0x3262c6f03F4003F1b4D6162F40bae8A71a101ef3',
        abi: lottoABI, // Use the imported ABI JSON file
        functionName: 'participate',
        value: parseEther('0.01'),
        args:['0x293Bcb20584a2e0E6d1b559E25783311ec29121C']
    })
    const { data, isLoading, isSuccess, write } = useContractWrite(config)
    console.log(data)
    
    return (
        <>
            <button disabled={!write || isLoading} onClick={() => write?.()}>
                {isLoading ? 'Loading...' : isSuccess ? 'Success!' : 'Bought'}
    
                {error && (
                    An error occurred preparing the transaction: {error.message}
    
                )}
       </>
    );
}

export default Write;

This function is supposed to call a function on a smart contract with ETH value and an referral address.

But when I run this in my Next.js project, I see this error:

ContractFunctionExecutionError: HTTP request failed.

URL: https://rpc.sepolia.org
Request body: {"method":"eth_call","params":[{"from":"0x293Bcb20584a2e0E6d1b559E25783311ec29121C","data":"0xb91038c7000000000000000000000000293bcb20584a2e0e6d1b559e25783311ec29121c","to":"0x3262c6f03F4003F1b4D6162F40bae8A71a101ef3"},"latest"]}

Raw Call Arguments:
from: 0x293Bcb20584a2e0E6d1b559E25783311ec29121C
to: 0x3262c6f03F4003F1b4D6162F40bae8A71a101ef3
data: 0xb91038c7000000000000000000000000293bcb20584a2e0e6d1b559e25783311ec29121c

Contract Call:
address: 0x3262c6f03F4003F1b4D6162F40bae8A71a101ef3
function: participate(address _referrer)
args: (0x293Bcb20584a2e0E6d1b559E25783311ec29121C)
sender: 0x293Bcb20584a2e0E6d1b559E25783311ec29121C

Docs: https://viem.sh/docs/contract/simulateContract.html
Details: NetworkError when attempting to fetch resource.

and I also get this error:

An error occurred preparing the transaction: Execution reverted for an unknown reason.

Raw Call Arguments:
from: 0x293Bcb20584a2e0E6d1b559E25783311ec29121C
to: 0x3262c6f03F4003F1b4D6162F40bae8A71a101ef3
value: 0.01 SEP
data: 0xb91038c7000000000000000000000000293bcb20584a2e0e6d1b559e25783311ec29121c

Contract Call:
address: 0x3262c6f03F4003F1b4D6162F40bae8A71a101ef3
function: participate(address _referrer)
args: (0x293Bcb20584a2e0E6d1b559E25783311ec29121C)
sender: 0x293Bcb20584a2e0E6d1b559E25783311ec29121C
Docs: https://viem.sh/docs/contract/simulateContract.html
Details: execution reverted
Version: [email protected]

I'm on Sepolia testnet. Does anyone know what I need to do to fix this?

Looking at the console, it seems that my writeContract function is called every block, why is that?

Answer 1

Your function has a capital letter, so your react framework will treat it differently. Make sure your functions start with a lower case letter.

Answer 2

Can you please check your Wagmi version cause like in wagmi V2 the prepare hooks were removed. You can check that out in their official documentation , which i have provided here.

https://wagmi.sh/react/guides/migrate-from-v1-to-v2#removed-prepare-hooks