Keep WC session after refreshing browser page

[damianmarti]

Keep the WalletConnect connection to the dapp after refreshing the page.

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
burnerwallet-nextjs	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jun 18, 2024 8:21pm

[damianmarti]

Nice! Will be very helpfull to add the refreshing feature!!

Need to test more to try to reproduce a pattern, but sometimes when you reload the dapp, or the burnerwallet, the transactions stop transfering to the burnerwallet, and the dapp stays with "Awaiting for.." notification.

After you reload the burnerwallet, the transaction in queue pops and you can accept or reject, but since there is no "queue" feature, you don't realize something is queued until you reload the burnerwallet.

Will try to reproduce nicely tonight, and try to include logs if show some evidence of the problem 🙌

============================

Update: Reproduced a pattern that happens in different browsers.

After connecting to a site and interacting normally with it:

• You reload burnerwallet
• Next "Mint NFT" you perform, passes the tx normally to the burnerwallet
• Next one, does not pass. You need to reload burnerwallet to make the tx drawer pop
• After this, it will happen everytime you try to mint

Hope it happens to you too so you are able to debug @damianmarti 🙌

There is an issue with the development mode because the useEffect is running twice.

If you try this using the preview link from the PR, it works fine.

I think it's related to React Strict mode, but I didn't find where the strict mode is activated.

Maybe @carletex has something to say related to this. If you set a useEffect with no dependencies to, for example, the Header component, it's called twice.

[carletex]

I think it's related to React Strict mode, but I didn't find where the strict mode is activated. Maybe @carletex has something to say related to this. If you set a useEffect with no dependencies to, for example, the Header component, it's called twice.

Yes!! According to the docs, that behavior is intentional (calling some lifecycle methods twice) to help identify side effects and ensure your effects are idempotent.

I think you can turn it off in next.config.ts with reactStrictMode: false

[Pabl0cks]

I think you can turn it off in next.config.ts with reactStrictMode: false

With reactStrictMode set to false it's working nicely!

Only problem I faced is the first login when it says Cannot access account but it's not related to this PR, it happens sometimes to me on the first login, until you disco/connect a couple of time and starts working.