Use onboard hooks instead of custom implementation

[usame-algan]

What is the feature about

We are currently using the @onboard/core package to manage wallets. However, when we initialize onboard, we store it in an ExternalStore and access it via our own useOnboard hook. We have custom handlers for retrieving the connected wallet, switching the chain (and having custom logic to make this work with hardware wallets) and more which is hard to maintain.

There is an @onboard/react package which works by wrapping a provider around the app and exposing these functions that we need through hooks like useSetChain and useConnectWallet. This would allow us to remove our custom implementation.

I tested their react demo with @francovenica to make sure switching chains was supported with hardware wallets. I think this was one of the reasons we went with our custom implementation.

The list of requirements

• [ ] Evaluate if @onboard/react can be used
• [ ] Replace useOnboard with external hooks from @onboard/react

Links

• @onboard/react package: https://github.com/blocknative/web3-onboard/tree/develop/packages/react
• Demo: https://reactdemo.blocknative.com/