From 3af2b049a760089bb0dda405842498c8c4613405 Mon Sep 17 00:00:00 2001 From: Damiano Plebani Date: Mon, 15 May 2023 17:23:19 +0200 Subject: [PATCH] chore: [IAI-237] Replace `IconFont` with the `Icon` component (#4502) This PR removes the legacy `IconFont` component and replaces it with the new `Icon` component. --------- Co-authored-by: Mario Perrotta Co-authored-by: Cristiano Tofani Co-authored-by: Fabio Bombardi <16268789+shadowsheep1@users.noreply.github.com> --- docs/icomoon-font-export.png | Bin 39385 -> 0 bytes img/assistance/battery.svg | 4 - img/assistance/card.svg | 4 - img/assistance/email.svg | 3 - img/assistance/gallery.svg | 3 - img/assistance/giacenza.svg | 13 - img/assistance/history.svg | 4 - img/assistance/info.svg | 3 - img/assistance/login.svg | 12 - img/assistance/nameSurname.svg | 3 - img/assistance/telefonia.svg | 3 - img/assistance/website.svg | 3 - img/icons/Eye.svg | 5 - img/icons/openweburl.svg | 3 - img/wallet/payment-methods/paypal/edit.svg | 6 - img/wallet/payment-methods/paypal/label.svg | 20 -- .../payment-methods/paypal/money_down.svg | 3 - ts/components/AdviceComponent.tsx | 24 +- ts/components/CalendarsListContainer.tsx | 2 +- ts/components/ChooserListContainer.tsx | 6 +- ts/components/ChooserListItem.tsx | 16 +- ts/components/ContextualInfo.tsx | 12 +- ts/components/DetailedlistItemComponent.tsx | 14 +- ts/components/EmailReadComponent.tsx | 17 +- ts/components/FiscalCodeLandscapeOverlay.tsx | 4 +- ts/components/GoBackButton.tsx | 8 +- ts/components/IdpSuccessfulAuthentication.tsx | 7 +- ts/components/LabelledItem/Icon.tsx | 3 +- ts/components/MessagesTabIcon.tsx | 5 +- ts/components/NoticeBox.tsx | 47 ---- ts/components/PinCreationForm.tsx | 2 +- ts/components/Pinpad/KeyPad.tsx | 24 +- ts/components/Pinpad/index.tsx | 10 +- ts/components/ProfileTabIcon.tsx | 11 +- ts/components/RegionServiceWebView.tsx | 44 ++-- .../RemindEmailValidationOverlay.tsx | 37 +-- ts/components/SectionStatus/StatusContent.tsx | 21 +- .../__tests__/SectionStatusContent.test.tsx | 6 +- .../SectionStatusContent.test.tsx.snap | 129 +++++++--- ts/components/SectionStatus/index.tsx | 18 +- ts/components/ServiceTabIcon.tsx | 7 +- ts/components/WalletTabIcon.tsx | 5 +- .../__tests__/ContextualInfo.test.tsx | 12 +- .../bottomSheet/BottomSheetHeader.tsx | 7 +- ts/components/box/InfoBox.tsx | 19 +- ts/components/cie/CieNotSupported.tsx | 31 +-- ts/components/cie/CieReadingCardAnimation.tsx | 11 +- ts/components/core/accordion/RawAccordion.tsx | 10 +- ts/components/core/icons/Icon.tsx | 140 +++++++---- ts/components/core/icons/svg/IconAbacus.tsx | 4 +- ts/components/core/icons/svg/IconAdd.tsx | 4 +- .../core/icons/svg/IconAgreement.tsx | 4 +- ts/components/core/icons/svg/IconAmount.tsx | 4 +- .../core/icons/svg/IconAnalytics.tsx | 4 +- .../core/icons/svg/IconArrowBottom.tsx | 4 +- .../core/icons/svg/IconArrowLeft.tsx | 4 +- .../core/icons/svg/IconArrowRight.tsx | 4 +- ts/components/core/icons/svg/IconArrowTop.tsx | 4 +- .../core/icons/svg/IconAttachment.tsx | 4 +- .../core/icons/svg/IconBackAndroid.tsx | 4 +- ts/components/core/icons/svg/IconBackiOS.tsx | 4 +- ts/components/core/icons/svg/IconBarcode.tsx | 4 +- ts/components/core/icons/svg/IconBattery.tsx | 4 +- ts/components/core/icons/svg/IconBell.tsx | 4 +- .../core/icons/svg/IconBiomFaceID.tsx | 4 +- .../core/icons/svg/IconBiomFingerprint.tsx | 4 +- ts/components/core/icons/svg/IconBonus.tsx | 4 +- ts/components/core/icons/svg/IconCalendar.tsx | 4 +- ts/components/core/icons/svg/IconCancel.tsx | 4 +- ts/components/core/icons/svg/IconCanceled.tsx | 4 +- .../core/icons/svg/IconCategCulture.tsx | 4 +- .../core/icons/svg/IconCategFinance.tsx | 4 +- .../core/icons/svg/IconCategHome.tsx | 4 +- .../core/icons/svg/IconCategJobOffers.tsx | 4 +- .../core/icons/svg/IconCategLearning.tsx | 4 +- .../core/icons/svg/IconCategMobility.tsx | 4 +- .../core/icons/svg/IconCategShopping.tsx | 4 +- .../core/icons/svg/IconCategSport.tsx | 4 +- .../icons/svg/IconCategSustainability.tsx | 4 +- .../core/icons/svg/IconCategTelco.tsx | 4 +- .../core/icons/svg/IconCategTravel.tsx | 4 +- .../core/icons/svg/IconCategWellness.tsx | 4 +- ts/components/core/icons/svg/IconChat.tsx | 4 +- .../core/icons/svg/IconChevronBottom.tsx | 4 +- .../core/icons/svg/IconChevronLeft.tsx | 4 +- .../core/icons/svg/IconChevronRight.tsx | 4 +- .../icons/svg/IconChevronRightListItem.tsx | 4 +- .../core/icons/svg/IconChevronTop.tsx | 4 +- ts/components/core/icons/svg/IconCie.tsx | 4 +- ts/components/core/icons/svg/IconClose.tsx | 4 +- .../core/icons/svg/IconCloseSmall.tsx | 4 +- ts/components/core/icons/svg/IconCoggle.tsx | 4 +- .../core/icons/svg/IconCompleted.tsx | 4 +- ts/components/core/icons/svg/IconCopy.tsx | 4 +- .../core/icons/svg/IconCreditCard.tsx | 4 +- ts/components/core/icons/svg/IconDevice.tsx | 4 +- ts/components/core/icons/svg/IconDocument.tsx | 4 +- .../core/icons/svg/IconDocumentAttachment.tsx | 4 +- .../icons/svg/IconDocumentAttachmentPDF.tsx | 4 +- .../core/icons/svg/IconDocumentSign.tsx | 4 +- ts/components/core/icons/svg/IconDotMenu.tsx | 4 +- ts/components/core/icons/svg/IconEdit.tsx | 4 +- ts/components/core/icons/svg/IconEmail.tsx | 4 +- .../core/icons/svg/IconEmailFill.tsx | 4 +- .../core/icons/svg/IconEmailLegal.tsx | 4 +- .../core/icons/svg/IconEmojiHappy.tsx | 4 +- ts/components/core/icons/svg/IconEmojiSad.tsx | 4 +- .../core/icons/svg/IconErrorFilled.tsx | 4 +- .../core/icons/svg/IconExternalLink.tsx | 4 +- ts/components/core/icons/svg/IconEyeHide.tsx | 4 +- ts/components/core/icons/svg/IconEyeShow.tsx | 4 +- .../icons/svg/IconFiscalCodeIndividual.tsx | 16 ++ .../core/icons/svg/IconFornitori.tsx | 4 +- ts/components/core/icons/svg/IconGallery.tsx | 4 +- ts/components/core/icons/svg/IconGiacenza.tsx | 4 +- ts/components/core/icons/svg/IconHistory.tsx | 4 +- ts/components/core/icons/svg/IconHome.tsx | 4 +- ts/components/core/icons/svg/IconHomeFill.tsx | 4 +- .../core/icons/svg/IconHourglass.tsx | 4 +- ts/components/core/icons/svg/IconInfo.tsx | 4 +- .../core/icons/svg/IconInfoFilled.tsx | 4 +- .../core/icons/svg/IconInitiatives.tsx | 4 +- .../core/icons/svg/IconInstitution.tsx | 4 +- ts/components/core/icons/svg/IconLadybug.tsx | 4 +- .../core/icons/svg/IconLocationAndroid.tsx | 4 +- .../core/icons/svg/IconLocationiOS.tsx | 4 +- .../core/icons/svg/IconLocationiOSFilled.tsx | 4 +- ts/components/core/icons/svg/IconLockOff.tsx | 4 +- ts/components/core/icons/svg/IconLockOn.tsx | 4 +- ts/components/core/icons/svg/IconLogin.tsx | 4 +- ts/components/core/icons/svg/IconLogout.tsx | 4 +- .../core/icons/svg/IconMagicWand.tsx | 4 +- ts/components/core/icons/svg/IconMessage.tsx | 4 +- .../core/icons/svg/IconMessageLegal.tsx | 4 +- .../core/icons/svg/IconNavDocuments.tsx | 4 +- .../core/icons/svg/IconNavMessages.tsx | 4 +- .../core/icons/svg/IconNavProfile.tsx | 4 +- .../core/icons/svg/IconNavServices.tsx | 4 +- .../core/icons/svg/IconNavWallet.tsx | 4 +- ts/components/core/icons/svg/IconNotice.tsx | 4 +- .../core/icons/svg/IconNoticeFilled.tsx | 4 +- ts/components/core/icons/svg/IconOk.tsx | 4 +- ts/components/core/icons/svg/IconPEC.tsx | 4 +- ts/components/core/icons/svg/IconPSP.tsx | 4 +- ts/components/core/icons/svg/IconPhone.tsx | 4 +- ts/components/core/icons/svg/IconPinOff.tsx | 4 +- ts/components/core/icons/svg/IconPinOn.tsx | 4 +- .../core/icons/svg/IconProductIOApp.tsx | 4 +- .../core/icons/svg/IconProductPagoPA.tsx | 4 +- ts/components/core/icons/svg/IconProfile.tsx | 4 +- .../core/icons/svg/IconProfileAlt.tsx | 4 +- .../core/icons/svg/IconProfileExperiment.tsx | 4 +- .../core/icons/svg/IconProfileFilled.tsx | 4 +- ts/components/core/icons/svg/IconQrCode.tsx | 4 +- ts/components/core/icons/svg/IconQuestion.tsx | 4 +- ts/components/core/icons/svg/IconRefund.tsx | 4 +- ts/components/core/icons/svg/IconReload.tsx | 4 +- ts/components/core/icons/svg/IconSave.tsx | 4 +- ts/components/core/icons/svg/IconSearch.tsx | 4 +- ts/components/core/icons/svg/IconSecurity.tsx | 4 +- .../core/icons/svg/IconSelfCertification.tsx | 4 +- .../core/icons/svg/IconShareAndroid.tsx | 4 +- ts/components/core/icons/svg/IconShareiOs.tsx | 4 +- ts/components/core/icons/svg/IconSpid.tsx | 4 +- .../core/icons/svg/IconStarEmpty.tsx | 4 +- .../core/icons/svg/IconStarFilled.tsx | 4 +- ts/components/core/icons/svg/IconSuccess.tsx | 4 +- .../core/icons/svg/IconSwitchOff.tsx | 4 +- ts/components/core/icons/svg/IconTag.tsx | 4 +- .../core/icons/svg/IconTransactions.tsx | 4 +- ts/components/core/icons/svg/IconTrashcan.tsx | 4 +- .../core/icons/svg/IconUnknownGdo.tsx | 4 +- .../core/icons/svg/IconWarningFilled.tsx | 4 +- ts/components/core/icons/svg/IconWebsite.tsx | 4 +- .../core/icons/svg/LegIconAbacus.tsx | 4 +- ts/components/core/icons/svg/LegIconAdd.tsx | 4 +- .../core/icons/svg/LegIconAmount.tsx | 4 +- .../core/icons/svg/LegIconAnalytics.tsx | 4 +- .../core/icons/svg/LegIconAttachment.tsx | 4 +- .../core/icons/svg/LegIconBarcode.tsx | 4 +- .../core/icons/svg/LegIconBattery.tsx | 18 -- ts/components/core/icons/svg/LegIconBonus.tsx | 4 +- .../core/icons/svg/LegIconCalendar.tsx | 4 +- .../core/icons/svg/LegIconCancel.tsx | 30 --- ts/components/core/icons/svg/LegIconChat.tsx | 4 +- .../core/icons/svg/LegIconCheckOff.tsx | 16 ++ .../core/icons/svg/LegIconCheckOn.tsx | 30 +++ .../core/icons/svg/LegIconChevronLeft.tsx | 14 ++ ts/components/core/icons/svg/LegIconClose.tsx | 4 +- .../core/icons/svg/LegIconCloseSmall.tsx | 4 +- .../core/icons/svg/LegIconCoggle.tsx | 4 +- .../core/icons/svg/LegIconCompleted.tsx | 4 +- ts/components/core/icons/svg/LegIconCopy.tsx | 4 +- .../core/icons/svg/LegIconCreditCard.tsx | 4 +- .../core/icons/svg/LegIconDevice.tsx | 16 -- .../icons/svg/LegIconDocumentAttachment.tsx | 4 +- .../svg/LegIconDocumentAttachmentPDF.tsx | 8 +- .../core/icons/svg/LegIconDotMenu.tsx | 18 -- ts/components/core/icons/svg/LegIconEdit.tsx | 4 +- ts/components/core/icons/svg/LegIconEmail.tsx | 4 +- .../core/icons/svg/LegIconEmojiHappy.tsx | 4 +- .../core/icons/svg/LegIconEmojiSad.tsx | 4 +- ts/components/core/icons/svg/LegIconError.tsx | 4 +- .../core/icons/svg/LegIconExternalLink.tsx | 4 +- .../core/icons/svg/LegIconEyeHide.tsx | 4 +- .../core/icons/svg/LegIconEyeShow.tsx | 4 +- .../core/icons/svg/LegIconFornitori.tsx | 4 +- .../core/icons/svg/LegIconGallery.tsx | 14 -- .../core/icons/svg/LegIconGiacenza.tsx | 4 +- .../core/icons/svg/LegIconHistory.tsx | 4 +- ts/components/core/icons/svg/LegIconHome.tsx | 4 +- .../core/icons/svg/LegIconHourglass.tsx | 4 +- .../core/icons/svg/LegIconInitiatives.tsx | 4 +- .../core/icons/svg/LegIconInstitution.tsx | 4 +- .../core/icons/svg/LegIconLadybug.tsx | 4 +- .../core/icons/svg/LegIconLocation.tsx | 4 +- .../core/icons/svg/LegIconLockOff.tsx | 4 +- .../core/icons/svg/LegIconLockOn.tsx | 4 +- ts/components/core/icons/svg/LegIconLogin.tsx | 22 -- .../core/icons/svg/LegIconMagicWand.tsx | 4 +- .../core/icons/svg/LegIconMessage.tsx | 4 +- .../core/icons/svg/LegIconMessageLegal.tsx | 4 +- .../core/icons/svg/LegIconNotice.tsx | 4 +- ts/components/core/icons/svg/LegIconPEC.tsx | 4 +- ts/components/core/icons/svg/LegIconPSP.tsx | 4 +- ts/components/core/icons/svg/LegIconPhone.tsx | 4 +- .../core/icons/svg/LegIconPinOff.tsx | 4 +- ts/components/core/icons/svg/LegIconPinOn.tsx | 4 +- .../core/icons/svg/LegIconProfile.tsx | 4 +- .../icons/svg/LegIconProfileExperiment.tsx | 4 +- .../core/icons/svg/LegIconQrCode.tsx | 4 +- .../core/icons/svg/LegIconQuestion.tsx | 4 +- .../core/icons/svg/LegIconRadioOff.tsx | 16 ++ .../core/icons/svg/LegIconRadioOn.tsx | 30 +++ ts/components/core/icons/svg/LegIconSave.tsx | 4 +- .../core/icons/svg/LegIconSearch.tsx | 4 +- ts/components/core/icons/svg/LegIconShare.tsx | 4 +- .../core/icons/svg/LegIconStarEmpty.tsx | 4 +- .../core/icons/svg/LegIconStarFilled.tsx | 4 +- .../core/icons/svg/LegIconSwitchOff.tsx | 4 +- ts/components/core/icons/svg/LegIconTag.tsx | 4 +- .../core/icons/svg/LegIconTransactions.tsx | 30 --- .../core/icons/svg/LegIconTrashcan.tsx | 4 +- .../core/icons/svg/LegIconUnknownGdo.tsx | 4 +- .../core/icons/svg/LegIconWarning.tsx | 4 +- .../core/icons/svg/LegIconWebsite.tsx | 4 +- .../icons/svg/originals/IconDeviceSignal.svg | 8 - .../originals/IconFiscalCodeIndividual.svg | 8 + .../icons/svg/originals/IconTransactions.svg | 8 - .../icons/svg/originals/LegIconBattery.svg | 10 - .../icons/svg/originals/LegIconCancel.svg | 22 -- .../icons/svg/originals/LegIconCheckOff.svg | 8 + .../icons/svg/originals/LegIconCheckOn.svg | 22 ++ .../svg/originals/LegIconChevronLeft.svg | 6 + .../icons/svg/originals/LegIconDotMenu.svg | 10 - .../icons/svg/originals/LegIconGallery.svg | 6 - .../core/icons/svg/originals/LegIconLogin.svg | 14 -- .../icons/svg/originals/LegIconRadioOff.svg | 8 + .../icons/svg/originals/LegIconRadioOn.svg | 22 ++ .../svg/originals/LegIconTransactions.svg | 22 -- .../core/pictograms/PictogramSection.tsx | 2 +- .../core/selection/RadioButtonList.tsx | 20 +- ts/components/core/selection/RemoteSwitch.tsx | 13 +- .../__snapshots__/RemoteSwitch.test.tsx.snap | 64 +++-- .../core/selection/checkbox/RawCheckBox.tsx | 30 ++- ts/components/infoScreen/imageRendering.tsx | 13 - .../messages/MessageDetail/DueDateBar.tsx | 5 +- .../__snapshots__/DueDate.test.tsx.snap | 98 ++++++-- ...edicalPrescriptionDueDateBar.test.tsx.snap | 198 +++++++++++---- .../common/CalendarEventButton.tsx | 10 +- .../messages/MessageDetail/index.tsx | 5 +- ts/components/messages/MessageList/Item.tsx | 9 +- .../__snapshots__/Item.test.tsx.snap | 158 +++++++++--- ts/components/screens/BaseHeader.tsx | 15 +- ts/components/screens/ListItemComponent.tsx | 10 +- ts/components/screens/TopScreenComponent.tsx | 3 +- ts/components/search/SearchButton.tsx | 7 +- .../PreferenceToggleRow.tsx | 5 +- .../ContactPreferencesToggles/index.tsx | 2 +- ts/components/services/SectionHeader.tsx | 17 +- .../services/ServiceMetadata/index.tsx | 2 +- ts/components/services/TosAndPrivacyBox.tsx | 5 +- .../services/__tests__/SectionHeader.test.tsx | 2 +- .../__snapshots__/SectionHeader.test.tsx.snap | 70 ++++-- ts/components/ui/Accordion.tsx | 24 +- ts/components/ui/DateTimePicker.tsx | 20 +- ts/components/ui/Markdown/index.tsx | 2 +- ts/components/ui/TabIconComponent.tsx | 12 +- ts/components/ui/TextboxWithSuggestion.tsx | 4 +- .../wallet/AddPaymentMethodButton.tsx | 39 --- ts/components/wallet/CameraMarker.tsx | 38 +-- ts/components/wallet/PayWebViewModal.tsx | 7 +- ts/components/wallet/PaymentHistoryItem.tsx | 10 +- ts/components/wallet/PaymentMethodsList.tsx | 5 +- ts/components/wallet/WalletHomeHeader.tsx | 11 +- .../wallet/__test__/PayWebViewModal.test.tsx | 2 +- ts/components/wallet/card/CardComponent.tsx | 46 ++-- .../wallet/card/SectionCardComponent.tsx | 17 +- .../CreditCardAttemptsList.tsx | 8 +- .../PickAvailablePaymentMethodListItem.tsx | 5 +- .../PickNotAvailablePaymentMethodListItem.tsx | 7 +- .../payment/PickPaymentMethodBaseListItem.tsx | 14 +- ts/components/wallet/payment/PspComponent.tsx | 8 +- .../bonusVacanze/components/ActiveBonus.tsx | 4 +- .../components/BonusCardComponent.tsx | 4 +- .../screens/ActiveBonusScreen.tsx | 40 ++- .../request/ActivateBonusDiscrepancies.tsx | 4 +- .../request/ActivateBonusReminder.tsx | 5 +- .../components/BaseDailyTransactionHeader.tsx | 8 +- .../BpdTransactionSummaryComponent.tsx | 4 +- .../bpdCardComponent/BpdCardComponent.tsx | 22 +- .../base/BpdToggle.tsx | 19 +- .../WalletPaymentMethodBpdList.tsx | 3 +- .../ranking/SuperCashbackRankingSummary.tsx | 17 +- .../textualSummary/ActiveTextualSummary.tsx | 8 +- .../textualSummary/ClosedTextualSummary.tsx | 6 +- .../unsubscribe/UnsubscribeComponent.tsx | 5 +- .../BpdAvailableTransactionsScreen.tsx | 2 +- .../transaction/BpdEmptyTransactionsList.tsx | 4 +- .../details/transaction/GoToTransactions.tsx | 6 +- .../onboarding/ErrorPaymentMethodsScreen.tsx | 10 +- ...ptInPaymentMethodsCashbackUpdateScreen.tsx | 6 +- .../OptInPaymentMethodsChoiceScreen.tsx | 6 +- .../bonus/cdc/components/CdcServiceCTA.tsx | 6 +- .../detail/eyca/EycaErrorComponent.tsx | 15 +- .../detail/eyca/EycaPendingComponent.tsx | 15 +- .../eyca/EycaStatusDetailsComponent.tsx | 13 +- .../merchants/CgnMerchantsDiscountItem.tsx | 4 +- .../merchants/CgnMerchantsFilters.tsx | 4 +- .../CgnDiscountDetail.test.tsx.snap | 174 ++++++++++++- .../discount/CgnBucketCodeComponent.tsx | 29 +-- .../discount/CgnOTPCodeComponent.tsx | 9 +- .../discount/CgnStaticCodeComponent.tsx | 23 +- .../merchants/discount/OtpCodeComponent.tsx | 4 +- .../CgnDiscountCodeComponent.test.tsx.snap | 87 ++++++- .../merchants/search/OrderOption.tsx | 9 +- .../merchants/CgnMerchantDetailScreen.tsx | 22 +- .../merchants/CgnMerchantLandingWebview.tsx | 2 +- .../common/components/TosBonusComponent.tsx | 4 +- .../components/SvVoucherListFilters.tsx | 11 +- ts/features/design-system/core/DSAdvice.tsx | 10 +- ts/features/design-system/core/DSAlert.tsx | 17 +- .../design-system/core/DSLegacyPictograms.tsx | 9 - .../design-system/core/DSListItems.tsx | 8 +- .../screens/valid/EuCovidCertValidScreen.tsx | 4 +- .../fci/components/DocumentWithSignature.tsx | 8 +- .../fci/components/DocumentsNavigationBar.tsx | 25 +- .../fci/components/QtspClauseListItem.tsx | 9 +- .../fci/components/SignatureFieldItem.tsx | 12 +- .../__tests__/DocumentsNavigationBar.test.tsx | 8 +- .../DocumentsNavigationBar.test.tsx.snap | 126 ++++++---- .../SignatureFieldItem.test.tsx.snap | 58 +++-- .../screens/valid/FciDataSharingScreen.tsx | 5 +- .../valid/FciDocumentPreviewScreen.tsx | 11 +- .../fci/screens/valid/FciDocumentsScreen.tsx | 12 +- .../valid/FciSignatureFieldsScreen.tsx | 4 +- ts/features/fims/components/CommonContent.tsx | 4 +- ts/features/fims/components/ErrorContent.tsx | 22 +- .../fims/components/SuccessContent.tsx | 12 +- .../screens/IbanEnrollmentScreen.tsx | 2 +- .../InitiativeConfigurationIntroScreen.tsx | 4 +- .../InitiativeSettingsComponent.tsx | 11 +- .../screens/InitiativeDetailsScreen.tsx | 2 +- .../screens/MultiValuePrerequisitesScreen.tsx | 9 +- .../components/MessageAttachments.tsx | 10 +- .../pn/components/PnMessageTimelineCTA.tsx | 12 +- .../bancomat/screen/BancomatInformation.tsx | 13 +- .../wallet/bancomatpay/component/BPayCard.tsx | 4 +- .../features/PaymentMethodSettings.tsx | 14 +- .../features/PaymentStatusSwitch.tsx | 5 +- .../component/CreditCardComponent.tsx | 5 +- .../bancomat/components/BankPreviewItem.tsx | 5 +- .../screens/add-pans/AddBancomatComponent.tsx | 3 +- .../cobadge/screens/CoBadgeChooseType.tsx | 5 +- .../add-account/AddCobadgeComponent.tsx | 3 +- .../paypal/components/PspInfoBottomSheet.tsx | 10 +- .../paypal/components/PspRadioItem.tsx | 5 +- .../__snapshots__/PspRadioItem.test.tsx.snap | 237 ++++++++++++++++-- .../screens/add/AddPrivativeCardComponent.tsx | 3 +- ts/features/wallet/paypal/PaypalCard.tsx | 7 +- .../paypal/screen/PayPalPspUpdateScreen.tsx | 12 +- .../components/ZendeskSupportComponent.tsx | 3 +- .../zendesk/screens/ZendeskAskPermissions.tsx | 46 ++-- .../ZendeskAskSeeReportsPermissions.tsx | 20 +- .../zendesk/screens/ZendeskChooseCategory.tsx | 13 +- .../screens/ZendeskChooseSubCategory.tsx | 14 +- .../screens/ZendeskSupportHelpCenter.tsx | 2 +- ts/screens/authentication/LandingScreen.tsx | 17 +- ts/screens/ingress/CheckBox.tsx | 9 +- ...boardingNotificationsPreferencesScreen.tsx | 2 +- .../OnboardingServicesPreferenceScreen.tsx | 3 +- .../onboarding/OnboardingShareDataScreen.tsx | 2 +- ts/screens/profile/CgnLandingPlayground.tsx | 9 +- ts/screens/profile/EmailForwardingScreen.tsx | 2 +- ts/screens/profile/FiscalCodeScreen.tsx | 4 +- .../profile/LanguagesPreferencesScreen.tsx | 2 +- ts/screens/profile/WebPlayground.tsx | 10 +- .../profile/components/ShareDataComponent.tsx | 6 +- .../services/ServicesContactComponent.tsx | 16 +- .../playgrounds/MarkdownPlayground.tsx | 10 +- ts/screens/services/ServicesHomeScreen.tsx | 4 +- .../wallet/ConfirmCardDetailsScreen.tsx | 7 +- .../wallet/PaymentHistoryDetailsScreen.tsx | 7 +- ts/screens/wallet/WalletHomeScreen.tsx | 17 +- ...reditCardOnboardingAttemptDetailScreen.tsx | 7 +- .../CodesPositionManualPaymentModal.tsx | 4 +- .../payment/ConfirmPaymentMethodScreen.tsx | 38 +-- .../payment/components/TransactionSummary.tsx | 4 +- .../components/TransactionSummaryStatus.tsx | 44 ++-- ts/theme/variables.ts | 9 - 410 files changed, 2486 insertions(+), 2231 deletions(-) delete mode 100644 docs/icomoon-font-export.png delete mode 100644 img/assistance/battery.svg delete mode 100644 img/assistance/card.svg delete mode 100644 img/assistance/email.svg delete mode 100644 img/assistance/gallery.svg delete mode 100644 img/assistance/giacenza.svg delete mode 100644 img/assistance/history.svg delete mode 100644 img/assistance/info.svg delete mode 100644 img/assistance/login.svg delete mode 100644 img/assistance/nameSurname.svg delete mode 100644 img/assistance/telefonia.svg delete mode 100644 img/assistance/website.svg delete mode 100644 img/icons/Eye.svg delete mode 100644 img/icons/openweburl.svg delete mode 100644 img/wallet/payment-methods/paypal/edit.svg delete mode 100644 img/wallet/payment-methods/paypal/label.svg delete mode 100644 img/wallet/payment-methods/paypal/money_down.svg delete mode 100644 ts/components/NoticeBox.tsx create mode 100644 ts/components/core/icons/svg/IconFiscalCodeIndividual.tsx delete mode 100644 ts/components/core/icons/svg/LegIconBattery.tsx delete mode 100644 ts/components/core/icons/svg/LegIconCancel.tsx create mode 100644 ts/components/core/icons/svg/LegIconCheckOff.tsx create mode 100644 ts/components/core/icons/svg/LegIconCheckOn.tsx create mode 100644 ts/components/core/icons/svg/LegIconChevronLeft.tsx delete mode 100644 ts/components/core/icons/svg/LegIconDevice.tsx delete mode 100644 ts/components/core/icons/svg/LegIconDotMenu.tsx delete mode 100644 ts/components/core/icons/svg/LegIconGallery.tsx delete mode 100644 ts/components/core/icons/svg/LegIconLogin.tsx create mode 100644 ts/components/core/icons/svg/LegIconRadioOff.tsx create mode 100644 ts/components/core/icons/svg/LegIconRadioOn.tsx delete mode 100644 ts/components/core/icons/svg/LegIconTransactions.tsx delete mode 100644 ts/components/core/icons/svg/originals/IconDeviceSignal.svg create mode 100644 ts/components/core/icons/svg/originals/IconFiscalCodeIndividual.svg delete mode 100644 ts/components/core/icons/svg/originals/IconTransactions.svg delete mode 100644 ts/components/core/icons/svg/originals/LegIconBattery.svg delete mode 100644 ts/components/core/icons/svg/originals/LegIconCancel.svg create mode 100644 ts/components/core/icons/svg/originals/LegIconCheckOff.svg create mode 100644 ts/components/core/icons/svg/originals/LegIconCheckOn.svg create mode 100644 ts/components/core/icons/svg/originals/LegIconChevronLeft.svg delete mode 100644 ts/components/core/icons/svg/originals/LegIconDotMenu.svg delete mode 100644 ts/components/core/icons/svg/originals/LegIconGallery.svg delete mode 100644 ts/components/core/icons/svg/originals/LegIconLogin.svg create mode 100644 ts/components/core/icons/svg/originals/LegIconRadioOff.svg create mode 100644 ts/components/core/icons/svg/originals/LegIconRadioOn.svg delete mode 100644 ts/components/core/icons/svg/originals/LegIconTransactions.svg delete mode 100644 ts/components/wallet/AddPaymentMethodButton.tsx diff --git a/docs/icomoon-font-export.png b/docs/icomoon-font-export.png deleted file mode 100644 index 6b3412518618893910dee32bda78c9e12e7a45e3..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 39385 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 - - - diff --git a/img/assistance/card.svg b/img/assistance/card.svg deleted file mode 100644 index fb1183a224f..00000000000 --- a/img/assistance/card.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/img/assistance/email.svg b/img/assistance/email.svg deleted file mode 100644 index f0fa9ce3443..00000000000 --- a/img/assistance/email.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/img/assistance/gallery.svg b/img/assistance/gallery.svg deleted file mode 100644 index 493bdd7448d..00000000000 --- a/img/assistance/gallery.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/img/assistance/giacenza.svg b/img/assistance/giacenza.svg deleted file mode 100644 index c1e3c05cafa..00000000000 --- a/img/assistance/giacenza.svg +++ /dev/null @@ -1,13 +0,0 @@ - - - - - - - - - - - - - diff --git a/img/assistance/history.svg b/img/assistance/history.svg deleted file mode 100644 index 35f891d04bb..00000000000 --- a/img/assistance/history.svg +++ /dev/null @@ -1,4 +0,0 @@ - - - - diff --git a/img/assistance/info.svg b/img/assistance/info.svg deleted file mode 100644 index 5415e2a80d6..00000000000 --- a/img/assistance/info.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/img/assistance/login.svg b/img/assistance/login.svg deleted file mode 100644 index 81de685001a..00000000000 --- a/img/assistance/login.svg +++ /dev/null @@ -1,12 +0,0 @@ - - - - - - - - - - - - diff --git a/img/assistance/nameSurname.svg b/img/assistance/nameSurname.svg deleted file mode 100644 index be23dbfd900..00000000000 --- a/img/assistance/nameSurname.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/img/assistance/telefonia.svg b/img/assistance/telefonia.svg deleted file mode 100644 index 89e18837af3..00000000000 --- a/img/assistance/telefonia.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/img/assistance/website.svg b/img/assistance/website.svg deleted file mode 100644 index 5dcddbeaacd..00000000000 --- a/img/assistance/website.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/img/icons/Eye.svg b/img/icons/Eye.svg deleted file mode 100644 index 9ec691274da..00000000000 --- a/img/icons/Eye.svg +++ /dev/null @@ -1,5 +0,0 @@ - - - diff --git a/img/icons/openweburl.svg b/img/icons/openweburl.svg deleted file mode 100644 index ee3c7fa72ab..00000000000 --- a/img/icons/openweburl.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/img/wallet/payment-methods/paypal/edit.svg b/img/wallet/payment-methods/paypal/edit.svg deleted file mode 100644 index b250e12c3ac..00000000000 --- a/img/wallet/payment-methods/paypal/edit.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - - - diff --git a/img/wallet/payment-methods/paypal/label.svg b/img/wallet/payment-methods/paypal/label.svg deleted file mode 100644 index 01ac294c9ab..00000000000 --- a/img/wallet/payment-methods/paypal/label.svg +++ /dev/null @@ -1,20 +0,0 @@ - - - - - - - - - - - - - - - - - - - - diff --git a/img/wallet/payment-methods/paypal/money_down.svg b/img/wallet/payment-methods/paypal/money_down.svg deleted file mode 100644 index e229312606e..00000000000 --- a/img/wallet/payment-methods/paypal/money_down.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/ts/components/AdviceComponent.tsx b/ts/components/AdviceComponent.tsx index 6a7e83e8741..dd6848d2671 100644 --- a/ts/components/AdviceComponent.tsx +++ b/ts/components/AdviceComponent.tsx @@ -1,17 +1,18 @@ import * as React from "react"; import { View, StyleSheet } from "react-native"; -import themeVariables from "../theme/variables"; -import { HSpacer } from "./core/spacer/Spacer"; +import { Icon, IOIcons } from "./core/icons"; +import type { IOColors } from "./core/variables/IOColors"; import { IOStyles } from "./core/variables/IOStyles"; -import IconFont from "./ui/IconFont"; +import { HSpacer } from "./core/spacer/Spacer"; import { Body } from "./core/typography/Body"; type Props = { text: string; - iconName?: string; + iconName?: IOIcons; iconSize?: number; - iconColor?: string; + iconColor?: IOColors; }; + const styles = StyleSheet.create({ icon: { marginTop: 4 @@ -25,12 +26,13 @@ const defaultIconSize = 18; */ const AdviceComponent: React.FunctionComponent = (props: Props) => ( - + + + {props.text} diff --git a/ts/components/CalendarsListContainer.tsx b/ts/components/CalendarsListContainer.tsx index 6f63e41e40e..0e00faf88da 100644 --- a/ts/components/CalendarsListContainer.tsx +++ b/ts/components/CalendarsListContainer.tsx @@ -93,7 +93,7 @@ class CalendarsListContainer extends React.PureComponent { title={convertLocalCalendarName(item.title)} hideIcon={!isDefaultCalendar} iconSize={12} - iconName={isDefaultCalendar ? "io-tick-big" : undefined} + iconName={isDefaultCalendar ? "legCompleted" : undefined} onPress={() => isDefaultCalendar && this.props.onCalendarRemove ? this.props.onCalendarRemove() diff --git a/ts/components/ChooserListContainer.tsx b/ts/components/ChooserListContainer.tsx index 1e5637e246a..bb6ed88e42e 100644 --- a/ts/components/ChooserListContainer.tsx +++ b/ts/components/ChooserListContainer.tsx @@ -27,7 +27,7 @@ import { import { LabelledItem } from "./LabelledItem"; import AppHeader from "./ui/AppHeader"; import FooterWithButtons from "./ui/FooterWithButtons"; -import IconFont from "./ui/IconFont"; +import { Icon } from "./core/icons/Icon"; type OwnProps = { items: ReadonlyArray; @@ -153,8 +153,8 @@ class ChooserListContainer extends React.PureComponent, State> { onPress={this.handleSearchPress} transparent={true} > - diff --git a/ts/components/ChooserListItem.tsx b/ts/components/ChooserListItem.tsx index 8860c5c5bf9..416d89baf42 100644 --- a/ts/components/ChooserListItem.tsx +++ b/ts/components/ChooserListItem.tsx @@ -3,11 +3,11 @@ import { pipe } from "fp-ts/lib/function"; import * as React from "react"; import { View, StyleSheet } from "react-native"; import customVariables from "../theme/variables"; -import ButtonDefaultOpacity from "./ButtonDefaultOpacity"; import { VSpacer } from "./core/spacer/Spacer"; import { H3 } from "./core/typography/H3"; import TouchableDefaultOpacity from "./TouchableDefaultOpacity"; -import IconFont from "./ui/IconFont"; +import { IOColors } from "./core/variables/IOColors"; +import { IOIcons, Icon } from "./core/icons"; type Props = Readonly<{ itemTitle: string; @@ -46,10 +46,8 @@ export default class ChooserListItem extends React.Component { public render() { const { isItemSelected, itemIconComponent, itemId, itemTitle } = this.props; - const iconName = isItemSelected ? "io-checkbox-on" : "io-checkbox-off"; - const iconColor = isItemSelected - ? customVariables.selectedColor - : customVariables.unselectedColor; + const iconName: IOIcons = isItemSelected ? "legCheckOn" : "legCheckOff"; + const iconColor: IOColors = isItemSelected ? "blue" : "bluegrey"; const icon = itemIconComponent ? pipe( @@ -68,9 +66,9 @@ export default class ChooserListItem extends React.Component { {itemTitle} - - - + + + ); diff --git a/ts/components/ContextualInfo.tsx b/ts/components/ContextualInfo.tsx index c765876b351..9b1300d5107 100644 --- a/ts/components/ContextualInfo.tsx +++ b/ts/components/ContextualInfo.tsx @@ -2,10 +2,10 @@ import { Body, Container, Content, Right } from "native-base"; import * as React from "react"; import { BackHandler, NativeEventSubscription, StyleSheet } from "react-native"; import themeVariables from "../theme/variables"; -import IconFont from "./ui/IconFont"; -import ButtonDefaultOpacity from "./ButtonDefaultOpacity"; import AppHeader from "./ui/AppHeader"; import { H1 } from "./core/typography/H1"; +import { Icon } from "./core/icons"; +import TouchableDefaultOpacity from "./TouchableDefaultOpacity"; type Props = Readonly<{ title: string; @@ -50,12 +50,12 @@ export default class ContextualInfo extends React.Component { - this.props.onClose()} - transparent={true} + testID="contextualInfo_closeButton" > - - + + { private getIconName = () => this.props.isSelectionModeEnabled ? this.props.isItemSelected - ? "io-checkbox-on" - : "io-checkbox-off" - : "io-right"; + ? "legCheckOn" + : "legCheckOff" + : "chevronRightListItem"; shouldComponentUpdate(nextProps: Readonly): boolean { // assuming that: @@ -158,11 +158,7 @@ export default class DetailedlistItemComponent extends React.Component { /> )} - + {this.props.children} diff --git a/ts/components/EmailReadComponent.tsx b/ts/components/EmailReadComponent.tsx index 0f6eaae0deb..56f6c514b99 100644 --- a/ts/components/EmailReadComponent.tsx +++ b/ts/components/EmailReadComponent.tsx @@ -11,10 +11,10 @@ import TopScreenComponent from "./screens/TopScreenComponent"; import SectionStatusComponent from "./SectionStatus"; import { BlockButtonsProps } from "./ui/BlockButtons"; import FooterWithButtons from "./ui/FooterWithButtons"; -import IconFont from "./ui/IconFont"; import { Body } from "./core/typography/Body"; import { VSpacer } from "./core/spacer/Spacer"; import { H3 } from "./core/typography/H3"; +import { Icon } from "./core/icons/Icon"; const styles = StyleSheet.create({ flex: { @@ -61,13 +61,14 @@ const EmailReadComponent = ({ handleGoBack, footerProps }: Props) => { {I18n.t("email.insert.label")} - + + + {O.isSome(optionEmail) &&

{optionEmail.value}

} diff --git a/ts/components/FiscalCodeLandscapeOverlay.tsx b/ts/components/FiscalCodeLandscapeOverlay.tsx index 8975b7aa074..1d1089f1415 100644 --- a/ts/components/FiscalCodeLandscapeOverlay.tsx +++ b/ts/components/FiscalCodeLandscapeOverlay.tsx @@ -13,7 +13,6 @@ import { } from "react-native"; import { InitializedProfile } from "../../definitions/backend/InitializedProfile"; import { Municipality } from "../../definitions/content/Municipality"; -import IconFont from "../components/ui/IconFont"; import I18n from "../i18n"; import customVariables from "../theme/variables"; import { useMaxBrightness } from "../utils/brightness"; @@ -21,6 +20,7 @@ import FiscalCodeComponent from "./FiscalCodeComponent"; import AppHeader from "./ui/AppHeader"; import { IOColors } from "./core/variables/IOColors"; import { VSpacer } from "./core/spacer/Spacer"; +import { Icon } from "./core/icons/Icon"; export type Props = Readonly<{ onCancel: () => void; @@ -94,7 +94,7 @@ const FiscalCodeLandscapeOverlay: React.FunctionComponent = ( accessibilityRole={"button"} accessibilityLabel={I18n.t("global.buttons.close")} > - + diff --git a/ts/components/GoBackButton.tsx b/ts/components/GoBackButton.tsx index 8077ffb46c7..57c5783018b 100644 --- a/ts/components/GoBackButton.tsx +++ b/ts/components/GoBackButton.tsx @@ -3,9 +3,8 @@ import * as React from "react"; import { BackHandler, NativeEventSubscription } from "react-native"; import I18n from "../i18n"; import NavigationService from "../navigation/NavigationService"; -import { IOColors } from "../components/core/variables/IOColors"; import ButtonDefaultOpacity from "./ButtonDefaultOpacity"; -import IconFont from "./ui/IconFont"; +import { Icon } from "./core/icons"; interface OwnProps { [k: string]: any; @@ -61,10 +60,7 @@ class GoBackButton extends React.PureComponent { {...buttonProps} accessibilityLabel={I18n.t("global.buttons.back")} > - + ); } diff --git a/ts/components/IdpSuccessfulAuthentication.tsx b/ts/components/IdpSuccessfulAuthentication.tsx index a037335e63a..39cf4eab3b8 100644 --- a/ts/components/IdpSuccessfulAuthentication.tsx +++ b/ts/components/IdpSuccessfulAuthentication.tsx @@ -5,8 +5,7 @@ import * as React from "react"; import { View, StatusBar, StyleSheet } from "react-native"; import variables from "../theme/variables"; -import IconFont from "./ui/IconFont"; -import { IOColors } from "./core/variables/IOColors"; +import { Icon } from "./core/icons"; const styles = StyleSheet.create({ container: { @@ -17,7 +16,7 @@ const styles = StyleSheet.create({ } }); -const tickSize = variables.iconSize6 * 2; +const ICON_SIZE = 96; export const IdpSuccessfulAuthentication = () => ( @@ -25,6 +24,6 @@ export const IdpSuccessfulAuthentication = () => ( barStyle="light-content" backgroundColor={styles.container.backgroundColor} /> - + ); diff --git a/ts/components/LabelledItem/Icon.tsx b/ts/components/LabelledItem/Icon.tsx index b5aafa2ae7b..227c6111bfa 100644 --- a/ts/components/LabelledItem/Icon.tsx +++ b/ts/components/LabelledItem/Icon.tsx @@ -8,7 +8,6 @@ import { import { isString } from "lodash"; import { IconProps } from "react-native-vector-icons/Icon"; import IconFont from "../ui/IconFont"; -import variables from "../../theme/variables"; import ButtonDefaultOpacity from "../ButtonDefaultOpacity"; const styles = StyleSheet.create({ @@ -54,7 +53,7 @@ export const Icon: React.FC = ({ > {isString(icon) ? ( { const { color } = this.props; return ( { - public render() { - const { backgroundColor, iconProps } = this.props; - return ( - - - - - {this.props.children} - - ); - } -} - -export default NoticeBox; diff --git a/ts/components/PinCreationForm.tsx b/ts/components/PinCreationForm.tsx index 208c055636d..407958ca076 100644 --- a/ts/components/PinCreationForm.tsx +++ b/ts/components/PinCreationForm.tsx @@ -179,7 +179,7 @@ export const PinCreationForm = ({ onSubmit }: Props) => { - + diff --git a/ts/components/Pinpad/KeyPad.tsx b/ts/components/Pinpad/KeyPad.tsx index 034ddb36559..22ace892f9c 100644 --- a/ts/components/Pinpad/KeyPad.tsx +++ b/ts/components/Pinpad/KeyPad.tsx @@ -3,18 +3,17 @@ import * as E from "fp-ts/lib/Either"; import { pipe } from "fp-ts/lib/function"; import { Col, Grid, Row, Text as NBButtonText } from "native-base"; import * as React from "react"; -import { Platform, StyleSheet } from "react-native"; +import { Platform, StyleSheet, View } from "react-native"; import { makeFontStyleObject } from "../../theme/fonts"; -import customVariables from "../../theme/variables"; import ButtonDefaultOpacity from "../ButtonDefaultOpacity"; import { hexToRgba, IOColors } from "../core/variables/IOColors"; -import StyledIconFont from "../ui/IconFont"; +import { IOIcons, Icon } from "../core/icons/Icon"; // left -> the string to represent as text // right -> the icon to represent with name and size export type DigitRpr = E.Either< string, - { name: string; size: number; accessibilityLabel: string } + { name: IOIcons; size: number; accessibilityLabel: string } >; type Digit = ITuple2 void> | undefined; @@ -109,16 +108,13 @@ const renderPinCol = ( ), ic => ( - + + + ) ) )} diff --git a/ts/components/Pinpad/index.tsx b/ts/components/Pinpad/index.tsx index 7567d6b0e06..8eea622b6aa 100644 --- a/ts/components/Pinpad/index.tsx +++ b/ts/components/Pinpad/index.tsx @@ -53,7 +53,7 @@ const styles = StyleSheet.create({ } }); -const SMALL_ICON_WIDTH = 17; +const CANCEL_ICON_WIDTH = 24; const ICON_WIDTH = 48; const SHAKE_ANIMATION_DURATION = 600 as Millisecond; const INPUT_MARGIN = 36; @@ -77,7 +77,7 @@ class Pinpad extends React.PureComponent { case "BIOMETRICS": case "TOUCH_ID": return E.right({ - name: "io-fingerprint", + name: "biomFingerprint", size: ICON_WIDTH, accessibilityLabel: I18n.t( "identification.unlockCode.accessibility.fingerprint" @@ -85,7 +85,7 @@ class Pinpad extends React.PureComponent { }); case "FACE_ID": return E.right({ - name: "io-face-id", + name: "biomFaceID", size: ICON_WIDTH, accessibilityLabel: I18n.t( "identification.unlockCode.accessibility.faceId" @@ -163,8 +163,8 @@ class Pinpad extends React.PureComponent { ), Tuple2( E.right({ - name: "io-cancel", - size: SMALL_ICON_WIDTH, + name: "cancel", + size: CANCEL_ICON_WIDTH, accessibilityLabel: I18n.t( "identification.unlockCode.accessibility.delete" ) diff --git a/ts/components/ProfileTabIcon.tsx b/ts/components/ProfileTabIcon.tsx index d516d74935d..1e9d3a8caac 100644 --- a/ts/components/ProfileTabIcon.tsx +++ b/ts/components/ProfileTabIcon.tsx @@ -1,12 +1,13 @@ import React from "react"; import { connect } from "react-redux"; +import { ColorValue } from "react-native"; import { GlobalState } from "../store/reducers/types"; -import IconFont from "./ui/IconFont"; +import { AnimatedIcon } from "./core/icons/Icon"; type OwnProps = { size?: number; - color?: string; + color?: ColorValue; }; type Props = OwnProps & ReturnType; @@ -21,10 +22,12 @@ class ProfileTabIcon extends React.PureComponent { // when new experimental features will be avaible, pick this flag from props const isExperimentalFeaturesEnabled = false; return ( - ); } diff --git a/ts/components/RegionServiceWebView.tsx b/ts/components/RegionServiceWebView.tsx index e9c98efcf34..4dea5a2595a 100644 --- a/ts/components/RegionServiceWebView.tsx +++ b/ts/components/RegionServiceWebView.tsx @@ -1,7 +1,13 @@ import * as E from "fp-ts/lib/Either"; import { pipe } from "fp-ts/lib/function"; import * as O from "fp-ts/lib/Option"; -import { Body, Container, Content, Right } from "native-base"; +import { + Body, + Container, + Content, + Right, + Text as NBButtonText +} from "native-base"; import * as React from "react"; import { View, Alert, Image, StyleSheet } from "react-native"; import WebView, { WebViewMessageEvent } from "react-native-webview"; @@ -12,7 +18,6 @@ import { import URLParse from "url-parse"; import brokenLinkImage from "../../img/broken-link.png"; import I18n from "../i18n"; -import customVariables from "../theme/variables"; import { WebviewMessage } from "../types/WebviewMessage"; import { getRemoteLocale } from "../utils/messages"; import { showToast } from "../utils/showToast"; @@ -23,13 +28,13 @@ import { } from "../utils/webview"; import ButtonDefaultOpacity from "./ButtonDefaultOpacity"; import { VSpacer } from "./core/spacer/Spacer"; -import { Body as BodyText } from "./core/typography/Body"; import { Label } from "./core/typography/Label"; import { withLightModalContext } from "./helpers/withLightModalContext"; import LoadingSpinnerOverlay from "./LoadingSpinnerOverlay"; import AppHeader from "./ui/AppHeader"; -import IconFont from "./ui/IconFont"; import { LightModalContextInterface } from "./ui/LightModal"; +import { Icon } from "./core/icons/Icon"; +import { IOStyles } from "./core/variables/IOStyles"; type Props = { onWebviewClose: () => void; @@ -39,8 +44,6 @@ type Props = { const styles = StyleSheet.create({ itemsCenter: { alignItems: "center" }, - selfCenter: { alignSelf: "center" }, - flex1: { flex: 1 }, errorContainer: { flex: 1, alignItems: "center" @@ -77,17 +80,14 @@ const RegionServiceWebView: React.FunctionComponent = (props: Props) => { - + - - + + + + @@ -104,19 +104,15 @@ const RegionServiceWebView: React.FunctionComponent = (props: Props) => { - + - - + + + + - @@ -151,7 +147,7 @@ const RegionServiceWebView: React.FunctionComponent = (props: Props) => { light={true} bordered={true} > - {I18n.t("global.buttons.cancel")} + {I18n.t("global.buttons.cancel")} { @@ -218,15 +218,15 @@ class RemindEmailValidationOverlay extends React.PureComponent { {I18n.t("global.actions.retry")} - { this.setState({ displayError: false }); }} - color={IOColors.white} accessible={true} accessibilityLabel={I18n.t("global.buttons.close")} - /> + > + + ); @@ -260,13 +260,13 @@ class RemindEmailValidationOverlay extends React.PureComponent { accessibilityLabel={I18n.t("global.buttons.back")} accessibilityRole={"button"} > - + ); private onMainProps: TopScreenComponentProps = { customRightIcon: { - iconName: "io-close", + iconName: "legClose", onPress: this.props.navigateBack } }; @@ -356,9 +356,9 @@ class RemindEmailValidationOverlay extends React.PureComponent { O.getOrElse(() => EMPTY_EMAIL) ); - const icon = this.state.emailHasBeenValidate - ? "io-email-validated" - : "io-email-to-validate"; + const illustration: IOPictograms = this.state.emailHasBeenValidate + ? "emailValidation" + : "emailToValidate"; const title = this.state.emailHasBeenValidate ? I18n.t("email.validate.validated") @@ -374,12 +374,13 @@ class RemindEmailValidationOverlay extends React.PureComponent { > - + + + {title} diff --git a/ts/components/SectionStatus/StatusContent.tsx b/ts/components/SectionStatus/StatusContent.tsx index 922b88c957e..57b97742b1d 100644 --- a/ts/components/SectionStatus/StatusContent.tsx +++ b/ts/components/SectionStatus/StatusContent.tsx @@ -1,9 +1,9 @@ import { AccessibilityRole, StyleSheet, View } from "react-native"; import React, { ComponentProps } from "react"; import { WithTestID } from "../../types/WithTestID"; -import IconFont from "../ui/IconFont"; import { Label } from "../core/typography/Label"; import { IOColors } from "../core/variables/IOColors"; +import { IOIcons, Icon } from "../core/icons/Icon"; const iconSize = 24; @@ -28,10 +28,9 @@ type Props = WithTestID<{ accessibilityLabel?: string; accessibilityRole?: AccessibilityRole; backgroundColor: IOColors; - iconColor: string; - iconName: string; + iconName: IOIcons; viewRef: React.RefObject; - labelColor: ComponentProps["color"]; + foregroundColor: ComponentProps["color"]; labelPaddingVertical?: number; }>; @@ -42,10 +41,9 @@ const StatusContent: React.FC = ({ accessibilityRole, backgroundColor, children, - iconColor, iconName, viewRef, - labelColor, + foregroundColor, labelPaddingVertical }) => ( = ({ style={[styles.container, { backgroundColor: IOColors[backgroundColor] }]} testID={"SectionStatusContent"} > - + + + = { [LevelEnum.warning]: "orange" }; -export const statusIconMap: Record = { - [LevelEnum.normal]: "io-complete", - [LevelEnum.critical]: "io-warning", - [LevelEnum.warning]: "io-info" +export const statusIconMap: Record = { + [LevelEnum.normal]: "ok", + [LevelEnum.critical]: "legWarning", + [LevelEnum.warning]: "info" }; // map the text background color with the relative text color -const textDefaultColor = "white"; export const getStatusTextColor = ( level: LevelEnum ): "bluegreyDark" | "white" => - level === LevelEnum.normal ? "bluegreyDark" : textDefaultColor; + level === LevelEnum.normal ? "bluegreyDark" : "white"; export const InnerSectionStatus = ( props: Omit & { @@ -84,11 +84,10 @@ export const InnerSectionStatus = ( "global.accessibility.alert" )}`} backgroundColor={backgroundColor} - iconColor={IOColors[color]} iconName={iconName} testID={"SectionStatusComponentContent"} viewRef={viewRef} - labelColor={color} + foregroundColor={color} > {`${sectionStatus.message[locale]} `} @@ -109,10 +108,9 @@ export const InnerSectionStatus = ( // disable accessibility to prevent the override of the container accessible={false} backgroundColor={backgroundColor} - iconColor={IOColors[color]} iconName={iconName} viewRef={viewRef} - labelColor={color} + foregroundColor={color} > {`${sectionStatus.message[locale]} `} { public render() { - return ( - - ); + return ; } } diff --git a/ts/components/WalletTabIcon.tsx b/ts/components/WalletTabIcon.tsx index f8d0dffcda5..474aec3932b 100644 --- a/ts/components/WalletTabIcon.tsx +++ b/ts/components/WalletTabIcon.tsx @@ -1,11 +1,12 @@ import React from "react"; import { connect } from "react-redux"; +import { ColorValue } from "react-native"; import { getSafeUnreadTransactionsNumSelector } from "../store/reducers/entities/readTransactions"; import { GlobalState } from "../store/reducers/types"; import TabIconComponent from "./ui/TabIconComponent"; type OwnProps = { - color?: string; + color?: ColorValue; }; type Props = OwnProps & ReturnType; @@ -18,7 +19,7 @@ class WalletTabIcon extends React.PureComponent { const { color, unreadTransactions } = this.props; return ( diff --git a/ts/components/__tests__/ContextualInfo.test.tsx b/ts/components/__tests__/ContextualInfo.test.tsx index c9e8fa4a364..c943e03904a 100644 --- a/ts/components/__tests__/ContextualInfo.test.tsx +++ b/ts/components/__tests__/ContextualInfo.test.tsx @@ -38,18 +38,20 @@ const options = { }; describe("ContextualInfo component", () => { - it("should render a button with the 'io-close' icon", () => { + it("should render a close button", () => { const component = renderComponent(options); - // ensure that the close icon is inside an accessible button - expect(buttonByIconName("io-close", component)).toBeDefined(); + expect( + component.queryByTestId("contextualInfo_closeButton") + ).not.toBeNull(); }); describe("when the close button is pressed", () => { it("should call `onClose`", () => { const onClose = jest.fn(); const component = renderComponent({ ...options, onClose }); - // eslint-disable-next-line @typescript-eslint/no-non-null-assertion - const closeButton = buttonByIconName("io-close", component)!; + const closeButton = component.queryByTestId( + "contextualInfo_closeButton" + )!; fireEvent(closeButton, "onPress"); expect(onClose).toHaveBeenCalledTimes(1); }); diff --git a/ts/components/bottomSheet/BottomSheetHeader.tsx b/ts/components/bottomSheet/BottomSheetHeader.tsx index dda010ae087..181fa2011e7 100644 --- a/ts/components/bottomSheet/BottomSheetHeader.tsx +++ b/ts/components/bottomSheet/BottomSheetHeader.tsx @@ -5,10 +5,10 @@ import { Millisecond } from "@pagopa/ts-commons/lib/units"; import I18n from "../../i18n"; import ButtonDefaultOpacity from "../ButtonDefaultOpacity"; import { H3 } from "../core/typography/H3"; -import IconFont from "../ui/IconFont"; import { IOStyles } from "../core/variables/IOStyles"; import { IOColors } from "../core/variables/IOColors"; import { setAccessibilityFocus } from "../../utils/accessibility"; +import { Icon } from "../core/icons"; const styles = StyleSheet.create({ row: { @@ -24,9 +24,6 @@ const styles = StyleSheet.create({ modalClose: { paddingRight: 0, justifyContent: "flex-end" - }, - icon: { - paddingRight: 0 } }); @@ -68,7 +65,7 @@ export const BottomSheetHeader: React.FunctionComponent = ({ accessibilityRole={"button"} accessibilityLabel={I18n.t("global.buttons.close")} > - + ); diff --git a/ts/components/box/InfoBox.tsx b/ts/components/box/InfoBox.tsx index 19e0e6cfb5c..965cec62756 100644 --- a/ts/components/box/InfoBox.tsx +++ b/ts/components/box/InfoBox.tsx @@ -1,12 +1,12 @@ import * as React from "react"; import { View, StyleSheet } from "react-native"; -import IconFont from "../ui/IconFont"; import { IOColors } from "../core/variables/IOColors"; import { HSpacer } from "../core/spacer/Spacer"; +import { IOIcons, Icon } from "../core/icons"; type Props = { - iconName?: string; - iconColor?: string; + iconName?: IOIcons; + iconColor?: IOColors; iconSize?: number; alignedCentral?: boolean; }; @@ -35,18 +35,15 @@ const ICON_SIZE = 32; * @constructor */ export const InfoBox: React.FunctionComponent = props => { - const iconName = props.iconName ?? "io-notice"; - const iconColor = props.iconColor ?? IOColors.blue; + const iconName = props.iconName ?? "notice"; + const iconColor = props.iconColor ?? "blue"; const iconSize = props.iconSize ?? ICON_SIZE; const centralAlignment = props.alignedCentral ? styles.alignedCentral : {}; return ( - + + + {props.children} diff --git a/ts/components/cie/CieNotSupported.tsx b/ts/components/cie/CieNotSupported.tsx index 468186994d3..ef965cda21d 100644 --- a/ts/components/cie/CieNotSupported.tsx +++ b/ts/components/cie/CieNotSupported.tsx @@ -1,12 +1,12 @@ import { Body, List, ListItem } from "native-base"; import * as React from "react"; import { useState } from "react"; -import { Platform } from "react-native"; +import { Platform, View } from "react-native"; import I18n from "../../i18n"; -import customVariables from "../../theme/variables"; import { VSpacer } from "../core/spacer/Spacer"; -import IconFont from "../ui/IconFont"; import Markdown from "../ui/Markdown"; +import { IOIcons, Icon } from "../core/icons"; +import { IOColors } from "../core/variables/IOColors"; type Props = { hasCieApiLevelSupport: boolean; @@ -14,10 +14,10 @@ type Props = { }; const ICON_SIZE = 24; -const okColor = customVariables.brandSuccess; -const koColor = customVariables.brandDanger; -const okIcon = "io-complete"; -const koIcon = "io-error"; +const okColor: IOColors = "green"; +const koColor: IOColors = "red"; +const okIcon: IOIcons = "ok"; +const koIcon: IOIcons = "legError"; const markDownElements = 2; const CieNotSupported: React.FunctionComponent = props => { const [markdownLoaded, setMarkdownLoaded] = useState(0); @@ -38,9 +38,9 @@ const CieNotSupported: React.FunctionComponent = props => { {markdownLoaded === markDownElements && ( - @@ -50,12 +50,13 @@ const CieNotSupported: React.FunctionComponent = props => { - + + + {I18n.t( "authentication.landing.cie_unsupported.nfc_incompatible" diff --git a/ts/components/cie/CieReadingCardAnimation.tsx b/ts/components/cie/CieReadingCardAnimation.tsx index b69ca23d675..a3fc71df409 100644 --- a/ts/components/cie/CieReadingCardAnimation.tsx +++ b/ts/components/cie/CieReadingCardAnimation.tsx @@ -4,8 +4,8 @@ import { View, Animated, Easing, Image, StyleSheet } from "react-native"; import ProgressCircle from "react-native-progress-circle"; import customVariables from "../../theme/variables"; import AnimatedRing from "../animations/AnimatedRing"; -import IconFont from "../ui/IconFont"; import { IOColors } from "../core/variables/IOColors"; +import { Icon } from "../core/icons/Icon"; export enum ReadingState { "reading" = "reading", @@ -215,12 +215,9 @@ export default class CieReadingCardAnimation extends React.PureComponent< /> {this.props.readingState === ReadingState.completed && ( - + + + )} diff --git a/ts/components/core/accordion/RawAccordion.tsx b/ts/components/core/accordion/RawAccordion.tsx index a6070735232..1aa6bbf6e5a 100644 --- a/ts/components/core/accordion/RawAccordion.tsx +++ b/ts/components/core/accordion/RawAccordion.tsx @@ -13,8 +13,8 @@ import { import I18n from "../../../i18n"; import customVariables from "../../../theme/variables"; import { isAndroid } from "../../../utils/platform"; -import IconFont from "../../ui/IconFont"; import { IOStyles } from "../variables/IOStyles"; +import { Icon } from "../icons/Icon"; // TODO: handle external initial open/closed state type Props = { @@ -65,7 +65,7 @@ export const RawAccordion: React.FunctionComponent = props => { const arrowAngle = shouldAnimate ? animatedController.interpolate({ inputRange: [0, 1], - outputRange: ["-90deg", "-270deg"] + outputRange: ["0deg", "-180deg"] }) : getDegree(isOpen); @@ -110,11 +110,7 @@ export const RawAccordion: React.FunctionComponent = props => { transform: [{ rotateZ: arrowAngle }] }} > - + diff --git a/ts/components/core/icons/Icon.tsx b/ts/components/core/icons/Icon.tsx index 219f369f07c..3af82375ac0 100644 --- a/ts/components/core/icons/Icon.tsx +++ b/ts/components/core/icons/Icon.tsx @@ -40,6 +40,7 @@ import IconSave from "./svg/IconSave"; import IconCompleted from "./svg/IconCompleted"; import IconSuccess from "./svg/IconSuccess"; import IconOk from "./svg/IconOk"; +import IconFiscalCodeIndividual from "./svg/IconFiscalCodeIndividual"; import IconCreditCard from "./svg/IconCreditCard"; import IconBonus from "./svg/IconBonus"; import IconTransactions from "./svg/IconTransactions"; @@ -158,7 +159,6 @@ import LegIconCompleted from "./svg/LegIconCompleted"; import LegIconCreditCard from "./svg/LegIconCreditCard"; import LegIconBonus from "./svg/LegIconBonus"; import LegIconDocumentAttachment from "./svg/LegIconDocumentAttachment"; -import LegIconTransactions from "./svg/LegIconTransactions"; import LegIconAmount from "./svg/LegIconAmount"; import LegIconCoggle from "./svg/LegIconCoggle"; import LegIconLocation from "./svg/LegIconLocation"; @@ -166,7 +166,6 @@ import LegIconWarning from "./svg/LegIconWarning"; import LegIconNotice from "./svg/LegIconNotice"; import LegIconHistory from "./svg/LegIconHistory"; import LegIconEdit from "./svg/LegIconEdit"; -import LegIconBattery from "./svg/LegIconBattery"; import LegIconTrashcan from "./svg/LegIconTrashcan"; import LegIconCalendar from "./svg/LegIconCalendar"; import LegIconProfile from "./svg/LegIconProfile"; @@ -175,52 +174,52 @@ import LegIconMagicWand from "./svg/LegIconMagicWand"; import LegIconStarFilled from "./svg/LegIconStarFilled"; import LegIconStarEmpty from "./svg/LegIconStarEmpty"; import LegIconSwitchOff from "./svg/LegIconSwitchOff"; -import LegIconDotMenu from "./svg/LegIconDotMenu"; import LegIconBarcode from "./svg/LegIconBarcode"; import LegIconSave from "./svg/LegIconSave"; -import LegIconLogin from "./svg/LegIconLogin"; import LegIconLadybug from "./svg/LegIconLadybug"; import LegIconTag from "./svg/LegIconTag"; -import LegIconGallery from "./svg/LegIconGallery"; import LegIconExternalLink from "./svg/LegIconExternalLink"; import LegIconUnknownGdo from "./svg/LegIconUnknownGdo"; -import LegIconCancel from "./svg/LegIconCancel"; -import LegIconDevice from "./svg/LegIconDevice"; import LegIconQuestion from "./svg/LegIconQuestion"; import LegIconSearch from "./svg/LegIconSearch"; import LegIconClose from "./svg/LegIconClose"; import LegIconCloseSmall from "./svg/LegIconCloseSmall"; +import LegIconChevronLeft from "./svg/LegIconChevronLeft"; import LegIconGiacenza from "./svg/LegIconGiacenza"; import LegIconPSP from "./svg/LegIconPSP"; import LegIconError from "./svg/LegIconError"; +import LegIconRadioOn from "./svg/LegIconRadioOn"; +import LegIconRadioOff from "./svg/LegIconRadioOff"; +import LegIconCheckOn from "./svg/LegIconCheckOn"; +import LegIconCheckOff from "./svg/LegIconCheckOff"; export const IOIcons = { spid: IconSpid, cie: IconCie /* io-cie */, qrCode: IconQrCode, - legQrCode: LegIconQrCode /* io-qr */, + legQrCode: LegIconQrCode, bell: IconBell, website: IconWebsite, legWebsite: LegIconWebsite, abacus: IconAbacus, - legAbacus: LegIconAbacus /* io-abacus */, + legAbacus: LegIconAbacus, home: IconHome, homeFill: IconHomeFill, legHome: LegIconHome, copy: IconCopy, - legCopy: LegIconCopy /* io-copy */, + legCopy: LegIconCopy, selfCert: IconSelfCertification, institution: IconInstitution, legInstitution: LegIconInstitution, hourglass: IconHourglass, - legHourglass: LegIconHourglass /* io-hourglass */, + legHourglass: LegIconHourglass, shareiOs: IconShareiOs, shareAndroid: IconShareAndroid, - legShare: LegIconShare /* io-share */, + legShare: LegIconShare, locked: IconLockOn, unlocked: IconLockOff, - legLocked: LegIconLockOn /* io-locker-closed */ /* io-lucchetto */, - legUnlocked: LegIconLockOff /* io-locker-open */, + legLocked: LegIconLockOn /* io-lucchetto */, + legUnlocked: LegIconLockOff, initiatives: IconInitiatives, legInitiatives: LegIconInitiatives, analytics: IconAnalytics, @@ -237,8 +236,8 @@ export const IOIcons = { legPinOn: LegIconPinOn, emojiSad: IconEmojiSad, emojiHappy: IconEmojiHappy, - legEmojiSad: LegIconEmojiSad /* io-sad */, - legEmojiHappy: LegIconEmojiHappy /* io-happy */, + legEmojiSad: LegIconEmojiSad, + legEmojiHappy: LegIconEmojiHappy, phone: IconPhone, legPhone: LegIconPhone /* io-phone */, email: IconEmail, @@ -249,7 +248,7 @@ export const IOIcons = { messageLegal: IconMessageLegal, legMessageLegal: LegIconMessageLegal, message: IconMessage, - legMessage: LegIconMessage /* io-send-message */, + legMessage: LegIconMessage, chat: IconChat, legChat: LegIconChat, doc: IconDocument, @@ -265,17 +264,17 @@ export const IOIcons = { attachment: IconAttachment, legAttachment: LegIconAttachment, add: IconAdd, - legAdd: LegIconAdd /* io-plus */, + legAdd: LegIconAdd, completed: IconCompleted, - legCompleted: LegIconCompleted /* io-tick-big */, - success: IconSuccess /* io-success */, - ok: IconOk /* io-complete */, + legCompleted: LegIconCompleted, + success: IconSuccess, + ok: IconOk, + fiscalCodeIndividual: IconFiscalCodeIndividual, creditCard: IconCreditCard, legCreditCard: LegIconCreditCard /* io-carta */, bonus: IconBonus, legBonus: LegIconBonus, - transactions: IconTransactions /* io-transactions */, - legTransactions: LegIconTransactions, + transactions: IconTransactions, amount: IconAmount, legAmount: LegIconAmount, psp: IconPSP, @@ -285,27 +284,26 @@ export const IOIcons = { locationAndroid: IconLocationAndroid, legLocation: LegIconLocation, coggle: IconCoggle, - legCoggle: LegIconCoggle /* io-coggle */ /* io-preferenze */, + legCoggle: LegIconCoggle, warningFilled: IconWarningFilled, legWarning: LegIconWarning /* io-warning */, - notice: IconNotice /* io-notice */, + notice: IconNotice, noticeFilled: IconNoticeFilled, legNotice: LegIconNotice, - info: IconInfo /* io-info */, + info: IconInfo, infoFilled: IconInfoFilled, canceled: IconCanceled, - legError: LegIconError /* io-error */, + legError: LegIconError, errorFilled: IconErrorFilled, refund: IconRefund, - reload: IconReload /* io-reload */, + reload: IconReload, history: IconHistory, legHistory: LegIconHistory, edit: IconEdit, - legEdit: LegIconEdit /* io-edit */, + legEdit: LegIconEdit, battery: IconBattery, - legBattery: LegIconBattery, trashcan: IconTrashcan, - legTrashcan: LegIconTrashcan /* io-trash */, + legTrashcan: LegIconTrashcan, calendar: IconCalendar, legCalendar: LegIconCalendar /* io-calendar */ /* io-calendario */, profile: IconProfile, @@ -313,48 +311,44 @@ export const IOIcons = { profileAlt: IconProfileAlt /* io-titolare */, legProfile: LegIconProfile, profileExperiment: IconProfileExperiment, - legProfileExperiment: LegIconProfileExperiment /* io-profilo-exp */, + legProfileExperiment: LegIconProfileExperiment, magicWand: IconMagicWand, legMagicWand: LegIconMagicWand, starFilled: IconStarFilled, starEmpty: IconStarEmpty, - legStarFilled: LegIconStarFilled /* io-filled-star */, - legStarEmpty: LegIconStarEmpty /* io-empty-star */, + legStarFilled: LegIconStarFilled, + legStarEmpty: LegIconStarEmpty, switchOff: IconSwitchOff, legSwitchOff: LegIconSwitchOff, device: IconDevice, - legDevice: LegIconDevice, dotMenu: IconDotMenu, - legDotMenu: LegIconDotMenu /* io-more */, barcode: IconBarcode, legBarcode: LegIconBarcode, - save: IconSave /* io-save */, - legSave: LegIconSave /* io-save */, + save: IconSave, + legSave: LegIconSave, login: IconLogin, logout: IconLogout, - legLogin: LegIconLogin, ladybug: IconLadybug, legLadybug: LegIconLadybug, tag: IconTag, legTag: LegIconTag, gallery: IconGallery, - legGallery: LegIconGallery, externalLink: IconExternalLink, legExternalLink: LegIconExternalLink, unknownGdo: IconUnknownGdo, legUnknownGdo: LegIconUnknownGdo, - cancel: IconCancel /* io-cancel */, - legCancel: LegIconCancel /* io-cancel */, - help: IconQuestion /* io-question */, + cancel: IconCancel, + help: IconQuestion, legHelp: LegIconQuestion /* io-question */, - search: IconSearch /* io-search */, + search: IconSearch, legSearch: LegIconSearch /* io-search */, - chevronRight: IconChevronRight /* io-right */, - chevronLeft: IconChevronLeft /* io-back */, + chevronRight: IconChevronRight, + chevronLeft: IconChevronLeft, chevronBottom: IconChevronBottom, chevronTop: IconChevronTop, chevronRightListItem: IconChevronRightListItem, - close: IconClose /* io-close */, + legChevronLeft: LegIconChevronLeft, + close: IconClose, legClose: LegIconClose /* io-close */, closeSmall: IconCloseSmall, legCloseSmall: LegIconCloseSmall, @@ -364,11 +358,15 @@ export const IOIcons = { arrowRight: IconArrowRight, backiOS: IconBackiOS, backAndroid: IconBackAndroid, - navMessages: IconNavMessages /* io-messaggi */, - navWallet: IconNavWallet /* io-portafoglio */, + legRadioOn: LegIconRadioOn, + legRadioOff: LegIconRadioOff, + legCheckOn: LegIconCheckOn, + legCheckOff: LegIconCheckOff, + navMessages: IconNavMessages, + navWallet: IconNavWallet, navDocuments: IconNavDocuments, navServices: IconNavServices, - navProfile: IconNavProfile /* io-profilo */, + navProfile: IconNavProfile, biomFingerprint: IconBiomFingerprint /* io-fingerprint */, biomFaceID: IconBiomFaceID /* io-face-id */, categCulture: IconCategCulture, @@ -383,7 +381,7 @@ export const IOIcons = { categJobOffers: IconCategJobOffers, categShopping: IconCategShopping, categSustainability: IconCategSustainability, - productIOApp: IconProductIOApp /* io-logo */, + productIOApp: IconProductIOApp, productPagoPA: IconProductPagoPA /* io-pagopa */ } as const; @@ -393,11 +391,23 @@ export type IOIconsProps = { name: IOIcons; color?: IOColors; size?: number | "100%"; + testID?: string; + accessible?: boolean; + accessibilityLabel?: string; }; export type SVGIconProps = { size: number | "100%"; style: StyleProp; + accessible: boolean; + accessibilityElementsHidden: boolean; + accessibilityLabel: string; + importantForAccessibility: + | "auto" + | "yes" + | "no" + | "no-hide-descendants" + | undefined; }; /* @@ -408,11 +418,21 @@ export const Icon = ({ name, color = "bluegrey", size = 24, + accessible = false, + accessibilityLabel = "", ...props }: IOIconsProps) => { const IconElement = IOIcons[name]; return ( - + ); }; @@ -425,16 +445,28 @@ type IOAnimatedIconsProps = { name: IOIcons; color?: ColorValue; size?: number | "100%"; + accessible?: boolean; }; export const AnimatedIcon = ({ name, color = IOColors.bluegrey, size = 24, + accessible = false, ...props }: IOAnimatedIconsProps) => { const IconElement = IOIcons[name]; - return ; + return ( + + ); }; /* Make component animatable. Reanimated supports class components only, @@ -489,6 +521,7 @@ const { attachment, add, completed, + fiscalCodeIndividual, creditCard, bonus, transactions, @@ -586,6 +619,7 @@ export const IOIconsNew = { attachment, add, completed, + fiscalCodeIndividual, creditCard, bonus, transactions, diff --git a/ts/components/core/icons/svg/IconAbacus.tsx b/ts/components/core/icons/svg/IconAbacus.tsx index c7ecaaea620..bd1d2b010e1 100644 --- a/ts/components/core/icons/svg/IconAbacus.tsx +++ b/ts/components/core/icons/svg/IconAbacus.tsx @@ -2,8 +2,8 @@ import React from "react"; import { Svg, Path } from "react-native-svg"; import { SVGIconProps } from "../Icon"; -const IconAbacus = ({ size, style }: SVGIconProps) => ( - +const IconAbacus = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconAdd = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconAgreement = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconAmount = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconAnalytics = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconArrowBottom = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconArrowLeft = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconArrowRight = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconArrowUp = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconAttachment = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconBackAndroid = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconBackiOS = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconBarcode = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconBattery = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconBell = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconBiomFaceID = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconBiomFingerprint = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconBonus = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconCalendar = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconCancel = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconCanceled = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconCategCulture = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconCategFinance = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconCategHome = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconCategJobOffers = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconCategLearning = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconCategMobility = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconCategShopping = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconCategSport = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconCategSustainability = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconCategCulture = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconCategTravel = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconCategWellness = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconChat = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconChevronBottom = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconChevronLeft = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconChevronRight = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconChevronRightListItem = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconChevronTop = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconCie = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconClose = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconCloseSmall = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconCoggle = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconCompleted = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconCopy = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconCreditCard = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconDevice = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconDocument = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconDocumentAttachment = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconDocumentAttachmentPDF = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconDocumentSign = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconDotMenu = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconEdit = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconEmail = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconEmailFill = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconEmailLegal = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconEmojiHappy = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconEmojiSad = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconErrorFilled = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconExternalLink = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconEyeHide = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconEyeShow = ({ size, style, ...props }: SVGIconProps) => ( + ( + + + +); + +export default IconFiscalCodeIndividual; diff --git a/ts/components/core/icons/svg/IconFornitori.tsx b/ts/components/core/icons/svg/IconFornitori.tsx index 7e4f3c605f5..91ef0e07ff1 100644 --- a/ts/components/core/icons/svg/IconFornitori.tsx +++ b/ts/components/core/icons/svg/IconFornitori.tsx @@ -2,8 +2,8 @@ import React from "react"; import { Svg, Path } from "react-native-svg"; import { SVGIconProps } from "../Icon"; -const IconFornitori = ({ size, style }: SVGIconProps) => ( - +const IconFornitori = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconGallery = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconGiacenza = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconHistory = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconHome = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconHomeFill = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconHourglass = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconInfo = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconInfoFilled = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconInitiatives = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconInstitution = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconLadybug = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconLocationAndroid = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconLocationiOS = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconLocationiOSFilled = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconLockOff = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconLockOn = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconLogin = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconLogout = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconMagicWand = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconMessage = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconMessageLegal = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconNavDocuments = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconNavMessages = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconNavProfile = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconNavServices = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconNavWallet = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconNotice = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconNoticeFilled = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconOk = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconPEC = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconPSP = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconPhone = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconPinOff = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconPinOn = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconProductIOApp = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconProductPagoPA = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconProfile = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconProfileAlt = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconProfileExperiment = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconProfileFilled = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconQrCode = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconQuestion = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconRefund = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconReload = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconSave = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconSearch = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconSecurity = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconSelfCertification = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconShareAndroid = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconShareiOs = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconSpid = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconStarEmpty = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconStarFilled = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconSuccess = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconSwitchOff = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconTag = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconTransactions = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconTrashcan = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconUnknownGdo = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconWarningFilled = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const IconWebsite = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconAbacus = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconAdd = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconAmount = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconAnalytics = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconAttachment = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconBarcode = ({ size, style, ...props }: SVGIconProps) => ( + ( - - - - -); - -export default LegIconBattery; diff --git a/ts/components/core/icons/svg/LegIconBonus.tsx b/ts/components/core/icons/svg/LegIconBonus.tsx index 83546437153..e258a6609c3 100644 --- a/ts/components/core/icons/svg/LegIconBonus.tsx +++ b/ts/components/core/icons/svg/LegIconBonus.tsx @@ -2,8 +2,8 @@ import React from "react"; import { Svg, Path } from "react-native-svg"; import { SVGIconProps } from "../Icon"; -const LegIconBonus = ({ size, style }: SVGIconProps) => ( - +const LegIconBonus = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconCalendar = ({ size, style, ...props }: SVGIconProps) => ( + ( - - - - - - -); - -export default LegIconCancel; diff --git a/ts/components/core/icons/svg/LegIconChat.tsx b/ts/components/core/icons/svg/LegIconChat.tsx index 8148990c1b8..b87401744b9 100644 --- a/ts/components/core/icons/svg/LegIconChat.tsx +++ b/ts/components/core/icons/svg/LegIconChat.tsx @@ -2,8 +2,8 @@ import React from "react"; import { Svg, Path } from "react-native-svg"; import { SVGIconProps } from "../Icon"; -const LegIconChat = ({ size, style }: SVGIconProps) => ( - +const LegIconChat = ({ size, style, ...props }: SVGIconProps) => ( + ( + + + +); + +export default LegIconCheckOff; diff --git a/ts/components/core/icons/svg/LegIconCheckOn.tsx b/ts/components/core/icons/svg/LegIconCheckOn.tsx new file mode 100644 index 00000000000..c2093cbd39f --- /dev/null +++ b/ts/components/core/icons/svg/LegIconCheckOn.tsx @@ -0,0 +1,30 @@ +import React from "react"; +import { Svg, Path } from "react-native-svg"; +import { SVGIconProps } from "../Icon"; + +const LegIconCheckOn = ({ size, style, ...props }: SVGIconProps) => ( + + + + + + +); + +export default LegIconCheckOn; diff --git a/ts/components/core/icons/svg/LegIconChevronLeft.tsx b/ts/components/core/icons/svg/LegIconChevronLeft.tsx new file mode 100644 index 00000000000..e6d87d87d9c --- /dev/null +++ b/ts/components/core/icons/svg/LegIconChevronLeft.tsx @@ -0,0 +1,14 @@ +import React from "react"; +import { Svg, Path } from "react-native-svg"; +import { SVGIconProps } from "../Icon"; + +const LegIconChevronLeft = ({ size, style, ...props }: SVGIconProps) => ( + + + +); + +export default LegIconChevronLeft; diff --git a/ts/components/core/icons/svg/LegIconClose.tsx b/ts/components/core/icons/svg/LegIconClose.tsx index bbbcd3ac944..b61393b4aee 100644 --- a/ts/components/core/icons/svg/LegIconClose.tsx +++ b/ts/components/core/icons/svg/LegIconClose.tsx @@ -2,8 +2,8 @@ import React from "react"; import { Svg, Path } from "react-native-svg"; import { SVGIconProps } from "../Icon"; -const LegIconClose = ({ size, style }: SVGIconProps) => ( - +const LegIconClose = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconCloseSmall = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconCoggle = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconCompleted = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconCopy = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconCreditCard = ({ size, style, ...props }: SVGIconProps) => ( + ( - - - -); - -export default LegIconDevice; diff --git a/ts/components/core/icons/svg/LegIconDocumentAttachment.tsx b/ts/components/core/icons/svg/LegIconDocumentAttachment.tsx index 44e74f6e29a..51791e0388c 100644 --- a/ts/components/core/icons/svg/LegIconDocumentAttachment.tsx +++ b/ts/components/core/icons/svg/LegIconDocumentAttachment.tsx @@ -2,8 +2,8 @@ import React from "react"; import { Svg, Path } from "react-native-svg"; import { SVGIconProps } from "../Icon"; -const LegIconDocumentAttachment = ({ size, style }: SVGIconProps) => ( - +const LegIconDocumentAttachment = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconDocumentAttachmentPDF = ({ + size, + style, + ...props +}: SVGIconProps) => ( + ( - - - - -); - -export default LegIconDotMenu; diff --git a/ts/components/core/icons/svg/LegIconEdit.tsx b/ts/components/core/icons/svg/LegIconEdit.tsx index 71105c355f2..ed3d61161ee 100644 --- a/ts/components/core/icons/svg/LegIconEdit.tsx +++ b/ts/components/core/icons/svg/LegIconEdit.tsx @@ -2,8 +2,8 @@ import React from "react"; import { Svg, Path } from "react-native-svg"; import { SVGIconProps } from "../Icon"; -const LegIconEdit = ({ size, style }: SVGIconProps) => ( - +const LegIconEdit = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconEmail = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconEmojiHappy = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconEmojiSad = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconError = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconExternalLink = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconEyeHide = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconEyeShow = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconFornitori = ({ size, style, ...props }: SVGIconProps) => ( + ( - - - -); - -export default LegIconGallery; diff --git a/ts/components/core/icons/svg/LegIconGiacenza.tsx b/ts/components/core/icons/svg/LegIconGiacenza.tsx index 2e67d928d14..df7fcdb8217 100644 --- a/ts/components/core/icons/svg/LegIconGiacenza.tsx +++ b/ts/components/core/icons/svg/LegIconGiacenza.tsx @@ -2,8 +2,8 @@ import React from "react"; import { Svg, Path } from "react-native-svg"; import { SVGIconProps } from "../Icon"; -const LegIconGiacenza = ({ size, style }: SVGIconProps) => ( - +const LegIconGiacenza = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconHistory = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconHome = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconHourglass = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconInitiatives = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconInstitution = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconLadybug = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconLocation = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconLockOff = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconLockOn = ({ size, style, ...props }: SVGIconProps) => ( + ( - - - - - -); - -export default LegIconLogin; diff --git a/ts/components/core/icons/svg/LegIconMagicWand.tsx b/ts/components/core/icons/svg/LegIconMagicWand.tsx index 36c0a319ec0..a3b1c93bc3a 100644 --- a/ts/components/core/icons/svg/LegIconMagicWand.tsx +++ b/ts/components/core/icons/svg/LegIconMagicWand.tsx @@ -2,8 +2,8 @@ import React from "react"; import { Svg, Path } from "react-native-svg"; import { SVGIconProps } from "../Icon"; -const LegIconMagicWand = ({ size, style }: SVGIconProps) => ( - +const LegIconMagicWand = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconMessage = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconMessageLegal = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconNotice = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconPEC = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconPSP = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconPhone = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconPinOff = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconPinOn = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconProfile = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconProfileExperiment = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconQrCode = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconQuestion = ({ size, style, ...props }: SVGIconProps) => ( + ( + + + +); + +export default LegIconRadioOff; diff --git a/ts/components/core/icons/svg/LegIconRadioOn.tsx b/ts/components/core/icons/svg/LegIconRadioOn.tsx new file mode 100644 index 00000000000..2aec0c816da --- /dev/null +++ b/ts/components/core/icons/svg/LegIconRadioOn.tsx @@ -0,0 +1,30 @@ +import React from "react"; +import { Svg, Path } from "react-native-svg"; +import { SVGIconProps } from "../Icon"; + +const LegIconRadioOn = ({ size, style, ...props }: SVGIconProps) => ( + + + + + + +); + +export default LegIconRadioOn; diff --git a/ts/components/core/icons/svg/LegIconSave.tsx b/ts/components/core/icons/svg/LegIconSave.tsx index 4482cd3b402..0f7697865af 100644 --- a/ts/components/core/icons/svg/LegIconSave.tsx +++ b/ts/components/core/icons/svg/LegIconSave.tsx @@ -2,8 +2,8 @@ import React from "react"; import { Svg, Path } from "react-native-svg"; import { SVGIconProps } from "../Icon"; -const LegIconSave = ({ size, style }: SVGIconProps) => ( - +const LegIconSave = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconSearch = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconShare = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconStarEmpty = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconStarFilled = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconSwitchOff = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconTag = ({ size, style, ...props }: SVGIconProps) => ( + ( - - - - - - -); - -export default LegIconTransactions; diff --git a/ts/components/core/icons/svg/LegIconTrashcan.tsx b/ts/components/core/icons/svg/LegIconTrashcan.tsx index 71426e1770d..0eebd0d6c91 100644 --- a/ts/components/core/icons/svg/LegIconTrashcan.tsx +++ b/ts/components/core/icons/svg/LegIconTrashcan.tsx @@ -2,8 +2,8 @@ import React from "react"; import { Svg, Path } from "react-native-svg"; import { SVGIconProps } from "../Icon"; -const LegIconTrashcan = ({ size, style }: SVGIconProps) => ( - +const LegIconTrashcan = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconUnknownGdo = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconWarning = ({ size, style, ...props }: SVGIconProps) => ( + ( - +const LegIconWebsite = ({ size, style, ...props }: SVGIconProps) => ( + - - diff --git a/ts/components/core/icons/svg/originals/IconFiscalCodeIndividual.svg b/ts/components/core/icons/svg/originals/IconFiscalCodeIndividual.svg new file mode 100644 index 00000000000..0f621b0c7b5 --- /dev/null +++ b/ts/components/core/icons/svg/originals/IconFiscalCodeIndividual.svg @@ -0,0 +1,8 @@ + + + diff --git a/ts/components/core/icons/svg/originals/IconTransactions.svg b/ts/components/core/icons/svg/originals/IconTransactions.svg deleted file mode 100644 index f023e33bb59..00000000000 --- a/ts/components/core/icons/svg/originals/IconTransactions.svg +++ /dev/null @@ -1,8 +0,0 @@ - - - diff --git a/ts/components/core/icons/svg/originals/LegIconBattery.svg b/ts/components/core/icons/svg/originals/LegIconBattery.svg deleted file mode 100644 index a4080092155..00000000000 --- a/ts/components/core/icons/svg/originals/LegIconBattery.svg +++ /dev/null @@ -1,10 +0,0 @@ - - - - diff --git a/ts/components/core/icons/svg/originals/LegIconCancel.svg b/ts/components/core/icons/svg/originals/LegIconCancel.svg deleted file mode 100644 index 8545ba5f532..00000000000 --- a/ts/components/core/icons/svg/originals/LegIconCancel.svg +++ /dev/null @@ -1,22 +0,0 @@ - - - - - - diff --git a/ts/components/core/icons/svg/originals/LegIconCheckOff.svg b/ts/components/core/icons/svg/originals/LegIconCheckOff.svg new file mode 100644 index 00000000000..393249e4774 --- /dev/null +++ b/ts/components/core/icons/svg/originals/LegIconCheckOff.svg @@ -0,0 +1,8 @@ + + + diff --git a/ts/components/core/icons/svg/originals/LegIconCheckOn.svg b/ts/components/core/icons/svg/originals/LegIconCheckOn.svg new file mode 100644 index 00000000000..ceef443d300 --- /dev/null +++ b/ts/components/core/icons/svg/originals/LegIconCheckOn.svg @@ -0,0 +1,22 @@ + + + + + + diff --git a/ts/components/core/icons/svg/originals/LegIconChevronLeft.svg b/ts/components/core/icons/svg/originals/LegIconChevronLeft.svg new file mode 100644 index 00000000000..4ffb75a2f95 --- /dev/null +++ b/ts/components/core/icons/svg/originals/LegIconChevronLeft.svg @@ -0,0 +1,6 @@ + + + diff --git a/ts/components/core/icons/svg/originals/LegIconDotMenu.svg b/ts/components/core/icons/svg/originals/LegIconDotMenu.svg deleted file mode 100644 index dc871852040..00000000000 --- a/ts/components/core/icons/svg/originals/LegIconDotMenu.svg +++ /dev/null @@ -1,10 +0,0 @@ - - - - diff --git a/ts/components/core/icons/svg/originals/LegIconGallery.svg b/ts/components/core/icons/svg/originals/LegIconGallery.svg deleted file mode 100644 index 09469217f15..00000000000 --- a/ts/components/core/icons/svg/originals/LegIconGallery.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - diff --git a/ts/components/core/icons/svg/originals/LegIconLogin.svg b/ts/components/core/icons/svg/originals/LegIconLogin.svg deleted file mode 100644 index 1dcabeb6faa..00000000000 --- a/ts/components/core/icons/svg/originals/LegIconLogin.svg +++ /dev/null @@ -1,14 +0,0 @@ - - - - - diff --git a/ts/components/core/icons/svg/originals/LegIconRadioOff.svg b/ts/components/core/icons/svg/originals/LegIconRadioOff.svg new file mode 100644 index 00000000000..52ab385c030 --- /dev/null +++ b/ts/components/core/icons/svg/originals/LegIconRadioOff.svg @@ -0,0 +1,8 @@ + + + diff --git a/ts/components/core/icons/svg/originals/LegIconRadioOn.svg b/ts/components/core/icons/svg/originals/LegIconRadioOn.svg new file mode 100644 index 00000000000..0260d8d14a6 --- /dev/null +++ b/ts/components/core/icons/svg/originals/LegIconRadioOn.svg @@ -0,0 +1,22 @@ + + + + + + diff --git a/ts/components/core/icons/svg/originals/LegIconTransactions.svg b/ts/components/core/icons/svg/originals/LegIconTransactions.svg deleted file mode 100644 index 0dd8f84929a..00000000000 --- a/ts/components/core/icons/svg/originals/LegIconTransactions.svg +++ /dev/null @@ -1,22 +0,0 @@ - - - - - - diff --git a/ts/components/core/pictograms/PictogramSection.tsx b/ts/components/core/pictograms/PictogramSection.tsx index 8aaa64958d6..7e5cdb76eb5 100644 --- a/ts/components/core/pictograms/PictogramSection.tsx +++ b/ts/components/core/pictograms/PictogramSection.tsx @@ -14,7 +14,7 @@ export const IOSectionPictograms = { messages: PictogramSectionMessages /* io-home-messaggi */, payments: PictogramSectionPayments, documents: PictogramSectionDocuments, - services: PictogramSectionServices /* io-home-servizi */, + services: PictogramSectionServices, profile: PictogramSectionProfile, settings: PictogramSectionSettings }; diff --git a/ts/components/core/selection/RadioButtonList.tsx b/ts/components/core/selection/RadioButtonList.tsx index e40bd5a0907..f750bc17e6b 100644 --- a/ts/components/core/selection/RadioButtonList.tsx +++ b/ts/components/core/selection/RadioButtonList.tsx @@ -5,8 +5,7 @@ import { H4 } from "../typography/H4"; import { IOStyles } from "../variables/IOStyles"; import TouchableDefaultOpacity from "../../TouchableDefaultOpacity"; import { IOColors } from "../variables/IOColors"; -import IconFont from "./../../ui/IconFont"; -import themeVariables from "./../../../theme/variables"; +import { Icon } from "../icons/Icon"; export type RadioItem = { body: ReactNode; @@ -119,18 +118,21 @@ export const RadioButtonList = (props: Props) => ( ]} testID={`pspItemTestID_${item.id}`} > - props.onPress(item.id)} style={[ styles.icon, props.rightSideSelection && styles.rightSideIcon ]} - /> + > + + {getBody(item, () => props.onPress(item.id))} ))} diff --git a/ts/components/core/selection/RemoteSwitch.tsx b/ts/components/core/selection/RemoteSwitch.tsx index 45771948997..3fdc0d356d0 100644 --- a/ts/components/core/selection/RemoteSwitch.tsx +++ b/ts/components/core/selection/RemoteSwitch.tsx @@ -4,11 +4,10 @@ import { View, ActivityIndicator } from "react-native"; import I18n from "../../../i18n"; import { TestID } from "../../../types/WithTestID"; import TouchableDefaultOpacity from "../../TouchableDefaultOpacity"; -import IconFont from "../../ui/IconFont"; import Switch from "../../ui/Switch"; import { calculateSlop } from "../accessibility"; -import { IOColors } from "../variables/IOColors"; import { IOStyleVariables } from "../variables/IOStyleVariables"; +import { Icon } from "../icons/Icon"; type Props = { value: pot.Pot; @@ -55,15 +54,9 @@ const NoneErrorVersion = (props: NoneErrorProps) => ( accessibilityLabel={I18n.t("global.genericRetry")} hitSlop={{ bottom: slop, left: slop, right: slop, top: slop }} onPress={props.onRetry} - style={{ width: IOStyleVariables.switchWidth }} + style={{ width: IOStyleVariables.switchWidth, alignItems: "center" }} > - + ); diff --git a/ts/components/core/selection/__test__/__snapshots__/RemoteSwitch.test.tsx.snap b/ts/components/core/selection/__test__/__snapshots__/RemoteSwitch.test.tsx.snap index ec4881593a0..56d389d3df0 100644 --- a/ts/components/core/selection/__test__/__snapshots__/RemoteSwitch.test.tsx.snap +++ b/ts/components/core/selection/__test__/__snapshots__/RemoteSwitch.test.tsx.snap @@ -39,48 +39,66 @@ exports[`RemoteSwitch tests Snapshot for pot.noneError 1`] = ` onStartShouldSetResponder={[Function]} style={ Object { + "alignItems": "center", "opacity": 1, "width": 51, } } > - -  - + + + + `; diff --git a/ts/components/core/selection/checkbox/RawCheckBox.tsx b/ts/components/core/selection/checkbox/RawCheckBox.tsx index a4624d808b7..ceb454c1d09 100644 --- a/ts/components/core/selection/checkbox/RawCheckBox.tsx +++ b/ts/components/core/selection/checkbox/RawCheckBox.tsx @@ -1,11 +1,11 @@ import * as React from "react"; -import { StyleSheet } from "react-native"; +import { StyleSheet, View } from "react-native"; import TouchableDefaultOpacity, { TouchableDefaultOpacityProps } from "../../../TouchableDefaultOpacity"; -import IconFont from "../../../ui/IconFont"; import { calculateSlop } from "../../accessibility"; import { IOColors } from "../../variables/IOColors"; +import { Icon } from "../../icons/Icon"; type Props = { // the value of the checkbox @@ -15,20 +15,21 @@ type Props = { type OwnProps = Props & Pick; -const size = 24; +const SIZE: number = 24; +const BORDER_WIDTH: number = 2; -const offColor = IOColors.bluegrey; -const onColor = IOColors.blue; -const slop = calculateSlop(size); -const tickSize = size * 0.85; +const offColor: IOColors = "bluegrey"; +const onColor: IOColors = "blue"; +const slop = calculateSlop(SIZE); +const tickSize = SIZE; const styles = StyleSheet.create({ checkBox: { - width: size, - height: size, + width: SIZE, + height: SIZE, backgroundColor: IOColors.white, borderColor: IOColors.blue, - borderWidth: 2, + borderWidth: BORDER_WIDTH, borderRadius: 4 } }); @@ -54,10 +55,15 @@ export const RawCheckBox: React.FunctionComponent = props => { testID="RawCheckbox" onPress={props.onPress} hitSlop={{ bottom: slop, left: slop, right: slop, top: slop }} - style={[styles.checkBox, { borderColor: getBorderColor(checked) }]} + style={[ + styles.checkBox, + { borderColor: IOColors[getBorderColor(checked)] } + ]} > {checked && ( - + + + )} ); diff --git a/ts/components/infoScreen/imageRendering.tsx b/ts/components/infoScreen/imageRendering.tsx index b2046485c11..3a38ad02c58 100644 --- a/ts/components/infoScreen/imageRendering.tsx +++ b/ts/components/infoScreen/imageRendering.tsx @@ -6,8 +6,6 @@ import { StyleSheet } from "react-native"; import { heightPercentageToDP } from "react-native-responsive-screen"; -import customVariables from "../../theme/variables"; -import IconFont from "../ui/IconFont"; const infoImageSize = 102; const screenHeight = Dimensions.get("screen").height; @@ -40,14 +38,3 @@ export const renderInfoRasterImage = (image: ImageSourcePropType) => ( testID={"rasterImage"} /> ); - -export const renderInfoIconImage = ( - image: string, - iconSize: number = infoImageSize -) => ( - -); diff --git a/ts/components/messages/MessageDetail/DueDateBar.tsx b/ts/components/messages/MessageDetail/DueDateBar.tsx index 2de3f9bb2e0..beb317c123f 100644 --- a/ts/components/messages/MessageDetail/DueDateBar.tsx +++ b/ts/components/messages/MessageDetail/DueDateBar.tsx @@ -12,10 +12,9 @@ import { MessagePaymentExpirationInfo } from "../../../utils/messages"; import { IOColors } from "../../core/variables/IOColors"; -import IconFont from "../../ui/IconFont"; - import { localeDateFormat } from "../../../utils/locale"; import { HSpacer, VSpacer } from "../../core/spacer/Spacer"; +import { Icon } from "../../core/icons"; import { Body } from "../../core/typography/Body"; import { IOStyles } from "../../core/variables/IOStyles"; import CalendarIconComponent from "./common/CalendarIconComponent"; @@ -161,7 +160,7 @@ const DueDateBar: React.FunctionComponent = ({ if (isPaid) { return ( - + {I18n.t("wallet.errors.DUPLICATED")} diff --git a/ts/components/messages/MessageDetail/__tests__/__snapshots__/DueDate.test.tsx.snap b/ts/components/messages/MessageDetail/__tests__/__snapshots__/DueDate.test.tsx.snap index eb591990f4d..0c47369b3f7 100644 --- a/ts/components/messages/MessageDetail/__tests__/__snapshots__/DueDate.test.tsx.snap +++ b/ts/components/messages/MessageDetail/__tests__/__snapshots__/DueDate.test.tsx.snap @@ -8071,36 +8071,102 @@ exports[`the \`DueDateBar\` component when \`isPaid\` is true should match the } } > - -  - + + + + + + + - - $ - + + + + + - - $ - + + + + + - - $ - + + + + + { ); const { small, disabled, medium } = this.props; const iconName = this.state.isEventInDeviceCalendar - ? "io-tick-big" - : "io-plus"; + ? "legCompleted" + : "legAdd"; return ( { bordered={!disabled} style={this.props.small ? styles.oneThird : styles.button} > - + {/* This condition doesn't make sense. We should replace it using + a different component (e.g. ButtonOutline) */} + {reminderText} ); diff --git a/ts/components/messages/MessageDetail/index.tsx b/ts/components/messages/MessageDetail/index.tsx index 3abf0885179..fed7e877cc9 100644 --- a/ts/components/messages/MessageDetail/index.tsx +++ b/ts/components/messages/MessageDetail/index.tsx @@ -91,9 +91,8 @@ const renderThirdPartyAttachmentsError = (viewRef: React.RefObject) => ( <> diff --git a/ts/components/messages/MessageList/Item.tsx b/ts/components/messages/MessageList/Item.tsx index 4c7db1318f1..c83490de765 100644 --- a/ts/components/messages/MessageList/Item.tsx +++ b/ts/components/messages/MessageList/Item.tsx @@ -27,7 +27,7 @@ import { IOColors } from "../../core/variables/IOColors"; import { IOStyles } from "../../core/variables/IOStyles"; import { BadgeComponent } from "../../screens/BadgeComponent"; import TouchableDefaultOpacity from "../../TouchableDefaultOpacity"; -import IconFont from "../../ui/IconFont"; +import { Icon } from "../../core/icons/Icon"; const ICON_WIDTH = 24; @@ -249,7 +249,6 @@ const MessageListItem = ({ message.organizationName || UNKNOWN_SERVICE_DATA.organizationName; const serviceName = message.serviceName || UNKNOWN_SERVICE_DATA.serviceName; const messageTitle = message.title || I18n.t("messages.errorLoading.noTitle"); - const iconName = isSelected ? "io-checkbox-on" : "io-checkbox-off"; const hasQrCode = category?.tag === "EU_COVID_CERT"; const showQrCode = hasQrCode && !isSelectionModeEnabled; @@ -310,10 +309,10 @@ const MessageListItem = ({ hasQrCode && styles.qrCheckBoxContainer ]} > - ) : ( diff --git a/ts/components/messages/MessageList/__tests__/__snapshots__/Item.test.tsx.snap b/ts/components/messages/MessageList/__tests__/__snapshots__/Item.test.tsx.snap index a06e4e41dfa..b0ae8fe3281 100644 --- a/ts/components/messages/MessageList/__tests__/__snapshots__/Item.test.tsx.snap +++ b/ts/components/messages/MessageList/__tests__/__snapshots__/Item.test.tsx.snap @@ -538,38 +538,60 @@ exports[`MessageList Item component when \`isSelectionModeEnabled\` is true and ] } > - - R - + + + + @@ -872,38 +894,102 @@ exports[`MessageList Item component when \`isSelectionModeEnabled\` is true and ] } > - - S - + + + + + + + diff --git a/ts/components/screens/BaseHeader.tsx b/ts/components/screens/BaseHeader.tsx index 563d713e641..0924f9531ec 100644 --- a/ts/components/screens/BaseHeader.tsx +++ b/ts/components/screens/BaseHeader.tsx @@ -30,6 +30,7 @@ import { IOColors } from "../core/variables/IOColors"; import GoBackButton from "../GoBackButton"; import SearchButton, { SearchType } from "../search/SearchButton"; import AppHeader from "../ui/AppHeader"; +import { IOIcons, Icon } from "../core/icons/Icon"; type HelpButtonProps = { onShowHelp: () => void; @@ -88,7 +89,7 @@ interface OwnProps { }; showChat?: boolean; customRightIcon?: { - iconName: string; + iconName: IOIcons; onPress: () => void; accessibilityLabel?: string; }; @@ -280,7 +281,7 @@ class BaseHeaderComponent extends React.PureComponent { accessibilityLabel={customRightIcon.accessibilityLabel} > {!isStringNullyOrEmpty(customRightIcon.iconName) && ( - + )} )} @@ -323,11 +324,11 @@ class BaseHeaderComponent extends React.PureComponent { const { isSearchEnabled, appLogo, primary, dark, isPagoPATestEnabled } = this.props; - const iconColor = isPagoPATestEnabled - ? variables.colorHighlight + const iconColor: IOColors = isPagoPATestEnabled + ? "aqua" : primary || dark - ? IOColors.white - : variables.brandPrimary; + ? "white" + : "blue"; return ( !isSearchEnabled && @@ -339,7 +340,7 @@ class BaseHeaderComponent extends React.PureComponent { importantForAccessibility="no-hide-descendants" style={{ marginLeft: 8 }} > - + ) : ( diff --git a/ts/components/screens/ListItemComponent.tsx b/ts/components/screens/ListItemComponent.tsx index 2e4b739fdd8..8a37f54aafd 100644 --- a/ts/components/screens/ListItemComponent.tsx +++ b/ts/components/screens/ListItemComponent.tsx @@ -12,13 +12,12 @@ import { import Switch from "../../components/ui/Switch"; import customVariables from "../../theme/variables"; import { makeFontStyleObject } from "../core/fonts"; -import { Icon } from "../core/icons"; import { IOBadge } from "../core/IOBadge"; import { HSpacer } from "../core/spacer/Spacer"; import { Body } from "../core/typography/Body"; import { IOColors } from "../core/variables/IOColors"; +import { IOIcons, Icon } from "../core/icons"; import { IOStyles } from "../core/variables/IOStyles"; -import IconFont from "./../ui/IconFont"; import { BadgeComponent } from "./BadgeComponent"; type Props = Readonly<{ @@ -30,7 +29,7 @@ type Props = Readonly<{ isFirstItem?: boolean; isLastItem?: boolean; hasBadge?: boolean; - iconName?: string; + iconName?: IOIcons; smallIconSize?: boolean; iconOnTop?: boolean; iconSize?: number; @@ -175,11 +174,10 @@ export default class ListItemComponent extends React.Component { {this.props.iconName !== undefined && this.props.hideIcon !== true && ( - )} diff --git a/ts/components/screens/TopScreenComponent.tsx b/ts/components/screens/TopScreenComponent.tsx index be861309b9a..673fd29730b 100644 --- a/ts/components/screens/TopScreenComponent.tsx +++ b/ts/components/screens/TopScreenComponent.tsx @@ -2,6 +2,7 @@ import * as React from "react"; import { ComponentProps } from "../../types/react"; import { FAQsCategoriesType } from "../../utils/faq"; import type { IOColors } from "../core/variables/IOColors"; +import type { IOIcons } from "../core/icons"; import { AccessibilityEvents } from "./BaseHeader"; import BaseScreenComponent from "./BaseScreenComponent"; @@ -10,7 +11,7 @@ interface OwnProps { onAccessibilityNavigationHeaderFocus?: () => void; headerTitle?: string; customRightIcon?: { - iconName: string; + iconName: IOIcons; onPress: () => void; }; faqCategories?: ReadonlyArray; diff --git a/ts/components/search/SearchButton.tsx b/ts/components/search/SearchButton.tsx index d69c5ec9e73..da4a131712b 100644 --- a/ts/components/search/SearchButton.tsx +++ b/ts/components/search/SearchButton.tsx @@ -14,14 +14,15 @@ import { import { Dispatch } from "../../store/actions/types"; import ButtonDefaultOpacity from "../ButtonDefaultOpacity"; import { LabelledItem } from "../LabelledItem"; -import IconFont from "../ui/IconFont"; +import { IOColors } from "../core/variables/IOColors"; +import { Icon } from "../core/icons"; export const MIN_CHARACTER_SEARCH_TEXT = 3; export type SearchType = "Messages" | "Services"; interface OwnProps { - color?: string; + color?: IOColors; searchType?: SearchType; // if this handler is defined it will be called in place of dispatching actions about search activation (see handleSearchPress) onSearchTap?: () => void; @@ -69,7 +70,7 @@ class SearchButton extends React.Component { transparent={true} accessibilityLabel={I18n.t("global.buttons.search")} > - + )} diff --git a/ts/components/services/ContactPreferencesToggles/PreferenceToggleRow.tsx b/ts/components/services/ContactPreferencesToggles/PreferenceToggleRow.tsx index 8b4796b765e..04cf590a86d 100644 --- a/ts/components/services/ContactPreferencesToggles/PreferenceToggleRow.tsx +++ b/ts/components/services/ContactPreferencesToggles/PreferenceToggleRow.tsx @@ -3,12 +3,11 @@ import { View, StyleSheet } from "react-native"; import Switch from "../../ui/Switch"; import { H4 } from "../../core/typography/H4"; import { IOStyles } from "../../core/variables/IOStyles"; -import IconFont from "../../ui/IconFont"; -import { IOColors } from "../../core/variables/IOColors"; import TouchableDefaultOpacity from "../../TouchableDefaultOpacity"; import I18n from "../../../i18n"; import { WithTestID } from "../../../types/WithTestID"; import ActivityIndicator from "../../ui/ActivityIndicator"; +import { Icon } from "../../core/icons/Icon"; type Props = WithTestID<{ label: string; @@ -56,7 +55,7 @@ const PreferenceToggleRow = ({ accessibilityRole={"button"} accessibilityLabel={I18n.t("global.accessibility.reload")} > - + ); case "ready": diff --git a/ts/components/services/ContactPreferencesToggles/index.tsx b/ts/components/services/ContactPreferencesToggles/index.tsx index c6449554c70..fc6bcabb960 100644 --- a/ts/components/services/ContactPreferencesToggles/index.tsx +++ b/ts/components/services/ContactPreferencesToggles/index.tsx @@ -116,7 +116,7 @@ const ContactPreferencesToggle: React.FC = (props: Props) => { return ( <> {/* diff --git a/ts/components/services/SectionHeader.tsx b/ts/components/services/SectionHeader.tsx index e50d9ab3c26..13216f7ef2a 100644 --- a/ts/components/services/SectionHeader.tsx +++ b/ts/components/services/SectionHeader.tsx @@ -4,23 +4,20 @@ import { StyleSheet, View } from "react-native"; import { TranslationKeys } from "../../../locales/locales"; import I18n from "../../i18n"; -import IconFont from "../ui/IconFont"; import { H3 } from "../core/typography/H3"; -import { IOColors } from "../core/variables/IOColors"; +import { HSpacer } from "../core/spacer/Spacer"; +import { IOIcons, Icon } from "../core/icons"; const styles = StyleSheet.create({ header: { flexDirection: "row", paddingVertical: 8, alignItems: "center" - }, - icon: { - marginRight: 8 } }); type Props = { - iconName: string; + iconName: IOIcons; title: TranslationKeys; }; @@ -29,12 +26,8 @@ type Props = { */ const sectionHeader: React.FC = ({ iconName, title }) => ( - + +

{I18n.t(title)}

diff --git a/ts/components/services/ServiceMetadata/index.tsx b/ts/components/services/ServiceMetadata/index.tsx index 1151113ab95..7f1eb635ff7 100644 --- a/ts/components/services/ServiceMetadata/index.tsx +++ b/ts/components/services/ServiceMetadata/index.tsx @@ -56,7 +56,7 @@ const ServiceMetadataComponent: React.FC = ({ } = servicesMetadata || {}; return ( <> - + {/* links */} {web_url && } diff --git a/ts/components/services/TosAndPrivacyBox.tsx b/ts/components/services/TosAndPrivacyBox.tsx index 786fce24e8c..633de0796c5 100644 --- a/ts/components/services/TosAndPrivacyBox.tsx +++ b/ts/components/services/TosAndPrivacyBox.tsx @@ -19,10 +19,7 @@ const TosAndPrivacy: React.FC = ({ tosUrl, privacyUrl }) => { } return ( - + {tosUrl && } {privacyUrl && } diff --git a/ts/components/services/__tests__/SectionHeader.test.tsx b/ts/components/services/__tests__/SectionHeader.test.tsx index f9b17d15432..ee1e8309d17 100644 --- a/ts/components/services/__tests__/SectionHeader.test.tsx +++ b/ts/components/services/__tests__/SectionHeader.test.tsx @@ -6,7 +6,7 @@ import SectionHeader from "../SectionHeader"; describe("SectionHeader component", () => { it("should match the snapshot", () => { const component = render( - + ); expect(component.toJSON()).toMatchSnapshot(); }); diff --git a/ts/components/services/__tests__/__snapshots__/SectionHeader.test.tsx.snap b/ts/components/services/__tests__/__snapshots__/SectionHeader.test.tsx.snap index 1bfa1643986..f51873c86fb 100644 --- a/ts/components/services/__tests__/__snapshots__/SectionHeader.test.tsx.snap +++ b/ts/components/services/__tests__/__snapshots__/SectionHeader.test.tsx.snap @@ -10,43 +10,67 @@ exports[`SectionHeader component should match the snapshot 1`] = ` } } > - -  - + + + + + = (props: Props) => { {title} - + + + {!expanded && } diff --git a/ts/components/ui/DateTimePicker.tsx b/ts/components/ui/DateTimePicker.tsx index 61d7546796c..c9a43a7a934 100644 --- a/ts/components/ui/DateTimePicker.tsx +++ b/ts/components/ui/DateTimePicker.tsx @@ -5,12 +5,11 @@ import { StyleSheet, View } from "react-native"; import { H5 } from "../core/typography/H5"; import { H4 } from "../core/typography/H4"; import { IOColors } from "../core/variables/IOColors"; -import variables from "../../theme/variables"; import { formatDateAsLocal } from "../../utils/dates"; import TouchableDefaultOpacity from "../TouchableDefaultOpacity"; import I18n from "../../i18n"; import { VSpacer } from "../core/spacer/Spacer"; -import IconFont from "./IconFont"; +import { Icon } from "../core/icons"; type Props = { date: Date | undefined; @@ -26,11 +25,6 @@ const styles = StyleSheet.create({ flex: 1, flexDirection: "row", justifyContent: "space-between" - }, - icon: { - height: 24, - width: 24, - marginBottom: 5 } }); @@ -63,14 +57,10 @@ const DateTimePicker: React.FunctionComponent = (props: Props) => { ? formatDateAsLocal(props.date, true, true) : I18n.t("global.dateFormats.dateTimePicker")} - diff --git a/ts/components/ui/Markdown/index.tsx b/ts/components/ui/Markdown/index.tsx index d30910b7692..c34a77913d3 100644 --- a/ts/components/ui/Markdown/index.tsx +++ b/ts/components/ui/Markdown/index.tsx @@ -117,7 +117,7 @@ div.custom-block.io-demo-block .custom-block-body::after { position: absolute; right: 0; font-family: 'io-icon-font'; - font-size: ${customVariables.iconSize6}px; + font-size: 48px; font-weight: normal; content: "\\50"; } diff --git a/ts/components/ui/TabIconComponent.tsx b/ts/components/ui/TabIconComponent.tsx index 16edf028ed1..0c0546df7b6 100644 --- a/ts/components/ui/TabIconComponent.tsx +++ b/ts/components/ui/TabIconComponent.tsx @@ -1,13 +1,11 @@ -import { View } from "react-native"; +import { ColorValue, View } from "react-native"; import React from "react"; -import variables from "../../theme/variables"; +import { IONavIcons, AnimatedIcon } from "../core/icons"; import CustomBadge from "./CustomBadge"; -import IconFont from "./IconFont"; - type Props = { - iconName: string; - color?: string; + iconName: IONavIcons; + color?: ColorValue; badgeValue?: number; }; @@ -20,7 +18,7 @@ class TabIconComponent extends React.PureComponent { return ( // accessibilityLabel={""} in order to read the font icon, without modify the library element - + ); diff --git a/ts/components/ui/TextboxWithSuggestion.tsx b/ts/components/ui/TextboxWithSuggestion.tsx index bb21b22321e..8c4050124ce 100644 --- a/ts/components/ui/TextboxWithSuggestion.tsx +++ b/ts/components/ui/TextboxWithSuggestion.tsx @@ -10,9 +10,9 @@ import { IOStyles } from "../core/variables/IOStyles"; import { LabelledItem } from "../LabelledItem"; import ButtonDefaultOpacity from "../ButtonDefaultOpacity"; import { HSpacer, VSpacer } from "../core/spacer/Spacer"; +import { Icon } from "../core/icons"; import AppHeader from "./AppHeader"; import { LightModalContext } from "./LightModal"; -import IconFont from "./IconFont"; const styles = StyleSheet.create({ container: { @@ -66,7 +66,7 @@ const TextboxWithSuggestionModal = (props: ModalProps) => { - + diff --git a/ts/components/wallet/AddPaymentMethodButton.tsx b/ts/components/wallet/AddPaymentMethodButton.tsx deleted file mode 100644 index fbc6cb4e423..00000000000 --- a/ts/components/wallet/AddPaymentMethodButton.tsx +++ /dev/null @@ -1,39 +0,0 @@ -import { Text as NBButtonText } from "native-base"; -import * as React from "react"; -import { StyleSheet } from "react-native"; -import I18n from "../../i18n"; -import customVariables from "../../theme/variables"; -import TouchableDefaultOpacity from "../TouchableDefaultOpacity"; -import IconFont from "../ui/IconFont"; -import { IOColors } from "../core/variables/IOColors"; - -const styles = StyleSheet.create({ - button: { - flexDirection: "row", - alignItems: "center", - justifyContent: "flex-end" - }, - label: { - marginLeft: customVariables.fontSizeBase / 4, - color: IOColors.white - } -}); - -interface Props { - onPress: () => void; - iconSize?: number; - labelSize?: number; -} - -export const AddPaymentMethodButton: React.SFC = ({ - onPress, - iconSize, - labelSize -}) => ( - - - - {I18n.t("wallet.newPaymentMethod.add").toUpperCase()} - - -); diff --git a/ts/components/wallet/CameraMarker.tsx b/ts/components/wallet/CameraMarker.tsx index 4ade2a845fe..12b27cc7857 100644 --- a/ts/components/wallet/CameraMarker.tsx +++ b/ts/components/wallet/CameraMarker.tsx @@ -2,10 +2,8 @@ import { Col, Grid, Row } from "native-base"; import * as React from "react"; import { StyleSheet, View } from "react-native"; -import IconFont from "../ui/IconFont"; - -import variables from "../../theme/variables"; import { IOColors } from "../core/variables/IOColors"; +import { Icon } from "../core/icons/Icon"; type MarkerState = "SCANNING" | "VALID" | "INVALID"; @@ -20,13 +18,6 @@ type Props = { * This is overlayed on the camera preview of the QR code scanner. */ export const CameraMarker: React.SFC = ({ screenWidth, state }) => { - const iconName = - state === "INVALID" - ? "io-close" - : state === "VALID" - ? "io-tick-big" - : undefined; - const sideLength = screenWidth / 2; const borderLength = screenWidth / 6; @@ -89,34 +80,19 @@ export const CameraMarker: React.SFC = ({ screenWidth, state }) => { left: 0, bottom: 0, justifyContent: "center", - alignItems: "center" - }, - - icon: { - fontSize: sideLength, - lineHeight: sideLength, + alignItems: "center", opacity: 0.7 - }, - - iconValid: { - color: variables.brandSuccess - }, - - iconInvalid: { - color: variables.brandDanger } }); return ( - {iconName && ( + {(state === "VALID" || state === "INVALID") && ( - )} diff --git a/ts/components/wallet/PayWebViewModal.tsx b/ts/components/wallet/PayWebViewModal.tsx index 5cfe58fcbf6..3dd878243a9 100644 --- a/ts/components/wallet/PayWebViewModal.tsx +++ b/ts/components/wallet/PayWebViewModal.tsx @@ -9,7 +9,6 @@ import { v4 as uuid } from "uuid"; import { InfoBox } from "../../components/box/InfoBox"; import { Label } from "../../components/core/typography/Label"; -import { IOColors } from "../../components/core/variables/IOColors"; import { useHardwareBackButton } from "../../hooks/useHardwareBackButton"; import I18n from "../../i18n"; import { WithTestID } from "../../types/WithTestID"; @@ -187,11 +186,7 @@ export const PayWebViewModal = (props: Props) => { style={styles.descriptionContainer} testID={"PayWebViewModal-description"} > - + diff --git a/ts/components/wallet/PaymentHistoryItem.tsx b/ts/components/wallet/PaymentHistoryItem.tsx index 4ca5e98ee98..96df87a3054 100644 --- a/ts/components/wallet/PaymentHistoryItem.tsx +++ b/ts/components/wallet/PaymentHistoryItem.tsx @@ -7,7 +7,7 @@ import { Body } from "../core/typography/Body"; import { IOStyles } from "../core/variables/IOStyles"; import { BadgeComponent } from "../screens/BadgeComponent"; import TouchableDefaultOpacity from "../TouchableDefaultOpacity"; -import IconFont from "../ui/IconFont"; +import { Icon } from "../core/icons"; type Props = Readonly<{ text11: string; @@ -40,8 +40,6 @@ const styles = StyleSheet.create({ } }); -const ICON_WIDTH = 24; - export default class PaymentHistoryItem extends React.PureComponent { public render() { return ( @@ -66,11 +64,7 @@ export default class PaymentHistoryItem extends React.PureComponent { - + {this.props.children} diff --git a/ts/components/wallet/PaymentMethodsList.tsx b/ts/components/wallet/PaymentMethodsList.tsx index eef8f39b4b7..15520506481 100644 --- a/ts/components/wallet/PaymentMethodsList.tsx +++ b/ts/components/wallet/PaymentMethodsList.tsx @@ -29,11 +29,10 @@ import { IOBadge, IOBadgeOutlineColors } from "../core/IOBadge"; import { HSpacer, VSpacer } from "../core/spacer/Spacer"; import { H3 } from "../core/typography/H3"; import { H5 } from "../core/typography/H5"; -import { IOColors } from "../core/variables/IOColors"; import { IOStyles } from "../core/variables/IOStyles"; import { withLightModalContext } from "../helpers/withLightModalContext"; -import IconFont from "../ui/IconFont"; import { LightModalContextInterface } from "../ui/LightModal"; +import { Icon } from "../core/icons"; type OwnProps = Readonly<{ paymentMethods: ReadonlyArray; @@ -170,7 +169,7 @@ const renderListItem = ( {itemInfo.item.description} - + ); } diff --git a/ts/components/wallet/WalletHomeHeader.tsx b/ts/components/wallet/WalletHomeHeader.tsx index b91b501fab0..d6b8df28f0a 100644 --- a/ts/components/wallet/WalletHomeHeader.tsx +++ b/ts/components/wallet/WalletHomeHeader.tsx @@ -8,7 +8,6 @@ import NavigationService from "../../navigation/NavigationService"; import { navigateToWalletAddPaymentMethod } from "../../store/actions/navigation"; import { Dispatch } from "../../store/actions/types"; import { GlobalState } from "../../store/reducers/types"; -import customVariables from "../../theme/variables"; import { useIOBottomSheetModal } from "../../utils/hooks/bottomSheet"; import ButtonDefaultOpacity from "../ButtonDefaultOpacity"; import { HSpacer } from "../core/spacer/Spacer"; @@ -20,7 +19,7 @@ import { IOColors } from "../core/variables/IOColors"; import { IOStyles } from "../core/variables/IOStyles"; import ItemSeparatorComponent from "../ItemSeparatorComponent"; import TouchableDefaultOpacity from "../TouchableDefaultOpacity"; -import IconFont from "../ui/IconFont"; +import { Icon } from "../core/icons"; type Props = ReturnType & ReturnType; @@ -91,7 +90,7 @@ const WalletHomeHeader = (props: Props) => { {item.subtitle} - + @@ -128,11 +127,7 @@ const WalletHomeHeader = (props: Props) => { accessibilityLabel={I18n.t("wallet.accessibility.addElement")} accessibilityRole="button" > - +

{I18n.t("wallet.newPaymentMethod.add").toUpperCase()} diff --git a/ts/components/wallet/__test__/PayWebViewModal.test.tsx b/ts/components/wallet/__test__/PayWebViewModal.test.tsx index 5dff215b3b6..5c1aa3b0875 100644 --- a/ts/components/wallet/__test__/PayWebViewModal.test.tsx +++ b/ts/components/wallet/__test__/PayWebViewModal.test.tsx @@ -89,7 +89,7 @@ describe("PayWebViewModal component", () => { expect( component .getByTestId("PayWebViewModal-description") - .find(node => node.props.iconName === "io-info") + .find(node => node.props.iconName === "info") ).toBeDefined(); }); }); diff --git a/ts/components/wallet/card/CardComponent.tsx b/ts/components/wallet/card/CardComponent.tsx index 45194197bd9..ed146942bbf 100644 --- a/ts/components/wallet/card/CardComponent.tsx +++ b/ts/components/wallet/card/CardComponent.tsx @@ -25,12 +25,13 @@ import { isPaymentMethodExpired } from "../../../utils/paymentMethod"; import { buildExpirationDate } from "../../../utils/stringBuilder"; import { FOUR_UNICODE_CIRCLES } from "../../../utils/wallet"; import ButtonDefaultOpacity from "../../ButtonDefaultOpacity"; -import { VSpacer } from "../../core/spacer/Spacer"; +import { HSpacer, VSpacer } from "../../core/spacer/Spacer"; import { Body } from "../../core/typography/Body"; import { H5 } from "../../core/typography/H5"; import { Label } from "../../core/typography/Label"; import { IOColors } from "../../core/variables/IOColors"; -import IconFont from "../../ui/IconFont"; +import { Icon } from "../../core/icons/Icon"; +import TouchableDefaultOpacity from "../../TouchableDefaultOpacity"; import Logo, { cardIcons } from "./Logo"; interface BaseProps { @@ -132,9 +133,6 @@ const styles = StyleSheet.create({ borderBottomLeftRadius: 0, borderBottomRightRadius: 0 }, - paddedIcon: { - paddingLeft: 10 - }, paddedTop: { paddingTop: 10 } @@ -209,29 +207,23 @@ export default class CardComponent extends React.Component { return ( {!hideFavoriteIcon && isFavorite !== undefined && ( - + + + )} {!hideMenu && ( - + + @@ -358,6 +350,8 @@ export default class CardComponent extends React.Component { const footerTextStyle = isFullCard ? styles.transactionsText : styles.pickPaymentText; + + const footerIconColor: IOColors = isFullCard ? "blue" : "white"; const text = I18n.t( isFullCard ? "cardComponent.detailsAndTransactions" : "cardComponent.pick" ); @@ -370,11 +364,7 @@ export default class CardComponent extends React.Component { onPress={this.handleOnCardPress} > {text} - + ); } diff --git a/ts/components/wallet/card/SectionCardComponent.tsx b/ts/components/wallet/card/SectionCardComponent.tsx index 6af243714f3..cdd8c819335 100644 --- a/ts/components/wallet/card/SectionCardComponent.tsx +++ b/ts/components/wallet/card/SectionCardComponent.tsx @@ -6,9 +6,7 @@ import { StyleSheet, ViewStyle } from "react-native"; -import IconFont from "../../../components/ui/IconFont"; import I18n from "../../../i18n"; -import customVariables from "../../../theme/variables"; import TouchableDefaultOpacity from "../../TouchableDefaultOpacity"; import { hexToRgba, IOColors } from "../../core/variables/IOColors"; import { IOBadge } from "../../core/IOBadge"; @@ -89,11 +87,7 @@ const SectionCardComponent: React.FunctionComponent = (props: Props) => { case "add": return ( <> - + - + ); case "show": @@ -127,12 +121,7 @@ const SectionCardComponent: React.FunctionComponent = (props: Props) => { {I18n.t("wallet.newPaymentMethod.show").toUpperCase()} - + ); } diff --git a/ts/components/wallet/creditCardOnboardingAttempts/CreditCardAttemptsList.tsx b/ts/components/wallet/creditCardOnboardingAttempts/CreditCardAttemptsList.tsx index b355fa4b505..4014c73f362 100644 --- a/ts/components/wallet/creditCardOnboardingAttempts/CreditCardAttemptsList.tsx +++ b/ts/components/wallet/creditCardOnboardingAttempts/CreditCardAttemptsList.tsx @@ -12,12 +12,12 @@ import { } from "../../../store/reducers/wallet/creditCard"; import TouchableDefaultOpacity from "../../TouchableDefaultOpacity"; import { BadgeComponent } from "../../screens/BadgeComponent"; -import IconFont from "../../ui/IconFont"; import customVariables from "../../../theme/variables"; import { Label } from "../../core/typography/Label"; import { IOStyles } from "../../core/variables/IOStyles"; import { IOColors } from "../../core/variables/IOColors"; import { VSpacer } from "../../core/spacer/Spacer"; +import { Icon } from "../../core/icons/Icon"; import { Body } from "../../core/typography/Body"; type Props = Readonly<{ @@ -122,10 +122,10 @@ export const CreditCardAttemptsList: React.FC = (props: Props) => { - diff --git a/ts/components/wallet/payment/PickAvailablePaymentMethodListItem.tsx b/ts/components/wallet/payment/PickAvailablePaymentMethodListItem.tsx index 04e8619d5b1..80d0eb453c5 100644 --- a/ts/components/wallet/payment/PickAvailablePaymentMethodListItem.tsx +++ b/ts/components/wallet/payment/PickAvailablePaymentMethodListItem.tsx @@ -12,9 +12,8 @@ import { GlobalState } from "../../../store/reducers/types"; import { getFavoriteWalletId } from "../../../store/reducers/wallet/wallets"; import { PaymentMethod } from "../../../types/pagopa"; import { getPickPaymentMethodDescription } from "../../../utils/payment"; -import { IOColors } from "../../core/variables/IOColors"; -import IconFont from "../../ui/IconFont"; import { getCardIconFromBrandLogo } from "../card/Logo"; +import { Icon } from "../../core/icons/Icon"; import PickPaymentMethodBaseListItem from "./PickPaymentMethodBaseListItem"; type Props = { @@ -93,7 +92,7 @@ const PickAvailablePaymentMethodListItem: React.FC = (props: Props) => { description={description} rightElement={ props.rightElement ?? ( - + ) } onPress={props.onPress} diff --git a/ts/components/wallet/payment/PickNotAvailablePaymentMethodListItem.tsx b/ts/components/wallet/payment/PickNotAvailablePaymentMethodListItem.tsx index d506a2cd3df..6813fcbbf45 100644 --- a/ts/components/wallet/payment/PickNotAvailablePaymentMethodListItem.tsx +++ b/ts/components/wallet/payment/PickNotAvailablePaymentMethodListItem.tsx @@ -15,9 +15,8 @@ import { getPickPaymentMethodDescription } from "../../../utils/payment"; import { getPaypalAccountEmail } from "../../../utils/paypal"; import { VSpacer } from "../../core/spacer/Spacer"; import { H4 } from "../../core/typography/H4"; -import { IOColors } from "../../core/variables/IOColors"; -import IconFont from "../../ui/IconFont"; import { getCardIconFromBrandLogo } from "../card/Logo"; +import { Icon } from "../../core/icons/Icon"; import PickPaymentMethodBaseListItem from "./PickPaymentMethodBaseListItem"; type Props = { @@ -185,9 +184,7 @@ const PickNotAvailablePaymentMethodListItem: React.FC = ( logo={logo} title={title} description={description} - rightElement={ - - } + rightElement={} onPress={present} /> diff --git a/ts/components/wallet/payment/PickPaymentMethodBaseListItem.tsx b/ts/components/wallet/payment/PickPaymentMethodBaseListItem.tsx index cf25a1c8a04..e8ab58b2139 100644 --- a/ts/components/wallet/payment/PickPaymentMethodBaseListItem.tsx +++ b/ts/components/wallet/payment/PickPaymentMethodBaseListItem.tsx @@ -3,11 +3,10 @@ import { ListItem } from "native-base"; import { View, Image, ImageSourcePropType, StyleSheet } from "react-native"; import { H4 } from "../../core/typography/H4"; import { H5 } from "../../core/typography/H5"; -import { IOColors } from "../../core/variables/IOColors"; -import IconFont from "../../ui/IconFont"; import { IOStyles } from "../../core/variables/IOStyles"; import { WithTestID } from "../../../types/WithTestID"; import { VSpacer } from "../../core/spacer/Spacer"; +import { Icon } from "../../core/icons/Icon"; type Props = WithTestID<{ isFirst: boolean; @@ -50,7 +49,12 @@ const PickPaymentMethodBaseListItem: React.FC = ({ onPress, testID }) => ( - + @@ -65,9 +69,7 @@ const PickPaymentMethodBaseListItem: React.FC = ({ - {isFavourite && ( - - )} + {isFavourite && } {rightElement} diff --git a/ts/components/wallet/payment/PspComponent.tsx b/ts/components/wallet/payment/PspComponent.tsx index 088eeed24ae..fe237f2de7e 100644 --- a/ts/components/wallet/payment/PspComponent.tsx +++ b/ts/components/wallet/payment/PspComponent.tsx @@ -10,7 +10,7 @@ import { formatNumberCentsToAmount } from "../../../utils/stringBuilder"; import { Body } from "../../core/typography/Body"; import { H4 } from "../../core/typography/H4"; import TouchableDefaultOpacity from "../../TouchableDefaultOpacity"; -import IconFont from "../../ui/IconFont"; +import { Icon } from "../../core/icons"; const ICON_SIZE = 24; const IMAGE_WIDTH = 100; @@ -73,11 +73,7 @@ export const PspComponent: FC = ({ psp, onPress }) => { )}

{cost}

- + diff --git a/ts/features/bonus/bonusVacanze/components/ActiveBonus.tsx b/ts/features/bonus/bonusVacanze/components/ActiveBonus.tsx index 27bb1968fb2..32cb0d81240 100644 --- a/ts/features/bonus/bonusVacanze/components/ActiveBonus.tsx +++ b/ts/features/bonus/bonusVacanze/components/ActiveBonus.tsx @@ -8,11 +8,11 @@ import { H3 } from "../../../../components/core/typography/H3"; import { Label } from "../../../../components/core/typography/Label"; import { IOColors } from "../../../../components/core/variables/IOColors"; import TouchableDefaultOpacity from "../../../../components/TouchableDefaultOpacity"; -import IconFont from "../../../../components/ui/IconFont"; import I18n from "../../../../i18n"; import customVariables from "../../../../theme/variables"; import { formatNumberAmount } from "../../../../utils/stringBuilder"; import { validityInterval } from "../utils/bonus"; +import { Icon } from "../../../../components/core/icons/Icon"; type Props = { bonus: BonusActivationWithQrCode; @@ -107,7 +107,7 @@ const ActiveBonus: React.FunctionComponent = (props: Props) => {

- + diff --git a/ts/features/bonus/bonusVacanze/components/BonusCardComponent.tsx b/ts/features/bonus/bonusVacanze/components/BonusCardComponent.tsx index c8d90d981a4..c45f08a1acb 100644 --- a/ts/features/bonus/bonusVacanze/components/BonusCardComponent.tsx +++ b/ts/features/bonus/bonusVacanze/components/BonusCardComponent.tsx @@ -22,7 +22,6 @@ import { } from "../../../../components/core/variables/IOColors"; import ItemSeparatorComponent from "../../../../components/ItemSeparatorComponent"; import TouchableDefaultOpacity from "../../../../components/TouchableDefaultOpacity"; -import IconFont from "../../../../components/ui/IconFont"; import { HSpacer, VSpacer } from "../../../../components/core/spacer/Spacer"; import I18n from "../../../../i18n"; import { makeFontStyleObject } from "../../../../components/core/fonts"; @@ -38,6 +37,7 @@ import { H2 } from "../../../../components/core/typography/H2"; import { IOStyles } from "../../../../components/core/variables/IOStyles"; import { Body } from "../../../../components/core/typography/Body"; import { H3 } from "../../../../components/core/typography/H3"; +import { Icon } from "../../../../components/core/icons/Icon"; import { IOBadge } from "../../../../components/core/IOBadge"; type Props = { @@ -202,7 +202,7 @@ const BonusCardComponent: React.FunctionComponent = (props: Props) => { > - + diff --git a/ts/features/bonus/bonusVacanze/screens/ActiveBonusScreen.tsx b/ts/features/bonus/bonusVacanze/screens/ActiveBonusScreen.tsx index 4be6321f63d..ea787627323 100644 --- a/ts/features/bonus/bonusVacanze/screens/ActiveBonusScreen.tsx +++ b/ts/features/bonus/bonusVacanze/screens/ActiveBonusScreen.tsx @@ -31,7 +31,6 @@ import DarkLayout from "../../../../components/screens/DarkLayout"; import { EdgeBorderComponent } from "../../../../components/screens/EdgeBorderComponent"; import GenericErrorComponent from "../../../../components/screens/GenericErrorComponent"; import TouchableDefaultOpacity from "../../../../components/TouchableDefaultOpacity"; -import IconFont from "../../../../components/ui/IconFont"; import { LightModalContextInterface } from "../../../../components/ui/LightModal"; import I18n from "../../../../i18n"; import { IOStackNavigationRouteProps } from "../../../../navigation/params/AppParamsList"; @@ -75,6 +74,7 @@ import { validityInterval } from "../utils/bonus"; import { HSpacer, VSpacer } from "../../../../components/core/spacer/Spacer"; +import { IOIcons, Icon } from "../../../../components/core/icons"; import { H3 } from "../../../../components/core/typography/H3"; import { IOStyles } from "../../../../components/core/variables/IOStyles"; import { Body } from "../../../../components/core/typography/Body"; @@ -129,9 +129,6 @@ const styles = StyleSheet.create({ justifyContent: "center", maxWidth: 327 }, - icon: { - paddingLeft: 12 - }, paddedContentLeft: { paddingLeft: variables.contentPadding }, @@ -143,7 +140,6 @@ const styles = StyleSheet.create({ backgroundColor: IOColors.white }, footerButton: { flex: 1, alignItems: "center" }, - footerButtonIcon: { color: IOColors.blue, marginBottom: 6, fontSize: 24 }, hover: { minWidth: "100%", minHeight: "100%", @@ -216,7 +212,7 @@ const screenShortInitialState: ScreenShotState = { type FooterButtonProp = { label: string; - iconName: string; + iconName: IOIcons; onPress: () => void; }; @@ -231,7 +227,8 @@ const FooterButton: React.FunctionComponent = ( props: FooterButtonProp ) => ( - + + ); @@ -401,7 +398,7 @@ const ActiveBonusScreen: React.FunctionComponent = (props: Props) => { = (props: Props) => { isShareEnabled() ? { label: I18n.t("global.genericShare").toLowerCase(), - iconName: "io-share", + iconName: "legShare", onPress: handleShare } : undefined } thirdButton={{ label: I18n.t("global.genericSave").toLowerCase(), - iconName: "io-save", + iconName: "legSave", onPress: saveScreenShot }} /> @@ -428,9 +425,9 @@ const ActiveBonusScreen: React.FunctionComponent = (props: Props) => { bonus && isBonusActive(bonus) && renderBonusActiveButtons(); const renderInformationBlock = ( - icon: string, + icon: IOIcons, text: string, - iconColor?: string + iconColor?: IOColors ) => { const now = new Date(); return ( @@ -454,16 +451,7 @@ const ActiveBonusScreen: React.FunctionComponent = (props: Props) => { IOStyles.centerJustified ]} > - variables.textColor) - )} - size={variables.iconSize3} - style={styles.icon} - /> + @@ -481,7 +469,7 @@ const ActiveBonusScreen: React.FunctionComponent = (props: Props) => { switch (bonus.status) { case BonusActivationStatusEnum.ACTIVE: return renderInformationBlock( - "io-calendario", + "legCalendar", I18n.t("bonus.bonusVacanze.statusInfo.validBetween", { from: pipe( bonusValidityInterval, @@ -501,7 +489,7 @@ const ActiveBonusScreen: React.FunctionComponent = (props: Props) => { ); case BonusActivationStatusEnum.REDEEMED: return renderInformationBlock( - "io-complete", + "ok", I18n.t("bonus.bonusVacanze.statusInfo.redeemed", { date: formatDateAsLocal( pipe( @@ -512,11 +500,11 @@ const ActiveBonusScreen: React.FunctionComponent = (props: Props) => { true ) }), - variables.brandSuccess + "green" ); case BonusActivationStatusEnum.FAILED: return renderInformationBlock( - "io-notice", + "notice", I18n.t("bonus.bonusVacanze.statusInfo.bonusRejected") ); default: diff --git a/ts/features/bonus/bonusVacanze/screens/activation/request/ActivateBonusDiscrepancies.tsx b/ts/features/bonus/bonusVacanze/screens/activation/request/ActivateBonusDiscrepancies.tsx index 5efbe564f9e..5f25de4840c 100644 --- a/ts/features/bonus/bonusVacanze/screens/activation/request/ActivateBonusDiscrepancies.tsx +++ b/ts/features/bonus/bonusVacanze/screens/activation/request/ActivateBonusDiscrepancies.tsx @@ -3,8 +3,8 @@ import { View, StyleSheet } from "react-native"; import { HSpacer } from "../../../../../../components/core/spacer/Spacer"; import { Body } from "../../../../../../components/core/typography/Body"; import { IOStyles } from "../../../../../../components/core/variables/IOStyles"; -import IconFont from "../../../../../../components/ui/IconFont"; import themeVariables from "../../../../../../theme/variables"; +import { Icon } from "../../../../../../components/core/icons/Icon"; type Props = { text: string; @@ -37,7 +37,7 @@ export const ActivateBonusDiscrepancies: React.FunctionComponent = IOStyles.horizontalContentPadding ]} > - + diff --git a/ts/features/bonus/bonusVacanze/screens/activation/request/ActivateBonusReminder.tsx b/ts/features/bonus/bonusVacanze/screens/activation/request/ActivateBonusReminder.tsx index 367ae7928bb..4bd20a1256c 100644 --- a/ts/features/bonus/bonusVacanze/screens/activation/request/ActivateBonusReminder.tsx +++ b/ts/features/bonus/bonusVacanze/screens/activation/request/ActivateBonusReminder.tsx @@ -1,10 +1,9 @@ import * as React from "react"; import { View } from "react-native"; -import IconFont from "../../../../../../components/ui/IconFont"; -import { IOColors } from "../../../../../../components/core/variables/IOColors"; import { HSpacer } from "../../../../../../components/core/spacer/Spacer"; import { IOStyles } from "../../../../../../components/core/variables/IOStyles"; import { Body } from "../../../../../../components/core/typography/Body"; +import { Icon } from "../../../../../../components/core/icons/Icon"; type Props = { text: string; @@ -17,7 +16,7 @@ type Props = { */ export const ActivateBonusReminder: React.FunctionComponent = props => ( - + {props.text} diff --git a/ts/features/bonus/bpd/components/BaseDailyTransactionHeader.tsx b/ts/features/bonus/bpd/components/BaseDailyTransactionHeader.tsx index 3923271456f..19396323b22 100644 --- a/ts/features/bonus/bpd/components/BaseDailyTransactionHeader.tsx +++ b/ts/features/bonus/bpd/components/BaseDailyTransactionHeader.tsx @@ -3,9 +3,9 @@ import { View, StyleSheet } from "react-native"; import I18n from "../../../../i18n"; import { H3 } from "../../../../components/core/typography/H3"; import { H5 } from "../../../../components/core/typography/H5"; -import IconFont from "../../../../components/ui/IconFont"; import { IOColors } from "../../../../components/core/variables/IOColors"; import { formatIntegerNumber } from "../../../../utils/stringBuilder"; +import { Icon } from "../../../../components/core/icons"; type Props = { date: string; @@ -37,11 +37,7 @@ const BaseDailyTransactionHeader: React.FunctionComponent = ( - +
{` ${I18n.t( "bonus.bpd.details.components.transactionsCountOverview.label", diff --git a/ts/features/bonus/bpd/components/BpdTransactionSummaryComponent.tsx b/ts/features/bonus/bpd/components/BpdTransactionSummaryComponent.tsx index 1c2647e3119..ec171b8eb4d 100644 --- a/ts/features/bonus/bpd/components/BpdTransactionSummaryComponent.tsx +++ b/ts/features/bonus/bpd/components/BpdTransactionSummaryComponent.tsx @@ -77,7 +77,7 @@ const BpdTransactionSummaryComponent: React.FunctionComponent = ( const { present, bottomSheet } = useIOBottomSheetModal( <> - +

{I18n.t( "bonus.bpd.details.transaction.detail.summary.calendarBlock.text1" @@ -104,7 +104,7 @@ const BpdTransactionSummaryComponent: React.FunctionComponent = ( return ( <> - +

{I18n.t("bonus.bpd.details.transaction.detail.summary.lastUpdated")}

{props.lastUpdateDate}

diff --git a/ts/features/bonus/bpd/components/bpdCardComponent/BpdCardComponent.tsx b/ts/features/bonus/bpd/components/bpdCardComponent/BpdCardComponent.tsx index fee463fe1ba..6a0abf41786 100644 --- a/ts/features/bonus/bpd/components/bpdCardComponent/BpdCardComponent.tsx +++ b/ts/features/bonus/bpd/components/bpdCardComponent/BpdCardComponent.tsx @@ -22,12 +22,12 @@ import { IOColors } from "../../../../../components/core/variables/IOColors"; import TouchableDefaultOpacity from "../../../../../components/TouchableDefaultOpacity"; -import IconFont from "../../../../../components/ui/IconFont"; import I18n from "../../../../../i18n"; import { localeDateFormat } from "../../../../../utils/locale"; import { formatNumberAmount } from "../../../../../utils/stringBuilder"; import { BpdAmount } from "../../saga/networking/amount"; import { BpdPeriod, BpdPeriodStatus } from "../../store/actions/periods"; +import { Icon } from "../../../../../components/core/icons"; import { makeFontStyleObject } from "../../../../../components/core/fonts"; import { IOBadge } from "../../../../../components/core/IOBadge"; @@ -151,7 +151,7 @@ type BadgeDefinition = { label: string; }; -type IconType = "io-locker-closed" | "io-locker-open" | "io-fireworks"; +type IconType = "legLocked" | "legUnlocked" | "ok"; type GraphicalState = { amount: ReadonlyArray; @@ -163,7 +163,7 @@ type GraphicalState = { const initialGraphicalState: GraphicalState = { amount: ["0", "00"], isInGracePeriod: false, - iconName: "io-locker-closed", + iconName: "legLocked", statusBadge: { label: "-" } @@ -172,7 +172,7 @@ const initialGraphicalState: GraphicalState = { /** * Closed lock must be shown if period is Inactive or the transactionNumber didn't reach the minimum target * Open lock must be shown if period is Closed or Active and the transactionNumber reach the minimum target - * Fireworks must be shown if period is Closed or Active and the totalCashback reach the maxAmount + * "Ok" (was Fireworks) must be shown if period is Closed or Active and the totalCashback reach the maxAmount * * @param period * @param totalAmount @@ -185,12 +185,12 @@ const iconHandler = (period: BpdPeriod, totalAmount: BpdAmount): IconType => { case "Active": case "Closed": return reachMinTransaction && reachMaxAmount - ? "io-fireworks" + ? "ok" : reachMinTransaction - ? "io-locker-open" - : "io-locker-closed"; + ? "legUnlocked" + : "legLocked"; default: - return "io-locker-closed"; + return "legLocked"; } }; @@ -320,7 +320,7 @@ export const BpdCardComponent: React.FunctionComponent = ( {amount[1]} - +
{I18n.t("bonus.bpd.earned")} @@ -374,7 +374,7 @@ export const BpdCardComponent: React.FunctionComponent = (
{isPeriodClosed && ( - + )} @@ -388,7 +388,7 @@ export const BpdCardComponent: React.FunctionComponent = ( styles.justifyContentCenter ]} > - + {isInGracePeriod || isPeriodInactive ? ( = props => { case "ready": case "update": return props.graphicalValue.value === "notActivable" ? ( - + + + ) : ( ( /> - + {I18n.t("bonus.bpd.details.paymentMethods.error")} diff --git a/ts/features/bonus/bpd/screens/details/components/summary/ranking/SuperCashbackRankingSummary.tsx b/ts/features/bonus/bpd/screens/details/components/summary/ranking/SuperCashbackRankingSummary.tsx index d6f69cfec07..a7b022a6e66 100644 --- a/ts/features/bonus/bpd/screens/details/components/summary/ranking/SuperCashbackRankingSummary.tsx +++ b/ts/features/bonus/bpd/screens/details/components/summary/ranking/SuperCashbackRankingSummary.tsx @@ -1,13 +1,11 @@ import * as React from "react"; -import { StyleSheet, TouchableOpacity } from "react-native"; +import { StyleSheet, TouchableOpacity, View } from "react-native"; import { connect } from "react-redux"; import { Dispatch } from "redux"; import { VSpacer } from "../../../../../../../../components/core/spacer/Spacer"; import { H2 } from "../../../../../../../../components/core/typography/H2"; import { H5 } from "../../../../../../../../components/core/typography/H5"; -import { IOColors } from "../../../../../../../../components/core/variables/IOColors"; import { IOStyles } from "../../../../../../../../components/core/variables/IOStyles"; -import IconFont from "../../../../../../../../components/ui/IconFont"; import I18n from "../../../../../../../../i18n"; import { bpdRankingEnabledSelector } from "../../../../../../../../store/reducers/backendStatus"; import { GlobalState } from "../../../../../../../../store/reducers/types"; @@ -20,6 +18,7 @@ import { isBpdRankingReady } from "../../../../../store/reducers/details/periods"; import { BpdBaseShadowBoxLayout } from "../base/BpdBaseShadowBoxLayout"; +import { Icon } from "../../../../../../../../components/core/icons"; import { useRankingNotReadyBottomSheet } from "./RankingNotReadyBottomSheet"; const loadLocales = () => ({ @@ -31,8 +30,7 @@ const loadLocales = () => ({ const styles = StyleSheet.create({ title: { textAlign: "center" - }, - center: { alignSelf: "center" } + } }); type OwnProps = { @@ -102,12 +100,9 @@ const SuperCashbackRankingNotReady = (): React.ReactElement => { row2={ <> - + + + } diff --git a/ts/features/bonus/bpd/screens/details/components/summary/textualSummary/ActiveTextualSummary.tsx b/ts/features/bonus/bpd/screens/details/components/summary/textualSummary/ActiveTextualSummary.tsx index 449b2669ccd..bb4fe994d07 100644 --- a/ts/features/bonus/bpd/screens/details/components/summary/textualSummary/ActiveTextualSummary.tsx +++ b/ts/features/bonus/bpd/screens/details/components/summary/textualSummary/ActiveTextualSummary.tsx @@ -14,7 +14,7 @@ type Props = React.ComponentProps; * Display a warning for the current period if transactions < minTransaction and status === "Active" */ const Warning = (props: { period: BpdPeriod }) => ( - + {I18n.t( "bonus.bpd.details.components.transactionsCountOverview.currentPeriodKOBody.one" @@ -38,7 +38,7 @@ const Warning = (props: { period: BpdPeriod }) => ( * Display a message informing the user that the cashback is unlocked for the current period */ const Unlock = (props: Props) => ( - + {I18n.t( "bonus.bpd.details.components.transactionsCountOverview.currentPeriodUnlockBody", @@ -55,7 +55,7 @@ const Unlock = (props: Props) => ( * Display a message informing the user that he reached the max cashback amount for the current period */ const MaxAmount = (props: { name: string | undefined }) => ( - + {I18n.t( "bonus.bpd.details.components.transactionsCountOverview.currentPeriodMaxAmount", @@ -71,7 +71,7 @@ const MaxAmount = (props: { name: string | undefined }) => ( * Display a message informing the user that at the moment he may be eligible for supercashback */ const SuperCashback = (props: { superCashbackAmount: number }) => ( - + {I18n.t( "bonus.bpd.details.components.transactionsCountOverview.currentPeriodSuperCashback", diff --git a/ts/features/bonus/bpd/screens/details/components/summary/textualSummary/ClosedTextualSummary.tsx b/ts/features/bonus/bpd/screens/details/components/summary/textualSummary/ClosedTextualSummary.tsx index f6442081845..cd071a1f84b 100644 --- a/ts/features/bonus/bpd/screens/details/components/summary/textualSummary/ClosedTextualSummary.tsx +++ b/ts/features/bonus/bpd/screens/details/components/summary/textualSummary/ClosedTextualSummary.tsx @@ -22,7 +22,7 @@ type Props = React.ComponentProps; * @constructor */ const GracePeriod = (props: { period: BpdPeriod }) => ( - + {I18n.t( "bonus.bpd.details.components.transactionsCountOverview.gracePeriodBody", @@ -43,7 +43,7 @@ const GracePeriod = (props: { period: BpdPeriod }) => ( * @constructor */ const KO = (props: Props) => ( - + {I18n.t( "bonus.bpd.details.components.transactionsCountOverview.closedPeriodKOBody", @@ -109,7 +109,7 @@ const enhanceOkText = (props: Props): O.Option => { * @constructor */ const OK = (props: Props) => ( - + {I18n.t( "bonus.bpd.details.components.transactionsCountOverview.closedPeriodOKBody", diff --git a/ts/features/bonus/bpd/screens/details/components/unsubscribe/UnsubscribeComponent.tsx b/ts/features/bonus/bpd/screens/details/components/unsubscribe/UnsubscribeComponent.tsx index 2f0d6918373..197e4110cda 100644 --- a/ts/features/bonus/bpd/screens/details/components/unsubscribe/UnsubscribeComponent.tsx +++ b/ts/features/bonus/bpd/screens/details/components/unsubscribe/UnsubscribeComponent.tsx @@ -2,10 +2,9 @@ import { View } from "react-native"; import * as React from "react"; import { VSpacer } from "../../../../../../../components/core/spacer/Spacer"; import { H3 } from "../../../../../../../components/core/typography/H3"; -import { IOColors } from "../../../../../../../components/core/variables/IOColors"; -import IconFont from "../../../../../../../components/ui/IconFont"; import Markdown from "../../../../../../../components/ui/Markdown"; import I18n from "../../../../../../../i18n"; +import { Icon } from "../../../../../../../components/core/icons"; const iconSize = 64; @@ -16,7 +15,7 @@ const iconSize = 64; export const UnsubscribeComponent = (): React.ReactElement => ( - +

{I18n.t("bonus.bpd.unsubscribe.body1")}

diff --git a/ts/features/bonus/bpd/screens/details/transaction/BpdAvailableTransactionsScreen.tsx b/ts/features/bonus/bpd/screens/details/transaction/BpdAvailableTransactionsScreen.tsx index 1f059b9e711..054ae5aca1d 100644 --- a/ts/features/bonus/bpd/screens/details/transaction/BpdAvailableTransactionsScreen.tsx +++ b/ts/features/bonus/bpd/screens/details/transaction/BpdAvailableTransactionsScreen.tsx @@ -206,7 +206,7 @@ const renderSectionHeader = (info: { export const NoPaymentMethodAreActiveWarning = () => ( - +

{I18n.t("bonus.bpd.details.transaction.noPaymentMethod.text1")}

diff --git a/ts/features/bonus/bpd/screens/details/transaction/BpdEmptyTransactionsList.tsx b/ts/features/bonus/bpd/screens/details/transaction/BpdEmptyTransactionsList.tsx index 40e6c95ceaa..a45a3f19301 100644 --- a/ts/features/bonus/bpd/screens/details/transaction/BpdEmptyTransactionsList.tsx +++ b/ts/features/bonus/bpd/screens/details/transaction/BpdEmptyTransactionsList.tsx @@ -9,14 +9,14 @@ import { BottomSheetBpdTransactionsBody } from "../../../components/BpdTransacti const BpdEmptyTransactionsList: React.FunctionComponent = () => ( <> - +

{I18n.t("bonus.bpd.details.transaction.detail.empty.text1")}

{I18n.t("bonus.bpd.details.transaction.detail.empty.text2")} - +

{I18n.t( "bonus.bpd.details.transaction.detail.summary.calendarBlock.text1" diff --git a/ts/features/bonus/bpd/screens/details/transaction/GoToTransactions.tsx b/ts/features/bonus/bpd/screens/details/transaction/GoToTransactions.tsx index 3603a03ddef..73d553cc156 100644 --- a/ts/features/bonus/bpd/screens/details/transaction/GoToTransactions.tsx +++ b/ts/features/bonus/bpd/screens/details/transaction/GoToTransactions.tsx @@ -3,8 +3,9 @@ import { getBottomSpace, isIphoneX } from "react-native-iphone-x-helper"; import DeviceInfo from "react-native-device-info"; import ButtonDefaultOpacity from "../../../../../../components/ButtonDefaultOpacity"; import { Label } from "../../../../../../components/core/typography/Label"; -import IconFont from "../../../../../../components/ui/IconFont"; import I18n from "../../../../../../i18n"; +import { Icon } from "../../../../../../components/core/icons"; +import { HSpacer } from "../../../../../../components/core/spacer/Spacer"; type Props = { goToTransactions: () => void }; @@ -29,7 +30,8 @@ const GoToTransactions: React.FunctionComponent = props => ( : 0 }} > - + + diff --git a/ts/features/bonus/bpd/screens/onboarding/ErrorPaymentMethodsScreen.tsx b/ts/features/bonus/bpd/screens/onboarding/ErrorPaymentMethodsScreen.tsx index b652fec5130..02b7c0e0de8 100644 --- a/ts/features/bonus/bpd/screens/onboarding/ErrorPaymentMethodsScreen.tsx +++ b/ts/features/bonus/bpd/screens/onboarding/ErrorPaymentMethodsScreen.tsx @@ -5,16 +5,15 @@ import { Dispatch } from "redux"; import { VSpacer } from "../../../../../components/core/spacer/Spacer"; import { Body } from "../../../../../components/core/typography/Body"; import { H2 } from "../../../../../components/core/typography/H2"; -import { IOColors } from "../../../../../components/core/variables/IOColors"; import { IOStyles } from "../../../../../components/core/variables/IOStyles"; import BaseScreenComponent from "../../../../../components/screens/BaseScreenComponent"; import FooterWithButtons from "../../../../../components/ui/FooterWithButtons"; -import IconFont from "../../../../../components/ui/IconFont"; import I18n from "../../../../../i18n"; import { navigateToWalletHome } from "../../../../../store/actions/navigation"; import { GlobalState } from "../../../../../store/reducers/types"; import { emptyContextualHelp } from "../../../../../utils/emptyContextualHelp"; import { confirmButtonProps } from "../../../bonusVacanze/components/buttons/ButtonConfigurations"; +import { Icon } from "../../../../../components/core/icons/Icon"; export type Props = ReturnType & ReturnType; @@ -46,12 +45,7 @@ const ErrorPaymentMethodsScreen: React.FunctionComponent = props => { - +

{title}

diff --git a/ts/features/bonus/bpd/screens/optInPaymentMethods/OptInPaymentMethodsCashbackUpdateScreen.tsx b/ts/features/bonus/bpd/screens/optInPaymentMethods/OptInPaymentMethodsCashbackUpdateScreen.tsx index 4f3a7388243..4f2d853b059 100644 --- a/ts/features/bonus/bpd/screens/optInPaymentMethods/OptInPaymentMethodsCashbackUpdateScreen.tsx +++ b/ts/features/bonus/bpd/screens/optInPaymentMethods/OptInPaymentMethodsCashbackUpdateScreen.tsx @@ -47,17 +47,13 @@ const OptInPaymentMethodsCashbackUpdateScreen = () => { }; return ( - // The void customRightIcon and customGoBack are needed to have a centered header title + // The void customGoBack is needed to have a centered header title true - }} customGoBack={ true} transparent={true} /> } diff --git a/ts/features/bonus/bpd/screens/optInPaymentMethods/OptInPaymentMethodsChoiceScreen.tsx b/ts/features/bonus/bpd/screens/optInPaymentMethods/OptInPaymentMethodsChoiceScreen.tsx index fdd7e45a9be..dd0d09f5842 100644 --- a/ts/features/bonus/bpd/screens/optInPaymentMethods/OptInPaymentMethodsChoiceScreen.tsx +++ b/ts/features/bonus/bpd/screens/optInPaymentMethods/OptInPaymentMethodsChoiceScreen.tsx @@ -166,15 +166,11 @@ const OptInPaymentMethodsChoiceScreen = () => { (isReady(showOptInChoice) && !showOptInChoice.value) } > - {/* The void customRightIcon and customGoBack are needed to have a centered header title */} + {/* The void customGoBack are needed to have a centered header title */} true - }} customGoBack={ true} transparent={true} /> } diff --git a/ts/features/bonus/cdc/components/CdcServiceCTA.tsx b/ts/features/bonus/cdc/components/CdcServiceCTA.tsx index 5d99c482a3e..6de01f8ac29 100644 --- a/ts/features/bonus/cdc/components/CdcServiceCTA.tsx +++ b/ts/features/bonus/cdc/components/CdcServiceCTA.tsx @@ -8,7 +8,6 @@ import { BonusVisibilityEnum } from "../../../../../definitions/content/BonusVis import ButtonDefaultOpacity from "../../../../components/ButtonDefaultOpacity"; import { VSpacer } from "../../../../components/core/spacer/Spacer"; import { Label } from "../../../../components/core/typography/Label"; -import { IOColors } from "../../../../components/core/variables/IOColors"; import SectionStatusComponent from "../../../../components/SectionStatus"; import StatusContent from "../../../../components/SectionStatus/StatusContent"; import ActivityIndicator from "../../../../components/ui/ActivityIndicator"; @@ -90,10 +89,9 @@ const ErrorButton = (props: ErrorButtonProp) => { "bonus.cdc.serviceCta.error.status" )} ${I18n.t("global.accessibility.alert")}`} backgroundColor={"orange"} - iconColor={IOColors.white} - iconName={"io-warning"} + foregroundColor={"white"} + iconName={"legWarning"} viewRef={viewRef} - labelColor={"white"} > {I18n.t("bonus.cdc.serviceCta.error.status")} diff --git a/ts/features/bonus/cgn/components/detail/eyca/EycaErrorComponent.tsx b/ts/features/bonus/cgn/components/detail/eyca/EycaErrorComponent.tsx index b11da26189d..de260b70a33 100644 --- a/ts/features/bonus/cgn/components/detail/eyca/EycaErrorComponent.tsx +++ b/ts/features/bonus/cgn/components/detail/eyca/EycaErrorComponent.tsx @@ -2,12 +2,12 @@ import * as React from "react"; import { View, StyleSheet } from "react-native"; import { H4 } from "../../../../../../components/core/typography/H4"; import I18n from "../../../../../../i18n"; -import IconFont from "../../../../../../components/ui/IconFont"; -import { IOColors } from "../../../../../../components/core/variables/IOColors"; import ButtonDefaultOpacity from "../../../../../../components/ButtonDefaultOpacity"; import { Label } from "../../../../../../components/core/typography/Label"; import { InfoBox } from "../../../../../../components/box/InfoBox"; import { VSpacer } from "../../../../../../components/core/spacer/Spacer"; +import { Icon } from "../../../../../../components/core/icons/Icon"; +import TouchableDefaultOpacity from "../../../../../../components/TouchableDefaultOpacity"; type Props = { onRetry: () => void; @@ -35,15 +35,12 @@ const EycaErrorComponent = (props: Props) => ( testID={"eyca-error-component"} >

{I18n.t("bonus.cgn.detail.status.eycaCircuit")}

- + + + - +

{I18n.t("bonus.cgn.detail.status.eycaError")}

diff --git a/ts/features/bonus/cgn/components/detail/eyca/EycaPendingComponent.tsx b/ts/features/bonus/cgn/components/detail/eyca/EycaPendingComponent.tsx index 07fe6c7fe54..2863b7e6fff 100644 --- a/ts/features/bonus/cgn/components/detail/eyca/EycaPendingComponent.tsx +++ b/ts/features/bonus/cgn/components/detail/eyca/EycaPendingComponent.tsx @@ -2,14 +2,14 @@ import * as React from "react"; import { View, StyleSheet } from "react-native"; import { H4 } from "../../../../../../components/core/typography/H4"; import I18n from "../../../../../../i18n"; -import IconFont from "../../../../../../components/ui/IconFont"; -import { IOColors } from "../../../../../../components/core/variables/IOColors"; import ButtonDefaultOpacity from "../../../../../../components/ButtonDefaultOpacity"; import { Label } from "../../../../../../components/core/typography/Label"; import { InfoBox } from "../../../../../../components/box/InfoBox"; import { openWebUrl } from "../../../../../../utils/url"; import { showToast } from "../../../../../../utils/showToast"; import { VSpacer } from "../../../../../../components/core/spacer/Spacer"; +import { Icon } from "../../../../../../components/core/icons/Icon"; +import TouchableDefaultOpacity from "../../../../../../components/TouchableDefaultOpacity"; type Props = { openBottomSheet: () => void; @@ -35,15 +35,12 @@ const EycaStatusDetailsComponent = (props: Props) => ( testID={"eyca-pending-component"} >

{I18n.t("bonus.cgn.detail.status.eycaCircuit")}

- + + + - +

{I18n.t("bonus.cgn.detail.status.eycaPending")}

diff --git a/ts/features/bonus/cgn/components/detail/eyca/EycaStatusDetailsComponent.tsx b/ts/features/bonus/cgn/components/detail/eyca/EycaStatusDetailsComponent.tsx index 5a9fdd1adcb..fcffdc2c5ed 100644 --- a/ts/features/bonus/cgn/components/detail/eyca/EycaStatusDetailsComponent.tsx +++ b/ts/features/bonus/cgn/components/detail/eyca/EycaStatusDetailsComponent.tsx @@ -3,8 +3,6 @@ import { View, StyleSheet } from "react-native"; import { EycaCardActivated } from "../../../../../../../definitions/cgn/EycaCardActivated"; import { H4 } from "../../../../../../components/core/typography/H4"; import I18n from "../../../../../../i18n"; -import IconFont from "../../../../../../components/ui/IconFont"; -import { IOColors } from "../../../../../../components/core/variables/IOColors"; import { IOStyles } from "../../../../../../components/core/variables/IOStyles"; import { Monospace } from "../../../../../../components/core/typography/Monospace"; import { EycaCardExpired } from "../../../../../../../definitions/cgn/EycaCardExpired"; @@ -18,6 +16,8 @@ import { HSpacer, VSpacer } from "../../../../../../components/core/spacer/Spacer"; +import { Icon } from "../../../../../../components/core/icons/Icon"; +import TouchableDefaultOpacity from "../../../../../../components/TouchableDefaultOpacity"; import { IOBadge } from "../../../../../../components/core/IOBadge"; type Props = { @@ -77,12 +77,9 @@ const EycaStatusDetailsComponent = (props: Props) => {

{I18n.t("bonus.cgn.detail.status.eyca")}

- + + + {badgeByStatus()} diff --git a/ts/features/bonus/cgn/components/merchants/CgnMerchantsDiscountItem.tsx b/ts/features/bonus/cgn/components/merchants/CgnMerchantsDiscountItem.tsx index d926131dd47..73a239745c9 100644 --- a/ts/features/bonus/cgn/components/merchants/CgnMerchantsDiscountItem.tsx +++ b/ts/features/bonus/cgn/components/merchants/CgnMerchantsDiscountItem.tsx @@ -10,10 +10,10 @@ import { DiscountCodeType } from "../../../../../../definitions/cgn/merchants/Di import { useCgnDiscountDetailBottomSheet } from "../../hooks/useCgnDiscountDetailBottomSheet"; import { Label } from "../../../../../components/core/typography/Label"; import { IOColors } from "../../../../../components/core/variables/IOColors"; -import IconFont from "../../../../../components/ui/IconFont"; import TouchableDefaultOpacity from "../../../../../components/TouchableDefaultOpacity"; import { IOBadge } from "../../../../../components/core/IOBadge"; import I18n from "../../../../../i18n"; +import { Icon } from "../../../../../components/core/icons"; import { HSpacer } from "../../../../../components/core/spacer/Spacer"; type Props = { @@ -69,7 +69,7 @@ const CgnMerchantDiscountItem: React.FunctionComponent = ({ )} - + {cgnDiscountDetail} diff --git a/ts/features/bonus/cgn/components/merchants/CgnMerchantsFilters.tsx b/ts/features/bonus/cgn/components/merchants/CgnMerchantsFilters.tsx index 32d89e05bc8..bf21805016a 100644 --- a/ts/features/bonus/cgn/components/merchants/CgnMerchantsFilters.tsx +++ b/ts/features/bonus/cgn/components/merchants/CgnMerchantsFilters.tsx @@ -12,7 +12,6 @@ import { } from "react-native"; import AppHeader from "../../../../../components/ui/AppHeader"; import ButtonDefaultOpacity from "../../../../../components/ButtonDefaultOpacity"; -import IconFont from "../../../../../components/ui/IconFont"; import { H5 } from "../../../../../components/core/typography/H5"; import I18n from "../../../../../i18n"; import { IOStyles } from "../../../../../components/core/variables/IOStyles"; @@ -26,6 +25,7 @@ import { } from "../../../bonusVacanze/components/buttons/ButtonConfigurations"; import { LabelledItem } from "../../../../../components/LabelledItem"; import { VSpacer } from "../../../../../components/core/spacer/Spacer"; +import { Icon } from "../../../../../components/core/icons/Icon"; import CategoryCheckbox from "./search/CategoryCheckbox"; import OrderOption from "./search/OrderOption"; import { DistanceSlider } from "./search/DistanceSlider"; @@ -102,7 +102,7 @@ const CgnMerchantsFilters: React.FunctionComponent = (props: Props) => { - + diff --git a/ts/features/bonus/cgn/components/merchants/__test__/__snapshots__/CgnDiscountDetail.test.tsx.snap b/ts/features/bonus/cgn/components/merchants/__test__/__snapshots__/CgnDiscountDetail.test.tsx.snap index d5717975ba3..38fabaa237d 100644 --- a/ts/features/bonus/cgn/components/merchants/__test__/__snapshots__/CgnDiscountDetail.test.tsx.snap +++ b/ts/features/bonus/cgn/components/merchants/__test__/__snapshots__/CgnDiscountDetail.test.tsx.snap @@ -121,11 +121,92 @@ exports[`when rendering on match snapshot for OTP discount 1`] = ` > •••••••••• - + > + + + + + + •••••••••• - + > + + + + + + { return ( <> @@ -155,12 +153,13 @@ const CgnBucketCodeContent = (props: ContentProps) => { onPress={handleCopyPress} content={bucketResponse.value.value.code} icon={ - + + + } /> ); @@ -170,13 +169,7 @@ const CgnBucketCodeContent = (props: ContentProps) => { - } + icon={} /> ); }; diff --git a/ts/features/bonus/cgn/components/merchants/discount/CgnOTPCodeComponent.tsx b/ts/features/bonus/cgn/components/merchants/discount/CgnOTPCodeComponent.tsx index 4c91a7ccda2..26234971c68 100644 --- a/ts/features/bonus/cgn/components/merchants/discount/CgnOTPCodeComponent.tsx +++ b/ts/features/bonus/cgn/components/merchants/discount/CgnOTPCodeComponent.tsx @@ -3,17 +3,16 @@ import { TouchableWithoutFeedback } from "@gorhom/bottom-sheet"; import { View, StyleSheet } from "react-native"; import I18n from "../../../../../../i18n"; import { BaseTypography } from "../../../../../../components/core/typography/BaseTypography"; -import { IOColors } from "../../../../../../components/core/variables/IOColors"; import { useIODispatch, useIOSelector } from "../../../../../../store/hooks"; import { cgnOtpDataSelector } from "../../../store/reducers/otp"; import { isError, isLoading, isReady } from "../../../../bpd/model/RemoteValue"; import { cgnGenerateOtp, resetOtpState } from "../../../store/actions/otp"; -import Eye from "../../../../../../../img/icons/Eye.svg"; import ActivityIndicator from "../../../../../../components/ui/ActivityIndicator"; import { Link } from "../../../../../../components/core/typography/Link"; import { IOStyles } from "../../../../../../components/core/variables/IOStyles"; import { H3 } from "../../../../../../components/core/typography/H3"; import { H4 } from "../../../../../../components/core/typography/H4"; +import { Icon } from "../../../../../../components/core/icons/Icon"; import { OtpCodeComponent } from "./OtpCodeComponent"; const styles = StyleSheet.create({ @@ -102,11 +101,7 @@ const CgnOTPCodeContent = ({ onCodePress }: Props) => { {"••••••••••"} - + ); diff --git a/ts/features/bonus/cgn/components/merchants/discount/CgnStaticCodeComponent.tsx b/ts/features/bonus/cgn/components/merchants/discount/CgnStaticCodeComponent.tsx index d415b5ea3af..2e1cdf5e004 100644 --- a/ts/features/bonus/cgn/components/merchants/discount/CgnStaticCodeComponent.tsx +++ b/ts/features/bonus/cgn/components/merchants/discount/CgnStaticCodeComponent.tsx @@ -4,13 +4,11 @@ import * as React from "react"; import { useCallback } from "react"; import { View, StyleSheet } from "react-native"; import { Discount } from "../../../../../../../definitions/cgn/merchants/Discount"; -import Eye from "../../../../../../../img/icons/Eye.svg"; import { BaseTypography } from "../../../../../../components/core/typography/BaseTypography"; import { H3 } from "../../../../../../components/core/typography/H3"; -import { IOColors } from "../../../../../../components/core/variables/IOColors"; -import IconFont from "../../../../../../components/ui/IconFont"; import I18n from "../../../../../../i18n"; import { clipboardSetStringWithFeedback } from "../../../../../../utils/clipboard"; +import { Icon } from "../../../../../../components/core/icons/Icon"; type Props = { staticCode: Discount["staticCode"]; @@ -83,18 +81,15 @@ const CgnStaticCodeComponent: React.FunctionComponent = ({ {isCodeVisible ? ( - + + + ) : ( - + )} diff --git a/ts/features/bonus/cgn/components/merchants/discount/OtpCodeComponent.tsx b/ts/features/bonus/cgn/components/merchants/discount/OtpCodeComponent.tsx index 46545f8e722..4825f6800ca 100644 --- a/ts/features/bonus/cgn/components/merchants/discount/OtpCodeComponent.tsx +++ b/ts/features/bonus/cgn/components/merchants/discount/OtpCodeComponent.tsx @@ -8,11 +8,11 @@ import { BaseTypography } from "../../../../../../components/core/typography/Bas import { H5 } from "../../../../../../components/core/typography/H5"; import { IOColors } from "../../../../../../components/core/variables/IOColors"; import TouchableDefaultOpacity from "../../../../../../components/TouchableDefaultOpacity"; -import IconFont from "../../../../../../components/ui/IconFont"; import I18n from "../../../../../../i18n"; import { clipboardSetStringWithFeedback } from "../../../../../../utils/clipboard"; import { isTestEnv } from "../../../../../../utils/environment"; import { addEvery } from "../../../../../../utils/strings"; +import { Icon } from "../../../../../../components/core/icons"; type ProgressConfig = { startPercentage: number; @@ -192,7 +192,7 @@ export const OtpCodeComponent = (props: Props) => { > {OtpCode(formattedCode)} - + •••••••••• - + > + + + + + + , (

{text}

- ); diff --git a/ts/features/bonus/cgn/screens/merchants/CgnMerchantDetailScreen.tsx b/ts/features/bonus/cgn/screens/merchants/CgnMerchantDetailScreen.tsx index 11ef01ec1be..08a838ea1e3 100644 --- a/ts/features/bonus/cgn/screens/merchants/CgnMerchantDetailScreen.tsx +++ b/ts/features/bonus/cgn/screens/merchants/CgnMerchantDetailScreen.tsx @@ -16,16 +16,13 @@ import { connect } from "react-redux"; import { Address } from "../../../../../../definitions/cgn/merchants/Address"; import { Discount } from "../../../../../../definitions/cgn/merchants/Discount"; import { Merchant } from "../../../../../../definitions/cgn/merchants/Merchant"; -import OpenWeb from "../../../../../../img/icons/openweburl.svg"; import { VSpacer } from "../../../../../components/core/spacer/Spacer"; import { H1 } from "../../../../../components/core/typography/H1"; import { H2 } from "../../../../../components/core/typography/H2"; import { H4 } from "../../../../../components/core/typography/H4"; -import { IOColors } from "../../../../../components/core/variables/IOColors"; import { IOStyles } from "../../../../../components/core/variables/IOStyles"; import BaseScreenComponent from "../../../../../components/screens/BaseScreenComponent"; import TouchableDefaultOpacity from "../../../../../components/TouchableDefaultOpacity"; -import IconFont from "../../../../../components/ui/IconFont"; import I18n from "../../../../../i18n"; import { Dispatch } from "../../../../../store/actions/types"; import { GlobalState } from "../../../../../store/reducers/types"; @@ -38,6 +35,7 @@ import { isLoading, isReady } from "../../../bpd/model/RemoteValue"; import CgnMerchantDiscountItem from "../../components/merchants/CgnMerchantsDiscountItem"; import { cgnSelectedMerchant } from "../../store/actions/merchants"; import { cgnSelectedMerchantSelector } from "../../store/reducers/merchants"; +import { Icon } from "../../../../../components/core/icons/Icon"; export type CgnMerchantDetailScreenNavigationParams = Readonly<{ merchantID: Merchant["id"]; @@ -58,6 +56,7 @@ const styles = StyleSheet.create({ }); const COPY_ICON_SIZE = 24; +const EXTERNAL_LINK_ICON_SIZE = 20; const CgnMerchantDetailScreen: React.FunctionComponent = ( props: Props @@ -90,12 +89,9 @@ const CgnMerchantDetailScreen: React.FunctionComponent = (

{item.full_address}

- + + + ); @@ -158,10 +154,10 @@ const CgnMerchantDetailScreen: React.FunctionComponent = (

{url}

- ) diff --git a/ts/features/bonus/cgn/screens/merchants/CgnMerchantLandingWebview.tsx b/ts/features/bonus/cgn/screens/merchants/CgnMerchantLandingWebview.tsx index ecef60a6c65..7a9af0e4d79 100644 --- a/ts/features/bonus/cgn/screens/merchants/CgnMerchantLandingWebview.tsx +++ b/ts/features/bonus/cgn/screens/merchants/CgnMerchantLandingWebview.tsx @@ -36,7 +36,7 @@ const CgnMerchantLandingWebview: React.FunctionComponent = ( return ( props.navigation.goBack() }} > diff --git a/ts/features/bonus/common/components/TosBonusComponent.tsx b/ts/features/bonus/common/components/TosBonusComponent.tsx index 7368f82701a..4c6977eb3f1 100644 --- a/ts/features/bonus/common/components/TosBonusComponent.tsx +++ b/ts/features/bonus/common/components/TosBonusComponent.tsx @@ -17,9 +17,9 @@ import { IOStyles } from "../../../../components/core/variables/IOStyles"; import { withLoadingSpinner } from "../../../../components/helpers/withLoadingSpinner"; import AppHeader from "../../../../components/ui/AppHeader"; import FooterWithButtons from "../../../../components/ui/FooterWithButtons"; -import IconFont from "../../../../components/ui/IconFont"; import I18n from "../../../../i18n"; import { AVOID_ZOOM_JS, closeInjectedScript } from "../../../../utils/webview"; +import { Icon } from "../../../../components/core/icons/Icon"; type Props = { onClose: () => void; @@ -111,7 +111,7 @@ const TosBonusComponent: React.FunctionComponent = props => { - + diff --git a/ts/features/bonus/siciliaVola/components/SvVoucherListFilters.tsx b/ts/features/bonus/siciliaVola/components/SvVoucherListFilters.tsx index 8bf335064bd..7d4b8dd9a22 100644 --- a/ts/features/bonus/siciliaVola/components/SvVoucherListFilters.tsx +++ b/ts/features/bonus/siciliaVola/components/SvVoucherListFilters.tsx @@ -6,7 +6,6 @@ import { Body, Container, Left, ListItem, Right } from "native-base"; import { View, Keyboard, SafeAreaView, ScrollView } from "react-native"; import AppHeader from "../../../../components/ui/AppHeader"; import ButtonDefaultOpacity from "../../../../components/ButtonDefaultOpacity"; -import IconFont from "../../../../components/ui/IconFont"; import { H5 } from "../../../../components/core/typography/H5"; import I18n from "../../../../i18n"; import { IOStyles } from "../../../../components/core/variables/IOStyles"; @@ -24,10 +23,10 @@ import { possibleVoucherStateSelector } from "../store/reducers/voucherList/poss import { isReady } from "../../bpd/model/RemoteValue"; import { StatoVoucherBean } from "../../../../../definitions/api_sicilia_vola/StatoVoucherBean"; import { H4 } from "../../../../components/core/typography/H4"; -import { IOColors } from "../../../../components/core/variables/IOColors"; import { svSetFilter } from "../store/actions/voucherList"; import { FilterState } from "../store/reducers/voucherList/filters"; import { VSpacer } from "../../../../components/core/spacer/Spacer"; +import { Icon } from "../../../../components/core/icons"; type Props = ReturnType & ReturnType & { @@ -65,10 +64,10 @@ const PossibleVoucherStateOption = ({

{text}

- ); @@ -138,7 +137,7 @@ const SvVoucherListFilters: React.FunctionComponent = (props: Props) => { - + diff --git a/ts/features/design-system/core/DSAdvice.tsx b/ts/features/design-system/core/DSAdvice.tsx index d302411d67a..2f575fec330 100644 --- a/ts/features/design-system/core/DSAdvice.tsx +++ b/ts/features/design-system/core/DSAdvice.tsx @@ -7,8 +7,6 @@ import { InfoBox } from "../../../components/box/InfoBox"; /* Types */ import { ImportoEuroCents } from "../../../../definitions/backend/ImportoEuroCents"; import { IOStyles } from "../../../components/core/variables/IOStyles"; -import { IOColors } from "../../../components/core/variables/IOColors"; - import { Label } from "../../../components/core/typography/Label"; import { ActivateBonusReminder } from "../../bonus/bonusVacanze/screens/activation/request/ActivateBonusReminder"; import { DesignSystemScreen } from "../components/DesignSystemScreen"; @@ -103,11 +101,7 @@ export const DSAdvice = () => ( - +
{ "Per verificare la tua carta, tratteniamo € 0.02. Non preoccuparti: ti restituiremo l'importo al più presto." @@ -140,7 +134,7 @@ export const DSAdvice = () => ( /> - + ); diff --git a/ts/features/design-system/core/DSListItems.tsx b/ts/features/design-system/core/DSListItems.tsx index 06bd928e8a5..a1837d6f168 100644 --- a/ts/features/design-system/core/DSListItems.tsx +++ b/ts/features/design-system/core/DSListItems.tsx @@ -13,7 +13,6 @@ import CgnMerchantDiscountItem from "../../bonus/cgn/components/merchants/CgnMer /* Icons */ import BooksIcon from "../../../../img/bonus/cgn/categories/books.svg"; import CultureIcon from "../../../../img/bonus/cgn/categories/culture.svg"; -import InfoIcon from "../../../../img/assistance/info.svg"; import OrderOption from "../../bonus/cgn/components/merchants/search/OrderOption"; import ZendeskItemPermissionComponent from "../../zendesk/components/ZendeskItemPermissionComponent"; @@ -24,6 +23,7 @@ import { TimelineOperationListItem } from "../../idpay/initiative/details/compon import { OperationTypeEnum } from "../../../../definitions/idpay/TransactionOperationDTO"; import { DesignSystemScreen } from "../components/DesignSystemScreen"; import { VSpacer } from "../../../components/core/spacer/Spacer"; +import { Icon } from "../../../components/core/icons/Icon"; export const DSListItems = () => ( @@ -95,7 +95,7 @@ export const DSListItems = () => ( alert("Action triggered")} /> @@ -113,7 +113,7 @@ export const DSListItems = () => ( alert("Action triggered")} @@ -173,7 +173,7 @@ export const DSListItems = () => ( } + icon={} title="Storico versioni dell'app" value="Per capire se il problema dipende dall'ultimo aggiornamento" testId="TestID" diff --git a/ts/features/euCovidCert/screens/valid/EuCovidCertValidScreen.tsx b/ts/features/euCovidCert/screens/valid/EuCovidCertValidScreen.tsx index 716b5f02067..05781104143 100644 --- a/ts/features/euCovidCert/screens/valid/EuCovidCertValidScreen.tsx +++ b/ts/features/euCovidCert/screens/valid/EuCovidCertValidScreen.tsx @@ -17,7 +17,6 @@ import { H5 } from "../../../../components/core/typography/H5"; import { IOColors } from "../../../../components/core/variables/IOColors"; import { IOStyles } from "../../../../components/core/variables/IOStyles"; import FooterWithButtons from "../../../../components/ui/FooterWithButtons"; -import IconFont from "../../../../components/ui/IconFont"; import I18n from "../../../../i18n"; import { mixpanelTrack } from "../../../../mixpanel"; import { GlobalState } from "../../../../store/reducers/types"; @@ -47,6 +46,7 @@ import { BaseEuCovidCertificateLayout } from "../BaseEuCovidCertificateLayout"; import { EUCovidContext } from "../EuCovidCertificateRouterScreen"; import { EuCovidCertHeader } from "../../components/EuCovidCertHeader"; import { VSpacer } from "../../../../components/core/spacer/Spacer"; +import { Icon } from "../../../../components/core/icons/Icon"; type OwnProps = { validCertificate: ValidCertificate; @@ -159,7 +159,7 @@ const addBottomSheetItem = (config: { {config.subTitle}
- + diff --git a/ts/features/fci/components/DocumentWithSignature.tsx b/ts/features/fci/components/DocumentWithSignature.tsx index dff470772aa..be437c3c0ad 100644 --- a/ts/features/fci/components/DocumentWithSignature.tsx +++ b/ts/features/fci/components/DocumentWithSignature.tsx @@ -282,12 +282,8 @@ const DocumentWithSignature = (props: Props) => { currentPage, totalPages })} - iconLeftColor={ - currentPage === 1 ? IOColors.bluegreyLight : IOColors.blue - } - iconRightColor={ - currentPage === totalPages ? IOColors.bluegreyLight : IOColors.blue - } + iconLeftColor={currentPage === 1 ? "bluegreyLight" : "blue"} + iconRightColor={currentPage === totalPages ? "bluegreyLight" : "blue"} onPrevious={onPrevious} onNext={onNext} disabled={false} diff --git a/ts/features/fci/components/DocumentsNavigationBar.tsx b/ts/features/fci/components/DocumentsNavigationBar.tsx index 4059b3d8fae..c5c026f85a5 100644 --- a/ts/features/fci/components/DocumentsNavigationBar.tsx +++ b/ts/features/fci/components/DocumentsNavigationBar.tsx @@ -1,12 +1,12 @@ import * as React from "react"; import { View, StyleSheet } from "react-native"; import ButtonDefaultOpacity from "../../../components/ButtonDefaultOpacity"; -import IconFont from "../../../components/ui/IconFont"; import { H4 } from "../../../components/core/typography/H4"; import { IOColors } from "../../../components/core/variables/IOColors"; import { WithTestID } from "../../../types/WithTestID"; import { IOStyles } from "../../../components/core/variables/IOStyles"; import { HSpacer } from "../../../components/core/spacer/Spacer"; +import { Icon } from "../../../components/core/icons/Icon"; const styles = StyleSheet.create({ container: { @@ -23,9 +23,6 @@ const styles = StyleSheet.create({ paddingBottom: 0, paddingTop: 0 }, - icon: { - paddingRight: 0 - }, shadow: { // iOS shadowColor: IOColors.black, @@ -48,8 +45,8 @@ export type IndicatorPositionEnum = "left" | "right"; type Props = WithTestID<{ titleRight: string; titleLeft: string; - iconRightColor?: string; - iconLeftColor?: string; + iconRightColor?: IOColors; + iconLeftColor?: IOColors; disabled?: boolean; indicatorPosition: IndicatorPositionEnum; onPrevious: () => void; @@ -69,10 +66,10 @@ const renderNavigationComponent = ( disabled={disabled} testID={"DocumentsNavigationBarLeftButtonTestID"} > - @@ -85,10 +82,10 @@ const renderNavigationComponent = ( disabled={disabled} testID={"DocumentsNavigationBarRightButtonTestID"} > - diff --git a/ts/features/fci/components/QtspClauseListItem.tsx b/ts/features/fci/components/QtspClauseListItem.tsx index 3a61b9fe479..47e90d4d0bd 100644 --- a/ts/features/fci/components/QtspClauseListItem.tsx +++ b/ts/features/fci/components/QtspClauseListItem.tsx @@ -1,12 +1,11 @@ import * as React from "react"; import { StyleSheet, View } from "react-native"; import { useSelector } from "react-redux"; -import IconFont from "../../../components/ui/IconFont"; import { IOStyles } from "../../../components/core/variables/IOStyles"; -import { IOColors } from "../../../components/core/variables/IOColors"; import TouchableDefaultOpacity from "../../../components/TouchableDefaultOpacity"; import { QtspClause } from "../../../../definitions/fci/QtspClause"; import { fciQtspFilledDocumentUrlSelector } from "../store/reducers/fciQtspFilledDocument"; +import { Icon } from "../../../components/core/icons/Icon"; import LinkedText from "./LinkedText"; type Props = { @@ -57,10 +56,10 @@ const QtspClauseListItem = (props: Props) => { }} > - diff --git a/ts/features/fci/components/SignatureFieldItem.tsx b/ts/features/fci/components/SignatureFieldItem.tsx index a8473bfd1ff..cde0c552231 100644 --- a/ts/features/fci/components/SignatureFieldItem.tsx +++ b/ts/features/fci/components/SignatureFieldItem.tsx @@ -1,12 +1,12 @@ import * as React from "react"; import { View, StyleSheet } from "react-native"; import { H4 } from "../../../components/core/typography/H4"; -import IconFont from "../../../components/ui/IconFont"; import { IOStyles } from "../../../components/core/variables/IOStyles"; import { IOColors } from "../../../components/core/variables/IOColors"; import TouchableDefaultOpacity from "../../../components/TouchableDefaultOpacity"; import { Link } from "../../../components/core/typography/Link"; import I18n from "../../../i18n"; +import { Icon } from "../../../components/core/icons/Icon"; type Props = { title: string; @@ -60,15 +60,15 @@ const SignatureFieldItem = (props: Props) => { disabled={props.disabled} style={{ alignSelf: "center" }} > - diff --git a/ts/features/fci/components/__tests__/DocumentsNavigationBar.test.tsx b/ts/features/fci/components/__tests__/DocumentsNavigationBar.test.tsx index 23d3593604d..2c555644d70 100644 --- a/ts/features/fci/components/__tests__/DocumentsNavigationBar.test.tsx +++ b/ts/features/fci/components/__tests__/DocumentsNavigationBar.test.tsx @@ -8,8 +8,8 @@ import { IOColors } from "../../../../components/core/variables/IOColors"; type Props = { titleRight: string; titleLeft: string; - iconRightColor?: string; - iconLeftColor?: string; + iconRightColor?: IOColors; + iconLeftColor?: IOColors; disabled?: boolean; indicatorPosition: IndicatorPositionEnum; onPrevious: () => void; @@ -21,8 +21,8 @@ describe("Test DocumentsNavigationBar component", () => { const props: Props = { titleRight: "Pagina 1 di 2", titleLeft: "Documento 1 di 2", - iconRightColor: IOColors.blue, - iconLeftColor: IOColors.blue, + iconRightColor: "blue", + iconLeftColor: "blue", indicatorPosition: "left", onPrevious: jest.fn(), onNext: jest.fn() diff --git a/ts/features/fci/components/__tests__/__snapshots__/DocumentsNavigationBar.test.tsx.snap b/ts/features/fci/components/__tests__/__snapshots__/DocumentsNavigationBar.test.tsx.snap index 554259f90c5..abecc0e98b7 100644 --- a/ts/features/fci/components/__tests__/__snapshots__/DocumentsNavigationBar.test.tsx.snap +++ b/ts/features/fci/components/__tests__/__snapshots__/DocumentsNavigationBar.test.tsx.snap @@ -81,41 +81,60 @@ exports[`Test DocumentsNavigationBar component should render a DocumentsNavigati } testID="DocumentsNavigationBarLeftButtonTestID" > - - v - + + + + - - t - + + + + - - R - + + + + { style={[styles.verticalPadding, styles.alertTextContainer]} testID="FciDataSharingScreenAlertTextTestID" > - +

{I18n.t("features.fci.shareDataScreen.alertText")} diff --git a/ts/features/fci/screens/valid/FciDocumentPreviewScreen.tsx b/ts/features/fci/screens/valid/FciDocumentPreviewScreen.tsx index f61e17dfbc3..8424d0e1cf8 100644 --- a/ts/features/fci/screens/valid/FciDocumentPreviewScreen.tsx +++ b/ts/features/fci/screens/valid/FciDocumentPreviewScreen.tsx @@ -3,10 +3,8 @@ import React from "react"; import { SafeAreaView, StyleSheet } from "react-native"; import * as O from "fp-ts/lib/Option"; import * as S from "fp-ts/lib/string"; -import { IOColors } from "../../../../components/core/variables/IOColors"; import BaseScreenComponent from "../../../../components/screens/BaseScreenComponent"; import TouchableDefaultOpacity from "../../../../components/TouchableDefaultOpacity"; -import IconFont from "../../../../components/ui/IconFont"; import I18n from "../../../../i18n"; import { IOStackNavigationRouteProps } from "../../../../navigation/params/AppParamsList"; import { emptyContextualHelp } from "../../../../utils/emptyContextualHelp"; @@ -22,6 +20,7 @@ import { } from "../../store/actions"; import { fciDownloadPathSelector } from "../../store/reducers/fciDownloadPreview"; import GenericErrorComponent from "../../components/GenericErrorComponent"; +import { Icon } from "../../../../components/core/icons/Icon"; export type FciDocumentPreviewScreenNavigationParams = Readonly<{ documentUrl: string; @@ -81,7 +80,7 @@ export const FciDocumentPreviewScreen = ( accessibilityLabel={I18n.t("global.buttons.back")} accessibilityRole={"button"} > - + ); @@ -114,11 +113,9 @@ export const FciDocumentPreviewScreen = ( currentPage, totalPages })} - iconLeftColor={currentDoc === 0 ? IOColors.bluegreyLight : IOColors.blue} + iconLeftColor={currentDoc === 0 ? "bluegreyLight" : "blue"} iconRightColor={ - currentDoc === documents.length - 1 - ? IOColors.bluegreyLight - : IOColors.blue + currentDoc === documents.length - 1 ? "bluegreyLight" : "blue" } onPrevious={onPrevious} onNext={onNext} diff --git a/ts/features/fci/screens/valid/FciDocumentsScreen.tsx b/ts/features/fci/screens/valid/FciDocumentsScreen.tsx index cbe39b6cc63..cf8cae49fce 100644 --- a/ts/features/fci/screens/valid/FciDocumentsScreen.tsx +++ b/ts/features/fci/screens/valid/FciDocumentsScreen.tsx @@ -13,7 +13,6 @@ import { useNavigation, useRoute } from "@react-navigation/native"; -import IconFont from "../../../../components/ui/IconFont"; import { IOStyles } from "../../../../components/core/variables/IOStyles"; import BaseScreenComponent from "../../../../components/screens/BaseScreenComponent"; import { IOColors } from "../../../../components/core/variables/IOColors"; @@ -35,6 +34,7 @@ import { } from "../../store/actions"; import { fciDocumentSignaturesSelector } from "../../store/reducers/fciDocumentSignatures"; import { useIODispatch, useIOSelector } from "../../../../store/hooks"; +import { Icon } from "../../../../components/core/icons/Icon"; import { fciDownloadPathSelector } from "../../store/reducers/fciDownloadPreview"; import LoadingSpinnerOverlay from "../../../../components/LoadingSpinnerOverlay"; import { trackFciDocOpeningSuccess, trackFciSigningDoc } from "../../analytics"; @@ -201,7 +201,7 @@ const FciDocumentsScreen = () => { accessibilityLabel={I18n.t("global.buttons.back")} accessibilityRole={"button"} > - + ); @@ -226,12 +226,8 @@ const FciDocumentsScreen = () => { currentPage, totalPages })} - iconLeftColor={ - currentPage === 1 ? IOColors.bluegreyLight : IOColors.blue - } - iconRightColor={ - currentPage === totalPages ? IOColors.bluegreyLight : IOColors.blue - } + iconLeftColor={currentPage === 1 ? "bluegreyLight" : "blue"} + iconRightColor={currentPage === totalPages ? "bluegreyLight" : "blue"} onPrevious={onPrevious} onNext={onNext} disabled={false} diff --git a/ts/features/fci/screens/valid/FciSignatureFieldsScreen.tsx b/ts/features/fci/screens/valid/FciSignatureFieldsScreen.tsx index 0d22699e388..cb53cd8cc8e 100644 --- a/ts/features/fci/screens/valid/FciSignatureFieldsScreen.tsx +++ b/ts/features/fci/screens/valid/FciSignatureFieldsScreen.tsx @@ -24,7 +24,6 @@ import FooterWithButtons from "../../../../components/ui/FooterWithButtons"; import { FCI_ROUTES } from "../../navigation/routes"; import TouchableDefaultOpacity from "../../../../components/TouchableDefaultOpacity"; import { IOColors } from "../../../../components/core/variables/IOColors"; -import IconFont from "../../../../components/ui/IconFont"; import { fciDocumentSignaturesSelector } from "../../store/reducers/fciDocumentSignatures"; import { fciEndRequest, @@ -42,6 +41,7 @@ import { getSectionListData } from "../../utils/signatureFields"; import { VSpacer } from "../../../../components/core/spacer/Spacer"; +import { Icon } from "../../../../components/core/icons/Icon"; import ScreenContent from "../../../../components/screens/ScreenContent"; import { LightModalContext } from "../../../../components/ui/LightModal"; import DocumentWithSignature from "../../components/DocumentWithSignature"; @@ -225,7 +225,7 @@ const FciSignatureFieldsScreen = ( accessibilityLabel={I18n.t("global.buttons.back")} accessibilityRole={"button"} > - + ); diff --git a/ts/features/fims/components/CommonContent.tsx b/ts/features/fims/components/CommonContent.tsx index f3387b48210..6aabe77a14d 100644 --- a/ts/features/fims/components/CommonContent.tsx +++ b/ts/features/fims/components/CommonContent.tsx @@ -2,8 +2,8 @@ import { Body, Container, Content, Right } from "native-base"; import * as React from "react"; import AppHeader from "../../../components/ui/AppHeader"; import ButtonDefaultOpacity from "../../../components/ButtonDefaultOpacity"; -import IconFont from "../../../components/ui/IconFont"; import { IOStyles } from "../../../components/core/variables/IOStyles"; +import { Icon } from "../../../components/core/icons/Icon"; type Props = { close: () => void; @@ -16,7 +16,7 @@ const CommonContent = ({ close, children }: Props) => ( - + diff --git a/ts/features/fims/components/ErrorContent.tsx b/ts/features/fims/components/ErrorContent.tsx index 1a118719691..914fdd10790 100644 --- a/ts/features/fims/components/ErrorContent.tsx +++ b/ts/features/fims/components/ErrorContent.tsx @@ -1,16 +1,11 @@ import * as React from "react"; -import { View, StyleSheet } from "react-native"; -import IconFont from "../../../components/ui/IconFont"; -import customVariables from "../../../theme/variables"; +import { View } from "react-native"; import { Label } from "../../../components/core/typography/Label"; import { VSpacer } from "../../../components/core/spacer/Spacer"; +import { Icon } from "../../../components/core/icons/Icon"; +import { IOStyles } from "../../../components/core/variables/IOStyles"; import CommonContent from "./CommonContent"; -const styles = StyleSheet.create({ - itemsCenter: { alignItems: "center" }, - selfCenter: { alignSelf: "center" } -}); - type Props = { text: string; close: () => void; @@ -18,15 +13,12 @@ type Props = { const ErrorContent = ({ text, close }: Props) => ( - + + + - + diff --git a/ts/features/fims/components/SuccessContent.tsx b/ts/features/fims/components/SuccessContent.tsx index ed57480a4b2..41b0c1fbec1 100644 --- a/ts/features/fims/components/SuccessContent.tsx +++ b/ts/features/fims/components/SuccessContent.tsx @@ -1,10 +1,9 @@ import * as React from "react"; import { View, StyleSheet } from "react-native"; -import IconFont from "../../../components/ui/IconFont"; -import customVariables from "../../../theme/variables"; import { Label } from "../../../components/core/typography/Label"; import I18n from "../../../i18n"; import { VSpacer } from "../../../components/core/spacer/Spacer"; +import { Icon } from "../../../components/core/icons/Icon"; import CommonContent from "./CommonContent"; const styles = StyleSheet.create({ @@ -18,12 +17,9 @@ type Props = { }; const SuccessContent = ({ text, close }: Props) => ( - + + + diff --git a/ts/features/idpay/initiative/configuration/screens/IbanEnrollmentScreen.tsx b/ts/features/idpay/initiative/configuration/screens/IbanEnrollmentScreen.tsx index 3335df39d1a..0bb392584eb 100644 --- a/ts/features/idpay/initiative/configuration/screens/IbanEnrollmentScreen.tsx +++ b/ts/features/idpay/initiative/configuration/screens/IbanEnrollmentScreen.tsx @@ -149,7 +149,7 @@ const IbanEnrollmentScreen = () => { key={iban.iban} title={iban.description} subTitle={iban.iban} - iconName={isSelected ? "io-radio-on" : "io-radio-off"} + iconName={isSelected ? "legRadioOn" : "legRadioOff"} smallIconSize={true} accessible={true} accessibilityRole={"radiogroup"} diff --git a/ts/features/idpay/initiative/configuration/screens/InitiativeConfigurationIntroScreen.tsx b/ts/features/idpay/initiative/configuration/screens/InitiativeConfigurationIntroScreen.tsx index 55b6700382c..9b85e61d25c 100644 --- a/ts/features/idpay/initiative/configuration/screens/InitiativeConfigurationIntroScreen.tsx +++ b/ts/features/idpay/initiative/configuration/screens/InitiativeConfigurationIntroScreen.tsx @@ -13,7 +13,6 @@ import LoadingSpinnerOverlay from "../../../../../components/LoadingSpinnerOverl import BaseScreenComponent from "../../../../../components/screens/BaseScreenComponent"; import TouchableDefaultOpacity from "../../../../../components/TouchableDefaultOpacity"; import FooterWithButtons from "../../../../../components/ui/FooterWithButtons"; -import IconFont from "../../../../../components/ui/IconFont"; import { emptyContextualHelp } from "../../../../../utils/emptyContextualHelp"; import InstitutionIcon from "../../../../../../img/features/idpay/institution.svg"; import CreditCardIcon from "../../../../../../img/features/idpay/creditcard.svg"; @@ -23,6 +22,7 @@ import { LOADING_TAG } from "../../../../../utils/xstate"; import I18n from "../../../../../i18n"; import { ConfigurationMode } from "../xstate/context"; import { VSpacer } from "../../../../../components/core/spacer/Spacer"; +import { Icon } from "../../../../../components/core/icons/Icon"; type InitiativeConfigurationIntroScreenRouteParams = { initiativeId: string; @@ -70,7 +70,7 @@ const InitiativeConfigurationIntroScreen = () => { const customGoBack = ( - + ); diff --git a/ts/features/idpay/initiative/details/components/InitiativeSettingsComponent.tsx b/ts/features/idpay/initiative/details/components/InitiativeSettingsComponent.tsx index bddaa2474d7..fe0840fbdf7 100644 --- a/ts/features/idpay/initiative/details/components/InitiativeSettingsComponent.tsx +++ b/ts/features/idpay/initiative/details/components/InitiativeSettingsComponent.tsx @@ -13,16 +13,14 @@ import { HSpacer, VSpacer } from "../../../../../components/core/spacer/Spacer"; import { H3 } from "../../../../../components/core/typography/H3"; import { H4 } from "../../../../../components/core/typography/H4"; import { LabelSmall } from "../../../../../components/core/typography/LabelSmall"; -import { IOColors } from "../../../../../components/core/variables/IOColors"; import { IOStyles } from "../../../../../components/core/variables/IOStyles"; -import IconFont from "../../../../../components/ui/IconFont"; import I18n from "../../../../../i18n"; import { AppParamsList, IOStackNavigationProp } from "../../../../../navigation/params/AppParamsList"; -import customVariables from "../../../../../theme/variables"; import { IDPayConfigurationRoutes } from "../../configuration/navigation/navigator"; +import { Icon } from "../../../../../components/core/icons/Icon"; type Props = { initiative?: InitiativeDTO; @@ -70,7 +68,7 @@ const SettingsButtonComponent = (props: SettingsButtonProps) => { {hasWarnings && ( <> - + )} @@ -78,10 +76,7 @@ const SettingsButtonComponent = (props: SettingsButtonProps) => {

{title}

{getSubtitleComponent()} - + ); }; diff --git a/ts/features/idpay/initiative/details/screens/InitiativeDetailsScreen.tsx b/ts/features/idpay/initiative/details/screens/InitiativeDetailsScreen.tsx index 98d28004889..25762eced59 100644 --- a/ts/features/idpay/initiative/details/screens/InitiativeDetailsScreen.tsx +++ b/ts/features/idpay/initiative/details/screens/InitiativeDetailsScreen.tsx @@ -188,7 +188,7 @@ const InitiativeDetailsScreen = () => { headerBackgroundColor={IOColors["blue-50"]} contextualHelp={emptyContextualHelp} customRightIcon={{ - iconName: "io-info", + iconName: "info", onPress: handleBeneficiaryDetailsPress }} > diff --git a/ts/features/idpay/onboarding/screens/MultiValuePrerequisitesScreen.tsx b/ts/features/idpay/onboarding/screens/MultiValuePrerequisitesScreen.tsx index 3231a3d0575..61fe2037d25 100644 --- a/ts/features/idpay/onboarding/screens/MultiValuePrerequisitesScreen.tsx +++ b/ts/features/idpay/onboarding/screens/MultiValuePrerequisitesScreen.tsx @@ -8,11 +8,9 @@ import { Body } from "../../../../components/core/typography/Body"; import { H1 } from "../../../../components/core/typography/H1"; import { H4 } from "../../../../components/core/typography/H4"; import { Link } from "../../../../components/core/typography/Link"; -import { IOColors } from "../../../../components/core/variables/IOColors"; import { IOStyles } from "../../../../components/core/variables/IOStyles"; import BaseScreenComponent from "../../../../components/screens/BaseScreenComponent"; import FooterWithButtons from "../../../../components/ui/FooterWithButtons"; -import IconFont from "../../../../components/ui/IconFont"; import { useNavigationSwipeBackListener } from "../../../../hooks/useNavigationSwipeBackListener"; import I18n from "../../../../i18n"; import { useOnboardingMachineService } from "../xstate/provider"; @@ -20,6 +18,7 @@ import { criteriaToDisplaySelector, prerequisiteAnswerIndexSelector } from "../xstate/selectors"; +import { Icon } from "../../../../components/core/icons/Icon"; const styles = StyleSheet.create({ maxheight: { @@ -45,10 +44,10 @@ const CustomListItem = ({ text, onPress, checked }: ListItemProps) => (

{text}

- ); diff --git a/ts/features/messages/components/MessageAttachments.tsx b/ts/features/messages/components/MessageAttachments.tsx index 82eaaf0fa5f..26fa9a3ec2b 100644 --- a/ts/features/messages/components/MessageAttachments.tsx +++ b/ts/features/messages/components/MessageAttachments.tsx @@ -10,7 +10,6 @@ import { Icon } from "../../../components/core/icons"; import { H5 } from "../../../components/core/typography/H5"; import { IOColors } from "../../../components/core/variables/IOColors"; import ItemSeparatorComponent from "../../../components/ItemSeparatorComponent"; -import IconFont from "../../../components/ui/IconFont"; import I18n from "../../../i18n"; import { UIAttachment } from "../../../store/reducers/entities/messages/types"; import { ContentTypeValues } from "../../../types/contentType"; @@ -32,7 +31,7 @@ const styles = StyleSheet.create({ }, row: { flexDirection: "row", - alignItems: "flex-start", + alignItems: "center", justifyContent: "space-between", flex: 1 }, @@ -113,12 +112,7 @@ const AttachmentItem = (props: { testID={"attachmentActivityIndicator"} /> ) : ( - + )} diff --git a/ts/features/pn/components/PnMessageTimelineCTA.tsx b/ts/features/pn/components/PnMessageTimelineCTA.tsx index fc7daf50074..a07f3e2370c 100644 --- a/ts/features/pn/components/PnMessageTimelineCTA.tsx +++ b/ts/features/pn/components/PnMessageTimelineCTA.tsx @@ -1,12 +1,12 @@ import React from "react"; import { View } from "react-native"; import { H5 } from "../../../components/core/typography/H5"; -import { IOColors } from "../../../components/core/variables/IOColors"; import BlockButtons from "../../../components/ui/BlockButtons"; -import IconFont from "../../../components/ui/IconFont"; import i18n from "../../../i18n"; import { mixpanelTrack } from "../../../mixpanel"; import { handleItemOnPress } from "../../../utils/url"; +import { HSpacer } from "../../../components/core/spacer/Spacer"; +import { Icon } from "../../../components/core/icons/Icon"; export const PnMessageTimelineCTA = (props: { url: string }) => ( ( marginBottom: 8 }} > - + +
void; @@ -47,13 +48,9 @@ const BancomatInformation: React.FunctionComponent = props => {

{I18n.t("wallet.bancomat.details.debit.title")}

- + + + diff --git a/ts/features/wallet/bancomatpay/component/BPayCard.tsx b/ts/features/wallet/bancomatpay/component/BPayCard.tsx index f93cdf28ac6..d92e88327bf 100644 --- a/ts/features/wallet/bancomatpay/component/BPayCard.tsx +++ b/ts/features/wallet/bancomatpay/component/BPayCard.tsx @@ -5,13 +5,13 @@ import { View, Image, StyleSheet } from "react-native"; import { connect } from "react-redux"; import bancomatLogoMin from "../../../../../img/wallet/payment-methods/bancomatpay-logo.png"; import { H4 } from "../../../../components/core/typography/H4"; -import IconFont from "../../../../components/ui/IconFont"; import I18n from "../../../../i18n"; import { profileNameSurnameSelector } from "../../../../store/reducers/profile"; import { GlobalState } from "../../../../store/reducers/types"; import { IOStyles } from "../../../../components/core/variables/IOStyles"; import BaseCardComponent from "../../component/card/BaseCardComponent"; import { HSpacer } from "../../../../components/core/spacer/Spacer"; +import { Icon } from "../../../../components/core/icons"; type Props = { phone?: string; @@ -49,7 +49,7 @@ const topLeft = (phone: string) => ( {phone && ( - +

{phone} diff --git a/ts/features/wallet/component/features/PaymentMethodSettings.tsx b/ts/features/wallet/component/features/PaymentMethodSettings.tsx index f81d7657995..6eb977b91f1 100644 --- a/ts/features/wallet/component/features/PaymentMethodSettings.tsx +++ b/ts/features/wallet/component/features/PaymentMethodSettings.tsx @@ -4,14 +4,13 @@ import { connect } from "react-redux"; import { Dispatch } from "redux"; import { HSpacer } from "../../../../components/core/spacer/Spacer"; import { H3 } from "../../../../components/core/typography/H3"; -import { IOColors } from "../../../../components/core/variables/IOColors"; import ItemSeparatorComponent from "../../../../components/ItemSeparatorComponent"; -import IconFont from "../../../../components/ui/IconFont"; import FavoritePaymentMethodSwitch from "../../../../components/wallet/FavoriteMethodSwitch"; import I18n from "../../../../i18n"; import { GlobalState } from "../../../../store/reducers/types"; import { PaymentMethod } from "../../../../types/pagopa"; import { isEnabledToPay } from "../../../../utils/paymentMethodCapabilities"; +import { Icon } from "../../../../components/core/icons/Icon"; import PagoPaPaymentCapability from "./PagoPaPaymentCapability"; type OwnProps = { paymentMethod: PaymentMethod }; @@ -35,13 +34,10 @@ const styles = StyleSheet.create({ const PaymentMethodSettings = (props: Props): React.ReactElement => ( <> - - + + + +

{I18n.t("global.buttons.settings")}

 diff --git a/ts/features/wallet/component/features/PaymentStatusSwitch.tsx b/ts/features/wallet/component/features/PaymentStatusSwitch.tsx index 0b02367a7f7..fcaa10ce41d 100644 --- a/ts/features/wallet/component/features/PaymentStatusSwitch.tsx +++ b/ts/features/wallet/component/features/PaymentStatusSwitch.tsx @@ -7,9 +7,7 @@ import { useEffect, useRef } from "react"; import { connect } from "react-redux"; import { Dispatch } from "redux"; import { RemoteSwitch } from "../../../../components/core/selection/RemoteSwitch"; -import { IOColors } from "../../../../components/core/variables/IOColors"; import { IOStyleVariables } from "../../../../components/core/variables/IOStyleVariables"; -import IconFont from "../../../../components/ui/IconFont"; import I18n from "../../../../i18n"; import { mixpanelTrack } from "../../../../mixpanel"; import { @@ -21,6 +19,7 @@ import { GlobalState } from "../../../../store/reducers/types"; import { getPaymentStatusById } from "../../../../store/reducers/wallet/wallets"; import { PaymentMethod } from "../../../../types/pagopa"; import { showToast } from "../../../../utils/showToast"; +import { Icon } from "../../../../components/core/icons/Icon"; type OwnProps = { paymentMethod: PaymentMethod; @@ -62,7 +61,7 @@ const Fallback = () => { void mixpanelTrack("PAYMENT_STATUS_SWITCH_ID_NOT_IN_WALLET_LIST"); return ( - + ); }; diff --git a/ts/features/wallet/creditCard/component/CreditCardComponent.tsx b/ts/features/wallet/creditCard/component/CreditCardComponent.tsx index 73ca335dd5c..999f35f6351 100644 --- a/ts/features/wallet/creditCard/component/CreditCardComponent.tsx +++ b/ts/features/wallet/creditCard/component/CreditCardComponent.tsx @@ -8,12 +8,10 @@ import { Dispatch } from "redux"; import { Body } from "../../../../components/core/typography/Body"; import { H5 } from "../../../../components/core/typography/H5"; import { IOStyles } from "../../../../components/core/variables/IOStyles"; -import IconFont from "../../../../components/ui/IconFont"; import { getCardIconFromBrandLogo } from "../../../../components/wallet/card/Logo"; import I18n from "../../../../i18n"; import { GlobalState } from "../../../../store/reducers/types"; import { getFavoriteWalletId } from "../../../../store/reducers/wallet/wallets"; -import variables from "../../../../theme/variables"; import { CreditCardPaymentMethod } from "../../../../types/pagopa"; import { TestID } from "../../../../types/WithTestID"; import { isPaymentMethodExpired } from "../../../../utils/paymentMethod"; @@ -22,6 +20,7 @@ import BaseCardComponent from "../../component/card/BaseCardComponent"; import { BlurredPan } from "../../component/card/BlurredPan"; import { BrandImage } from "../../component/card/BrandImage"; import { VSpacer } from "../../../../components/core/spacer/Spacer"; +import { Icon } from "../../../../components/core/icons/Icon"; type OwnProps = { creditCard: CreditCardPaymentMethod; @@ -81,7 +80,7 @@ const topLeft = (

{pot.getOrElse(favorite, false) && ( - + )} ); diff --git a/ts/features/wallet/onboarding/bancomat/components/BankPreviewItem.tsx b/ts/features/wallet/onboarding/bancomat/components/BankPreviewItem.tsx index 72af68c86fd..06bc86224eb 100644 --- a/ts/features/wallet/onboarding/bancomat/components/BankPreviewItem.tsx +++ b/ts/features/wallet/onboarding/bancomat/components/BankPreviewItem.tsx @@ -7,10 +7,9 @@ import { Abi } from "../../../../../../definitions/pagopa/walletv2/Abi"; import ButtonDefaultOpacity from "../../../../../components/ButtonDefaultOpacity"; import { VSpacer } from "../../../../../components/core/spacer/Spacer"; import { LabelSmall } from "../../../../../components/core/typography/LabelSmall"; -import { IOColors } from "../../../../../components/core/variables/IOColors"; -import IconFont from "../../../../../components/ui/IconFont"; import I18n from "../../../../../i18n"; import { useImageResize } from "../screens/hooks/useImageResize"; +import { Icon } from "../../../../../components/core/icons/Icon"; type Props = { // TODO: change bank in info and use a generic type @@ -93,7 +92,7 @@ export const BankPreviewItem: React.FunctionComponent = ( - + ) : ( = (props: Props) => { {isBancomatBlocked(props.pan) ? ( - + {I18n.t("wallet.onboarding.bancomat.add.blocked")} ) : ( diff --git a/ts/features/wallet/onboarding/cobadge/screens/CoBadgeChooseType.tsx b/ts/features/wallet/onboarding/cobadge/screens/CoBadgeChooseType.tsx index ceb32c9c28a..ccdaa8d4cff 100644 --- a/ts/features/wallet/onboarding/cobadge/screens/CoBadgeChooseType.tsx +++ b/ts/features/wallet/onboarding/cobadge/screens/CoBadgeChooseType.tsx @@ -16,11 +16,9 @@ import { H1 } from "../../../../../components/core/typography/H1"; import { H3 } from "../../../../../components/core/typography/H3"; import { H4 } from "../../../../../components/core/typography/H4"; import { H5 } from "../../../../../components/core/typography/H5"; -import { IOColors } from "../../../../../components/core/variables/IOColors"; import { IOStyles } from "../../../../../components/core/variables/IOStyles"; import BaseScreenComponent from "../../../../../components/screens/BaseScreenComponent"; import FooterWithButtons from "../../../../../components/ui/FooterWithButtons"; -import IconFont from "../../../../../components/ui/IconFont"; import I18n from "../../../../../i18n"; import { IOStackNavigationProp } from "../../../../../navigation/params/AppParamsList"; import { @@ -32,6 +30,7 @@ import { emptyContextualHelp } from "../../../../../utils/emptyContextualHelp"; import { cancelButtonProps } from "../../../../bonus/bonusVacanze/components/buttons/ButtonConfigurations"; import { PaymentMethodOnboardingCoBadgeParamsList } from "../navigation/params"; import { walletAddCoBadgeStart } from "../store/actions"; +import { Icon } from "../../../../../components/core/icons/Icon"; type Props = ReturnType & ReturnType & { @@ -84,7 +83,7 @@ const renderListItem = (cardPathItem: ListRenderItemInfo) => ( {cardPathItem.item.title}
- +
= (props: Props) => { {isCoBadgeOrPrivativeBlocked(props.pan) ? ( - + {blockedCard} ) : ( diff --git a/ts/features/wallet/onboarding/paypal/components/PspInfoBottomSheet.tsx b/ts/features/wallet/onboarding/paypal/components/PspInfoBottomSheet.tsx index d4aa7c4a505..a0e51cf5c1a 100644 --- a/ts/features/wallet/onboarding/paypal/components/PspInfoBottomSheet.tsx +++ b/ts/features/wallet/onboarding/paypal/components/PspInfoBottomSheet.tsx @@ -4,15 +4,13 @@ import { View, StyleSheet } from "react-native"; import { NonNegativeNumber } from "@pagopa/ts-commons/lib/numbers"; import { TouchableWithoutFeedback } from "@gorhom/bottom-sheet"; import I18n from "../../../../../i18n"; -import MoneyDownIcon from "../../../../../../img/wallet/payment-methods/paypal/money_down.svg"; -import LabelIcon from "../../../../../../img/wallet/payment-methods/paypal/label.svg"; -import EditIcon from "../../../../../../img/wallet/payment-methods/paypal/edit.svg"; import { formatNumberCentsToAmount } from "../../../../../utils/stringBuilder"; import { Body } from "../../../../../components/core/typography/Body"; import { IOStyles } from "../../../../../components/core/variables/IOStyles"; import { Label } from "../../../../../components/core/typography/Label"; import { Link } from "../../../../../components/core/typography/Link"; import { openWebUrl } from "../../../../../utils/url"; +import { Icon } from "../../../../../components/core/icons/Icon"; const styles = StyleSheet.create({ rowContainer: { @@ -34,7 +32,7 @@ const iconSize = 24; // icon and description const getItem = (props: Props) => [ { - icon: , + icon: , description: ( {I18n.t( @@ -44,7 +42,7 @@ const getItem = (props: Props) => [ ) }, { - icon: , + icon: , description: ( {I18n.t( @@ -60,7 +58,7 @@ const getItem = (props: Props) => [ ) }, { - icon: , + icon: , description: ( - + {bottomSheet} diff --git a/ts/features/wallet/onboarding/paypal/screen/__tests__/__snapshots__/PspRadioItem.test.tsx.snap b/ts/features/wallet/onboarding/paypal/screen/__tests__/__snapshots__/PspRadioItem.test.tsx.snap index 903c09a1953..8dc6b0b3a3c 100644 --- a/ts/features/wallet/onboarding/paypal/screen/__tests__/__snapshots__/PspRadioItem.test.tsx.snap +++ b/ts/features/wallet/onboarding/paypal/screen/__tests__/__snapshots__/PspRadioItem.test.tsx.snap @@ -66,38 +66,73 @@ exports[`PspRadioItem match snapshot 1`] = ` } testID="infoIconTestID" > - -  - + + + + + - + > + + + + - + > + + + + - + > + + + + + = ( /> {isBlocked && ( - + {blockedCard} )} diff --git a/ts/features/wallet/paypal/PaypalCard.tsx b/ts/features/wallet/paypal/PaypalCard.tsx index 7c7389e41e0..582296addd9 100644 --- a/ts/features/wallet/paypal/PaypalCard.tsx +++ b/ts/features/wallet/paypal/PaypalCard.tsx @@ -6,15 +6,14 @@ import paypalLogoMin from "../../../../img/wallet/cards-icons/paypal_card.png"; import paypalLogoExt from "../../../../img/wallet/payment-methods/paypal-logo.png"; import { Body } from "../../../components/core/typography/Body"; import { IOStyles } from "../../../components/core/variables/IOStyles"; -import IconFont from "../../../components/ui/IconFont"; import I18n from "../../../i18n"; import { GlobalState } from "../../../store/reducers/types"; import { getFavoriteWalletId } from "../../../store/reducers/wallet/wallets"; -import variables from "../../../theme/variables"; import { PayPalPaymentMethod } from "../../../types/pagopa"; import { getPaypalAccountEmail } from "../../../utils/paypal"; import BaseCardComponent from "../component/card/BaseCardComponent"; import { BrandImage } from "../component/card/BrandImage"; +import { Icon } from "../../../components/core/icons/Icon"; type Props = { paypal: PayPalPaymentMethod; @@ -46,9 +45,7 @@ const topLeft = (isFavourite: boolean) => ( - {isFavourite && ( - - )} + {isFavourite && } ); diff --git a/ts/features/wallet/paypal/screen/PayPalPspUpdateScreen.tsx b/ts/features/wallet/paypal/screen/PayPalPspUpdateScreen.tsx index 23c206667be..6d9b111dd3f 100644 --- a/ts/features/wallet/paypal/screen/PayPalPspUpdateScreen.tsx +++ b/ts/features/wallet/paypal/screen/PayPalPspUpdateScreen.tsx @@ -19,7 +19,6 @@ import { Label } from "../../../../components/core/typography/Label"; import { IOStyles } from "../../../../components/core/variables/IOStyles"; import BaseScreenComponent from "../../../../components/screens/BaseScreenComponent"; import FooterWithButtons from "../../../../components/ui/FooterWithButtons"; -import IconFont from "../../../../components/ui/IconFont"; import I18n from "../../../../i18n"; import { IOStackNavigationRouteProps } from "../../../../navigation/params/AppParamsList"; import { WalletParamsList } from "../../../../navigation/params/WalletParamsList"; @@ -29,7 +28,6 @@ import { } from "../../../../store/actions/wallet/payment"; import { useIOSelector } from "../../../../store/hooks"; import { pspV2ListSelector } from "../../../../store/reducers/wallet/payment"; -import customVariables from "../../../../theme/variables"; import { emptyContextualHelp } from "../../../../utils/emptyContextualHelp"; import { formatNumberCentsToAmount } from "../../../../utils/stringBuilder"; import { LoadingErrorComponent } from "../../../bonus/bonusVacanze/components/loadingErrorScreen/LoadingErrorComponent"; @@ -41,6 +39,7 @@ import { } from "../../onboarding/paypal/components/PspRadioItem"; import { convertPspData } from "../../onboarding/paypal/store/transformers"; import { IOPayPalPsp } from "../../onboarding/paypal/types"; +import { Icon } from "../../../../components/core/icons/Icon"; const styles = StyleSheet.create({ radioListHeaderRightColumn: { @@ -145,12 +144,9 @@ const PspItem = (props: { psp: IOPayPalPsp; onPress: () => void }) => { - + + + ); diff --git a/ts/features/zendesk/components/ZendeskSupportComponent.tsx b/ts/features/zendesk/components/ZendeskSupportComponent.tsx index 3797c7cce48..8816e0ff9b5 100644 --- a/ts/features/zendesk/components/ZendeskSupportComponent.tsx +++ b/ts/features/zendesk/components/ZendeskSupportComponent.tsx @@ -10,7 +10,6 @@ import { H3 } from "../../../components/core/typography/H3"; import { H4 } from "../../../components/core/typography/H4"; import { Label } from "../../../components/core/typography/Label"; import { Link } from "../../../components/core/typography/Link"; -import { IOColors } from "../../../components/core/variables/IOColors"; import { zendeskPrivacyUrl } from "../../../config"; import I18n from "../../../i18n"; import { mixpanelTrack } from "../../../mixpanel"; @@ -85,7 +84,7 @@ const ZendeskSupportComponent = ({
- + diff --git a/ts/features/zendesk/screens/ZendeskAskPermissions.tsx b/ts/features/zendesk/screens/ZendeskAskPermissions.tsx index 139414c05d6..0d44b0cc2eb 100644 --- a/ts/features/zendesk/screens/ZendeskAskPermissions.tsx +++ b/ts/features/zendesk/screens/ZendeskAskPermissions.tsx @@ -3,17 +3,6 @@ import { constNull, pipe } from "fp-ts/lib/function"; import * as O from "fp-ts/lib/Option"; import React, { useEffect } from "react"; import { SafeAreaView, ScrollView, View } from "react-native"; -import BatteryIcon from "../../../../img/assistance/battery.svg"; -import CardIcon from "../../../../img/assistance/card.svg"; -import EmailIcon from "../../../../img/assistance/email.svg"; -import GalleryIcon from "../../../../img/assistance/gallery.svg"; -import StockIcon from "../../../../img/assistance/giacenza.svg"; -import HistoryIcon from "../../../../img/assistance/history.svg"; -import InfoIcon from "../../../../img/assistance/info.svg"; -import LoginIcon from "../../../../img/assistance/login.svg"; -import NameSurnameIcon from "../../../../img/assistance/nameSurname.svg"; -import DeviceIcon from "../../../../img/assistance/telefonia.svg"; -import WebSiteIcon from "../../../../img/assistance/website.svg"; import { VSpacer } from "../../../components/core/spacer/Spacer"; import { H1 } from "../../../components/core/typography/H1"; import { H3 } from "../../../components/core/typography/H3"; @@ -73,6 +62,8 @@ import { zendeskSelectedCategorySelector, zendeskSelectedSubcategorySelector } from "../store/reducers"; +import { Icon } from "../../../components/core/icons/Icon"; +import { IOColors } from "../../../components/core/variables/IOColors"; /** * Transform an array of string into a Zendesk @@ -88,92 +79,92 @@ type ItemProps = { identityProvider: string; }; -const iconProps = { width: 24, height: 24 }; +const iconStyleProps = { size: 24, color: "blue" as IOColors }; const getItems = (props: ItemProps): ReadonlyArray => [ { id: "profileNameSurname", - icon: , + icon: , title: I18n.t("support.askPermissions.nameSurname"), value: props.nameSurname, testId: "profileNameSurname" }, { id: "profileFiscalCode", - icon: , + icon: , title: I18n.t("support.askPermissions.fiscalCode"), value: props.fiscalCode, testId: "profileFiscalCode" }, { id: "profileEmail", - icon: , + icon: , title: I18n.t("support.askPermissions.emailAddress"), value: props.email, testId: "profileEmail" }, { id: "galleryProminentDisclosure", - icon: , + icon: , title: I18n.t("support.askPermissions.prominentDisclosure"), value: I18n.t("support.askPermissions.prominentDisclosureData"), testId: "galleryProminentDisclosure" }, { id: "paymentIssues", - icon: , + icon: , title: I18n.t("support.askPermissions.stock"), value: I18n.t("support.askPermissions.stockValue"), testId: "paymentIssues" }, { id: "addCardIssues", - icon: , + icon: , title: I18n.t("support.askPermissions.card"), value: I18n.t("support.askPermissions.cardValue"), testId: "addCardIssues" }, { id: "addFciIssues", - icon: , + icon: , title: I18n.t("support.askPermissions.fci"), value: I18n.t("support.askPermissions.fciValue"), testId: "addFciIssues" }, { - icon: , + icon: , title: I18n.t("support.askPermissions.deviceAndOS"), value: props.deviceDescription, zendeskId: zendeskDeviceAndOSId, testId: "deviceAndOS" }, { - icon: , + icon: , title: I18n.t("support.askPermissions.devicePerformance"), value: I18n.t("support.askPermissions.devicePerformanceData"), testId: "devicePerformance" }, { - icon: , + icon: , title: I18n.t("support.askPermissions.ipAddress"), value: I18n.t("support.askPermissions.ipAddressValue"), testId: "ipAddress" }, { - icon: , + icon: , title: I18n.t("support.askPermissions.appVersionsHistory"), value: I18n.t("support.askPermissions.appVersionsHistoryValue"), testId: "appVersionsHistory" }, { - icon: , + icon: , title: I18n.t("support.askPermissions.identityProvider"), value: props.identityProvider, zendeskId: zendeskidentityProviderId, testId: "identityProvider" }, { - icon: , + icon: , title: I18n.t("support.askPermissions.navigationData"), value: I18n.t("support.askPermissions.navigationDataValue"), testId: "navigationData" @@ -361,11 +352,6 @@ const ZendeskAskPermissions = () => { diff --git a/ts/features/zendesk/screens/ZendeskAskSeeReportsPermissions.tsx b/ts/features/zendesk/screens/ZendeskAskSeeReportsPermissions.tsx index 046b7e13b0c..6b5bf58b7da 100644 --- a/ts/features/zendesk/screens/ZendeskAskSeeReportsPermissions.tsx +++ b/ts/features/zendesk/screens/ZendeskAskSeeReportsPermissions.tsx @@ -1,11 +1,8 @@ import { useNavigation } from "@react-navigation/native"; -import { constNull, pipe } from "fp-ts/lib/function"; +import { pipe } from "fp-ts/lib/function"; import * as O from "fp-ts/lib/Option"; import React from "react"; import { SafeAreaView, ScrollView, View } from "react-native"; -import CardIcon from "../../../../img/assistance/card.svg"; -import EmailIcon from "../../../../img/assistance/email.svg"; -import NameSurnameIcon from "../../../../img/assistance/nameSurname.svg"; import { VSpacer } from "../../../components/core/spacer/Spacer"; import { H1 } from "../../../components/core/typography/H1"; import { H3 } from "../../../components/core/typography/H3"; @@ -33,6 +30,8 @@ import ZendeskItemPermissionComponent, { ItemPermissionProps } from "../components/ZendeskItemPermissionComponent"; import { ZendeskParamsList } from "../navigation/params"; +import { Icon } from "../../../components/core/icons/Icon"; +import { IOColors } from "../../../components/core/variables/IOColors"; export type ZendeskAskSeeReportsPermissionsNavigationParams = { assistanceForPayment: boolean; @@ -46,26 +45,26 @@ type ItemProps = { email?: string; }; -const iconProps = { width: 24, height: 24 }; +const iconStyleProps = { size: 24, color: "blue" as IOColors }; const getItems = (props: ItemProps): ReadonlyArray => [ { id: "profileNameSurname", - icon: , + icon: , title: I18n.t("support.askPermissions.nameSurname"), value: props.nameSurname, testId: "profileNameSurname" }, { id: "profileFiscalCode", - icon: , + icon: , title: I18n.t("support.askPermissions.fiscalCode"), value: props.fiscalCode, testId: "profileFiscalCode" }, { id: "profileEmail", - icon: , + icon: , title: I18n.t("support.askPermissions.emailAddress"), value: props.email, testId: "profileEmail" @@ -121,11 +120,6 @@ const ZendeskAskSeeReportsPermissions = (props: Props) => { diff --git a/ts/features/zendesk/screens/ZendeskChooseCategory.tsx b/ts/features/zendesk/screens/ZendeskChooseCategory.tsx index a71d785f428..41734cce784 100644 --- a/ts/features/zendesk/screens/ZendeskChooseCategory.tsx +++ b/ts/features/zendesk/screens/ZendeskChooseCategory.tsx @@ -14,12 +14,10 @@ import { H1 } from "../../../components/core/typography/H1"; import { H4 } from "../../../components/core/typography/H4"; import { IOStyles } from "../../../components/core/variables/IOStyles"; import BaseScreenComponent from "../../../components/screens/BaseScreenComponent"; -import IconFont from "../../../components/ui/IconFont"; import I18n from "../../../i18n"; import { IOStackNavigationRouteProps } from "../../../navigation/params/AppParamsList"; import { toArray } from "../../../store/helpers/indexer"; import { useIOSelector } from "../../../store/hooks"; -import customVariables from "../../../theme/variables"; import { getFullLocale } from "../../../utils/locale"; import { addTicketCustomField, @@ -33,6 +31,7 @@ import { zendeskSupportFailure } from "../store/actions"; import { zendeskConfigSelector } from "../store/reducers"; +import { Icon } from "../../../components/core/icons/Icon"; export type ZendeskChooseCategoryNavigationParams = { assistanceForPayment: boolean; @@ -124,11 +123,7 @@ const ZendeskChooseCategory = (props: Props) => { {category.description[locale]}

- + @@ -140,10 +135,6 @@ const ZendeskChooseCategory = (props: Props) => { true - }} headerTitle={I18n.t("support.chooseCategory.header")} > diff --git a/ts/features/zendesk/screens/ZendeskChooseSubCategory.tsx b/ts/features/zendesk/screens/ZendeskChooseSubCategory.tsx index 9035b16f153..68dbb88fbd4 100644 --- a/ts/features/zendesk/screens/ZendeskChooseSubCategory.tsx +++ b/ts/features/zendesk/screens/ZendeskChooseSubCategory.tsx @@ -14,11 +14,9 @@ import { H1 } from "../../../components/core/typography/H1"; import { H4 } from "../../../components/core/typography/H4"; import { IOStyles } from "../../../components/core/variables/IOStyles"; import BaseScreenComponent from "../../../components/screens/BaseScreenComponent"; -import IconFont from "../../../components/ui/IconFont"; import I18n from "../../../i18n"; import { IOStackNavigationRouteProps } from "../../../navigation/params/AppParamsList"; import { useIOSelector } from "../../../store/hooks"; -import customVariables from "../../../theme/variables"; import { getFullLocale } from "../../../utils/locale"; import { addTicketCustomField, @@ -30,6 +28,7 @@ import { zendeskSupportFailure } from "../store/actions"; import { zendeskSelectedCategorySelector } from "../store/reducers"; +import { Icon } from "../../../components/core/icons/Icon"; export type ZendeskChooseSubCategoryNavigationParams = { assistanceForPayment: boolean; @@ -112,26 +111,17 @@ const ZendeskChooseSubCategory = (props: Props) => { {subCategory.description[locale]}

- + ); }; - // The void customRightIcon is needed to have a centered header title return ( true - }} headerTitle={selectedCategory.description[locale]} > diff --git a/ts/features/zendesk/screens/ZendeskSupportHelpCenter.tsx b/ts/features/zendesk/screens/ZendeskSupportHelpCenter.tsx index 5cd2c70abcb..498f6733ce9 100644 --- a/ts/features/zendesk/screens/ZendeskSupportHelpCenter.tsx +++ b/ts/features/zendesk/screens/ZendeskSupportHelpCenter.tsx @@ -209,7 +209,7 @@ const ZendeskSupportHelpCenter = () => { showChat={false} customGoBack={} customRightIcon={{ - iconName: "io-close", + iconName: "legClose", onPress: workUnitCancel, accessibilityLabel: I18n.t("global.accessibility.contextualHelp.close") }} diff --git a/ts/screens/authentication/LandingScreen.tsx b/ts/screens/authentication/LandingScreen.tsx index 2e204015c92..9435d124f82 100644 --- a/ts/screens/authentication/LandingScreen.tsx +++ b/ts/screens/authentication/LandingScreen.tsx @@ -15,7 +15,7 @@ import sessionExpiredImg from "../../../img/landing/session_expired.png"; import ButtonDefaultOpacity from "../../components/ButtonDefaultOpacity"; import CieNotSupported from "../../components/cie/CieNotSupported"; import ContextualInfo from "../../components/ContextualInfo"; -import { VSpacer } from "../../components/core/spacer/Spacer"; +import { HSpacer, VSpacer } from "../../components/core/spacer/Spacer"; import { Link } from "../../components/core/typography/Link"; import { IOColors } from "../../components/core/variables/IOColors"; import { IOStyles } from "../../components/core/variables/IOStyles"; @@ -30,7 +30,6 @@ import BaseScreenComponent, { ContextualHelpPropsMarkdown } from "../../components/screens/BaseScreenComponent"; import SectionStatusComponent from "../../components/SectionStatus"; -import IconFont from "../../components/ui/IconFont"; import { LightModalContextInterface } from "../../components/ui/LightModal"; import I18n from "../../i18n"; import { mixpanelTrack } from "../../mixpanel"; @@ -57,6 +56,7 @@ import variables from "../../theme/variables"; import { ComponentProps } from "../../types/react"; import { isDevEnv } from "../../utils/environment"; import RootedDeviceModal from "../modal/RootedDeviceModal"; +import { Icon } from "../../components/core/icons"; import { SpidIdp } from "../../../definitions/content/SpidIdp"; type NavigationProps = IOStackNavigationRouteProps; @@ -301,10 +301,8 @@ class LandingScreen extends React.PureComponent { : "landing-button-login-spid" } > - + + {isCieSupported ? I18n.t("authentication.landing.loginCie") @@ -335,10 +333,11 @@ class LandingScreen extends React.PureComponent { : "landing-button-login-cie" } > - + {this.isCieSupported() ? I18n.t("authentication.landing.loginSpid") diff --git a/ts/screens/ingress/CheckBox.tsx b/ts/screens/ingress/CheckBox.tsx index 49920520d97..817f34668bd 100644 --- a/ts/screens/ingress/CheckBox.tsx +++ b/ts/screens/ingress/CheckBox.tsx @@ -1,14 +1,13 @@ import * as React from "react"; import { StyleSheet, View } from "react-native"; -import IconFont from "../../components/ui/IconFont"; import { IOColors, hexToRgba } from "../../components/core/variables/IOColors"; +import { Icon } from "../../components/core/icons"; type Props = { checked: boolean; }; const checkBoxColor = hexToRgba(IOColors.white, 0.15); -const checkBoxIcon = "io-tick-big"; const styles = StyleSheet.create({ base: { @@ -29,11 +28,7 @@ const styles = StyleSheet.create({ export const IngressCheckBox = (props: Props) => ( {props.checked && ( - + )} ); diff --git a/ts/screens/onboarding/OnboardingNotificationsPreferencesScreen.tsx b/ts/screens/onboarding/OnboardingNotificationsPreferencesScreen.tsx index d52cf81a1ee..b6b13ed631f 100644 --- a/ts/screens/onboarding/OnboardingNotificationsPreferencesScreen.tsx +++ b/ts/screens/onboarding/OnboardingNotificationsPreferencesScreen.tsx @@ -228,7 +228,7 @@ const OnboardingNotificationsPreferencesScreen = (props: Props) => { } /> - +
{I18n.t( "profile.main.privacy.shareData.screen.profileSettings" diff --git a/ts/screens/onboarding/OnboardingServicesPreferenceScreen.tsx b/ts/screens/onboarding/OnboardingServicesPreferenceScreen.tsx index 989f4c9b4f7..67177d90dc7 100644 --- a/ts/screens/onboarding/OnboardingServicesPreferenceScreen.tsx +++ b/ts/screens/onboarding/OnboardingServicesPreferenceScreen.tsx @@ -6,7 +6,6 @@ import { ServicesPreferencesModeEnum } from "../../../definitions/backend/Servic import { InfoBox } from "../../components/box/InfoBox"; import { VSpacer } from "../../components/core/spacer/Spacer"; import { H5 } from "../../components/core/typography/H5"; -import { IOColors } from "../../components/core/variables/IOColors"; import { IOStyles } from "../../components/core/variables/IOStyles"; import { withLoadingSpinner } from "../../components/helpers/withLoadingSpinner"; import BaseScreenComponent from "../../components/screens/BaseScreenComponent"; @@ -109,7 +108,7 @@ const OnboardingServicesPreferenceScreen = ( onSelectMode={handleOnSelectMode} showBadge={showBadge} /> - +
{I18n.t("profile.main.privacy.shareData.screen.profileSettings")}
diff --git a/ts/screens/onboarding/OnboardingShareDataScreen.tsx b/ts/screens/onboarding/OnboardingShareDataScreen.tsx index adc82aeb837..437b2bc5de2 100644 --- a/ts/screens/onboarding/OnboardingShareDataScreen.tsx +++ b/ts/screens/onboarding/OnboardingShareDataScreen.tsx @@ -61,7 +61,7 @@ const OnboardingShareDataScreen = (props: Props): React.ReactElement => { - + diff --git a/ts/screens/profile/CgnLandingPlayground.tsx b/ts/screens/profile/CgnLandingPlayground.tsx index 810b66831b5..e0abf3328cd 100644 --- a/ts/screens/profile/CgnLandingPlayground.tsx +++ b/ts/screens/profile/CgnLandingPlayground.tsx @@ -4,12 +4,12 @@ import { View, SafeAreaView, StyleSheet, TextInput } from "react-native"; import { Label } from "../../components/core/typography/Label"; import BaseScreenComponent from "../../components/screens/BaseScreenComponent"; import ButtonDefaultOpacity from "../../components/ButtonDefaultOpacity"; -import IconFont from "../../components/ui/IconFont"; import { IOStyles } from "../../components/core/variables/IOStyles"; import { H5 } from "../../components/core/typography/H5"; import WebviewComponent from "../../components/WebviewComponent"; import { IOColors } from "../../components/core/variables/IOColors"; import { VSpacer } from "../../components/core/spacer/Spacer"; +import { Icon } from "../../components/core/icons/Icon"; const styles = StyleSheet.create({ textInput: { padding: 1, borderWidth: 1, height: 30, color: IOColors.black }, @@ -63,12 +63,7 @@ const CgnLandingPlayground = () => { setLoadUri(navigationURI); }} > - + diff --git a/ts/screens/profile/EmailForwardingScreen.tsx b/ts/screens/profile/EmailForwardingScreen.tsx index 0cd5ce1d0cf..bd15ebd624f 100644 --- a/ts/screens/profile/EmailForwardingScreen.tsx +++ b/ts/screens/profile/EmailForwardingScreen.tsx @@ -67,7 +67,7 @@ function renderListItem( & { navigation: IOStackNavigationProp; @@ -102,7 +102,7 @@ const FiscalCodeScreen: React.FunctionComponent = (props: Props) => { accessibilityLabel={I18n.t("global.buttons.back")} accessibilityRole={"button"} > - + ); diff --git a/ts/screens/profile/LanguagesPreferencesScreen.tsx b/ts/screens/profile/LanguagesPreferencesScreen.tsx index 241f80462f4..108050cfe31 100644 --- a/ts/screens/profile/LanguagesPreferencesScreen.tsx +++ b/ts/screens/profile/LanguagesPreferencesScreen.tsx @@ -146,7 +146,7 @@ class LanguagesPreferencesScreen extends React.PureComponent { title={languageTitle} hideIcon={!isSelectedLanguage} iconSize={iconSize} - iconName={isSelectedLanguage ? "io-tick-big" : undefined} + iconName={isSelectedLanguage ? "legCompleted" : undefined} onPress={() => this.onLanguageSelected(lang)} accessible={true} accessibilityRole={"radio"} diff --git a/ts/screens/profile/WebPlayground.tsx b/ts/screens/profile/WebPlayground.tsx index 0de1d3a11da..20363b583be 100644 --- a/ts/screens/profile/WebPlayground.tsx +++ b/ts/screens/profile/WebPlayground.tsx @@ -12,11 +12,10 @@ import RegionServiceWebView from "../../components/RegionServiceWebView"; import { Dispatch } from "../../store/actions/types"; import { navigateBack } from "../../store/actions/navigation"; import ButtonDefaultOpacity from "../../components/ButtonDefaultOpacity"; -import IconFont from "../../components/ui/IconFont"; import { LabelledItem } from "../../components/LabelledItem"; import { showToast } from "../../utils/showToast"; -import { IOColors } from "../../components/core/variables/IOColors"; import { HSpacer, VSpacer } from "../../components/core/spacer/Spacer"; +import { Icon } from "../../components/core/icons/Icon"; type Props = ReturnType; @@ -87,12 +86,7 @@ const WebPlayground: React.FunctionComponent = (props: Props) => { style={styles.contentCenter} onPress={() => setLoadUri(navigationURI)} > - + diff --git a/ts/screens/profile/components/ShareDataComponent.tsx b/ts/screens/profile/components/ShareDataComponent.tsx index ba73664c581..7b47f4f9bc0 100644 --- a/ts/screens/profile/components/ShareDataComponent.tsx +++ b/ts/screens/profile/components/ShareDataComponent.tsx @@ -40,7 +40,7 @@ export const ShareDataComponent = (): React.ReactElement => { {I18n.t("profile.main.privacy.shareData.screen.description")} - + {I18n.t("profile.main.privacy.shareData.screen.why.description.one")} - + {`${I18n.t( "profile.main.privacy.shareData.screen.security.description.one" @@ -71,7 +71,7 @@ export const ShareDataComponent = (): React.ReactElement => { - + {I18n.t("profile.main.privacy.shareData.screen.gdpr.description.one")}
- + + + diff --git a/ts/screens/profile/playgrounds/MarkdownPlayground.tsx b/ts/screens/profile/playgrounds/MarkdownPlayground.tsx index 4243d1eebce..c78b0efbabb 100644 --- a/ts/screens/profile/playgrounds/MarkdownPlayground.tsx +++ b/ts/screens/profile/playgrounds/MarkdownPlayground.tsx @@ -8,10 +8,8 @@ import { MessageBodyMarkdown } from "../../../../definitions/backend/MessageBody import ButtonDefaultOpacity from "../../../components/ButtonDefaultOpacity"; import { HSpacer, VSpacer } from "../../../components/core/spacer/Spacer"; import { Label } from "../../../components/core/typography/Label"; -import { IOColors } from "../../../components/core/variables/IOColors"; import { ExtractedCtaButton } from "../../../components/cta/ExtractedCtaButton"; import BaseScreenComponent from "../../../components/screens/BaseScreenComponent"; -import IconFont from "../../../components/ui/IconFont"; import Markdown from "../../../components/ui/Markdown"; import { CTA } from "../../../types/MessageCTA"; import { @@ -20,6 +18,7 @@ import { handleCtaAction } from "../../../utils/messages"; import { maybeNotNullyString } from "../../../utils/strings"; +import { Icon } from "../../../components/core/icons/Icon"; const styles = StyleSheet.create({ flex: { flex: 1 }, @@ -70,12 +69,7 @@ const MarkdownPlayground = () => { style={styles.contentCenter} onPress={() => setMarkdownText(inputText)} > - + diff --git a/ts/screens/services/ServicesHomeScreen.tsx b/ts/screens/services/ServicesHomeScreen.tsx index 5d336884ee0..b14620c0b0d 100644 --- a/ts/screens/services/ServicesHomeScreen.tsx +++ b/ts/screens/services/ServicesHomeScreen.tsx @@ -51,7 +51,6 @@ import SectionStatusComponent from "../../components/SectionStatus"; import ServicesSearch from "../../components/services/ServicesSearch"; import TouchableDefaultOpacity from "../../components/TouchableDefaultOpacity"; import FocusAwareStatusBar from "../../components/ui/FocusAwareStatusBar"; -import IconFont from "../../components/ui/IconFont"; import { LightModalContextInterface } from "../../components/ui/LightModal"; import I18n from "../../i18n"; import { @@ -102,6 +101,7 @@ import { getProfileChannelsforServicesList } from "../../utils/profile"; import { showToast } from "../../utils/showToast"; +import { Icon } from "../../components/core/icons"; import { ServiceDetailsScreenNavigationParams } from "./ServiceDetailsScreen"; type OwnProps = IOStackNavigationRouteProps; @@ -336,7 +336,7 @@ class ServicesHomeScreen extends React.Component { accessibilityLabel={I18n.t("services.accessibility.edit")} onPress={this.props.navigateToServicePreference} > - + diff --git a/ts/screens/wallet/ConfirmCardDetailsScreen.tsx b/ts/screens/wallet/ConfirmCardDetailsScreen.tsx index 3d558c73b1a..3af336329e0 100644 --- a/ts/screens/wallet/ConfirmCardDetailsScreen.tsx +++ b/ts/screens/wallet/ConfirmCardDetailsScreen.tsx @@ -19,7 +19,6 @@ import { HSpacer, VSpacer } from "../../components/core/spacer/Spacer"; import { H1 } from "../../components/core/typography/H1"; import { H4 } from "../../components/core/typography/H4"; import { H5 } from "../../components/core/typography/H5"; -import { IOColors } from "../../components/core/variables/IOColors"; import { IOStyles } from "../../components/core/variables/IOStyles"; import { withLoadingSpinner } from "../../components/helpers/withLoadingSpinner"; import { renderInfoRasterImage } from "../../components/infoScreen/imageRendering"; @@ -272,11 +271,7 @@ class ConfirmCardDetailsScreen extends React.Component { hideFavoriteIcon={true} /> - +
{I18n.t("wallet.saveCard.notice")}
 diff --git a/ts/screens/wallet/PaymentHistoryDetailsScreen.tsx b/ts/screens/wallet/PaymentHistoryDetailsScreen.tsx index ccca0d97ff8..4d4422020bb 100644 --- a/ts/screens/wallet/PaymentHistoryDetailsScreen.tsx +++ b/ts/screens/wallet/PaymentHistoryDetailsScreen.tsx @@ -10,13 +10,12 @@ import { ToolEnum } from "../../../definitions/content/AssistanceToolConfig"; import { ZendeskCategory } from "../../../definitions/content/ZendeskCategory"; import ButtonDefaultOpacity from "../../components/ButtonDefaultOpacity"; import CopyButtonComponent from "../../components/CopyButtonComponent"; -import { VSpacer } from "../../components/core/spacer/Spacer"; +import { HSpacer, VSpacer } from "../../components/core/spacer/Spacer"; import { Body } from "../../components/core/typography/Body"; import { Label } from "../../components/core/typography/Label"; import { IOStyles } from "../../components/core/variables/IOStyles"; import ItemSeparatorComponent from "../../components/ItemSeparatorComponent"; import BaseScreenComponent from "../../components/screens/BaseScreenComponent"; -import IconFont from "../../components/ui/IconFont"; import { getPaymentHistoryInfo } from "../../components/wallet/PaymentsHistoryList"; import { paymentStatusType, @@ -62,6 +61,7 @@ import { zendeskPaymentStartOrigin } from "../../utils/supportAssistance"; import { H2 } from "../../components/core/typography/H2"; +import { Icon } from "../../components/core/icons/Icon"; export type PaymentHistoryDetailsScreenNavigationParams = Readonly<{ payment: PaymentHistory; @@ -283,7 +283,8 @@ class PaymentHistoryDetailsScreen extends React.Component { bordered={true} block={true} > - + + {I18n.t("payment.details.info.buttons.help")} diff --git a/ts/screens/wallet/WalletHomeScreen.tsx b/ts/screens/wallet/WalletHomeScreen.tsx index ad6276ff614..6413ea3e474 100644 --- a/ts/screens/wallet/WalletHomeScreen.tsx +++ b/ts/screens/wallet/WalletHomeScreen.tsx @@ -13,7 +13,7 @@ import { connect } from "react-redux"; import { BonusActivationWithQrCode } from "../../../definitions/bonus_vacanze/BonusActivationWithQrCode"; import { TypeEnum } from "../../../definitions/pagopa/Wallet"; import ButtonDefaultOpacity from "../../components/ButtonDefaultOpacity"; -import { VSpacer } from "../../components/core/spacer/Spacer"; +import { HSpacer, VSpacer } from "../../components/core/spacer/Spacer"; import { Body } from "../../components/core/typography/Body"; import { H3 } from "../../components/core/typography/H3"; import { IOColors } from "../../components/core/variables/IOColors"; @@ -28,7 +28,6 @@ import { ContextualHelpPropsMarkdown } from "../../components/screens/BaseScreen import { EdgeBorderComponent } from "../../components/screens/EdgeBorderComponent"; import { ScreenContentRoot } from "../../components/screens/ScreenContent"; import SectionStatusComponent from "../../components/SectionStatus"; -import IconFont from "../../components/ui/IconFont"; import { LightModalContextInterface } from "../../components/ui/LightModal"; import SectionCardComponent, { SectionCardStatus @@ -107,6 +106,8 @@ import customVariables from "../../theme/variables"; import { Transaction, Wallet } from "../../types/pagopa"; import { isStrictSome } from "../../utils/pot"; import { showToast } from "../../utils/showToast"; +import { Icon } from "../../components/core/icons"; +import { IOStyles } from "../../components/core/variables/IOStyles"; export type WalletHomeNavigationParams = Readonly<{ newMethodAdded: boolean; @@ -124,12 +125,6 @@ type Props = ReturnType & TabBarItemPressType; const styles = StyleSheet.create({ - white: { - color: IOColors.white - }, - flex1: { - flex: 1 - }, emptyListWrapper: { padding: customVariables.contentPadding, alignItems: "center" @@ -417,7 +412,7 @@ class WalletHomeScreen extends React.PureComponent { return ( {renderHelp && this.renderHelpMessage()} @@ -496,8 +491,8 @@ class WalletHomeScreen extends React.PureComponent { } activeOpacity={1} > - - {/* ButtonText */} + + {I18n.t("wallet.payNotice")} ); diff --git a/ts/screens/wallet/creditCardOnboardingAttempts/CreditCardOnboardingAttemptDetailScreen.tsx b/ts/screens/wallet/creditCardOnboardingAttempts/CreditCardOnboardingAttemptDetailScreen.tsx index afd36a9263f..4b2b4037ab3 100644 --- a/ts/screens/wallet/creditCardOnboardingAttempts/CreditCardOnboardingAttemptDetailScreen.tsx +++ b/ts/screens/wallet/creditCardOnboardingAttempts/CreditCardOnboardingAttemptDetailScreen.tsx @@ -5,7 +5,7 @@ import { View, StyleSheet } from "react-native"; import { useDispatch } from "react-redux"; import { ToolEnum } from "../../../../definitions/content/AssistanceToolConfig"; import ButtonDefaultOpacity from "../../../components/ButtonDefaultOpacity"; -import { VSpacer } from "../../../components/core/spacer/Spacer"; +import { HSpacer, VSpacer } from "../../../components/core/spacer/Spacer"; import { Body } from "../../../components/core/typography/Body"; import { H3 } from "../../../components/core/typography/H3"; import { Label } from "../../../components/core/typography/Label"; @@ -13,7 +13,6 @@ import { IOStyles } from "../../../components/core/variables/IOStyles"; import ItemSeparatorComponent from "../../../components/ItemSeparatorComponent"; import { BadgeComponent } from "../../../components/screens/BadgeComponent"; import BaseScreenComponent from "../../../components/screens/BaseScreenComponent"; -import IconFont from "../../../components/ui/IconFont"; import { getPanDescription } from "../../../components/wallet/creditCardOnboardingAttempts/CreditCardAttemptsList"; import { SlidedContentComponent } from "../../../components/wallet/SlidedContentComponent"; import { @@ -39,6 +38,7 @@ import { zendeskCategoryId, zendeskPaymentMethodCategory } from "../../../utils/supportAssistance"; +import { Icon } from "../../../components/core/icons/Icon"; export type CreditCardOnboardingAttemptDetailScreenNavigationParams = Readonly<{ attempt: CreditCardInsertion; @@ -131,7 +131,8 @@ const CreditCardOnboardingAttemptDetailScreen = (props: Props) => { bordered={true} block={true} > - + + {I18n.t("payment.details.info.buttons.help")} diff --git a/ts/screens/wallet/payment/CodesPositionManualPaymentModal.tsx b/ts/screens/wallet/payment/CodesPositionManualPaymentModal.tsx index 8e657d49a61..aeb0746860e 100644 --- a/ts/screens/wallet/payment/CodesPositionManualPaymentModal.tsx +++ b/ts/screens/wallet/payment/CodesPositionManualPaymentModal.tsx @@ -10,8 +10,8 @@ import { import ImageZoom from "react-native-image-pan-zoom"; import ButtonDefaultOpacity from "../../../components/ButtonDefaultOpacity"; +import { Icon } from "../../../components/core/icons/Icon"; import AppHeader from "./../../../components/ui/AppHeader"; -import IconFont from "./../../../components/ui/IconFont"; type Props = { onCancel: () => void; @@ -63,7 +63,7 @@ class CodesPositionManualPaymentModal extends React.PureComponent { onPress={this.props.onCancel} transparent={true} > - + diff --git a/ts/screens/wallet/payment/ConfirmPaymentMethodScreen.tsx b/ts/screens/wallet/payment/ConfirmPaymentMethodScreen.tsx index 9f534c893f8..d6cef33219d 100644 --- a/ts/screens/wallet/payment/ConfirmPaymentMethodScreen.tsx +++ b/ts/screens/wallet/payment/ConfirmPaymentMethodScreen.tsx @@ -12,7 +12,7 @@ import CardIcon from "../../../../img/wallet/card.svg"; import BancomatPayLogo from "../../../../img/wallet/payment-methods/bancomat_pay.svg"; import PaypalLogo from "../../../../img/wallet/payment-methods/paypal/paypal_logo.svg"; import TagIcon from "../../../../img/wallet/tag.svg"; -import { VSpacer } from "../../../components/core/spacer/Spacer"; +import { HSpacer, VSpacer } from "../../../components/core/spacer/Spacer"; import { H1 } from "../../../components/core/typography/H1"; import { H3 } from "../../../components/core/typography/H3"; import { H4 } from "../../../components/core/typography/H4"; @@ -25,7 +25,6 @@ import BaseScreenComponent, { ContextualHelpPropsMarkdown } from "../../../components/screens/BaseScreenComponent"; import FooterWithButtons from "../../../components/ui/FooterWithButtons"; -import IconFont from "../../../components/ui/IconFont"; import { LightModalContextInterface } from "../../../components/ui/LightModal"; import { getCardIconFromBrandLogo } from "../../../components/wallet/card/Logo"; import { PayWebViewModal } from "../../../components/wallet/PayWebViewModal"; @@ -92,6 +91,7 @@ import { getLookUpIdPO } from "../../../utils/pmLookUpId"; import { showToast } from "../../../utils/showToast"; import { formatNumberCentsToAmount } from "../../../utils/stringBuilder"; import { openWebUrl } from "../../../utils/url"; +import { Icon } from "../../../components/core/icons/Icon"; // temporary feature flag since this feature is still WIP // (missing task to complete https://pagopa.atlassian.net/browse/IA-684?filter=10121) @@ -129,8 +129,6 @@ const styles = StyleSheet.create({ alignItems: "center" }, - iconRowText: { marginLeft: 8 }, - flex: { flex: 1 } }); @@ -405,19 +403,9 @@ const ConfirmPaymentMethodScreen: React.FC = (props: Props) => { - - -

+ + +

{I18n.t("wallet.ConfirmPayment.paymentInformations")}

@@ -441,12 +429,8 @@ const ConfirmPaymentMethodScreen: React.FC = (props: Props) => { - -

+ +

{I18n.t("wallet.ConfirmPayment.payWith")}

@@ -468,12 +452,8 @@ const ConfirmPaymentMethodScreen: React.FC = (props: Props) => { - -

+ +

{I18n.t("wallet.ConfirmPayment.transactionCosts")}

diff --git a/ts/screens/wallet/payment/components/TransactionSummary.tsx b/ts/screens/wallet/payment/components/TransactionSummary.tsx index 07323c08cb0..7ed4f7791e9 100644 --- a/ts/screens/wallet/payment/components/TransactionSummary.tsx +++ b/ts/screens/wallet/payment/components/TransactionSummary.tsx @@ -12,7 +12,6 @@ import { Body } from "../../../../components/core/typography/Body"; import { H4 } from "../../../../components/core/typography/H4"; import { IOColors } from "../../../../components/core/variables/IOColors"; import TouchableDefaultOpacity from "../../../../components/TouchableDefaultOpacity"; -import IconFont from "../../../../components/ui/IconFont"; import { MultiImage } from "../../../../components/ui/MultiImage"; import I18n from "../../../../i18n"; import { PaymentState } from "../../../../store/reducers/wallet/payment"; @@ -26,6 +25,7 @@ import { } from "../../../../utils/stringBuilder"; import { usePaymentAmountInfoBottomSheet } from "../hooks/usePaymentAmountInfoBottomSheet"; import { getRecepientName } from "../../../../utils/strings"; +import { Icon } from "../../../../components/core/icons/Icon"; const styles = StyleSheet.create({ row: { @@ -91,7 +91,7 @@ const InfoButton = (props: { onPress: () => void }) => ( )} accessibilityRole={"button"} > - + ); diff --git a/ts/screens/wallet/payment/components/TransactionSummaryStatus.tsx b/ts/screens/wallet/payment/components/TransactionSummaryStatus.tsx index c6e95cb7516..bb9ec737976 100644 --- a/ts/screens/wallet/payment/components/TransactionSummaryStatus.tsx +++ b/ts/screens/wallet/payment/components/TransactionSummaryStatus.tsx @@ -2,18 +2,17 @@ import * as O from "fp-ts/lib/Option"; import * as React from "react"; import { View } from "react-native"; import { LabelSmall } from "../../../../components/core/typography/LabelSmall"; -import { IOColors } from "../../../../components/core/variables/IOColors"; import StatusContent from "../../../../components/SectionStatus/StatusContent"; import I18n from "../../../../i18n"; import { getV2ErrorMainType } from "../../../../utils/payment"; import { TransactionSummaryError } from "../NewTransactionSummaryScreen"; +import { IOIcons } from "../../../../components/core/icons"; type StatusContentProps = { viewRef: React.RefObject; backgroundColor: "orange" | "aqua"; - iconName: string; - iconColor: string; - labelColor: "white" | "bluegreyDark"; + iconName: IOIcons; + foregroundColor: "white" | "bluegreyDark"; line1: string; line2?: string; }; @@ -22,17 +21,16 @@ export const renderStatusContent = (props: StatusContentProps) => ( - + {props.line1} {props.line2 && ( - + {"\n"} {props.line2} @@ -62,9 +60,8 @@ export const TransactionSummaryStatus = (props: { statusContentProps = { viewRef, backgroundColor: "orange", - labelColor: "white", - iconName: "io-notice", - iconColor: IOColors.white, + foregroundColor: "white", + iconName: "notice", line1: I18n.t("wallet.errors.TECHNICAL"), line2: I18n.t("wallet.errors.contactECsubtitle") }; @@ -73,9 +70,8 @@ export const TransactionSummaryStatus = (props: { statusContentProps = { viewRef, backgroundColor: "orange", - labelColor: "white", - iconName: "io-notice", - iconColor: IOColors.white, + foregroundColor: "white", + iconName: "notice", line1: I18n.t("wallet.errors.REVOKED"), line2: I18n.t("wallet.errors.contactECsubtitle") }; @@ -84,9 +80,8 @@ export const TransactionSummaryStatus = (props: { statusContentProps = { viewRef, backgroundColor: "orange", - labelColor: "white", - iconName: "io-notice", - iconColor: IOColors.white, + foregroundColor: "white", + iconName: "notice", line1: I18n.t("wallet.errors.EXPIRED"), line2: I18n.t("wallet.errors.contactECsubtitle") }; @@ -95,9 +90,8 @@ export const TransactionSummaryStatus = (props: { statusContentProps = { viewRef, backgroundColor: "orange", - labelColor: "white", - iconName: "io-notice", - iconColor: IOColors.white, + foregroundColor: "white", + iconName: "notice", line1: I18n.t("wallet.errors.ONGOING"), line2: I18n.t("wallet.errors.ONGOING_SUBTITLE") }; @@ -106,9 +100,8 @@ export const TransactionSummaryStatus = (props: { statusContentProps = { viewRef, backgroundColor: "aqua", - iconName: "io-complete", - iconColor: IOColors.bluegreyDark, - labelColor: "bluegreyDark", + iconName: "ok", + foregroundColor: "bluegreyDark", line1: I18n.t("wallet.errors.DUPLICATED") }; break; @@ -116,9 +109,8 @@ export const TransactionSummaryStatus = (props: { statusContentProps = { viewRef, backgroundColor: "orange", - iconName: "io-notice", - iconColor: IOColors.white, - labelColor: "white", + iconName: "notice", + foregroundColor: "white", line1: I18n.t("wallet.errors.TECHNICAL"), line2: I18n.t("wallet.errors.GENERIC_ERROR_SUBTITLE") }; diff --git a/ts/theme/variables.ts b/ts/theme/variables.ts index 5fd5fccdbf9..bc6d9968365 100644 --- a/ts/theme/variables.ts +++ b/ts/theme/variables.ts @@ -85,15 +85,6 @@ const customVariables = Object.assign(materialVariables, { iconFamily: "Entypo" /* NB Theme variable, don't remove */, iconSizeBase: 24, - get iconSize2(): number { - return this.iconSizeBase * (5 / 6); - }, - get iconSize3(): number { - return this.iconSizeBase * 1; - }, - get iconSize6(): number { - return this.iconSizeBase * 2; - }, // Content contentPadding: 24, contentPaddingLarge: 48,