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.

Sign up for GitHub

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

Jump to bottom

feat(wallet): Implement NFT management v2 #20204

Merged
merged 9 commits into from
Sep 21, 2023
Merged

feat(wallet): Implement NFT management v2 #20204

merged 9 commits into from
Sep 21, 2023

Conversation

muliswilliam
Copy link
Contributor

@muliswilliam muliswilliam commented Sep 18, 2023 •
edited
Loading

Resolves brave/brave-browser#33095
Resolves brave/brave-browser#32984

Submitter Checklist:

  • I confirm that no security/privacy review is needed and no other type of reviews are needed, or that I have requested them
  • There is a ticket for my issue
  • Used Github auto-closing keywords in the PR description above
  • Wrote a good PR/commit description
  • Squashed any review feedback or "fixup" commits before merge, so that history is a record of what happened in the repo, not your PR
  • Added appropriate labels (QA/Yes or QA/No; release-notes/include or release-notes/exclude; OS/...) to the associated issue
  • Checked the PR locally:
    • npm run test -- brave_browser_tests, npm run test -- brave_unit_tests wiki
    • npm run lint, npm run presubmit wiki, npm run gn_check, npm run tslint
  • Ran git rebase master (if needed)

Reviewer Checklist:

  • A security review is not needed, or a link to one is included in the PR description
  • New files have MPL-2.0 license header
  • Adequate test coverage exists to prevent regressions
  • Major classes, functions and non-trivial code blocks are well-commented
  • Changes in component dependencies are properly reflected in gn
  • Code follows the style guide
  • Test plan is specified in PR before merging

After-merge Checklist:

Test Plan:

Switching NFT Views

  • Go to Portfolio
  • Click on NFT tab
  • On the left, it should show Collected and number of NFTs that are not spam or hidden
  • Clicking the Collected button should open a dropdown with 2 options, Collected and Hidden
  • You can switch between the options to switch which NFTs are displayed

NFT Actions

  • To view NFT options, click on ... on the bottom right of each NFT.

  • For non-spam or not hidden NFTs, it will show 3 options: Edit, Hide and Don't show in wallet

  • Clicking on Edit should show NFT form from which you can edit and save NFT details

  • Clicking on Hide moves the NFT to hidden tab

  • Clicking on Remove from wallet shows a confirmation modal. If a user confirms, the NFT is deleted from their wallet asset list

  • For spam NFTs the actions shown are: Mark as not junk and Don't show in wallet.

  • Clicking on Mark as not junk moves the NFT from hidden tab to collected tab

  • Clicking on Don't show in wallet behaves the same way as described above.

NFT Item UI changes

  • Each NFT item has account on the bottom right corner. The visibility can be controlled in Portfolio filters
  • Spam NFTs have a Junk label on the top right.
  • Actions button has been moved from top right to the bottom of the NFT image
Screenshot 2023-09-18 at 19 47 32 Screenshot 2023-09-18 at 19 48 15 Screenshot 2023-09-18 at 19 51 20 Screenshot 2023-09-18 at 19 53 23 Screenshot 2023-09-18 at 20 18 48

@muliswilliam muliswilliam requested review from a team as code owners September 18, 2023 17:21
@github-actions github-actions bot added CI/storybook-url Deploy storybook and provide a unique URL for each build feature/web3/wallet feature/web3/wallet/core labels Sep 18, 2023
@brave-builds
Copy link
Collaborator

A Storybook has been deployed to preview UI for the latest push

@muliswilliam muliswilliam mentioned this pull request Sep 19, 2023
Closed
mkarolin
mkarolin approved these changes Sep 19, 2023
View reviewed changes
Copy link
Collaborator

@mkarolin mkarolin left a comment

Choose a reason for hiding this comment

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

strings++ (with a formatting fix)

josheleonard
josheleonard suggested changes Sep 21, 2023
View reviewed changes
components/brave_wallet/browser/brave_wallet_constants.h Outdated Show resolved Hide resolved
components/brave_wallet_ui/common/slices/endpoints/nfts.endpoints.ts Outdated Show resolved Hide resolved
..._ui/components/desktop/views/nfts/components/nft-group-selector/nft-group-selector.styles.ts Outdated Show resolved Hide resolved
components/brave_wallet_ui/components/desktop/views/nfts/components/nfts.tsx Outdated Show resolved Hide resolved
components/brave_wallet_ui/components/desktop/views/nfts/components/nfts.tsx Outdated Show resolved Hide resolved
components/brave_wallet_ui/components/desktop/views/nfts/components/nfts.tsx Outdated Show resolved Hide resolved
components/brave_wallet_ui/components/desktop/views/portfolio/components/nft-grid-view/style.ts Outdated Show resolved Hide resolved
components/brave_wallet_ui/components/desktop/views/portfolio/components/nft-grid-view/style.ts Outdated Show resolved Hide resolved
...ve_wallet_ui/components/desktop/views/portfolio/components/nft-more-popup/nft-more-popup.tsx Outdated Show resolved Hide resolved
...ve_wallet_ui/components/desktop/views/portfolio/components/nft-more-popup/nft-more-popup.tsx Outdated Show resolved Hide resolved
@brave-builds
Copy link
Collaborator

A Storybook has been deployed to preview UI for the latest push

josheleonard
josheleonard approved these changes Sep 21, 2023
View reviewed changes
Copy link
Contributor

@josheleonard josheleonard left a comment

Choose a reason for hiding this comment

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

Approved with suggestions

josheleonard
josheleonard approved these changes Sep 21, 2023
View reviewed changes
Copy link
Contributor

@josheleonard josheleonard left a comment

Choose a reason for hiding this comment

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

LGTM

@brave-builds
Copy link
Collaborator

A Storybook has been deployed to preview UI for the latest push

@muliswilliam muliswilliam merged commit eb7d8ed into master Sep 21, 2023
6 checks passed
@muliswilliam muliswilliam deleted the feat-nft-mgt-v2 branch September 21, 2023 17:11
@github-actions github-actions bot added this to the 1.60.x - Nightly milestone Sep 21, 2023
muliswilliam added a commit that referenced this pull request Sep 26, 2023
@muliswilliam @josheleonard
feat(wallet): Implement NFT management v2 (#20204)
de067e3 
* Added group selector

* WIP

* Design implement + strings

* Format

* Fix storybook

* implement feedback

* Update components/brave_wallet/browser/brave_wallet_constants.h

Co-authored-by: Josh Leonard <30185185+josheleonard@users.noreply.github.com>

* Move account lookup to the component

* Fix string spelling

---------

Co-authored-by: Josh Leonard <30185185+josheleonard@users.noreply.github.com>
@muliswilliam muliswilliam mentioned this pull request Sep 26, 2023
Merged
7 tasks
@srirambv
Copy link
Contributor

srirambv commented Sep 28, 2023 •
edited
Loading

Verification passed on

Brave 1.60.63 Chromium: 118.0.5993.21 (Official Build) nightly (64-bit)
Revision 3c2401f
OS Linux
  • Verified steps from PR
  • Verified switching to NFT view shows Collected [x] when NFTs are auto-discovered or added manually
  • Verified selecting Hidden shows the list of NFTs that are marked as Junk
  • Verified enabling icons from menu shows the network icon and the account blockie
  • Verified on a visible NFT, clicking menu shows option for Edit, Hide and Don't show in Wallet
  • Verified selecting Hide on an NFT moves it to hidden list
  • Verified selecting Unhide on an NFT in the hidden list moves it to Collected list
  • Encountered #33305, #33306, #33307

kjozwiak pushed a commit that referenced this pull request Sep 29, 2023
@muliswilliam @josheleonard
feat(wallet): Implement NFT management v2 (Uplift to 1.59.x) (#20297)
cd4c9e8 
* feat(wallet): Implement NFT management v2 (#20204)

* Added group selector

* WIP

* Design implement + strings

* Format

* Fix storybook

* implement feedback

* Update components/brave_wallet/browser/brave_wallet_constants.h

Co-authored-by: Josh Leonard <30185185+josheleonard@users.noreply.github.com>

* Move account lookup to the component

* Fix string spelling

---------

Co-authored-by: Josh Leonard <30185185+josheleonard@users.noreply.github.com>

* Fix API slice errors

* Fix storybook

---------

Co-authored-by: Josh Leonard <30185185+josheleonard@users.noreply.github.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@mkarolin mkarolin mkarolin approved these changes

@josheleonard josheleonard josheleonard approved these changes

@nvonpentz nvonpentz nvonpentz approved these changes

Assignees

@muliswilliam muliswilliam

Labels
CI/storybook-url Deploy storybook and provide a unique URL for each build feature/web3/wallet/core feature/web3/wallet
Projects
None yet
Milestone
1.60.x - Release
Development

Successfully merging this pull request may close these issues.

Implement NFT management v2 NFT Spam title showing '0' suffix when no NFTs marked as spam
6 participants
@muliswilliam @brave-builds @srirambv @nvonpentz @josheleonard @mkarolin