Feature Request: new Wallet Connection status component

[Markkos89]

I am working in a new branch in my form integrating the t3 stack and storing users accounts, etc.

What is needed to be done is to enhance the wallet connection status with a new component.
The actual preview link is here: https://academy-8gt6x76bv-spark-dev-dao.vercel.app/ which is showing this branch on my academy fork: https://github.com/Markkos89/academy/tree/feat/t3-siwe

A new PR should be done from a new branch called: feat/wallet-status-component to the working branch: feat/t3-siwe

We have the "Connect Wallet" button, and after the wallet is connected, the "Sign In" button appears.
When the wallet is connected now is showing the wallet address and it appears upon the nav bar menues.

Like this:

What is needed (and will work for the v2 version imho) is a new component that handles everything, almost like the RainbowKit one.
The integration with RainbowKit can be tested here: https://academy-pearl.vercel.app/ if needed, I will show it:

1- pressing the "Connect Wallet" button opens the modal to select your wallet:

2- after that, if not signed in, it asks the user to do it:

2 b- after logged in, the button will show the shorted address:

3- lastly, when signed in, if you click on the button again it opens a new modal with some options:

PD: Also we have to handle the validation of the correct network (Mumbai now), this can be done after the wallet is connected? before sign in? So if the network is wrong, a new modal should appear noticing this with a button to change network.

[kempsterrrr]

@Markkos89 - this looks like you're using Rainbow kit, right?

As part of the preferred partner model, we'd ideally like to suggest the preferred wallet provider as the highest option on the Wallet connect Modal. Looking the documentation here this seems like it would be very simple to achieve.

Are we happy to include the preferred wallet provider here in this way?

cc @elPiablo @Markkos89 @wolovim

[elPiablo]

That sounds good @kempsterrrr, if it is possible @Markkos89 .... 😄

[Markkos89]

@Markkos89 - this looks like you're using Rainbow kit, right?

As part of the preferred partner model, we'd ideally like to suggest the preferred wallet provider as the highest option on the Wallet connect Modal. Looking the documentation here this seems like it would be very simple to achieve.

Are we happy to include the preferred wallet provider here in this way?

cc @elPiablo @Markkos89 @wolovim

Hey @kempsterrrr ! 2 things:

1 - Yes! I can add it 😄 for it I will need the projectId from WalletConnet Cloud as specified here:

zerionWallet(options: {
  projectId: string;
  chains: Chain[];
});

WalletConnect Cloud link

2 - For the other version I am working on, I am not using RainbowKit, I'm only using Wagmi and don't know if it supports Zerion. We can check it, just for letting you guys know

Regards!

[kempsterrrr]

@Markkos89 - I've set up a wallet connect cloud account using [email protected] - let me know who is the best person to give access too.

2 - For the other version I am working on, I am not using RainbowKit, I'm only using Wagmi and don't know if it supports Zerion. We can check it, just for letting you guys know

Does this mean there will be no wallet connect modal or a custom one?

It would be nice/beneficial to be still able to recommend the preferred wallet partner in this way in future versions if we can.

[Markkos89]

This issue is not going to be needed soon because I was able to integrate RainbowKit and Next-Auth and SIWE together.

I will close it soon.

@okhaimie-dev finally I was able to do it!!! 😄

[Markkos89]

closing because of #228