Merge branch 'master' into IOPAE-1795-service-details-screen-IOScroll…

…View
pagopa · Feb 24, 2025 · 550d33c · 550d33c
2 parents e5a2d34 + a80ec32
commit 550d33c
Show file tree

Hide file tree

Showing 8 changed files with 94 additions and 138 deletions.
diff --git a/locales/de/index.json b/locales/de/index.json
@@ -2802,13 +2802,12 @@
     },
     "identification": {
         "instructions": {
-            "unlockCode": "Entsperrcode",
-            "unlockCodepPrefix": "Benutze deinen",
-            "fingerprint": "Fingerabdruck",
-            "fingerprintPrefix": "benutze deinen",
-            "faceId": "Gesicht",
-            "faceIdPrefix": "benutze dein",
-            "congiunction": "oder"
+            "useFingerPrintOrUnlockCode": "benutze deinen **Fingerabdruck** oder benutze deinen **Entsperrcode**",
+            "useFingerPrintOrUnlockCodeA11y": "benutze deinen Fingerabdruck oder benutze deinen Entsperrcode",
+            "useFaceIdOrUnlockCode": "benutze dein **Gesicht** oder benutze deinen **Entsperrcode**",
+            "useFaceIdOrUnlockCodeA11y": "benutze dein Gesicht oder benutze deinen Entsperrcode",
+            "useUnlockCode": "benutze deinen **Entsperrcode**",
+            "useUnlockCodeA11y": "benutze deinen Entsperrcode"
         },
         "title": "Hallo {{name}}!",
         "titleProfileName": "Hallo {{profileName}}!",

diff --git a/locales/en/index.json b/locales/en/index.json
@@ -2912,13 +2912,12 @@
     },
     "identification": {
         "instructions": {
-            "unlockCode": "unlock code",
-            "unlockCodepPrefix": "use your",
-            "fingerprint": "fingerprint",
-            "fingerprintPrefix": "use your",
-            "faceId": "face",
-            "faceIdPrefix": "use your",
-            "congiunction": "or"
+            "useFingerPrintOrUnlockCode": "use your **fingerprint** or use your **unlock code**",
+            "useFingerPrintOrUnlockCodeA11y": "use your fingerprint or use your unlock code",
+            "useFaceIdOrUnlockCode": "use your **face** or use your **unlock code**",
+            "useFaceIdOrUnlockCodeA11y": "use your face or use your unlock code",
+            "useUnlockCode":" use your **unlock code**",
+            "useUnlockCodeA11y": "use your unlock code"
         },
         "title": "Hi {{name}}!",
         "titleProfileName": "Hi {{profileName}}!",

diff --git a/locales/it/index.json b/locales/it/index.json
@@ -2912,13 +2912,12 @@
     },
     "identification": {
         "instructions": {
-            "unlockCode": "codice di sblocco",
-            "unlockCodepPrefix": "inserisci il",
-            "fingerprint": "impronta",
-            "fingerprintPrefix": "usa l'",
-            "faceId": "volto",
-            "faceIdPrefix": "usa il",
-            "congiunction": "o"
+            "useFingerPrintOrUnlockCode": "usa l'**impronta** o inserisci il **codice di sblocco**",
+            "useFingerPrintOrUnlockCodeA11y": "usa l'impronta o inserisci il codice di sblocco",
+            "useFaceIdOrUnlockCode": "usa il **volto** o inserisci il **codice di sblocco**",
+            "useFaceIdOrUnlockCodeA11y": "usa il volto o inserisci il codice di sblocco",
+            "useUnlockCode": "inserisci il **codice di sblocco**",
+            "useUnlockCodeA11y": "inserisci il codice di sblocco"
         },
         "title": "Ciao {{name}}!",
         "titleProfileName": "Ciao {{profileName}}!",

diff --git a/package.json b/package.json
@@ -57,7 +57,7 @@
     "@babel/plugin-transform-private-property-in-object": "^7.25.9",
     "@babel/plugin-transform-react-jsx": "^7.25.9",
     "@gorhom/bottom-sheet": "^4.1.5",
-    "@pagopa/io-app-design-system": "4.6.0",
+    "@pagopa/io-app-design-system": "4.6.1",
     "@pagopa/io-pagopa-commons": "^3.1.0",
     "@pagopa/io-react-native-cieid": "^0.3.5",
     "@pagopa/io-react-native-crypto": "^1.0.1",

diff --git a/publiccode.yml b/publiccode.yml
@@ -8,11 +8,11 @@ logo: "img/io-app-icon.png"
 releaseDate: "2024-11-21"
 url: "https://github.com/pagopa/io-app"
 applicationSuite: IO
-landingURL: "https://io.italia.it/"
+landingURL: "https://ioapp.it/"
 softwareVersion: 2.83.0-rc.7
 developmentStatus: beta
 softwareType: standalone/mobile
-roadmap: "https://io.italia.it/"
+roadmap: "https://ioapp.it/"
 platforms:
   - ios
   - android

diff --git a/ts/screens/modal/IdentificationModal.tsx b/ts/screens/modal/IdentificationModal.tsx
@@ -7,7 +7,8 @@ import {
   IconButton,
   Pictogram,
   ToastNotification,
-  VSpacer
+  VSpacer,
+  useIOFontDynamicScale
 } from "@pagopa/io-app-design-system";
 import { Millisecond } from "@pagopa/ts-commons/lib/units";
 import * as O from "fp-ts/lib/Option";
@@ -37,7 +38,6 @@ import I18n from "../../i18n";
 import {
   identificationCancel,
   identificationFailure,
-  identificationForceLogout,
   identificationPinReset,
   identificationSuccess
 } from "../../store/actions/identification";
@@ -76,8 +76,8 @@ const IdentificationModal = () => {
   const errorStatusRef = useRef<View>(null);
   const colorScheme: ColorSchemeName = "light";
   const numberPadVariant = colorScheme ? "dark" : "light";
-
   const { isDeviceScreenSmall } = useDetectSmallScreen();
+  const { hugeFontEnabled } = useIOFontDynamicScale();
 
   const blueColor = useAppBackgroundAccentColorName();
 
@@ -133,9 +133,11 @@ const IdentificationModal = () => {
     },
     [dispatch]
   );
-  const onIdentificationForceLogout = useCallback(() => {
-    dispatch(identificationForceLogout());
+
+  const onPinResetHandler = useCallback(() => {
+    dispatch(identificationPinReset());
   }, [dispatch]);
+
   const onIdentificationFailure = useCallback(() => {
     dispatch(identificationFailure());
   }, [dispatch]);
@@ -158,15 +160,13 @@ const IdentificationModal = () => {
       O.getOrElse(() => false)
     );
     if (forceLogout) {
-      onIdentificationForceLogout();
+      // eslint-disable-next-line functional/immutable-data
+      showRetryText.current = false;
+      onPinResetHandler();
     } else {
       onIdentificationFailure();
     }
-  }, [
-    identificationFailState,
-    onIdentificationFailure,
-    onIdentificationForceLogout
-  ]);
+  }, [identificationFailState, onIdentificationFailure, onPinResetHandler]);
 
   const onIdentificationSuccessHandler = useCallback(
     (isBiometric: boolean) => {
@@ -237,10 +237,6 @@ const IdentificationModal = () => {
     [biometricType, onFingerprintRequest]
   );
 
-  const onPinResetHandler = useCallback(() => {
-    dispatch(identificationPinReset());
-  }, [dispatch]);
-
   const confirmResetAlert = useCallback(
     () =>
       Alert.alert(
@@ -296,7 +292,11 @@ const IdentificationModal = () => {
     />
   ));
 
-  const { top: topInset } = useSafeAreaInsets();
+  const { top: safeAreaTop } = useSafeAreaInsets();
+  const topInset =
+    Platform.OS === "android"
+      ? safeAreaTop || StatusBar.currentHeight || 0
+      : safeAreaTop;
 
   const pictogramKey: IOPictograms = isValidatingTask ? "passcode" : "key";
 
@@ -428,7 +428,8 @@ const IdentificationModal = () => {
                     variant="warning"
                   />
                 </View>
-              ) : isDeviceScreenSmall && isValidatingTask ? null : (
+              ) : (isDeviceScreenSmall || hugeFontEnabled) &&
+                isValidatingTask ? null : (
                 <View style={IOStyles.alignCenter}>
                   <Pictogram
                     pictogramStyle="light-content"
@@ -449,18 +450,10 @@ const IdentificationModal = () => {
                 />
               </View>
             </View>
-            {isDeviceScreenSmall ? (
-              <VSpacer size={16} />
-            ) : (
-              <VSpacer size={32} />
-            )}
+            <VSpacer size={isDeviceScreenSmall ? 16 : 32} />
             <NumberPad />
             <View>
-              {isDeviceScreenSmall ? (
-                <VSpacer size={16} />
-              ) : (
-                <VSpacer size={32} />
-              )}
+              <VSpacer size={isDeviceScreenSmall ? 16 : 32} />
               <View style={IOStyles.selfCenter}>
                 <ButtonLink
                   textAlign="center"

diff --git a/ts/utils/identification/index.tsx b/ts/utils/identification/index.tsx
@@ -4,7 +4,11 @@ import {
   IOStyles
 } from "@pagopa/io-app-design-system";
 import { View } from "react-native";
+import { TxtParagraphNode } from "@textlint/ast-node-types";
 import I18n from "../../i18n";
+import IOMarkdown from "../../components/IOMarkdown";
+import { Renderer } from "../../components/IOMarkdown/types";
+import { getTxtNodeKey } from "../../components/IOMarkdown/renderRules";
 
 export const FAIL_ATTEMPTS_TO_SHOW_ALERT = 4;
 
@@ -20,56 +24,24 @@ export const getBiometryIconName = (
   }
 };
 
-const getTranlations = () => {
-  // We need a function to handle the translations when the language changes,
-  // or is differnt between the device and the app
-  const unlockCode = I18n.t("identification.instructions.unlockCode");
-  const unlockCodePrefix = I18n.t(
-    "identification.instructions.unlockCodepPrefix"
-  );
-  const fingerprint = I18n.t("identification.instructions.fingerprint");
-  const fingerprintPrefix = I18n.t(
-    "identification.instructions.fingerprintPrefix"
-  );
-  const faceId = I18n.t("identification.instructions.faceId");
-  const faceIdPrefix = I18n.t("identification.instructions.faceIdPrefix");
-  return {
-    unlockCode,
-    unlockCodePrefix,
-    fingerprint,
-    fingerprintPrefix,
-    faceId,
-    faceIdPrefix,
-    congiunction: I18n.t("identification.instructions.congiunction"),
-    unlockCodeInstruction: `${unlockCodePrefix} ${unlockCode}`,
-    fingerprintInstruction: `${fingerprintPrefix} ${fingerprint}`,
-    faceIdInstruction: `${faceIdPrefix} ${faceId}`
-  };
-};
-
 export const getAccessibiliyIdentificationInstructions = (
   biometricType: BiometricsValidType | undefined,
   isBimoetricIdentificatoinFailed: boolean = false
 ) => {
-  const {
-    unlockCodeInstruction,
-    fingerprintInstruction,
-    faceIdInstruction,
-    congiunction
-  } = getTranlations();
-
   if (isBimoetricIdentificatoinFailed) {
-    return unlockCodeInstruction;
+    return I18n.t("identification.instructions.useUnlockCodeA11y");
   }
 
   switch (biometricType) {
     case "BIOMETRICS":
     case "TOUCH_ID":
-      return `${fingerprintInstruction} ${congiunction} ${unlockCodeInstruction}`;
+      return I18n.t(
+        "identification.instructions.useFingerPrintOrUnlockCodeA11y"
+      );
     case "FACE_ID":
-      return `${faceIdInstruction} ${congiunction} ${unlockCodeInstruction}`;
+      return I18n.t("identification.instructions.useFaceIdOrUnlockCodeA11y");
     default:
-      return unlockCodeInstruction;
+      return I18n.t("identification.instructions.useUnlockCodeA11y");
   }
 };
 
@@ -82,39 +54,33 @@ export const IdentificationInstructionsComponent = (props: {
     biometricType,
     isBimoetricIdentificatoinFailed
   );
-  const {
-    unlockCode,
-    unlockCodePrefix,
-    fingerprint,
-    fingerprintPrefix,
-    faceId,
-    faceIdPrefix,
-    congiunction
-  } = getTranlations();
-  const instructionComponent = (
-    <View style={IOStyles.row}>
-      <Body color="white" weight="Regular">
-        {unlockCodePrefix}
-        <Body color="white" weight="Semibold">
-          {` ${unlockCode}`}
+
+  const generatePragraphRule = () => ({
+    Paragraph(paragraph: TxtParagraphNode, render: Renderer) {
+      return (
+        <Body
+          key={getTxtNodeKey(paragraph)}
+          color="white"
+          textStyle={{ textAlign: "center" }}
+        >
+          {paragraph.children.map(render)}
         </Body>
-      </Body>
-    </View>
-  );
-  const instructionComponentWithFingerprint = (
-    <View style={IOStyles.row}>
-      <Body color="white" weight="Regular">
-        {fingerprintPrefix}
-        <Body color="white" weight="Semibold">{` ${fingerprint}`}</Body>
-      </Body>
-    </View>
-  );
-  const instructionComponentWithFaceId = (
-    <View style={IOStyles.row}>
-      <Body color="white" weight="Regular">
-        {faceIdPrefix}
-        <Body color="white" weight="Semibold">{` ${faceId}`}</Body>
-      </Body>
+      );
+    }
+  });
+
+  const instructionComponent = (
+    <View
+      accessible
+      accessibilityLabel={I18n.t(
+        "identification.instructions.useUnlockCodeA11y"
+      )}
+      style={IOStyles.row}
+    >
+      <IOMarkdown
+        content={I18n.t("identification.instructions.useUnlockCode")}
+        rules={generatePragraphRule()}
+      />
     </View>
   );
 
@@ -131,12 +97,12 @@ export const IdentificationInstructionsComponent = (props: {
           accessibilityLabel={a11yInstruction}
           style={IOStyles.row}
         >
-          {instructionComponentWithFingerprint}
-          <Body color="white" weight="Regular">
-            {" "}
-            {congiunction}{" "}
-          </Body>
-          {instructionComponent}
+          <IOMarkdown
+            content={I18n.t(
+              "identification.instructions.useFingerPrintOrUnlockCode"
+            )}
+            rules={generatePragraphRule()}
+          />
         </View>
       );
     case "FACE_ID":
@@ -146,12 +112,12 @@ export const IdentificationInstructionsComponent = (props: {
           accessibilityLabel={a11yInstruction}
           style={IOStyles.row}
         >
-          {instructionComponentWithFaceId}
-          <Body color="white" weight="Regular">
-            {" "}
-            {congiunction}{" "}
-          </Body>
-          {instructionComponent}
+          <IOMarkdown
+            content={I18n.t(
+              "identification.instructions.useFaceIdOrUnlockCode"
+            )}
+            rules={generatePragraphRule()}
+          />
         </View>
       );
     default: