feat: [IOPID-1550] - Download User Data new DS integration

locales/de/index.yml

@@ -338,11 +338,8 @@ profile:
           answer_3: "Ich habe die App nie benutzt"
           answer_4: "Keiner der oben genannten Punkte"
       exportData:
-        cta: "Kopie deiner Daten anfordern"
         title: "Zugriff auf deine Daten"
         description: "Du erhältst eine Kopie der mit deinem IO-Profil verbundenen Daten"
-        info:
-          title: "Du kannst deine IO-Profilinformationen jederzeit herunterladen."
         alert:
           requestTitle: "Möchtest du wirklich all deine Daten exportieren?"
           oldRequest: "Wir bearbeiten bereits eine Anfrage zum Datenexport"

locales/en/index.yml

@@ -376,12 +376,25 @@ profile:
           body: "We've taken over your request and we will delete your account within 30 days. You can re-subscribe to the IO App at any time with SPID or CIE."
           cta: Close
       exportData:
-        cta: Request a copy of your data
+        cta: Ask for a copy of the data
         title: Access your data
+        subtitle: You can download your IO profile data at any time.
         description: Receive a copy of the data associated with your IO profile
-        info:
-          title: You can download your IO profile information at any time.
-          body: !include profile/profile_download_data.md
+        detail:
+          bulletList:
+            title: "Your data are:"
+            item1: your tax code;
+            item2: your email address and, if applicable, confirmation of its validation;
+            item3: the text of the Messages you received;
+            item4: your notification preferences.
+          paragraph1: The information will be downloaded in YAML format, a standard format for exchanging data between different applications.
+          paragraph2: 
+            part1: "You will get "
+            part2: "a message on IO "
+            part3: with a link and password that lasts 15 days. 
+          paragraph3: 
+            part1: For more information see the.
+            link:  IO Privacy Policy.
         alert:
           requestTitle: Are you sure you want to export all your data?
           oldRequest: We are already proceeding to export all your data

locales/it/index.yml

@@ -376,12 +376,25 @@ profile:
           body: Il tuo profilo verrà eliminato entro 30 giorni. Puoi tornare nuovamente su IO in qualsiasi momento entrando con SPID o CIE.
           cta: Chiudi
       exportData:
-        cta: Richiedi copia dei tuoi dati
+        cta: Richiedi una copia dei dati
         title: Accedi ai tuoi dati
+        subtitle: Puoi scaricare i dati principali del tuo profilo IO in qualsiasi momento.
         description: Ricevi una copia dei dati associati al tuo profilo IO
-        info:
-          title: Puoi scaricare le informazioni relative al tuo profilo IO in qualsiasi momento.
-          body: !include profile/profile_download_data.md
+        detail:
+          bulletList:
+            title: "I dati sono:"
+            item1: il tuo codice fiscale;
+            item2: l’indirizzo email da te indicato e, nel caso, la conferma della sua validazione;
+            item3: il testo dei Messaggi che hai ricevuto;
+            item4: le tue preferenze di notifica.
+          paragraph1: Le informazioni saranno scaricate in formato YAML, un formato standard che in informatica consente lo scambio di dati fra applicazioni diverse.
+          paragraph2: 
+            part1: "Riceverai un "
+            part2: "messaggio su IO "
+            part3: in cui sono presenti un link e una password validi per 15 giorni. 
+          paragraph3: 
+            part1: Per maggiori informazioni consulta l’
+            link: Informativa privacy di IO.
         alert:
           requestTitle: Vuoi davvero esportare tutti i tuoi dati?
           oldRequest: Abbiamo già preso in carico una richiesta di esportazione dei dati.

ts/components/BulletList.tsx

@@ -1,14 +1,24 @@
 import { View } from "react-native";
 import React, { ComponentProps, memo, useCallback } from "react";
-import { Body, IOSpacer, VSpacer } from "@pagopa/io-app-design-system";
+import {
+  Body,
+  HSpacer,
+  IOSpacer,
+  IOStyles,
+  VSpacer
+} from "@pagopa/io-app-design-system";
+import {
+  BodyProps,
+  ComposedBodyFromArray
+} from "./core/typography/ComposedBodyFromArray";
 
 const BULLET_ITEM = "\u2022";
 
-type ListItem = {
+export type BulletListItem = {
   /**
    * The text of the list item.
    */
-  value: string;
+  value: string | Array<BodyProps>;
   /**
    * The id used as key, it must be unique.
    */
@@ -20,7 +30,7 @@ type ListItem = {
   /**
    * Nested list.
    */
-  list?: Array<Omit<ListItem, "list">>;
+  list?: Array<Omit<BulletListItem, "list">>;
 };
 
 type Props = {
@@ -31,7 +41,7 @@ type Props = {
   /**
    * The list to display bullet items.
    */
-  list: Array<ListItem>;
+  list: Array<BulletListItem>;
   /**
    * Title extra props.
    */
@@ -43,10 +53,10 @@ type Props = {
 };
 
 /**
- * This component renders a bullet list. It supports two levels of nesting, so the first level `ListItem` can contain a `list` prop.
+ * This component renders a bullet list. It supports two levels of nesting, so the first level `BulletListItem` can contain a `list` prop.
  *
  * @param {string} title The bullet list title.
- * @param {Array<ListItem>} list The array used to render the bullet list.
+ * @param {Array<BulletListItem>} list The array used to render the bullet list.
  * @param {ComponentProps<typeof Body>} [titleProps] Used to customize title.
  * @param {IOSpacer} [spacing] Used to define list item indentation and space between title and list.
  * @returns {JSX.Element} The rendered component.
@@ -71,16 +81,23 @@ type Props = {
 export const BulletList = memo(
   ({ title, list, spacing = 8, titleProps = {} }: Props) => {
     /**
-     * @param {Array<ListItem>} [list] The list to iterate.
+     * @param {Array<BulletListItem>} [list] The list to iterate.
      * @param {number} [count=0] The number a recursive calls, used to stop the cycle when nesting level is equal to two.
      * @returns {JSX.Element} The rendered list.
      */
     const renderListItems = useCallback(
-      (list?: Array<ListItem>, count: number = 0) =>
+      (list?: Array<BulletListItem>, count: number = 0) =>
         list?.map(({ id, value, textProps = {}, ...rest }) => (
-          <View key={id} style={{ paddingLeft: spacing }} {...textProps}>
-            <Body>
-              {BULLET_ITEM} {value}
+          <View key={id} style={IOStyles.row}>
+            <HSpacer size={spacing} />
+            <Body>{BULLET_ITEM}</Body>
+            <HSpacer size={spacing} />
+            <Body {...textProps}>
+              {Array.isArray(value) ? (
+                <ComposedBodyFromArray body={value} />
+              ) : (
+                value
+              )}
             </Body>
             {"list" in rest &&
               count === 0 &&
@@ -94,7 +111,9 @@ export const BulletList = memo(
       <View>
         <Body {...titleProps}>{title}</Body>
         <VSpacer size={spacing} />
-        {renderListItems(list)}
+        <View accessible={true} accessibilityRole="list">
+          {renderListItems(list)}
+        </View>
       </View>
     );
   }