wallet-ext: allow selecting the accounts to connect to dapp #8413

pchrysochoidis · 2023-02-18T21:36:24Z

adds WalletListSelect component that allows selecting between the accounts of the wallet and creating new ones
when multiaccounts is enabled while connecting to a dapp user is able to choose which accounts to connect

When multiaccount is disabled

When multiaccount is enabled and user has more than one account

Screen.Recording.2023-02-19.at.22.48.09.mov

NOTE: To check the accounts that are connected

switch between accounts and check the dapp status popup
or run

chrome.storage.local.get('permissions').then(({permissions: p}) => console.log(p['http://localhost:3000'].accounts))

in the console of the extension.

Closes APPS-283

vercel · 2023-02-18T21:36:31Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated
explorer	✅ Ready (Inspect)	Visit Preview	💬 Add your feedback	Feb 24, 2023 at 1:24AM (UTC)
explorer-storybook	✅ Ready (Inspect)	Visit Preview	💬 Add your feedback	Feb 24, 2023 at 1:24AM (UTC)
frenemies	✅ Ready (Inspect)	Visit Preview	💬 Add your feedback	Feb 24, 2023 at 1:24AM (UTC)
wallet-adapter	✅ Ready (Inspect)	Visit Preview	💬 Add your feedback	Feb 24, 2023 at 1:24AM (UTC)

mystie711 · 2023-02-21T15:50:07Z

Looking good in general. A few UI details that need to be aligned with Figma,

Rounder corner spec

Spacing of content inside both cards

looks like a border is getting used for the rectangle. It should be a line that separates the bottom row from the content above instead. Please double check spacing,

No need to show the toast when a new account is created. May be capture this in the new ticket you are going to create,

pchrysochoidis · 2023-02-21T16:05:11Z

@mystie711

About 'Rounder corner spec, this should be addressed by this ticket https://mysten.atlassian.net/browse/APPS-519. I will need to reuse some components from other PRs once merged will update this. (I just left it as it was for now)

About spacing/border ~~will check~~ Those have been fixed in another PR that will be merged together with this one so it's already addressed

For creating New Account added this ticket

Jibz1 · 2023-02-22T01:50:48Z

apps/wallet/src/ui/app/components/WalletListSelectItem.tsx

+    address,
+    selected,
+}: WalletListSelectItemProps) {
+    const addressShort = useMiddleEllipsis(address);


for addressShort can you use formatAddress from mysten/sui.js

I think useMiddleEllipsis is used almost everywhere, we should probably add a task to add a hook to format the address - and remove useMiddleEllipsis if we want

~~Added the ticket https://mysten.atlassian.net/browse/APPS-526~~ removed

Jibz1 · 2023-02-22T01:52:36Z

apps/wallet/src/ui/app/pages/site-connect/index.tsx

@@ -39,19 +45,24 @@ function SiteConnectPage() {
    const dispatch = useAppDispatch();
    const permissionRequest = useAppSelector(permissionSelector);
    const activeAccount = useAppSelector(({ account }) => account.address);
+    const activeAccountShort = useMiddleEllipsis(activeAccount);


Jibz1

LGT, except for ellipses

mystie711 · 2023-02-23T15:49:37Z

Is there an updated video of this?

pchrysochoidis · 2023-02-23T16:00:15Z

Is there an updated video of this?

this is how it would be after merging this one

Screen.Recording.2023-02-23.at.15.54.14.mov

* adds WalletListSelect component that allows selecting between the accounts of the wallet and creating new ones * when multiaccounts is enabled while connecting to a dapp user is able to choose which accounts to connect <img width="361" alt="Screenshot 2023-02-18 at 21 17 55" src="https://user-images.githubusercontent.com/10210143/219900181-82696483-cd7e-44dd-94a4-fe3d8a379db1.png"> When multiaccount is disabled <img width="375" alt="Screenshot 2023-02-19 at 22 36 21" src="https://user-images.githubusercontent.com/10210143/219980363-28a36ce0-ba5d-4743-88e2-3031c9e7bf60.png"> When multiaccount is enabled and user has more than one account https://user-images.githubusercontent.com/10210143/219980417-79a944d4-b409-4046-832a-09d8b98b2c40.mov NOTE: To check the accounts that are connected * switch between accounts and check the dapp status popup * or run ``` chrome.storage.local.get('permissions').then(({permissions: p}) => console.log(p['http://localhost:3000'].accounts)) ``` in the console of the extension. <img width="959" alt="Screenshot 2023-02-18 at 21 22 28" src="https://user-images.githubusercontent.com/10210143/219900158-798d1843-31e2-47fe-81af-3d4d993680a6.png"> Closes APPS-283

pchrysochoidis requested review from Jibz1, mystie711, Jordan-Mysten and mamos-mysten February 18, 2023 21:36

pchrysochoidis force-pushed the pc-wallet-ext-apps-283-app-connect-select-accounts branch from e0dd3bd to 32f5c53 Compare February 18, 2023 21:41

vercel bot temporarily deployed to Preview – wallet-adapter February 18, 2023 21:41 Inactive

vercel bot deployed to Preview – explorer February 18, 2023 21:41 View deployment

vercel bot temporarily deployed to Preview – frenemies February 18, 2023 21:42 Inactive

vercel bot temporarily deployed to Preview – explorer-storybook February 18, 2023 21:42 Inactive

pchrysochoidis marked this pull request as draft February 19, 2023 20:04

pchrysochoidis force-pushed the pc-wallet-ext-apps-283-app-connect-select-accounts branch from 32f5c53 to 41a4c50 Compare February 19, 2023 22:51

vercel bot temporarily deployed to Preview – wallet-adapter February 19, 2023 22:51 Inactive

pchrysochoidis changed the base branch from main to pc-wallet-ext-apps-289-export-account February 19, 2023 22:51

vercel bot temporarily deployed to Preview – explorer-storybook February 19, 2023 22:52 Inactive

vercel bot deployed to Preview – explorer February 19, 2023 22:52 View deployment

vercel bot temporarily deployed to Preview – frenemies February 19, 2023 22:52 Inactive

pchrysochoidis marked this pull request as ready for review February 19, 2023 23:01

pchrysochoidis force-pushed the pc-wallet-ext-apps-289-export-account branch from b674da8 to 90a0795 Compare February 21, 2023 01:09

pchrysochoidis force-pushed the pc-wallet-ext-apps-283-app-connect-select-accounts branch from 41a4c50 to 42c80dc Compare February 21, 2023 01:11

vercel bot deployed to Preview – explorer February 21, 2023 01:12 View deployment

vercel bot temporarily deployed to Preview – explorer-storybook February 21, 2023 01:12 Inactive

vercel bot temporarily deployed to Preview – frenemies February 21, 2023 01:13 Inactive

vercel bot temporarily deployed to Preview – wallet-adapter February 21, 2023 01:13 Inactive

pchrysochoidis force-pushed the pc-wallet-ext-apps-283-app-connect-select-accounts branch from 42c80dc to 3139292 Compare February 22, 2023 01:28

vercel bot deployed to Preview – explorer February 22, 2023 01:29 View deployment

vercel bot temporarily deployed to Preview – frenemies February 22, 2023 01:29 Inactive

vercel bot temporarily deployed to Preview – wallet-adapter February 22, 2023 01:29 Inactive

vercel bot temporarily deployed to Preview – explorer-storybook February 22, 2023 01:30 Inactive

Jibz1 reviewed Feb 22, 2023

View reviewed changes

Jibz1 approved these changes Feb 22, 2023

View reviewed changes

pchrysochoidis force-pushed the pc-wallet-ext-apps-289-export-account branch from 3c2a1bb to 416f643 Compare February 23, 2023 14:02

pchrysochoidis force-pushed the pc-wallet-ext-apps-283-app-connect-select-accounts branch from 3139292 to 074e62b Compare February 23, 2023 14:43

vercel bot temporarily deployed to Preview – explorer-storybook February 23, 2023 14:44 Inactive

vercel bot deployed to Preview – explorer February 23, 2023 14:44 View deployment

vercel bot temporarily deployed to Preview – wallet-adapter February 23, 2023 14:44 Inactive

vercel bot temporarily deployed to Preview – frenemies February 23, 2023 14:44 Inactive

Base automatically changed from pc-wallet-ext-apps-289-export-account to main February 23, 2023 20:58

pchrysochoidis added 3 commits February 24, 2023 01:21

wallet-ext: wallet list select component

a484f83

wallet-ext: allow selecting the accounts to connect with a dapp

c14d9c4

wallet-ext: remove useMiddleEllipsis usages

9b86bc8

pchrysochoidis force-pushed the pc-wallet-ext-apps-283-app-connect-select-accounts branch from 074e62b to 9b86bc8 Compare February 24, 2023 01:23

vercel bot temporarily deployed to Preview – wallet-adapter February 24, 2023 01:23 Inactive

vercel bot deployed to Preview – explorer February 24, 2023 01:24 View deployment

vercel bot temporarily deployed to Preview – explorer-storybook February 24, 2023 01:24 Inactive

pchrysochoidis merged commit 5478f7b into main Feb 24, 2023

pchrysochoidis deleted the pc-wallet-ext-apps-283-app-connect-select-accounts branch February 24, 2023 13:05

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

wallet-ext: allow selecting the accounts to connect to dapp #8413

wallet-ext: allow selecting the accounts to connect to dapp #8413

pchrysochoidis commented Feb 18, 2023 •

edited

Loading

vercel bot commented Feb 18, 2023 •

edited

Loading

mystie711 commented Feb 21, 2023

pchrysochoidis commented Feb 21, 2023 •

edited

Loading

Jibz1 Feb 22, 2023

pchrysochoidis Feb 22, 2023 •

edited

Loading

pchrysochoidis Feb 22, 2023 •

edited

Loading

Jibz1 Feb 22, 2023

pchrysochoidis Feb 23, 2023

Jibz1 left a comment

mystie711 commented Feb 23, 2023

pchrysochoidis commented Feb 23, 2023

wallet-ext: allow selecting the accounts to connect to dapp #8413

wallet-ext: allow selecting the accounts to connect to dapp #8413

Conversation

pchrysochoidis commented Feb 18, 2023 • edited Loading

vercel bot commented Feb 18, 2023 • edited Loading

mystie711 commented Feb 21, 2023

pchrysochoidis commented Feb 21, 2023 • edited Loading

Jibz1 Feb 22, 2023

Choose a reason for hiding this comment

pchrysochoidis Feb 22, 2023 • edited Loading

Choose a reason for hiding this comment

pchrysochoidis Feb 22, 2023 • edited Loading

Choose a reason for hiding this comment

Jibz1 Feb 22, 2023

Choose a reason for hiding this comment

pchrysochoidis Feb 23, 2023

Choose a reason for hiding this comment

Jibz1 left a comment

Choose a reason for hiding this comment

mystie711 commented Feb 23, 2023

pchrysochoidis commented Feb 23, 2023

pchrysochoidis commented Feb 18, 2023 •

edited

Loading

vercel bot commented Feb 18, 2023 •

edited

Loading

pchrysochoidis commented Feb 21, 2023 •

edited

Loading

pchrysochoidis Feb 22, 2023 •

edited

Loading

pchrysochoidis Feb 22, 2023 •

edited

Loading