web3modal icon indicating copy to clipboard operation
web3modal copied to clipboard

useContractRead with args from other hooks (useState)

Open jellohouse opened this issue 2 years ago • 3 comments

Trying to useContractRead that has as an arg the address from useAccount like this:

    const { address, isConnected } = useAccount();
    
    const userContractBalance = useContractRead({
       addressOrName: process.env.NEXT_PUBLIC_MY_CONTRACT_ADDRESS,
       contractInterface: myABI,
       functionName: 'balances',
       args: [address]
    });
    
    console.log('userContractBalance is', address, userContractBalance.data);

However I notice that sometimes when I switch pages in my app and go back to this, the userContractBalance.data is undefined even though the address is defined... Sometimes it works sometimes not...

I then even tried adding this lower in my code:

  useEffect(() => {
     if (address) userContractBalance.refetch();
  }, [address])

But it did not help. Not sure what the problem is. Any tips would be greatly appreciated.

jellohouse avatar Oct 20 '22 02:10 jellohouse

I think that when you switch pages, useContractRead starts re-fetching data, thus it will be undefined initially until it is resolved. Hook has enabled param to bypass fetching data on render, you could utilise that alongside some sort of cache.

xzilja avatar Oct 22 '22 08:10 xzilja

I understand that when I switch pages, it will be undefined initially until the it is resolved. But why does sometimes it does not resolve at all?

I do a console log of the address I'm inputting as arg to useContractRead and the object returned from useContractRead like this:

console.log('userContractBalance is', address, userContractBalance);

And in my console log I see:

userContractBalance is 0xA490DBDF2E3211fDXXXXXXXXXXXXXXX // valid address that user connected with
{
    "data": undefined,
    "isLoading": false,
    "error": {
        "reason": "resolver or addr is not configured for ENS name",
        "code": "INVALID_ARGUMENT",
        "argument": "name",
        "value": ""
    }
}

The address is clearly defined in the log, but the useContractRead gives error that: "resolver or addr is not configured for ENS name"

So it's like it's using the wrong address or something.

jellohouse avatar Oct 22 '22 22:10 jellohouse

@jellohouse could you please try with alpha.8. If issue still persists, any chance you could provide small repo that replicates this issue for me to dig in?

I tried to replicate this with contract address from useState that was changing via setInterval, but everything seemed to work as expected.

I also wonder why you might be getting that resolver or addr is not configured for ENS name (should be a different error if address is empty). Are you sure contract address that you are providing is valid? If not, I think it might be treated as ens name instead hence the error

xzilja avatar Oct 24 '22 11:10 xzilja

yeah I think this was an issue with my code and useEffects... consider it resolved.

jellohouse avatar Oct 28 '22 15:10 jellohouse

I am having the same issue.

I can't pinpoint it, but it seems non-deterministic, which leads me to believe it's useEffect that is causing it. I'm trying to call useContractRead in a useEffect hook and have enabled set to false due to it causing an infinite loop otherwise.

I imagine it's due to the address not being available in time (which I use as an argument).

0xcerty avatar Nov 06 '22 17:11 0xcerty

@jellohouse would love to hear your solution. Struggling with this...

0xcerty avatar Nov 06 '22 20:11 0xcerty