Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

wallet-ext: multiple accounts in active connections view #8436

Merged
merged 6 commits into from
Feb 24, 2023

Conversation

pchrysochoidis
Copy link
Contributor

@pchrysochoidis pchrysochoidis commented Feb 20, 2023

  • useExplorerLink hook
    • move the creation of the explorer link out of the ExplorerLink component
  • components to be used in connected dapps view
    • added DAppInfoCard a box that shows the dapp icon name and link
    • added DAppPermissionsList that shows a list of permissions
    • updated SummaryCard to fix overflow and borders for footer and add a divider option
    • updated WalletListSelect to add disconnect mode, disabled state and allow filtering visible accounts
  • add functionality to disconnect only specific accounts
  • support multi accounts in connected apps view
    • allow disconnecting specific account from a dapp
    • some refactoring for SuiApps to
      • connected apps to use also the data from the WalletDapps list
      • simplify Props
      • fix stylings and use new components like Link and Button
      • mint demo nft toasts and using mutation

Playground/WalletApps listing page styling changes

Screen.Recording.2023-02-20.at.20.50.58.mov

Multi-accounts in Disconnect app view

Screen.Recording.2023-02-20.at.20.51.59.mov
Screen.Recording.2023-02-20.at.20.53.47.mov
Screen.Recording.2023-02-20.at.20.54.18.mov

closes APPS-284

@vercel
Copy link

vercel bot commented Feb 20, 2023

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:17PM (UTC)
explorer-storybook ✅ Ready (Inspect) Visit Preview 💬 Add your feedback Feb 24, 2023 at 1:17PM (UTC)
frenemies ✅ Ready (Inspect) Visit Preview 💬 Add your feedback Feb 24, 2023 at 1:17PM (UTC)
wallet-adapter ✅ Ready (Inspect) Visit Preview 💬 Add your feedback Feb 24, 2023 at 1:17PM (UTC)

@pchrysochoidis pchrysochoidis changed the base branch from main to pc-wallet-ext-apps-283-app-connect-select-accounts February 20, 2023 12:30
@pchrysochoidis pchrysochoidis force-pushed the pc-wallet-ext-apps-284-active-accounts branch from 795f887 to 321343d Compare February 20, 2023 20:44
@vercel vercel bot temporarily deployed to Preview – wallet-adapter February 20, 2023 20:45 Inactive
@vercel vercel bot temporarily deployed to Preview – frenemies February 20, 2023 20:45 Inactive
@vercel vercel bot temporarily deployed to Preview – explorer-storybook February 20, 2023 20:46 Inactive
@pchrysochoidis pchrysochoidis force-pushed the pc-wallet-ext-apps-284-active-accounts branch from 321343d to ede4922 Compare February 20, 2023 20:49
@vercel vercel bot temporarily deployed to Preview – frenemies February 20, 2023 20:50 Inactive
@vercel vercel bot temporarily deployed to Preview – explorer-storybook February 20, 2023 20:50 Inactive
@vercel vercel bot temporarily deployed to Preview – wallet-adapter February 20, 2023 20:50 Inactive
@pchrysochoidis pchrysochoidis force-pushed the pc-wallet-ext-apps-284-active-accounts branch from ede4922 to 75a2bc0 Compare February 20, 2023 20:53
@vercel vercel bot temporarily deployed to Preview – frenemies February 20, 2023 20:53 Inactive
@vercel vercel bot temporarily deployed to Preview – wallet-adapter February 20, 2023 20:53 Inactive
@vercel vercel bot temporarily deployed to Preview – explorer-storybook February 20, 2023 20:54 Inactive
@pchrysochoidis pchrysochoidis marked this pull request as ready for review February 20, 2023 20:58
@pchrysochoidis pchrysochoidis force-pushed the pc-wallet-ext-apps-283-app-connect-select-accounts branch from 41a4c50 to 42c80dc Compare February 21, 2023 01:11
@pchrysochoidis pchrysochoidis force-pushed the pc-wallet-ext-apps-284-active-accounts branch from 75a2bc0 to 84e0389 Compare February 21, 2023 01:15
@vercel vercel bot temporarily deployed to Preview – frenemies February 21, 2023 01:16 Inactive
@vercel vercel bot temporarily deployed to Preview – explorer-storybook February 21, 2023 01:16 Inactive
@vercel vercel bot temporarily deployed to Preview – wallet-adapter February 21, 2023 01:16 Inactive
@mystie711
Copy link
Collaborator

Looking good overall. Some UI polish items below.

Double check the check-unselected color & the row item color,
image

Update text to "Minting failed. Try again in a bit."
image

Update resting arrow color,
image

Could we move the toast during fade out so it does not look like it overlaps the bottom footer? Shorten the move distance. And yes, please apply this universally to all toasts in the component we use!
image

@vercel vercel bot temporarily deployed to Preview – wallet-adapter February 22, 2023 00:48 Inactive
@pchrysochoidis pchrysochoidis force-pushed the pc-wallet-ext-apps-284-active-accounts branch from 0737ac4 to 1743a5f Compare February 23, 2023 16:20
@vercel vercel bot temporarily deployed to Preview – wallet-adapter February 23, 2023 16:21 Inactive
@vercel vercel bot temporarily deployed to Preview – explorer-storybook February 23, 2023 16:22 Inactive
@vercel vercel bot temporarily deployed to Preview – frenemies February 23, 2023 16:22 Inactive
@pchrysochoidis pchrysochoidis force-pushed the pc-wallet-ext-apps-283-app-connect-select-accounts branch from 074e62b to 9b86bc8 Compare February 24, 2023 01:23
@pchrysochoidis pchrysochoidis force-pushed the pc-wallet-ext-apps-284-active-accounts branch from 1743a5f to 8097910 Compare February 24, 2023 01:47
@vercel vercel bot temporarily deployed to Preview – wallet-adapter February 24, 2023 01:48 Inactive
@vercel vercel bot temporarily deployed to Preview – explorer-storybook February 24, 2023 01:49 Inactive
Base automatically changed from pc-wallet-ext-apps-283-app-connect-select-accounts to main February 24, 2023 13:05
* move the creation of the explorer link out of the ExplorerLink component
* added DAppInfoCard a box that shows the dapp icon name and link
* added DAppPermissionsList that shows a list of permissions
* updated SummaryCard to fix overflow and borders for footer and add a divider option
* updated WalletListSelect to add disconnect mode, disabled state and allow filtering visible accounts
* allow disconnecting specific account from a dapp
* some refactoring for SuiApps to
  * connected apps to use also the data from the WalletDapps list
  * simplify Props
  * fix stylings and use new components like Link and Button
* use suiDark link color in DAppInfoCard
@pchrysochoidis pchrysochoidis force-pushed the pc-wallet-ext-apps-284-active-accounts branch from 8097910 to ae023d8 Compare February 24, 2023 13:16
@vercel vercel bot temporarily deployed to Preview – wallet-adapter February 24, 2023 13:16 Inactive
@vercel vercel bot temporarily deployed to Preview – explorer-storybook February 24, 2023 13:17 Inactive
<div className={st.desc}>
<div className={st.title}>Builders in sui ecosystem</div>
{ecosystemApps?.length ? (
<>
Apps here are actively curated but do not indicate any
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

not a blocker we could use Text component here

href={accountOnExplorerHref!}
text="View account on Sui Explorer"
onClick={() => {
trackEvent('ViewExplorerAccount');
Copy link
Contributor

@Jibz1 Jibz1 Feb 24, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

no need for the bracket before and after trackEvent

title={name}
className={st.ecosystemApp}
showIcon={false}
onClick={onClickAppLink}
onClick={() => {
trackEvent('AppOpen', {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

same here

Copy link
Contributor

@Jibz1 Jibz1 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Except for the minor nit and connected app issue LGTM

@pchrysochoidis
Copy link
Contributor Author

@Jibz1 about the Text component, we should revisit the components used here anyway to remove scss modules use new UI components etc. Now I just tried to touch as less as possible in interest of time. Will leave this and the function props to be addressed at that time.

About the issue you mean the one we discussed offline right (not something else)? - When we connect to a site and we have the wallet in the connected view on another tab, the list of connected apps doesn't update (jira issue) . This is an existing behaviour and this PR didn't break it so I think it should be addressed in another PR.

@pchrysochoidis pchrysochoidis merged commit 448f16a into main Feb 24, 2023
@pchrysochoidis pchrysochoidis deleted the pc-wallet-ext-apps-284-active-accounts branch February 24, 2023 14:34
pchrysochoidis added a commit that referenced this pull request Mar 1, 2023
* useExplorerLink hook 
* move the creation of the explorer link out of the ExplorerLink
component
* components to be used in connected dapps view 
  * added DAppInfoCard a box that shows the dapp icon name and link
  * added DAppPermissionsList that shows a list of permissions
* updated SummaryCard to fix overflow and borders for footer and add a
divider option
* updated WalletListSelect to add disconnect mode, disabled state and
allow filtering visible accounts
* add functionality to disconnect only specific accounts
* support multi accounts in connected apps view 
  * allow disconnecting specific account from a dapp
  * some refactoring for SuiApps to
    * connected apps to use also the data from the WalletDapps list
    * simplify Props
    * fix stylings and use new components like Link and Button
    * mint demo nft toasts and using mutation

Playground/WalletApps listing page styling changes


https://user-images.githubusercontent.com/10210143/220197176-e68aff9e-515b-4633-a82d-275c721cd5db.mov

Multi-accounts in Disconnect app view



https://user-images.githubusercontent.com/10210143/220197372-c982fc9e-ba83-4820-896c-c08e902a203e.mov



https://user-images.githubusercontent.com/10210143/220197417-730f9b3b-2fd8-47c7-a95d-6f5aa45856c4.mov



https://user-images.githubusercontent.com/10210143/220197467-b2a682d2-23ed-42dc-a484-66e9c69ed3b6.mov


closes APPS-284
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants