feat(Bonus Pagamenti Digitali): [#175683801] When credit card has been added, join BPD or enroll the new method to BPD

ts/features/wallet/onboarding/bancomat/navigation/action.ts

@@ -1,4 +1,6 @@
 import { NavigationActions } from "react-navigation";
+import { InferNavigationParams } from "../../../../../types/react";
+import ActivateBpdOnNewBancomatScreen from "../screens/bpd/ActivateBpdOnNewPaymentMethodScreen";
 import WALLET_ONBOARDING_BANCOMAT_ROUTES from "./routes";
 
 export const navigateToOnboardingBancomatChooseBank = () =>
@@ -21,7 +23,10 @@ export const navigateToSuggestBpdActivation = () =>
     routeName: WALLET_ONBOARDING_BANCOMAT_ROUTES.SUGGEST_BPD_ACTIVATION
   });
 
-export const navigateToActivateBpdOnNewBancomat = () =>
+export const navigateToActivateBpdOnNewMethod = (
+  params?: InferNavigationParams<typeof ActivateBpdOnNewBancomatScreen>
+) =>
   NavigationActions.navigate({
-    routeName: WALLET_ONBOARDING_BANCOMAT_ROUTES.ACTIVATE_BPD_NEW_BANCOMAT
+    routeName: WALLET_ONBOARDING_BANCOMAT_ROUTES.ACTIVATE_BPD_NEW_BANCOMAT,
+    params
   });

ts/features/wallet/onboarding/bancomat/navigation/navigator.ts

@@ -1,5 +1,5 @@
 import { createStackNavigator } from "react-navigation";
-import ActivateBpdOnNewBancomatScreen from "../screens/bpd/ActivateBpdOnNewBancomatScreen";
+import ActivateBpdOnNewBancomatScreen from "../screens/bpd/ActivateBpdOnNewPaymentMethodScreen";
 import SuggestBpdActivationScreen from "../screens/bpd/SuggestBpdActivationScreen";
 import SearchBankScreen from "../screens/search/SearchBankScreen";
 import SearchAvailableUserBancomatScreen from "../screens/searchBancomat/SearchAvailableUserBancomatScreen";

ts/features/wallet/onboarding/bancomat/saga/orchestration/addBancomatToWallet.ts

@@ -9,7 +9,7 @@ import { navigationCurrentRouteSelector } from "../../../../../../store/reducers
 import { SagaCallReturnType } from "../../../../../../types/utils";
 import { isBpdEnabled } from "../../../../../bonus/bpd/saga/orchestration/onboarding/startOnboarding";
 import {
-  navigateToActivateBpdOnNewBancomat,
+  navigateToActivateBpdOnNewMethod,
   navigateToOnboardingBancomatChooseBank,
   navigateToSuggestBpdActivation
 } from "../../navigation/action";
@@ -113,7 +113,7 @@ function* activateBpdOnNewBancomat() {
   } else {
     if (isBpdEnabledResponse.value) {
       // navigate to onboarding new bancomat
-      yield put(navigateToActivateBpdOnNewBancomat());
+      yield put(navigateToActivateBpdOnNewMethod());
     } else {
       // navigate to "ask if u want to start bpd onboarding"
       yield put(navigateToSuggestBpdActivation());

ts/features/wallet/onboarding/bancomat/screens/bpd/ActivateBpdOnNewBancomatScreen.tsx → ts/features/wallet/onboarding/bancomat/screens/bpd/ActivateBpdOnNewPaymentMethodScreen.tsx

@@ -1,7 +1,7 @@
 import { View } from "native-base";
 import * as React from "react";
 import { SafeAreaView, ScrollView } from "react-native";
-import { NavigationActions } from "react-navigation";
+import { NavigationActions, NavigationScreenProps } from "react-navigation";
 import { connect } from "react-redux";
 import { Dispatch } from "redux";
 import { Body } from "../../../../../../components/core/typography/Body";
@@ -13,9 +13,17 @@ import { GlobalState } from "../../../../../../store/reducers/types";
 import { FooterTwoButtons } from "../../../../../bonus/bonusVacanze/components/markdown/FooterTwoButtons";
 import { PaymentMethodRawList } from "../../../../../bonus/bpd/components/paymentMethodActivationToggle/list/PaymentMethodRawList";
 import { onboardingBancomatAddedPansSelector } from "../../store/reducers/addedPans";
+import { PatchedWalletV2 } from "../../../../../../types/pagopa";
+
+type ActivateBpdOnNewPaymentMethodScreen = {
+  newAddedMethods?: ReadonlyArray<PatchedWalletV2>;
+};
+
+type OwnProps = NavigationScreenProps<ActivateBpdOnNewPaymentMethodScreen>;
 
 export type Props = ReturnType<typeof mapDispatchToProps> &
-  ReturnType<typeof mapStateToProps>;
+  ReturnType<typeof mapStateToProps> &
+  OwnProps;
 
 const loadLocales = () => ({
   headerTitle: I18n.t("wallet.onboarding.bancomat.headerTitle"),
@@ -26,8 +34,12 @@ const loadLocales = () => ({
   continueStr: I18n.t("global.buttons.continue")
 });
 
-const ActivateBpdOnNewBancomatScreen: React.FunctionComponent<Props> = props => {
+const ActivateBpdOnNewPaymentMethodScreen: React.FunctionComponent<Props> = props => {
   const { headerTitle, title, body1, body2, skip, continueStr } = loadLocales();
+  // show new added methods from navigation params
+  // if they aren't, read the new bancomat added from the store
+  const newMethodsAdded =
+    props.navigation.getParam("newAddedMethods") ?? props.newBancomat;
   return (
     <BaseScreenComponent headerTitle={headerTitle}>
       <SafeAreaView style={IOStyles.flex}>
@@ -38,7 +50,7 @@ const ActivateBpdOnNewBancomatScreen: React.FunctionComponent<Props> = props =>
             <View spacer={true} large={true} />
             <Body>{body1}</Body>
             <View spacer={true} large={true} />
-            <PaymentMethodRawList paymentList={props.newBancomat} />
+            <PaymentMethodRawList paymentList={newMethodsAdded} />
             <View spacer={true} large={true} />
             <Body>{body2}</Body>
           </View>
@@ -67,4 +79,4 @@ const mapStateToProps = (state: GlobalState) => ({
 export default connect(
   mapStateToProps,
   mapDispatchToProps
-)(ActivateBpdOnNewBancomatScreen);
+)(ActivateBpdOnNewPaymentMethodScreen);

ts/sagas/wallet.ts

@@ -95,6 +95,7 @@ import { isProfileEmailValidatedSelector } from "../store/reducers/profile";
 import { GlobalState } from "../store/reducers/types";
 
 import {
+  EnableableFunctionsTypeEnum,
   NullableWallet,
   PaymentManagerToken,
   PayRequest
@@ -126,6 +127,14 @@ import {
 } from "./wallet/pagopaApis";
 import { getTransactionsRead } from "../store/reducers/entities/readTransactions";
 import _ from "lodash";
+import { hasFunctionEnabled } from "../utils/walletv2";
+import { bpdEnabledSelector } from "../features/bonus/bpd/store/reducers/details/activation";
+import { isReady } from "../features/bonus/bpd/model/RemoteValue";
+import {
+  navigateToActivateBpdOnNewMethod,
+  navigateToSuggestBpdActivation
+} from "../features/wallet/onboarding/bancomat/navigation/action";
+import { navigationHistoryPop } from "../store/actions/navigationHistory";
 
 /**
  * Configure the max number of retries and delay between retries when polling
@@ -298,7 +307,36 @@ function* startOrResumeAddCreditCardSaga(
       const maybeAddedWallet = updatedWallets.find(
         _ => _.idWallet === idWallet
       );
+      // if the new method has been added
       if (maybeAddedWallet !== undefined) {
+        const bpdEnroll: ReturnType<typeof bpdEnabledSelector> = yield select(
+          bpdEnabledSelector
+        );
+        // check if the new method is compliant with bpd
+        if (bpdEnabled && maybeAddedWallet.v2) {
+          const hasBpdFeature = hasFunctionEnabled(
+            maybeAddedWallet.v2,
+            EnableableFunctionsTypeEnum.BPD
+          );
+          // if the method is bpd compliant check if we have info about bpd activation
+          if (hasBpdFeature && isReady(bpdEnroll)) {
+            // if bdp is active navigate to a screen where it asked to enroll that method in bpd
+            // otherwise navigate to a screen where is asked to join bpd
+            if (bpdEnroll.value) {
+              yield put(
+                navigateToActivateBpdOnNewMethod({
+                  newAddedMethods: [maybeAddedWallet.v2]
+                })
+              );
+            } else {
+              yield put(navigateToSuggestBpdActivation());
+            }
+            // remove these screen from the navigation stack: method choice, credit card form, credit card resume
+            yield put(navigationHistoryPop(3));
+            return;
+          }
+        }
+
         // dispatch the action: a new card has been added
         yield put(addWalletNewCreditCardSuccess());
         if (action.payload.setAsFavorite === true) {