[bug] Balance on Connect Button doesn't update after a txn

[brijeshagal]

Is there an existing issue for this?

• [X] I have searched the existing issues

RainbowKit Version

2.0.7

wagmi Version

2.9.1

Current Behavior

This is the current scenerio after a transaction was sent. It gets updated on refresh though.

I am using the useAddRecentTransaction hook to handle this as per the updated code but it updates the balance only on the account modal.

Expected Behavior

Balance should be updated after transaction on Connect Button as well as it is working correctly with account modal.

Steps To Reproduce

Submit a transaction by clicking on submit button, after the transaction succeeds, the balance is updated on the account modal but not on Connect Button

Link to Minimal Reproducible Example (CodeSandbox, StackBlitz, etc.)

https://github.com/brijeshagal/error-reproduction-code/blob/main/app/page.tsx

Anything else?

No response

[magiziz]

@brijeshagal Realtime balance are only supported via our useAddRecentTransaction hook. You can check our docs here. Essentially if you wait till your transaction succeeds, then use useAddRecentTransaction hook to add a transaction, you should be able to see the Connect Button balance update. Let me know if this helps 👍

[brijeshagal]

@brijeshagal Realtime balance are only supported via our useAddRecentTransaction hook. You can check our docs here. Essentially if you wait till your transaction succeeds, then use useAddRecentTransaction hook to add a transaction, you should be able to see the Connect Button balance update. Let me know if this helps 👍

That's exactly what I have done in the repo shared above. Please check that file out once. It's minimalist code only.

[magiziz]

@brijeshagal I'm able to reproduce this. I can see that connect button balance is not getting updated, but account modal does. I'll keep this issue open and let you know once it's resolved.

[magiziz]

@brijeshagal I had time to look at your repo and seems like i saw a few error messages when sending and adding the transaction.

I've created a super simple next js app here https://github.com/magiziz/rainbowkit-realtime-balance

If you could check out the repo and compare them with your changes that'd awesome. Also I would suggest using alchemy or infura instead of relying on public node. You can configure them in wagmi.ts file here.

I've tested this with both optimism and base.

https://github.com/rainbow-me/rainbowkit/assets/53529533/08d64890-fbb3-4a74-98a1-0284080cfde5

https://github.com/rainbow-me/rainbowkit/assets/53529533/0bdcb4d8-8fd5-4405-8e45-694afbd213e4

[magiziz]

@brijeshagal Were you able to figure it out ?

[magiziz]

Going to close this issue for now. Please feel free to reopen this issue if you're still stuck.