From 6aef8336d70edaf5710c06df69e256861c5ecff2 Mon Sep 17 00:00:00 2001
From: Damiano Plebani <damiano.plebani@pagopa.it>
Date: Wed, 31 Jan 2024 15:52:35 +0100
Subject: [PATCH] chore: [IOAPPX-240] Replace legacy `FooterWithButtons` in the
 `ShareDataScreen` (#5471)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## Short description
This PR replaces the legacy `FooterWithButtons` in the _Share data_
screen

## List of changes proposed in this pull request
- Replace the legacy `FooterWithButtons` with the new one

### Preview
| Before | After |
|--------|--------|
| ![Simulator Screenshot - iPhone 14 Pro - 2024-01-31 at 15 14
57](https://github.com/pagopa/io-app/assets/1255491/61990b06-ef00-4d40-bb69-6ad037e6d042)
| ![Simulator Screenshot - iPhone 14 Pro - 2024-01-31 at 15 12
28](https://github.com/pagopa/io-app/assets/1255491/9781cfcd-6edf-4f8c-9770-505741e7aa34)
|

## How to test
Go to the **Profile** → **Privacy & Policy** → **Share your data**
---
 ts/screens/profile/ShareDataScreen.tsx | 70 +++++++++++++++-----------
 1 file changed, 40 insertions(+), 30 deletions(-)

diff --git a/ts/screens/profile/ShareDataScreen.tsx b/ts/screens/profile/ShareDataScreen.tsx
index c015e90fbd6..1c611526cde 100644
--- a/ts/screens/profile/ShareDataScreen.tsx
+++ b/ts/screens/profile/ShareDataScreen.tsx
@@ -1,13 +1,13 @@
+import {
+  BlockButtonProps,
+  FooterWithButtons
+} from "@pagopa/io-app-design-system";
 import * as React from "react";
 import { SafeAreaView, View } from "react-native";
 import { connect } from "react-redux";
 import { Dispatch } from "redux";
-import {
-  cancelButtonProps,
-  confirmButtonProps
-} from "../../components/buttons/ButtonConfigurations";
+import { IOToast } from "../../components/Toast";
 import { IOStyles } from "../../components/core/variables/IOStyles";
-import FooterWithButtons from "../../components/ui/FooterWithButtons";
 import { RNavScreenWithLargeHeader } from "../../components/ui/RNavScreenWithLargeHeader";
 import I18n from "../../i18n";
 import { setMixpanelEnabled } from "../../store/actions/mixpanel";
@@ -15,7 +15,6 @@ import { isMixpanelEnabled } from "../../store/reducers/persistedPreferences";
 import { GlobalState } from "../../store/reducers/types";
 import { getFlowType } from "../../utils/analytics";
 import { useOnFirstRender } from "../../utils/hooks/useOnFirstRender";
-import { showToast } from "../../utils/showToast";
 import { trackMixpanelScreen } from "./analytics";
 import {
   trackMixpanelDeclined,
@@ -33,9 +32,8 @@ const ShareDataScreen = (props: Props): React.ReactElement => {
     trackMixpanelDeclined(flow);
     trackMixpanelSetEnabled(false, flow);
     props.setMixpanelEnabled(false);
-    showToast(
-      I18n.t("profile.main.privacy.shareData.screen.confirmToast"),
-      "success"
+    IOToast.success(
+      I18n.t("profile.main.privacy.shareData.screen.confirmToast")
     );
   });
   const isMixpanelEnabled = props.isMixpanelEnabled ?? true;
@@ -44,24 +42,38 @@ const ShareDataScreen = (props: Props): React.ReactElement => {
     trackMixpanelScreen(getFlowType(false, false));
   });
 
-  const buttonProps = isMixpanelEnabled
-    ? cancelButtonProps(
-        present,
-        I18n.t("profile.main.privacy.shareData.screen.cta.dontShareData")
-      )
-    : confirmButtonProps(
-        () => {
-          trackMixpanelSetEnabled(true, getFlowType(false, false));
-          props.setMixpanelEnabled(true);
-          showToast(
-            I18n.t("profile.main.privacy.shareData.screen.confirmToast"),
-            "success"
-          );
-        },
-        I18n.t("profile.main.privacy.shareData.screen.cta.shareData"),
-        undefined,
-        "share-data-confirm-button"
-      );
+  const buttonProps: BlockButtonProps = isMixpanelEnabled
+    ? {
+        type: "Outline",
+        buttonProps: {
+          color: "primary",
+          accessibilityLabel: I18n.t(
+            "profile.main.privacy.shareData.screen.cta.dontShareData"
+          ),
+          onPress: present,
+          label: I18n.t(
+            "profile.main.privacy.shareData.screen.cta.dontShareData"
+          )
+        }
+      }
+    : {
+        type: "Solid",
+        buttonProps: {
+          color: "primary",
+          accessibilityLabel: I18n.t(
+            "profile.main.privacy.shareData.screen.cta.dontShareData"
+          ),
+          onPress: () => {
+            trackMixpanelSetEnabled(true, getFlowType(false, false));
+            props.setMixpanelEnabled(true);
+            IOToast.success(
+              I18n.t("profile.main.privacy.shareData.screen.confirmToast")
+            );
+          },
+          label: I18n.t("profile.main.privacy.shareData.screen.cta.shareData"),
+          testID: "share-data-confirm-button"
+        }
+      };
 
   return (
     <RNavScreenWithLargeHeader
@@ -69,9 +81,7 @@ const ShareDataScreen = (props: Props): React.ReactElement => {
       titleTestID={"share-data-component-title"}
       description={I18n.t("profile.main.privacy.shareData.screen.description")}
       fixedBottomSlot={
-        <SafeAreaView>
-          <FooterWithButtons type={"SingleButton"} leftButton={buttonProps} />
-        </SafeAreaView>
+        <FooterWithButtons type="SingleButton" primary={buttonProps} />
       }
     >
       <SafeAreaView style={IOStyles.flex}>