feat: [IOPID-1507] Integrate new DS in Pin Screen flow

[ChrisMattew]

Short description

Split Pin Screen in two dedicated components

List of changes proposed in this pull request

• Integration of new DS in Pin Screen section
• Split the old Pin Screen in PinCreation and PinConfirmation components which respectively handle the pin creation and confirmation workflows
• Replaced the Alert message which forced the user to restart the application after pin change operation in Profile section with a non-blocking toast message**
• Extended CodeInput component with a custom wrapper delegated to trigger keyboard opening on element focus

[!Note] ** The need to restart the application after the pin was changed comes from this PR to make it immediately available in app. Today this behavior is not necessary anymore because the pin is now retrieved directly from react-native-keychain when needed.

Test

E2E

[!Tip]

Screens

iOS

Onboarding pin creation	Profile pin change

Pin error validation	Pin error match

Android

Onboarding pin creation	Profile pin change

Pin error validation	Pin error match

Accessibility iOS & Android

iOS	Android

How to test

Since this component is used in two sections of the app - Onboarding and Profile flows - there are two different ways in which it can be tested.

Profile section

This is the easiest way in which it can be tested:

• In a logged-in context navigate to Profile > Security > Change the unlock code
• Insert the old pin, when requested, to enable the pin change flow

Onboarding section

Testing in local environment - clone io-dev-api-server repo if you haven't did it yet and follow the instructions - go in config/config.json and in profile.attrs add a fiscal code under fiscal_code key (must be 16 characters long), restart you backend and then restart the application to login again and display the onboarding flow with the new Pin Screen.

 {
   "profile": {
     "attrs": {
       "name": "Gian Maria",
       "fiscal_code": "AAAAAA00A00A000B"
     }
   }
}

[!Tip] To try multiple times repeat the process changing at least one fiscal_code character

[pagopa-github-bot]

	Warnings
:warning:	Multiple stories with different types are associated with this Pull request. Only one tag will be added, following the order: feature > bug > chore

Affected stories

• 🌟 IOPID-1507: [DS-Onboarding][APP] Pin Screen subtask of
  • ⚡ IOPID-1498: DS - Schermate Onboarding/First Onboarding (16)
• 🌟 IOPID-1533: [DS-Profile] ⚠️ Sicurezza - Modifica codice sblocco subtask of
  • ⚡ IOPID-1516: DS - Sezione Profilo (20)

Generated by :no_entry_sign: dangerJS against 224ba62ca5f7cd087bdc8b2d75355623a5d91fde

[codecov[bot]]

Codecov Report

Attention: Patch coverage is 66.91729% with 44 lines in your changes missing coverage. Please review.

Project coverage is 49.62%. Comparing base (4f204b4) to head (224ba62). Report is 123 commits behind head on master.

Additional details and impacted files

@@            Coverage Diff             @@
##           master    #5737      +/-   ##
==========================================
+ Coverage   48.42%   49.62%   +1.19%     
==========================================
  Files        1488     1653     +165     
  Lines       31617    32916    +1299     
  Branches     7669     8009     +340     
==========================================
+ Hits        15311    16333    +1022     
- Misses      16238    16521     +283     
+ Partials       68       62       -6     

Files	Coverage Δ
...components/screens/PinCreation/PinCarouselItem.tsx	100.00% <100.00%> (ø)
...creens/PinCreation/usePinValidationBottomSheet.tsx	100.00% <100.00%> (ø)
ts/navigation/OnboardingNavigator.tsx	66.66% <ø> (ø)
ts/navigation/ProfileNavigator.tsx	66.66% <ø> (+26.66%)	:arrow_up:
ts/sagas/startup/checkConfiguredPinSaga.ts	0.00% <ø> (ø)
ts/screens/onboarding/OnboardingPinScreen.tsx	50.00% <50.00%> (ø)
ts/screens/profile/PinScreen.tsx	50.00% <50.00%> (ø)
ts/components/BulletList.tsx	81.81% <81.81%> (ø)
ts/components/Carousel.tsx	88.23% <88.23%> (ø)
ts/utils/hooks/useOnboardingAbortAlert.ts	57.14% <33.33%> (+42.85%)	:arrow_up:
... and 2 more

... and 613 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 5d017f9...224ba62. Read the comment docs.

[ChrisMattew]

@mariateresaventura copy review needed 🙏🏼

[mariateresaventura]

@mariateresaventura copy review needed 🙏🏼

Done!

[ChrisMattew]

@mariateresaventura copy review needed! 🙏🏼

[mariateresaventura]

@mariateresaventura copy review needed! 🙏🏼

Done!