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

Add Loading Skeletons #12507

Merged
merged 6 commits into from
Mar 16, 2022
Merged

Add Loading Skeletons #12507

merged 6 commits into from
Mar 16, 2022

Conversation

muliswilliam
Copy link
Contributor

This PR adds loading skeletons to the following areas of wallet UI:

  • Visible assets list
  • Portfolio Balance
  • Selected Asset Balance

Transaction List Loading Skeleton will be added in a separate PR.

Resolves brave/brave-browser#21339

Submitter Checklist:

  • I confirm that no security/privacy review is needed, or that I have requested one
  • 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, npm run lint, 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:

Loading.Skeleton.1.mov
Loading.Skeleton.2.mov

@github-actions github-actions bot added the CI/storybook-url Deploy storybook and provide a unique URL for each build label Mar 7, 2022
@brave-builds
Copy link
Collaborator

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

@brave-builds
Copy link
Collaborator

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

@muliswilliam muliswilliam added this to the 1.38.x - Nightly milestone Mar 15, 2022
Copy link
Member

@onyb onyb left a comment

Choose a reason for hiding this comment

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

Looks good to me. Just a small remark that we need to be careful with the hardcoded width/height numbers. Not sure if there's a dynamic solution for it, but good for now.

@muliswilliam
Copy link
Contributor Author

Looks good to me. Just a small remark that we need to be careful with the hardcoded width/height numbers. Not sure if there's a dynamic solution for it, but good for now.

@onyb I have created an issue for this: brave/brave-browser#21701

@brave-builds
Copy link
Collaborator

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

@muliswilliam muliswilliam merged commit 16c838e into master Mar 16, 2022
@muliswilliam muliswilliam deleted the loading-skeletons branch March 16, 2022 08:31
muliswilliam added a commit that referenced this pull request Mar 16, 2022
* Added loading skeleton component

* Added loading skeleton to portfolio asset item

* Added loading skeleton for portfolio balance

* Added loading skeleton component to shared

* Added a utility function to get a random number within a specified range

* Use unbiasedRandom to generate width
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CI/storybook-url Deploy storybook and provide a unique URL for each build
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Add Loading skeletons to assets list and transactions and any other sections to improve UX
4 participants