Add evm wallet support to polygon prototype

[ebma]

• Adds the rainbowkit wallet components
• Creates useWagmiHooks to showcase the use of the wagmi hooks. This should be removed before merging

I decided to use rainbowkit because it seems quite popular and it's easy to use and configure. We can tweak the list of wallets shown in the dialog and we can also reduce the network selector to just show Polygon. All the things we need to interact with the contracts are contained in wagmi, e.g. signing a custom message , reading balances, etc.

Closes #40.

Notes

• I left the walletAccount around but empty because replacing it in a sensical way is more involved and should probably rather be done in https://github.com/pendulum-chain/vortex/issues/42.

[netlify[bot]]

✅ Deploy Preview for pendulum-pay ready!

Name	Link
🔨 Latest commit	b6cf6ddaf07ab6384fdefc15b4253ee844b41eac
🔍 Latest deploy log	https://app.netlify.com/sites/pendulum-pay/deploys/667af796fd120d0008afb65e
😎 Deploy Preview	https://deploy-preview-51--pendulum-pay.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[ebma]

@pendulum-chain/devs please have a look

[Sharqiewicz]

@ebma The package looks popular and well supported. However, if it does not work out I noticed that the combination of wagmi and @web3-react packages is quite popular for EVM wallet connections. These packages provide a high degree of control over the implementation. For the full version of the application, we should consider utilizing these two packages to enhance our wallet integration.

[ebma]

Cool, thanks for pointing it out @Sharqiewicz 👍 We can consider that in the future. Rainbowkit is probably easier for the prototype as it offers the dialog and connection logic out of the box.

[ebma]

With the provided useAccount and useSigningMessage across the app like you showcased on the testing hook we won't need it anymore (I think ?)

Yes that's true. I kept it because otherwise, I'd have to touch too much of the other flow. We will still need to use some account to do the stuff on Pendulum, just not one that is managed by the user wallet. So I left the rest in place to hopefully make replacing it easier once necessary.

[gianfra-t]

Mmm maybe you are right, I just can't remember exactly all the places that it is used. I said that because I was also considering the changes from phase 6A ( sometimes I think people are in my head, sorry..).

There we can work directly with the ephemeral, like here. In fact, I just realized I haven't finished removing the user's account completely and that all the walletAccount instances used on that example are to be replaced.

So, we can leave it and later when we merge 6A we can think if we still need it. I was planning on merging first 6B into 6A since it brings a lot of relevant changes, and later open a PR of 6A into polygon-prototype-staging where we remove Pendulum's account completely. WDYT?

[ebma]

I was planning on merging first 6B into 6A since it brings a lot of relevant changes, and later open a PR of 6A into polygon-prototype-staging where we remove Pendulum's account completely. WDYT?

Yes, let's do that 👍

[prayagd]

Tried it too, works so smooth. Can we get rid of the "Base" option from the network selector?

[ebma]

Sure 👍 I consider this generally approved and will clean up the code for merging then.

[ebma]

Code is cleaned, will merge tomorrow