diff --git a/ts/components/CalendarsListContainer.tsx b/ts/components/CalendarsListContainer.tsx
index 3beb2f99a9f..4ce306c152d 100644
--- a/ts/components/CalendarsListContainer.tsx
+++ b/ts/components/CalendarsListContainer.tsx
@@ -2,7 +2,6 @@ import * as pot from "@pagopa/ts-commons/lib/pot";
import React, { memo, useCallback, useEffect, useState } from "react";
import RNCalendarEvents, { Calendar } from "react-native-calendar-events";
import {
- ContentWrapper,
ListItemHeader,
RadioGroup,
VSpacer,
@@ -132,25 +131,21 @@ const CalendarsListContainer = ({
}, [fetchCalendars]);
return (
-
- {pot.isSome(calendarsByAccount) &&
- calendarsByAccount.value.map((section, index) => (
-
-
-
- type="radioListItem"
- key={`radio_group_${index}`}
- items={mapData(section.data)}
- selectedItem={selectedCalendar?.id}
- onPress={onPressRadio}
- />
- {/* not show the end spacer if the element is the last */}
- {index < calendarsByAccount.value.length - 1 && (
-
- )}
-
- ))}
-
+ pot.isSome(calendarsByAccount) &&
+ calendarsByAccount.value.map((section, index) => (
+
+
+
+ type="radioListItem"
+ key={`radio_group_${index}`}
+ items={mapData(section.data)}
+ selectedItem={selectedCalendar?.id}
+ onPress={onPressRadio}
+ />
+ {/* not show the end spacer if the element is the last */}
+ {index < calendarsByAccount.value.length - 1 && }
+
+ ))
);
};
diff --git a/ts/components/LoadingSpinnerOverlay.tsx b/ts/components/LoadingSpinnerOverlay.tsx
index 83e20815a18..f90cb318c3e 100644
--- a/ts/components/LoadingSpinnerOverlay.tsx
+++ b/ts/components/LoadingSpinnerOverlay.tsx
@@ -40,7 +40,10 @@ const LoadingSpinnerOverlay = ({
return (
= ({
/>
{shouldRenderFooter && onAcceptTos && (
-
{
return (
-
+
{
)}
-
{contentTitle}
-
+
{children}
diff --git a/ts/components/screens/__tests__/__snapshots__/LoadingScreenContent.test.tsx.snap b/ts/components/screens/__tests__/__snapshots__/LoadingScreenContent.test.tsx.snap
index 56fcbeed199..d681155d455 100644
--- a/ts/components/screens/__tests__/__snapshots__/LoadingScreenContent.test.tsx.snap
+++ b/ts/components/screens/__tests__/__snapshots__/LoadingScreenContent.test.tsx.snap
@@ -343,11 +343,15 @@ exports[`LoadingScreenContent should match the snapshot with title, a child, hea
}
}
style={
- {
- "backgroundColor": "#FFFFFF",
- "flex": 1,
- "justifyContent": "center",
- }
+ [
+ {
+ "flex": 1,
+ "justifyContent": "center",
+ },
+ {
+ "backgroundColor": "#FFFFFF",
+ },
+ ]
}
>
@@ -549,13 +556,6 @@ exports[`LoadingScreenContent should match the snapshot with title, a child, hea
-
@@ -1148,13 +1155,6 @@ exports[`LoadingScreenContent should match the snapshot with title, a child, hea
-
@@ -1747,13 +1754,6 @@ exports[`LoadingScreenContent should match the snapshot with title, no children,
-
@@ -2343,13 +2350,6 @@ exports[`LoadingScreenContent should match the snapshot with title, no children,
-
(
-
+const BoxedRefreshIndicator = ({ action, caption }: Props) => (
+
{caption ? caption : null}
{action ? action : null}
diff --git a/ts/components/ui/IOScrollViewWithLargeHeader.tsx b/ts/components/ui/IOScrollViewWithLargeHeader.tsx
index dd1ce6d2075..ab9437beca7 100644
--- a/ts/components/ui/IOScrollViewWithLargeHeader.tsx
+++ b/ts/components/ui/IOScrollViewWithLargeHeader.tsx
@@ -40,6 +40,7 @@ type Props = WithTestID<
ignoreSafeAreaMargin?: ComponentProps<
typeof HeaderSecondLevel
>["ignoreSafeAreaMargin"];
+ includeContentMargins?: boolean;
headerActionsProp?: HeaderActionsProps;
canGoback?: boolean;
excludeEndContentMargin?: boolean;
@@ -64,6 +65,7 @@ export const IOScrollViewWithLargeHeader = forwardRef(
contextualHelpMarkdown,
faqCategories,
ignoreSafeAreaMargin = false,
+ includeContentMargins = false,
headerActionsProp = {},
excludeEndContentMargin,
testID
@@ -144,7 +146,11 @@ export const IOScrollViewWithLargeHeader = forwardRef(
{children && (
<>
- {children}
+ {includeContentMargins ? (
+ {children}
+ ) : (
+ children
+ )}
>
)}
diff --git a/ts/components/ui/__test__/BoxedRefreshIndicator.test.tsx b/ts/components/ui/__test__/BoxedRefreshIndicator.test.tsx
index 3245dc4e74d..4280076184c 100644
--- a/ts/components/ui/__test__/BoxedRefreshIndicator.test.tsx
+++ b/ts/components/ui/__test__/BoxedRefreshIndicator.test.tsx
@@ -17,16 +17,14 @@ describe("BoxedRefreshIndicator", () => {
it("Should match all-properties snapshot", () => {
const action = This is the action;
const caption = This is the caption;
- const white = true;
- const component = renderComponent(action, caption, white);
+ const component = renderComponent(action, caption);
expect(component.toJSON()).toMatchSnapshot();
});
});
const renderComponent = (
action?: React.ReactNode,
- caption?: React.ReactNode,
- white?: boolean
+ caption?: React.ReactNode
) => {
const initialState = appReducer(undefined, applicationChangeState("active"));
const dsState = appReducer(
@@ -37,7 +35,7 @@ const renderComponent = (
const store: ReturnType = mockStore(dsState);
return render(
-
+
);
};
diff --git a/ts/components/ui/__test__/__snapshots__/BoxedRefreshIndicator.test.tsx.snap b/ts/components/ui/__test__/__snapshots__/BoxedRefreshIndicator.test.tsx.snap
index 352e4530e95..f559fcfe454 100644
--- a/ts/components/ui/__test__/__snapshots__/BoxedRefreshIndicator.test.tsx.snap
+++ b/ts/components/ui/__test__/__snapshots__/BoxedRefreshIndicator.test.tsx.snap
@@ -3,17 +3,12 @@
exports[`BoxedRefreshIndicator Should match all-properties snapshot 1`] = `
@@ -362,6 +366,9 @@ exports[`IngressScreen Should match the snapshot 1`] = `
style={
{
"alignItems": "center",
+ "display": "flex",
+ "flexDirection": "column",
+ "rowGap": 24,
}
}
>
@@ -394,13 +401,6 @@ exports[`IngressScreen Should match the snapshot 1`] = `
useNativeLooping={false}
/>
-
(
-
-
-
-
- {doubleAvatar ? (
-
- ) : (
-
- )}
+}: MessageListItemProps) => {
+ const theme = useIOTheme();
+
+ return (
+
+
+
-
+ {doubleAvatar ? (
+
+ ) : (
+
+ )}
+
+
+
-
-
-
-
- {organizationName}
-
-
- {formattedDate}
-
-
-
-
-
-
-
- {!isRead && (
-
-
+
+
+
+ {organizationName}
+
+
+ {formattedDate}
+
+
+
+
+
+
+
+ {!isRead && (
+
+
+
+ )}
+
+ {badgeText && badgeVariant && (
+
+
+ {badgeVariant === "legalMessage" && (
+ <>
+
+
+ >
+ )}
)}
- {badgeText && badgeVariant && (
-
-
- {badgeVariant === "legalMessage" && (
- <>
-
-
- >
- )}
-
- )}
-
-
-);
+
+ );
+};
diff --git a/ts/features/messages/components/Home/__tests__/__snapshots__/WrappedMessageListItem.test.tsx.snap b/ts/features/messages/components/Home/__tests__/__snapshots__/WrappedMessageListItem.test.tsx.snap
index 00c9c98ae13..ae6759fbbc9 100644
--- a/ts/features/messages/components/Home/__tests__/__snapshots__/WrappedMessageListItem.test.tsx.snap
+++ b/ts/features/messages/components/Home/__tests__/__snapshots__/WrappedMessageListItem.test.tsx.snap
@@ -613,7 +613,7 @@ exports[`WrappedMessageListItem should match snapshot, from SEND, read message 1
"lineHeight": 24,
},
{
- "flex": 1,
+ "flexGrow": 1,
},
]
}
@@ -1565,7 +1565,7 @@ exports[`WrappedMessageListItem should match snapshot, from SEND, unread message
"lineHeight": 24,
},
{
- "flex": 1,
+ "flexGrow": 1,
},
]
}
@@ -2694,7 +2694,7 @@ exports[`WrappedMessageListItem should match snapshot, not from SEND, contains p
"lineHeight": 24,
},
{
- "flex": 1,
+ "flexGrow": 1,
},
]
}
@@ -3677,7 +3677,7 @@ exports[`WrappedMessageListItem should match snapshot, not from SEND, contains p
"lineHeight": 24,
},
{
- "flex": 1,
+ "flexGrow": 1,
},
]
}
@@ -4715,7 +4715,7 @@ exports[`WrappedMessageListItem should match snapshot, not from SEND, contains u
"lineHeight": 24,
},
{
- "flex": 1,
+ "flexGrow": 1,
},
]
}
@@ -5568,7 +5568,7 @@ exports[`WrappedMessageListItem should match snapshot, not from SEND, contains u
"lineHeight": 24,
},
{
- "flex": 1,
+ "flexGrow": 1,
},
]
}
@@ -6354,7 +6354,7 @@ exports[`WrappedMessageListItem should match snapshot, not from SEND, not a paym
"lineHeight": 24,
},
{
- "flex": 1,
+ "flexGrow": 1,
},
]
}
@@ -7085,7 +7085,7 @@ exports[`WrappedMessageListItem should match snapshot, not from SEND, not a paym
"lineHeight": 24,
},
{
- "flex": 1,
+ "flexGrow": 1,
},
]
}
diff --git a/ts/features/messages/components/MessageAttachment/__test__/__snapshots__/PdfViewer.test.tsx.snap b/ts/features/messages/components/MessageAttachment/__test__/__snapshots__/PdfViewer.test.tsx.snap
index e9bafe05cc0..30f39aa81e5 100644
--- a/ts/features/messages/components/MessageAttachment/__test__/__snapshots__/PdfViewer.test.tsx.snap
+++ b/ts/features/messages/components/MessageAttachment/__test__/__snapshots__/PdfViewer.test.tsx.snap
@@ -31,15 +31,12 @@ exports[`PdfViewer should match the snapshot 1`] = `
>
+
{(serviceMetadata?.email || serviceMetadata?.phone) && (
@@ -876,10 +878,12 @@ exports[`MessageDetailsFooter component should match the snapshot, no service's
"paddingHorizontal": 24,
},
{
- "backgroundColor": "#F4F5F8",
"marginBottom": "-75%",
"paddingBottom": "75%",
},
+ {
+ "backgroundColor": "#F4F5F8",
+ },
]
}
>
@@ -1412,10 +1416,12 @@ exports[`MessageDetailsFooter component should match the snapshot, no service's
"paddingHorizontal": 24,
},
{
- "backgroundColor": "#F4F5F8",
"marginBottom": "-75%",
"paddingBottom": "75%",
},
+ {
+ "backgroundColor": "#F4F5F8",
+ },
]
}
>
@@ -1948,10 +1954,12 @@ exports[`MessageDetailsFooter component should match the snapshot, no service's
"paddingHorizontal": 24,
},
{
- "backgroundColor": "#F4F5F8",
"marginBottom": "-75%",
"paddingBottom": "75%",
},
+ {
+ "backgroundColor": "#F4F5F8",
+ },
]
}
>
@@ -2484,10 +2492,12 @@ exports[`MessageDetailsFooter component should match the snapshot, with service'
"paddingHorizontal": 24,
},
{
- "backgroundColor": "#F4F5F8",
"marginBottom": "-75%",
"paddingBottom": "75%",
},
+ {
+ "backgroundColor": "#F4F5F8",
+ },
]
}
>
@@ -3188,10 +3198,12 @@ exports[`MessageDetailsFooter component should match the snapshot, with service'
"paddingHorizontal": 24,
},
{
- "backgroundColor": "#F4F5F8",
"marginBottom": "-75%",
"paddingBottom": "75%",
},
+ {
+ "backgroundColor": "#F4F5F8",
+ },
]
}
>
@@ -3892,10 +3904,12 @@ exports[`MessageDetailsFooter component should match the snapshot, with service'
"paddingHorizontal": 24,
},
{
- "backgroundColor": "#F4F5F8",
"marginBottom": "-75%",
"paddingBottom": "75%",
},
+ {
+ "backgroundColor": "#F4F5F8",
+ },
]
}
>
@@ -4596,10 +4610,12 @@ exports[`MessageDetailsFooter component should match the snapshot, with service'
"paddingHorizontal": 24,
},
{
- "backgroundColor": "#F4F5F8",
"marginBottom": "-75%",
"paddingBottom": "75%",
},
+ {
+ "backgroundColor": "#F4F5F8",
+ },
]
}
>
diff --git a/ts/features/messages/components/Search/EmptyList.tsx b/ts/features/messages/components/Search/EmptyList.tsx
index 63d65b7c0b5..7817f4dd3c6 100644
--- a/ts/features/messages/components/Search/EmptyList.tsx
+++ b/ts/features/messages/components/Search/EmptyList.tsx
@@ -1,23 +1,12 @@
import {
+ ContentWrapper,
H6,
IOPictograms,
- IOStyles,
- IOVisualCostants,
Pictogram,
- VSpacer,
+ VStack,
WithTestID
} from "@pagopa/io-app-design-system";
import React from "react";
-import { StyleSheet, View } from "react-native";
-
-const styles = StyleSheet.create({
- container: {
- marginHorizontal: IOVisualCostants.appMarginDefault
- },
- text: {
- textAlign: "center"
- }
-});
export type EmptyListProps = WithTestID<{
pictogram: IOPictograms;
@@ -25,11 +14,10 @@ export type EmptyListProps = WithTestID<{
}>;
export const EmptyList = ({ pictogram, title, testID }: EmptyListProps) => (
-
-
+
+
-
-
- {title}
-
+ {title}
+
+
);
diff --git a/ts/features/messages/screens/__tests__/__snapshots__/MessageAttachment.test.tsx.snap b/ts/features/messages/screens/__tests__/__snapshots__/MessageAttachment.test.tsx.snap
index e18991ff47d..edc008b5f90 100644
--- a/ts/features/messages/screens/__tests__/__snapshots__/MessageAttachment.test.tsx.snap
+++ b/ts/features/messages/screens/__tests__/__snapshots__/MessageAttachment.test.tsx.snap
@@ -222,15 +222,12 @@ exports[`MessageAttachment Should match the snapshot when everything went fine 1
>
@@ -408,13 +415,6 @@ exports[`MessageRouterScreen should match snapshot before starting to retrieve m
-
@@ -1267,13 +1274,6 @@ exports[`MessageRouterScreen should match snapshot if message data retrieval was
-
@@ -3199,13 +3206,6 @@ exports[`MessageRouterScreen should match snapshot on message data retrieval suc
-
@@ -4058,13 +4065,6 @@ exports[`MessageRouterScreen should match snapshot while retrieving message data
-
();
+ const theme = useIOTheme();
+ const backgroundColor = IOColors[theme["appBackground-primary"]];
+
const transactionInfo = transaction?.infoNotice;
const handlePressTransactionDetails = (cartItem: CartItem) => {
@@ -81,24 +91,21 @@ export const PaymentsBizEventsTransactionHeadingSection = ({
const totalAmount = calculateTotalAmount(transactionInfo);
return (
-
-
-
- {totalAmount && (
- <>
+
+
+
+ {totalAmount && (
-
- >
- )}
-
-
+ )}
+
+
);
};
diff --git a/ts/features/payments/bizEventsTransaction/components/PaymentsBizEventsTransactionInfoSection.tsx b/ts/features/payments/bizEventsTransaction/components/PaymentsBizEventsTransactionInfoSection.tsx
index 353a08214fc..f0d6c12bc32 100644
--- a/ts/features/payments/bizEventsTransaction/components/PaymentsBizEventsTransactionInfoSection.tsx
+++ b/ts/features/payments/bizEventsTransaction/components/PaymentsBizEventsTransactionInfoSection.tsx
@@ -1,28 +1,31 @@
-import { capitalize } from "lodash";
-import * as React from "react";
-import { StyleSheet, View } from "react-native";
-import Placeholder from "rn-placeholder";
import {
Alert,
Divider,
+ IOColors,
IOLogoPaymentType,
IORadiusScale,
IOVisualCostants,
ListItemHeader,
ListItemInfo,
ListItemInfoCopy,
+ useIOTheme,
VSpacer
} from "@pagopa/io-app-design-system";
+import { capitalize } from "lodash";
+import * as React from "react";
+import { StyleSheet, View } from "react-native";
+import Placeholder from "rn-placeholder";
+
+import { OriginEnum } from "../../../../../definitions/pagopa/biz-events/InfoNotice";
+import { NoticeDetailResponse } from "../../../../../definitions/pagopa/biz-events/NoticeDetailResponse";
+import { WalletInfo } from "../../../../../definitions/pagopa/biz-events/WalletInfo";
import { IOStyles } from "../../../../components/core/variables/IOStyles";
import I18n from "../../../../i18n";
-import { format } from "../../../../utils/dates";
import { clipboardSetStringWithFeedback } from "../../../../utils/clipboard";
-import TransactionReceiptDivider from "../../../../../img/features/wallet/transaction-receipt-divider.svg";
-import { WalletInfo } from "../../../../../definitions/pagopa/biz-events/WalletInfo";
-import { getPayerInfoLabel } from "../utils";
-import { NoticeDetailResponse } from "../../../../../definitions/pagopa/biz-events/NoticeDetailResponse";
-import { OriginEnum } from "../../../../../definitions/pagopa/biz-events/InfoNotice";
+import { format } from "../../../../utils/dates";
import { capitalizeTextName } from "../../../../utils/strings";
+import { WalletTransactionReceiptDivider } from "../../transaction/components/WalletTransactionReceiptDivider";
+import { getPayerInfoLabel } from "../utils";
type PaymentsBizEventsTransactionInfoSectionProps = {
transaction?: NoticeDetailResponse;
@@ -36,7 +39,6 @@ const styles = StyleSheet.create({
},
contentCard: {
...IOStyles.horizontalContentPadding,
- ...IOStyles.bgWhite,
borderRadius: IORadiusScale["1"],
marginVertical: IOVisualCostants.appMarginDefault
}
@@ -49,16 +51,16 @@ const PaymentsBizEventsTransactionInfoSection = ({
transaction,
loading
}: PaymentsBizEventsTransactionInfoSectionProps) => {
+ const theme = useIOTheme();
+ const backgroundColor = IOColors[theme["appBackground-primary"]];
+
const transactionInfo = transaction?.infoNotice;
+
return (
<>
-
+
-
+
(
-
- {I18n.t("transaction.details.totalAmount")}
- {loading && (
-
-
-
- )}
- {!loading && totalAmount && {formatAmountText(totalAmount)}
}
-
-);
+}: TotalAmountSectionProps) => {
+ const theme = useIOTheme();
+
+ return (
+
+
+ {I18n.t("transaction.details.totalAmount")}
+
+ {loading && (
+
+
+
+ )}
+ {!loading && totalAmount && {formatAmountText(totalAmount)}
}
+
+ );
+};
diff --git a/ts/features/payments/bizEventsTransaction/screens/PaymentsTransactionBizEventsDetailsScreen.tsx b/ts/features/payments/bizEventsTransaction/screens/PaymentsTransactionBizEventsDetailsScreen.tsx
index fe744d9d82d..6d9aa6abb85 100644
--- a/ts/features/payments/bizEventsTransaction/screens/PaymentsTransactionBizEventsDetailsScreen.tsx
+++ b/ts/features/payments/bizEventsTransaction/screens/PaymentsTransactionBizEventsDetailsScreen.tsx
@@ -1,4 +1,4 @@
-import { IOColors, useIOToast } from "@pagopa/io-app-design-system";
+import { IOColors, useIOTheme, useIOToast } from "@pagopa/io-app-design-system";
import * as pot from "@pagopa/ts-commons/lib/pot";
import { RouteProp, useRoute } from "@react-navigation/native";
import * as React from "react";
@@ -78,6 +78,9 @@ const PaymentsTransactionBizEventsDetailsScreen = () => {
const transactionDetails = pot.toUndefined(transactionDetailsPot);
const animatedScrollViewRef = useAnimatedRef();
+ const theme = useIOTheme();
+ const backgroundColor = IOColors[theme["appBackground-secondary"]];
+
useOnFirstRender(() => {
fetchTransactionDetails();
});
@@ -175,9 +178,9 @@ const PaymentsTransactionBizEventsDetailsScreen = () => {
}
>
-
+
{/* The following line is used to show the background color gray that overlay the basic one which is white */}
-
+
handleOnCopy(orgFiscalCode)}
/>
{amountInfoBottomSheet.bottomSheet}
-
+
);
};
diff --git a/ts/features/payments/details/components/PaymentsMethodDetailsBaseScreenComponent.tsx b/ts/features/payments/details/components/PaymentsMethodDetailsBaseScreenComponent.tsx
index e470d05e68c..f5990dbf38d 100644
--- a/ts/features/payments/details/components/PaymentsMethodDetailsBaseScreenComponent.tsx
+++ b/ts/features/payments/details/components/PaymentsMethodDetailsBaseScreenComponent.tsx
@@ -3,6 +3,7 @@ import {
IOColors,
IOSpacingScale,
IOVisualCostants,
+ useIOTheme,
VSpacer
} from "@pagopa/io-app-design-system";
import * as React from "react";
@@ -39,6 +40,9 @@ const PaymentsMethodDetailsBaseScreenComponent = ({
const insets = useSafeAreaInsets();
const translationY = useSharedValue(0);
const [titleHeight, setTitleHeight] = React.useState(0);
+
+ const theme = useIOTheme();
+ const backgroundColor = IOColors[theme["appBackground-primary"]];
const blueHeaderColor = isDSenabled ? IOColors["blueIO-600"] : IOColors.blue;
const animatedScrollViewRef = useAnimatedRef();
@@ -78,7 +82,7 @@ const PaymentsMethodDetailsBaseScreenComponent = ({
contentContainerStyle={{
flexGrow: 1,
paddingBottom: 48,
- backgroundColor: IOColors.white
+ backgroundColor
}}
ref={animatedScrollViewRef}
>
diff --git a/ts/features/payments/details/components/WalletDetailsPaymentMethodSettings.tsx b/ts/features/payments/details/components/WalletDetailsPaymentMethodSettings.tsx
index 0406600d583..6f29a7fdec2 100644
--- a/ts/features/payments/details/components/WalletDetailsPaymentMethodSettings.tsx
+++ b/ts/features/payments/details/components/WalletDetailsPaymentMethodSettings.tsx
@@ -1,14 +1,11 @@
-import { H6, IOSpacingScale } from "@pagopa/io-app-design-system";
+import { Divider, ListItemHeader } from "@pagopa/io-app-design-system";
import * as React from "react";
import { WalletInfo } from "../../../../../definitions/pagopa/walletv3/WalletInfo";
-import ItemSeparatorComponent from "../../../../components/ItemSeparatorComponent";
import I18n from "../../../../i18n";
import WalletDetailsPagoPaPaymentCapability from "./WalletDetailsPagoPaPaymentCapability";
type Props = { paymentMethod: WalletInfo };
-const componentVerticalSpacing: IOSpacingScale = 12;
-
/**
* This component allows the user to choose and change the common settings for a payment methods
* @param props
@@ -18,14 +15,9 @@ const WalletDetailsPaymentMethodSettings = (
props: Props
): React.ReactElement => (
<>
-
- {I18n.t("global.buttons.settings")}
-
+
-
+
>
);
diff --git a/ts/features/payments/transaction/components/WalletTransactionHeadingSection.tsx b/ts/features/payments/transaction/components/WalletTransactionHeadingSection.tsx
index 9947b1d636d..db1ca13379d 100644
--- a/ts/features/payments/transaction/components/WalletTransactionHeadingSection.tsx
+++ b/ts/features/payments/transaction/components/WalletTransactionHeadingSection.tsx
@@ -1,4 +1,10 @@
-import { Body, IOStyles, VSpacer } from "@pagopa/io-app-design-system";
+import {
+ Body,
+ IOColors,
+ IOStyles,
+ useIOTheme,
+ VSpacer
+} from "@pagopa/io-app-design-system";
import { useNavigation } from "@react-navigation/native";
import React from "react";
import { View } from "react-native";
@@ -25,6 +31,9 @@ export const WalletTransactionHeadingSection = ({
}: Props) => {
const navigation = useNavigation();
+ const theme = useIOTheme();
+ const backgroundColor = IOColors[theme["appBackground-primary"]];
+
const handlePressTransactionDetails = (operationDetails: Dettaglio) => {
if (transaction) {
navigation.navigate(
@@ -72,8 +81,8 @@ export const WalletTransactionHeadingSection = ({
};
return (
-
-
+
+
{
const isDesignSystemEnabled = useIOSelector(isDesignSystemEnabledSelector);
+ const theme = useIOTheme();
+ const backgroundColor = IOColors[theme["appBackground-primary"]];
+
return (
<>
-
+
-
+
{
+ const theme = useIOTheme();
+
+ return (
+
+ );
+};
diff --git a/ts/features/payments/transaction/screens/PaymentsTransactionDetailsScreen.tsx b/ts/features/payments/transaction/screens/PaymentsTransactionDetailsScreen.tsx
index 41496dcca59..516cbbbec93 100644
--- a/ts/features/payments/transaction/screens/PaymentsTransactionDetailsScreen.tsx
+++ b/ts/features/payments/transaction/screens/PaymentsTransactionDetailsScreen.tsx
@@ -1,4 +1,4 @@
-import { IOColors } from "@pagopa/io-app-design-system";
+import { IOColors, useIOTheme } from "@pagopa/io-app-design-system";
import * as pot from "@pagopa/ts-commons/lib/pot";
import { RouteProp, useRoute } from "@react-navigation/native";
import * as React from "react";
@@ -56,6 +56,9 @@ const PaymentsTransactionDetailsScreen = () => {
const isLoading = pot.isLoading(transactionDetailsPot);
const transactionDetails = pot.toUndefined(transactionDetailsPot);
+ const theme = useIOTheme();
+ const backgroundColor = IOColors[theme["appBackground-secondary"]];
+
useOnFirstRender(() => {
dispatch(getPaymentsTransactionDetailsAction.request({ transactionId }));
});
@@ -83,9 +86,9 @@ const PaymentsTransactionDetailsScreen = () => {
headerActionsProp={{ showHelp: true }}
>
-
+
{/* The following line is used to show the background color gray that overlay the basic one which is white */}
-
+
-
+
+
{I18n.t(titleKey)}
diff --git a/ts/features/pushNotifications/components/__tests__/__snapshots__/NotificationPreviewSample.test.tsx.snap b/ts/features/pushNotifications/components/__tests__/__snapshots__/NotificationPreviewSample.test.tsx.snap
index 7500f4cf1d4..ab152481da8 100644
--- a/ts/features/pushNotifications/components/__tests__/__snapshots__/NotificationPreviewSample.test.tsx.snap
+++ b/ts/features/pushNotifications/components/__tests__/__snapshots__/NotificationPreviewSample.test.tsx.snap
@@ -335,18 +335,23 @@ exports[`NotificationPreviewSample should match snapshot, preview off, reminder
>
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
{title}
-
+
{subTitle}
diff --git a/ts/features/services/common/components/ServicesHeaderSection.tsx b/ts/features/services/common/components/ServicesHeaderSection.tsx
index 507d3e5e9fd..c9d8b3b9ad6 100644
--- a/ts/features/services/common/components/ServicesHeaderSection.tsx
+++ b/ts/features/services/common/components/ServicesHeaderSection.tsx
@@ -1,9 +1,10 @@
import React, { ComponentProps } from "react";
-import { Dimensions, StyleSheet, View } from "react-native";
+import { Dimensions, View } from "react-native";
import { useHeaderHeight } from "@react-navigation/elements";
import {
ContentWrapper,
IOColors,
+ useIOTheme,
VSpacer,
WithTestID
} from "@pagopa/io-app-design-system";
@@ -11,12 +12,6 @@ import { ServicesHeader, ServicesHeaderSkeleton } from "./ServicesHeader";
const WINDOW_HEIGHT = Dimensions.get("window").height;
-const styles = StyleSheet.create({
- container: {
- backgroundColor: IOColors["grey-50"]
- }
-});
-
export type ServicesHeaderSectionProps = WithTestID<
| ({
isLoading?: false;
@@ -33,17 +28,16 @@ export const ServicesHeaderSection = ({
...rest
}: ServicesHeaderSectionProps) => {
const headerHeight = useHeaderHeight();
+ const theme = useIOTheme();
return (
{rest.isLoading ? (
diff --git a/ts/features/services/common/components/__tests__/__snapshots__/ServicesHeaderSection.test.tsx.snap b/ts/features/services/common/components/__tests__/__snapshots__/ServicesHeaderSection.test.tsx.snap
index f0a259671a2..0b9c393df78 100644
--- a/ts/features/services/common/components/__tests__/__snapshots__/ServicesHeaderSection.test.tsx.snap
+++ b/ts/features/services/common/components/__tests__/__snapshots__/ServicesHeaderSection.test.tsx.snap
@@ -3,16 +3,12 @@
exports[`ServicesHeaderSection component should match snapshot for loading 1`] = `
{
+ const theme = useIOTheme();
+
+ return (
+
+ {children}
+
+ );
+};
+
const CardWithMarkdownContent = memo(
({ content }: CardWithMarkdownContentProps) => (
-
+
{content}
-
+
)
);
const CardWithMarkdownContentSkeleton = () => (
-
+
-
+
);
export { CardWithMarkdownContent, CardWithMarkdownContentSkeleton };
diff --git a/ts/screens/profile/CalendarsPreferencesScreen.tsx b/ts/screens/profile/CalendarsPreferencesScreen.tsx
index ef40c631ed4..e86b568e2a7 100644
--- a/ts/screens/profile/CalendarsPreferencesScreen.tsx
+++ b/ts/screens/profile/CalendarsPreferencesScreen.tsx
@@ -44,6 +44,7 @@ const CalendarsPreferencesScreen = () => {
return (
{
{I18n.t("profile.main.privacy.exportData.detail.paragraph3.part1")}
-
+
diff --git a/ts/screens/profile/EmailForwardingScreen.tsx b/ts/screens/profile/EmailForwardingScreen.tsx
index 2684e56988d..6a5f9608ccf 100644
--- a/ts/screens/profile/EmailForwardingScreen.tsx
+++ b/ts/screens/profile/EmailForwardingScreen.tsx
@@ -1,28 +1,27 @@
/**
* A screens to express the preferences related to email forwarding.
*/
-import React, { useCallback, useEffect, useRef, useState } from "react";
-import * as pot from "@pagopa/ts-commons/lib/pot";
-import * as O from "fp-ts/lib/Option";
-import { pipe } from "fp-ts/lib/function";
import {
BodyProps,
- ContentWrapper,
ListItemSwitch,
useIOToast
} from "@pagopa/io-app-design-system";
+import * as pot from "@pagopa/ts-commons/lib/pot";
+import * as O from "fp-ts/lib/Option";
+import { pipe } from "fp-ts/lib/function";
import _ from "lodash";
+import React, { useCallback, useEffect, useRef, useState } from "react";
+import { ContextualHelpPropsMarkdown } from "../../components/screens/BaseScreenComponent";
import { IOScrollViewWithLargeHeader } from "../../components/ui/IOScrollViewWithLargeHeader";
import I18n from "../../i18n";
+import { customEmailChannelSetEnabled } from "../../store/actions/persistedPreferences";
+import { profileUpsert } from "../../store/actions/profile";
import { useIODispatch, useIOSelector } from "../../store/hooks";
import {
isEmailEnabledSelector,
profileEmailSelector,
profileSelector
} from "../../store/reducers/profile";
-import { ContextualHelpPropsMarkdown } from "../../components/screens/BaseScreenComponent";
-import { profileUpsert } from "../../store/actions/profile";
-import { customEmailChannelSetEnabled } from "../../store/actions/persistedPreferences";
import { usePrevious } from "../../utils/hooks/usePrevious";
const contextualHelpMarkdown: ContextualHelpPropsMarkdown = {
@@ -129,21 +128,20 @@ const EmailForwardingScreen = () => {
return (
-
-
-
+
);
};
diff --git a/ts/screens/profile/FiscalCodeScreen.tsx b/ts/screens/profile/FiscalCodeScreen.tsx
index 200e3c01f58..31f6e26f43e 100644
--- a/ts/screens/profile/FiscalCodeScreen.tsx
+++ b/ts/screens/profile/FiscalCodeScreen.tsx
@@ -1,28 +1,28 @@
-import React, { useState, useCallback, useRef } from "react";
-import { View, StyleSheet } from "react-native";
import {
- IOColors,
- VSpacer,
- ContentWrapper,
H3,
- LabelSmall
+ IOColors,
+ LabelSmall,
+ useIOTheme,
+ VSpacer
} from "@pagopa/io-app-design-system";
-import Barcode from "react-native-barcode-builder";
-import { useFocusEffect } from "@react-navigation/native";
import { Millisecond } from "@pagopa/ts-commons/lib/units";
+import { useFocusEffect } from "@react-navigation/native";
+import React, { useCallback, useRef, useState } from "react";
+import { StyleSheet, View } from "react-native";
+import Barcode from "react-native-barcode-builder";
import { withLightModalContext } from "../../components/helpers/withLightModalContext";
import { ContextualHelpPropsMarkdown } from "../../components/screens/BaseScreenComponent";
+import { IOScrollViewWithLargeHeader } from "../../components/ui/IOScrollViewWithLargeHeader";
import I18n from "../../i18n";
+import { useIOSelector } from "../../store/hooks";
import {
profileFiscalCodeSelector,
profileNameSurnameSelector
} from "../../store/reducers/profile";
-import { IOScrollViewWithLargeHeader } from "../../components/ui/IOScrollViewWithLargeHeader";
-import { FAQsCategoriesType } from "../../utils/faq";
-import { useIOSelector } from "../../store/hooks";
-import { useMaxBrightness } from "../../utils/brightness";
import { setAccessibilityFocus } from "../../utils/accessibility";
+import { useMaxBrightness } from "../../utils/brightness";
import { clipboardSetStringWithFeedback } from "../../utils/clipboard";
+import { FAQsCategoriesType } from "../../utils/faq";
const FAQ_CATEGORIES: ReadonlyArray = ["profile"];
@@ -37,6 +37,8 @@ const contextualHelpMarkdown: ContextualHelpPropsMarkdown = {
const FiscalCodeScreen = () => {
useMaxBrightness();
+ const theme = useIOTheme();
+
const titleRef = useRef(null);
const [isCFCopied, setIsCFCopied] = useState(false);
@@ -61,6 +63,7 @@ const FiscalCodeScreen = () => {
return (
{
contextualHelpMarkdown={contextualHelpMarkdown}
faqCategories={FAQ_CATEGORIES}
>
-
+
{fiscalCode && (
-
-
-
- {nameSurname}
-
-
- {fiscalCode}
-
-
+
+ {nameSurname}
+
+ {fiscalCode}
+
)}
);
};
const styles = StyleSheet.create({
- box: {
+ card: {
borderRadius: 8,
- borderColor: IOColors.bluegreyLight,
+ borderCurve: "continuous",
borderStyle: "solid",
borderWidth: 1,
display: "flex",
diff --git a/ts/screens/profile/LanguagesPreferencesScreen.tsx b/ts/screens/profile/LanguagesPreferencesScreen.tsx
index abed062a006..e4ee9eb72bc 100644
--- a/ts/screens/profile/LanguagesPreferencesScreen.tsx
+++ b/ts/screens/profile/LanguagesPreferencesScreen.tsx
@@ -1,6 +1,5 @@
import {
Banner,
- ContentWrapper,
RadioGroup,
RadioItem,
useIOToast,
@@ -197,6 +196,7 @@ const LanguagesPreferencesScreen = () => {
return (
{
headerActionsProp={{ showHelp: true }}
contextualHelpMarkdown={contextualHelpMarkdown}
>
-
-
-
- type="radioListItem"
- items={renderedItem}
- selectedItem={selectedItem}
- onPress={onLanguageSelected}
+
+
+ type="radioListItem"
+ items={renderedItem}
+ selectedItem={selectedItem}
+ onPress={onLanguageSelected}
+ />
+
+ {isBannerVisible && (
+
+ openWebUrl(bannerInfoSelector.web_url?.[getFullLocale()] || "")
+ }
/>
-
- {isBannerVisible && (
-
- openWebUrl(bannerInfoSelector.web_url?.[getFullLocale()] || "")
- }
- />
- )}
-
+ )}
);
diff --git a/ts/screens/profile/ServicesPreferenceScreen.tsx b/ts/screens/profile/ServicesPreferenceScreen.tsx
index 74d489645de..23993adaf09 100644
--- a/ts/screens/profile/ServicesPreferenceScreen.tsx
+++ b/ts/screens/profile/ServicesPreferenceScreen.tsx
@@ -1,4 +1,4 @@
-import { ContentWrapper, useIOToast } from "@pagopa/io-app-design-system";
+import { useIOToast } from "@pagopa/io-app-design-system";
import * as pot from "@pagopa/ts-commons/lib/pot";
import React, { ReactElement, useCallback, useEffect } from "react";
import { ServicesPreferencesModeEnum } from "../../../definitions/backend/ServicesPreferencesMode";
@@ -107,18 +107,17 @@ const ServicesPreferenceScreen = (): ReactElement => {
return (
-
-
-
+
{manualConfigBottomSheet}
diff --git a/ts/screens/profile/__test__/__snapshots__/NotificationsPreferencesScreen.test.tsx.snap b/ts/screens/profile/__test__/__snapshots__/NotificationsPreferencesScreen.test.tsx.snap
index 52b4a0e14f9..25e351f1fdd 100644
--- a/ts/screens/profile/__test__/__snapshots__/NotificationsPreferencesScreen.test.tsx.snap
+++ b/ts/screens/profile/__test__/__snapshots__/NotificationsPreferencesScreen.test.tsx.snap
@@ -338,18 +338,23 @@ exports[`NotificationsPreferencesScreen should match snapshot, disabled preview
/>
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
-
-
+
+
+
+
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
+
-
-
+
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
-
-
-
+
-
-
+
+
+ mask="a"
+ >
+
+
void;
@@ -69,7 +69,7 @@ const AnalyticsFeatureInfo = ({ trackAction }: FeatureProps) => {
() => (
{I18n.t("profile.main.privacy.shareData.screen.why.description.one")}
-