[Seedless Onboarding] Account center redesign

[usame-algan]

What it solves

Resolves #2589

How this PR fixes it

• Adds a new component SocialLoginInfo that is similar to EthHashInfo
• Refactors useConnectWallet

How to test it

1. Open the app
2. Press Connect Wallet
3. Observe the new design
4. Connect a MM wallet
5. Observe the new design
6. Connect via Social Login
7. Observe the new design
8. The copy button should copy the address
9. The explorer button should open the address in the block explorer

Screenshots

Checklist

• I've tested the branch on mobile 📱
• I've documented how it affects the analytics (if at all) 📊
• I've written a unit/e2e test for it (if applicable) 🧑‍💻

[github-actions]

Branch preview

✅ Deploy successful!

https://account_center--walletweb.review-wallet-web.5afe.dev

[github-actions]

ESLint Summary View Full Report

Annotations are provided inline on the Files Changed tab. You can also see all annotations that were generated on the annotations page.

Type	Occurrences	Fixable
Errors	0	0
Warnings	0	0
Ignored	0	N/A

• Result: ✅ success
• Annotations: 0 total

---

^{Report generated by eslint-plus-action}

[schmanu]

The code looks good.

I found one weird issue but could not find out what change is causing this. But I cannot reproduce it on the epic branch:
When opening the account center, network selector or any other of the modals from the header, the header moves by ~8px.

Screen.Recording.2023-10-10.at.17.56.28.mov

[schmanu]

Could we not use the global settings -> data page instead?

[usame-algan]

Good idea, lets move it there! cc @mike10ca

[usame-algan]

When opening the account center, network selector or any other of the modals from the header, the header moves by ~8px.

If I understand correctly this is related to the modals removing scroll when they open. This is the default behavior of MUI popups afaik.