feat: hub adapter and refactor wallets store

[yeager-eren]

Summary

Add adapter to use hub providers alongside legacy providers.

This PR includes adding hub adapter in /react/ and refactor wallets store. From now on, we should be able to develop with our new wallet management system, Hub.

How did you test this change?

You can test the changes by running yarn dev:widget.

Details on how to review and what to test has been written in next section.

Notes for reviewers

Store

Assignee: @Ikari-Shinji-re

We had a separate store for wallets, in order to continue our work to migrate our stores to a single store and make current stores a slice of that, I completely removed wallets store and made it an slice.

The structure is mostly same, but there are one major difference. Previously, we had a connectedWallets which each of them had a balance itself. To simplify the process, I added a separate _balances and keep them separate from connectedWallet.

This change helps us do calculation much simpler (like calculating total balances) and treat this part differently, for example on connecting wallet it has two phases, one for adding the wallet to connectedWallets and another action for getting balances.

Other notable changes

• We were slicing tokens list to simulate pagination (to not showing a long scrollbar), I removed it since it was buggy and also make it more complicated without bringing much value.
• I'm keeping the raw balance data in store, which means whenever we need to show balance to user, we need to make sure we are using shiftedBy in order to show a correct number to user. There were places like Max button needs to be updated which I did. I just mentioned this, maybe there are more places like this I'm unaware.

Area of changes

Mostly embedded/src/store, you can take a look at embedded as well and they will be updating usage of wallets store.

Also removing balance from rango-preset is related to wallets store.

AutoConnect

Assignee: @Ikari-Shinji-re

For having auto connect in Hub, in addition to wallet type/name, we need namespace as well. So I added a separate key in storage.

I tried to reuse the legacy codes as much as I can, eagerConnectHandler, LastConnectedWalletsFromStorage, same filenames are some effort to achieve this.

LastConnectedWalletsFromStorage is actually a shared interface to interact with both legacy and hub storage.

Area of changes

You can start by reviewing react/src/legacy/, I tried to make the legacy code reusable by separating the logic into autoConnect, useAutoConnect. Auto connect is calling in useLegacyProvider.

And then you can start taking a look at react/src/hub/, I tried to use same filename and structure in legacy to make it more consistent and understandable.

When you are reviewing this, you will notice there are some new functions like LastConnectedWallets which are actually a general solutions on legacy codes that needs to be reused in adapter.

These files should be interested to you:

• autoConnect,ts
• constancts.ts
• lastConnectedWallets.ts
• useHubAdapter.ts

In Future

• Having a migration for migrating legacy auto connect storage to hub storage

Adapter

__Assignee: @RyukTheCoder __

In previous PRs, we've prepared the filesystem structure for adding an adapter. In this PR, We've added a new /react/src/hub directory alongside /react/src/legacy.

The idea here is keeping the legacy interface to not needing to update clients (like embedded), to achieve this I created a new hook called useProviders which provides the legacy (ProviderContext) at the end. It simply will load both hub and legacy providers and it's switch between them. For example you are going to use connect in embedded, when it's going to run, it will check the request wallet is a legacy provider or hub provider, then it will call the method on that one.

Each legacy and hub has a hook to implement the legacy interface (ProviderContext), they are useLegacyProviders and useHubProviders.

For backward compatibility, there is an special namespace called DISCOVER_MODE. Alongside DISCOVER_MODE, network will be set as well. here we are manually matching networks to namespaces. This will help us keep the legacy interface and have what hub needs as well. Explained some more details on next section.

Other notable changes

• To call a hub provider, having namespace is required. Since the legacy hasn't this concept, we only have network there. Adapter has a mapping between Networks and Hub's Namespace. Take a look at discoverNamespace to see the mapping. That would be great if @RanGojo check this mapping as well.
• Network can not be passed to wallet's instances (e.g. window.ethereum) directly, for example for switching network, we need to convert Network enum to chain id. take a look at tryConvertNamespaceNetworkToChainInfo in this regard.

Area of changes

Hub enabled in widget/app/src/App.tsx, and there are some update regarding to connect, it needs to have DISCOVER_MODE ( e.g widget/embedded/src/QueueManager.tsx).

Adapter has been written in /react/src/hub. Some parts of the changes is for auto connect. It separately has been assigned to @Ikari-Shinji-re .

Changes to /react/src/legacy are mostly for auto connect feature.

Breaking Changes

• Second param for connect in /react has changed. I updated the usage in embedded.

Phantom

__Assignee: @RyukTheCoder __

Phantom has been migrated to hub and also in addition to Solana namespace, EVM namespace has been added too.

Area of changes

You can take a look at /provider-phantom.

Other changes

• Hub can be enabled and disabled by setting configs.isExperimentalEnabled. I made it enable for now.

TODO

• add package.json for subpath and remove utils from /core/mod.ts
• Write some guide on hub

In Future

• Check hot reload for multiple entrypoins, seems Parcel doesn't support ESM exports for hot reload properly.
• suggestAndConnect hasn't implemented in Hub adapter.
• hub adapter is usingcanSwitchNetworkTo, canEagerConnect, getSigners, getWalletInfo().supportedChains, getInstance from legacy provider.

Related PRs

• feat: introducing hub, our new wallet management #826
• test: add tests for wallets/react #824
• feat:wallet v1 (a.k.a Hub) #623

[yeager-eren]

@RanGojo Thanks. I fixed the NaN bug in my last commit ab16aea.
The rest of items have been discussed offline.

[yeager-eren]

going to merge this. we will fix some reported bugs in separate PRs.