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

feat(IT Wallet): [SIW-560] Generalize loading component #5055

Merged

Conversation

LazyAfternoons
Copy link
Contributor

@LazyAfternoons LazyAfternoons commented Oct 2, 2023

Short description

This PR proposes a generalization of the ItwLoadingSpinner.

List of changes proposed in this pull request

  • Adds an optional size prop which defaults to 24 to render the spinner component in different sizes. 76 is kept for backward compatibility with the existing screens and will be removed after we migrate completely to the new design system.
  • Makes the color prop optional which defaults to IOColors["blueIO-500"] for the new design system;
  • Removes captionTitle and captionSubtitle from the loading spinner component and moves it to ItwLoadingSpinnerOverlay.tsx which is also updated with the new design system.

How to test

Test an issuing flow and check for any regression. Please note that the "legacy" spinner might be a little thinner than before. Also, this is still not updated with the new gradient style.

@LazyAfternoons LazyAfternoons temporarily deployed to dev October 2, 2023 09:30 — with GitHub Actions Inactive
@pagopa-github-bot pagopa-github-bot changed the title [SIW-560] Generalize loading component feat(IT Wallet): [SIW-560] Generalize loading component Oct 2, 2023
@pagopa-github-bot
Copy link
Collaborator

pagopa-github-bot commented Oct 2, 2023

Affected stories

  • 🌟 SIW-560: [APP] Generalizzazione del component di caricamento
    subtask of
    • 🌟 SIW-443: [APP] Come utente voglio poter selezionare la credenziale da aggiungere nel wallet

Generated by 🚫 dangerJS against 07eb409

@LazyAfternoons LazyAfternoons marked this pull request as ready for review October 2, 2023 09:38
@LazyAfternoons LazyAfternoons requested a review from a team as a code owner October 2, 2023 09:38
@codecov
Copy link

codecov bot commented Oct 2, 2023

Codecov Report

Merging #5055 (3fca22c) into bundle/it-wallet (308461f) will increase coverage by 0.06%.
Report is 20 commits behind head on bundle/it-wallet.
The diff coverage is 14.63%.

❗ Current head 3fca22c differs from pull request most recent head 07eb409. Consider uploading reports for the commit 07eb409 to get more accurate results

Additional details and impacted files

Impacted file tree graph

@@                 Coverage Diff                  @@
##           bundle/it-wallet    #5055      +/-   ##
====================================================
+ Coverage             46.42%   46.48%   +0.06%     
====================================================
  Files                  1583     1584       +1     
  Lines                 32906    32855      -51     
  Branches               8305     8176     -129     
====================================================
- Hits                  15275    15273       -2     
+ Misses                17568    17527      -41     
+ Partials                 63       55       -8     
Files Coverage Δ
ts/components/messages/MessagesInbox.tsx 64.28% <ø> (ø)
ts/components/ui/SwitchListItem.tsx 17.64% <ø> (ø)
ts/config.ts 100.00% <100.00%> (ø)
ts/features/design-system/core/DSAdvice.tsx 46.15% <ø> (ø)
ts/features/design-system/core/DSButtons.tsx 22.91% <ø> (+10.96%) ⬆️
.../features/it-wallet/components/ItwActionBanner.tsx 16.66% <ø> (+2.38%) ⬆️
.../it-wallet/components/ItwLoadingSpinnerOverlay.tsx 25.00% <ø> (ø)
ts/features/it-wallet/components/ListItemItw.tsx 11.53% <ø> (ø)
ts/features/it-wallet/navigation/ItwRoutes.ts 100.00% <ø> (ø)
...eatures/it-wallet/navigation/ItwStackNavigator.tsx 66.66% <ø> (ø)
... and 21 more

... and 8 files with indirect coverage changes


Continue to review full report in Codecov by Sentry.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update bea8c43...07eb409. Read the comment docs.

Copy link
Contributor

@hevelius hevelius left a comment

Choose a reason for hiding this comment

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

LGTM

@hevelius hevelius temporarily deployed to dev October 2, 2023 11:15 — with GitHub Actions Inactive
@LazyAfternoons LazyAfternoons merged commit 18977da into bundle/it-wallet Oct 2, 2023
4 checks passed
@LazyAfternoons LazyAfternoons deleted the SIW-560-generalize-loading-component branch October 2, 2023 12:12
LazyAfternoons added a commit that referenced this pull request Oct 4, 2023
## Short description
This PR proposes a generalization of the `ItwLoadingSpinner`. 

## List of changes proposed in this pull request
- Adds an optional `size` prop which defaults to `24` to render the
spinner component in different sizes. `76` is kept for backward
compatibility with the existing screens and will be removed after we
migrate completely to the new design system.
- Makes the `color` prop optional which defaults to
`IOColors["blueIO-500"]` for the new design system;
- Removes `captionTitle` and `captionSubtitle` from the loading spinner
component and moves it to `ItwLoadingSpinnerOverlay.tsx` which is also
updated with the new design system.

## How to test
Test an issuing flow and check for any regression. Please note that the
"legacy" spinner might be a little thinner than before. Also, this is
still not updated with the new gradient style.

---------

Co-authored-by: Mario Perrotta <mario.perrotta@pagopa.it>
dmnplb added a commit to pagopa/io-app-design-system that referenced this pull request Oct 9, 2023
## Short description
This PR adds the new `LoadingSpinner` component, derived from
`ItwLoadingSpinner` developed specifically for the IT Wallet flow. To
learn more about the original component:
* pagopa/io-app#5055

## List of changes proposed in this pull request
- Slightly refactor the original component
- Add the new **Loaders** page to the example app

### Preview


https://github.com/pagopa/io-app-design-system/assets/1255491/fa506c48-eea3-4210-854c-b5fe66ba5132



## How to test
1. Launch the example app
2. Go to the **Loaders** page

---------

Co-authored-by: Cristiano Tofani <cri.tofani@gmail.com>
LazyAfternoons added a commit that referenced this pull request Nov 20, 2023
## Short description
This PR proposes a generalization of the `ItwLoadingSpinner`. 

## List of changes proposed in this pull request
- Adds an optional `size` prop which defaults to `24` to render the
spinner component in different sizes. `76` is kept for backward
compatibility with the existing screens and will be removed after we
migrate completely to the new design system.
- Makes the `color` prop optional which defaults to
`IOColors["blueIO-500"]` for the new design system;
- Removes `captionTitle` and `captionSubtitle` from the loading spinner
component and moves it to `ItwLoadingSpinnerOverlay.tsx` which is also
updated with the new design system.

## How to test
Test an issuing flow and check for any regression. Please note that the
"legacy" spinner might be a little thinner than before. Also, this is
still not updated with the new gradient style.

---------

Co-authored-by: Mario Perrotta <mario.perrotta@pagopa.it>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants