Merge branch 'master' into SFEQS-2083-replace-dialog

pagopa · Feb 23, 2024 · 718b6dd · 718b6dd
2 parents 2fc1faf + 106c7df
commit 718b6dd
Show file tree

Hide file tree

Showing 12 changed files with 151 additions and 201 deletions.
diff --git a/ts/features/fci/components/DocumentWithSignature.tsx b/ts/features/fci/components/DocumentWithSignature.tsx
@@ -187,7 +187,7 @@ const DocumentWithSignature = (props: Props) => {
     <SafeAreaView
       style={[IOStyles.flex, IOStyles.bgWhite]}
       testID={"FciDocumentsScreenTestID"}
-      edges={["bottom", "left", "right"]}
+      edges={["top", "left", "right"]}
     >
       <View style={[IOStyles.horizontalContentPadding, styles.header]}>
         <HSpacer />

diff --git a/ts/features/fci/components/ErrorComponent.tsx b/ts/features/fci/components/ErrorComponent.tsx
@@ -144,9 +144,9 @@ const ErrorComponent = (props: Props) => {
 
   return (
     <SafeAreaView
+      edges={["top", "left", "right"]}
       style={IOStyles.flex}
       testID={props.testID}
-      edges={["left", "right"]}
     >
       <InfoScreenComponent
         image={<Pictogram name={props.pictogram} />}

diff --git a/ts/features/fci/components/LoadingComponent.tsx b/ts/features/fci/components/LoadingComponent.tsx
@@ -1,17 +1,10 @@
 import * as React from "react";
-import { StyleSheet, View } from "react-native";
-import {
-  Body,
-  H3,
-  LoadingSpinner,
-  VSpacer,
-  WithTestID
-} from "@pagopa/io-app-design-system";
-import customVariables from "../../../theme/variables";
+import { SafeAreaView, StyleSheet } from "react-native";
+import { Body, H3, VSpacer, WithTestID } from "@pagopa/io-app-design-system";
+import { LoadingIndicator } from "../../../components/ui/LoadingIndicator";
 
 const styles = StyleSheet.create({
   main: {
-    padding: customVariables.contentPadding,
     flex: 1,
     alignItems: "center",
     justifyContent: "center"
@@ -36,8 +29,8 @@ const LoadingComponent = (props: Props) => {
   const { captionTitle, captionSubtitle } = props;
 
   return (
-    <View style={styles.main} testID={props.testID}>
-      <LoadingSpinner size={76} />
+    <SafeAreaView style={styles.main} testID={props.testID}>
+      <LoadingIndicator />
       <VSpacer size={48} />
       <H3 style={styles.textAlignCenter} testID="LoadingSpinnerCaptionTitleID">
         {captionTitle}
@@ -49,7 +42,7 @@ const LoadingComponent = (props: Props) => {
       >
         {captionSubtitle}
       </Body>
-    </View>
+    </SafeAreaView>
   );
 };
 

diff --git a/ts/features/fci/components/__tests__/__snapshots__/LoadingComponent.test.tsx.snap b/ts/features/fci/components/__tests__/__snapshots__/LoadingComponent.test.tsx.snap
@@ -1,27 +1,29 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Test LoadingComponent component should render a LoadingComponent component with props correctly 1`] = `
-<View
+<RCTSafeAreaView
+  emulateUnlessSupported={true}
   style={
     Object {
       "alignItems": "center",
       "flex": 1,
       "justifyContent": "center",
-      "padding": 24,
     }
   }
 >
   <View
+    accessibilityHint="[missing \\"en.global.accessibility.activityIndicator.hint\\" translation]"
+    accessibilityLabel="[missing \\"en.global.accessibility.activityIndicator.label\\" translation]"
     accessibilityRole="progressbar"
     accessible={true}
     importantForAccessibility="no-hide-descendants"
     style={
       Object {
-        "height": 76,
-        "width": 76,
+        "height": 48,
+        "width": 48,
       }
     }
-    testID="LoadingSpinnerTestID"
+    testID="LoadingIndicator"
   >
     <View
       collapsable={false}
@@ -38,11 +40,11 @@ exports[`Test LoadingComponent component should render a LoadingComponent compon
     >
       <RNSVGSvgView
         align="xMidYMid"
-        bbHeight={76}
-        bbWidth={76}
+        bbHeight={48}
+        bbWidth={48}
         fill="none"
         focusable={false}
-        height={76}
+        height={48}
         meetOrSlice={0}
         minX={0}
         minY={0}
@@ -54,14 +56,14 @@ exports[`Test LoadingComponent component should render a LoadingComponent compon
             },
             Object {
               "flex": 0,
-              "height": 76,
-              "width": 76,
+              "height": 48,
+              "width": 48,
             },
           ]
         }
-        vbHeight={76}
-        vbWidth={76}
-        width={76}
+        vbHeight={48}
+        vbWidth={48}
+        width={48}
       >
         <RNSVGGroup
           fill={null}
@@ -76,9 +78,9 @@ exports[`Test LoadingComponent component should render a LoadingComponent compon
               gradient={
                 Array [
                   0,
-                  736995,
+                  29670,
                   1,
-                  -16040221,
+                  -16747546,
                 ]
               }
               gradientTransform={null}
@@ -93,9 +95,9 @@ exports[`Test LoadingComponent component should render a LoadingComponent compon
               gradient={
                 Array [
                   0,
-                  -16040221,
+                  -16747546,
                   1,
-                  -16040221,
+                  -16747546,
                 ]
               }
               gradientTransform={null}
@@ -113,10 +115,10 @@ exports[`Test LoadingComponent component should render a LoadingComponent compon
                 "strokeWidth",
               ]
             }
-            strokeWidth={7}
+            strokeWidth={5}
           >
             <RNSVGPath
-              d="M 3.5 38 A 34.5 34.5 0 0 1 72.5 38"
+              d="M 2.5 24 A 21.5 21.5 0 0 1 45.5 24"
               propList={
                 Array [
                   "stroke",
@@ -130,7 +132,7 @@ exports[`Test LoadingComponent component should render a LoadingComponent compon
               }
             />
             <RNSVGPath
-              d="M 72.5 38 A 34.5 34.5 0 0 1 3.5 38"
+              d="M 45.5 24 A 21.5 21.5 0 0 1 2.5 24"
               propList={
                 Array [
                   "stroke",
@@ -144,14 +146,14 @@ exports[`Test LoadingComponent component should render a LoadingComponent compon
               }
             />
             <RNSVGPath
-              d="M 3.5 38 A 34.5 34.5 0 0 1 3.5 36.25"
+              d="M 2.5 24 A 21.5 21.5 0 0 1 2.5 22.75"
               propList={
                 Array [
                   "stroke",
                   "strokeLinecap",
                 ]
               }
-              stroke={4278927075}
+              stroke={4278219750}
               strokeLinecap={1}
             />
           </RNSVGGroup>
@@ -241,5 +243,5 @@ exports[`Test LoadingComponent component should render a LoadingComponent compon
   >
     Please wait...
   </Text>
-</View>
+</RCTSafeAreaView>
 `;
diff --git a/ts/features/fci/hooks/useFciAbortSignatureFlow.tsx b/ts/features/fci/hooks/useFciAbortSignatureFlow.tsx
@@ -1,9 +1,10 @@
 import * as React from "react";
-import { Alert } from "react-native";
+import { Alert, View } from "react-native";
 import { useRoute } from "@react-navigation/native";
 import {
+  BlockButtons,
   ButtonSolidProps,
-  FooterWithButtons,
+  IOVisualCostants,
   useIOExperimentalDesign
 } from "@pagopa/io-app-design-system";
 import I18n from "../../../i18n";
@@ -60,14 +61,13 @@ export const useFciAbortSignatureFlow = () => {
     ),
     snapPoint: [280],
     footer: (
-      <FooterWithButtons
-        type={"TwoButtonsInlineHalf"}
-        primary={{ type: "Outline", buttonProps: cancelButtonProps }}
-        secondary={{
-          type: "Solid",
-          buttonProps: continueButtonProps
-        }}
-      />
+      <View style={{ paddingHorizontal: IOVisualCostants.appMarginDefault }}>
+        <BlockButtons
+          type={"TwoButtonsInlineHalf"}
+          primary={{ type: "Outline", buttonProps: cancelButtonProps }}
+          secondary={{ type: "Solid", buttonProps: continueButtonProps }}
+        />
+      </View>
     )
   });
 

diff --git a/ts/features/fci/screens/valid/FciDataSharingScreen.tsx b/ts/features/fci/screens/valid/FciDataSharingScreen.tsx
@@ -16,7 +16,6 @@ import {
   ListItemNav,
   VSpacer
 } from "@pagopa/io-app-design-system";
-import { SafeAreaView } from "react-native-safe-area-context";
 import I18n from "../../../../i18n";
 import { useIOSelector } from "../../../../store/hooks";
 import {
@@ -127,80 +126,78 @@ const FciDataSharingScreen = (): React.ReactElement => {
 
   return (
     <>
-      <SafeAreaView style={IOStyles.flex} edges={["bottom", "left", "right"]}>
-        <ScrollView
-          style={IOStyles.horizontalContentPadding}
-          testID={"FciDataSharingScreenListTestID"}
-        >
-          <H2>{I18n.t("features.fci.shareDataScreen.title")}</H2>
-          <VSpacer size={16} />
-          <Body>{I18n.t("features.fci.shareDataScreen.content")}</Body>
-          {name && (
-            <ListItemNav
-              testID="FciDataSharingScreenNameTestID"
-              value={I18n.t("features.fci.shareDataScreen.name")}
-              description={name}
-              accessibilityLabel={I18n.t("features.fci.shareDataScreen.name")}
-              onPress={() => undefined}
-              hideChevron
-            />
-          )}
-          {familyName && (
-            <ListItemNav
-              testID="FciDataSharingScreenFamilyNameTestID"
-              value={I18n.t("features.fci.shareDataScreen.familyName")}
-              description={familyName}
-              onPress={() => undefined}
-              hideChevron
-              accessibilityLabel={I18n.t(
-                "features.fci.shareDataScreen.familyName"
-              )}
-            />
-          )}
-          {birthDate && (
-            <ListItemNav
-              testID="FciDataSharingScreenBirthDateTestID"
-              value={I18n.t("features.fci.shareDataScreen.birthDate")}
-              description={formatFiscalCodeBirthdayAsShortFormat(birthDate)}
-              hideChevron
-              accessibilityLabel={I18n.t(
-                "features.fci.shareDataScreen.birthDate"
-              )}
-              onPress={() => undefined}
-            />
-          )}
-          {fiscalCode && (
+      <ScrollView
+        style={IOStyles.horizontalContentPadding}
+        testID={"FciDataSharingScreenListTestID"}
+      >
+        <H2>{I18n.t("features.fci.shareDataScreen.title")}</H2>
+        <VSpacer size={16} />
+        <Body>{I18n.t("features.fci.shareDataScreen.content")}</Body>
+        {name && (
+          <ListItemNav
+            testID="FciDataSharingScreenNameTestID"
+            value={I18n.t("features.fci.shareDataScreen.name")}
+            description={name}
+            accessibilityLabel={I18n.t("features.fci.shareDataScreen.name")}
+            onPress={() => undefined}
+            hideChevron
+          />
+        )}
+        {familyName && (
+          <ListItemNav
+            testID="FciDataSharingScreenFamilyNameTestID"
+            value={I18n.t("features.fci.shareDataScreen.familyName")}
+            description={familyName}
+            onPress={() => undefined}
+            hideChevron
+            accessibilityLabel={I18n.t(
+              "features.fci.shareDataScreen.familyName"
+            )}
+          />
+        )}
+        {birthDate && (
+          <ListItemNav
+            testID="FciDataSharingScreenBirthDateTestID"
+            value={I18n.t("features.fci.shareDataScreen.birthDate")}
+            description={formatFiscalCodeBirthdayAsShortFormat(birthDate)}
+            hideChevron
+            accessibilityLabel={I18n.t(
+              "features.fci.shareDataScreen.birthDate"
+            )}
+            onPress={() => undefined}
+          />
+        )}
+        {fiscalCode && (
+          <ListItemNav
+            testID="FciDataSharingScreenFiscalCodeTestID"
+            value={I18n.t("profile.fiscalCode.fiscalCode")}
+            description={fiscalCode}
+            hideChevron
+            accessibilityLabel={I18n.t("profile.fiscalCode.fiscalCode")}
+            onPress={() => undefined}
+          />
+        )}
+        {O.isSome(email) && (
+          <>
             <ListItemNav
-              testID="FciDataSharingScreenFiscalCodeTestID"
-              value={I18n.t("profile.fiscalCode.fiscalCode")}
-              description={fiscalCode}
+              testID="FciDataSharingScreenEmailTestID"
+              value={I18n.t("profile.data.list.email")}
+              description={email.value}
               hideChevron
-              accessibilityLabel={I18n.t("profile.fiscalCode.fiscalCode")}
+              accessibilityLabel={I18n.t("profile.data.list.email")}
               onPress={() => undefined}
             />
-          )}
-          {O.isSome(email) && (
-            <>
-              <ListItemNav
-                testID="FciDataSharingScreenEmailTestID"
-                value={I18n.t("profile.data.list.email")}
-                description={email.value}
-                hideChevron
-                accessibilityLabel={I18n.t("profile.data.list.email")}
-                onPress={() => undefined}
-              />
-              <AlertTextComponent />
-            </>
-          )}
-        </ScrollView>
-        <View testID="FciDataSharingScreenFooterTestID">
-          <FooterWithButtons
-            type={"TwoButtonsInlineThird"}
-            secondary={{ type: "Solid", buttonProps: confirmButtonProps }}
-            primary={{ type: "Outline", buttonProps: cancelButtonProps }}
-          />
-        </View>
-      </SafeAreaView>
+            <AlertTextComponent />
+          </>
+        )}
+      </ScrollView>
+      <View testID="FciDataSharingScreenFooterTestID">
+        <FooterWithButtons
+          type={"TwoButtonsInlineThird"}
+          secondary={{ type: "Solid", buttonProps: confirmButtonProps }}
+          primary={{ type: "Outline", buttonProps: cancelButtonProps }}
+        />
+      </View>
 
       {fciAbortSignature}
     </>