From fc9783a17adca4a4f765c8146fc4ebc437295ec8 Mon Sep 17 00:00:00 2001 From: Fabrizio Date: Thu, 26 Nov 2020 19:59:54 +0100 Subject: [PATCH 01/24] [#175883764] screen and navigation for satispay --- .../onboarding/bancomat/navigation/action.ts | 2 +- .../bancomat/navigation/navigator.ts | 6 ++-- .../ActivateBpdOnNewBancomatScreen.tsx | 16 ++++++++++ .../bpd/ActivateBpdOnNewBancomatScreen.tsx | 15 --------- .../bpd/ActivateBpdOnNewCreditCardScreen.tsx | 0 .../ActivateBpdOnNewPaymentMethodScreen.tsx | 0 .../bpd/SuggestBpdActivationScreen.tsx | 0 .../onboarding/satispay/navigation/action.ts | 27 ++++++++++++++++ .../satispay/navigation/navigator.ts | 32 +++++++++++++++++++ .../onboarding/satispay/navigation/routes.ts | 13 ++++++++ .../satispay/saga/networking/index.ts | 3 +- .../ActivateBpdOnNewSatispayScreen.tsx | 17 ++++++++++ .../screens/StartSatispaySearchScreen.tsx | 26 +++++++++++++++ .../add/AddSatispayScreen.tsx} | 0 .../LoadAddSatispayComponent.tsx} | 0 .../screens/search/SatispayKoNotFound.tsx | 0 .../screens/search/SatispayKoTimeout.tsx | 0 .../search/SearchSatispayManagerScreen.tsx | 0 ts/navigation/MainNavigator.tsx | 2 ++ 19 files changed, 138 insertions(+), 21 deletions(-) create mode 100644 ts/features/wallet/onboarding/bancomat/screens/ActivateBpdOnNewBancomatScreen.tsx delete mode 100644 ts/features/wallet/onboarding/bancomat/screens/bpd/ActivateBpdOnNewBancomatScreen.tsx rename ts/features/wallet/onboarding/{bancomat => common}/screens/bpd/ActivateBpdOnNewCreditCardScreen.tsx (100%) rename ts/features/wallet/onboarding/{bancomat => common}/screens/bpd/ActivateBpdOnNewPaymentMethodScreen.tsx (100%) rename ts/features/wallet/onboarding/{bancomat => common}/screens/bpd/SuggestBpdActivationScreen.tsx (100%) create mode 100644 ts/features/wallet/onboarding/satispay/navigation/action.ts create mode 100644 ts/features/wallet/onboarding/satispay/navigation/navigator.ts create mode 100644 ts/features/wallet/onboarding/satispay/navigation/routes.ts create mode 100644 ts/features/wallet/onboarding/satispay/screens/ActivateBpdOnNewSatispayScreen.tsx create mode 100644 ts/features/wallet/onboarding/satispay/screens/StartSatispaySearchScreen.tsx rename ts/features/wallet/onboarding/satispay/{navigation/placeholder => screens/add/AddSatispayScreen.tsx} (100%) rename ts/features/wallet/onboarding/satispay/screens/{placeholder => add/LoadAddSatispayComponent.tsx} (100%) create mode 100644 ts/features/wallet/onboarding/satispay/screens/search/SatispayKoNotFound.tsx create mode 100644 ts/features/wallet/onboarding/satispay/screens/search/SatispayKoTimeout.tsx create mode 100644 ts/features/wallet/onboarding/satispay/screens/search/SearchSatispayManagerScreen.tsx diff --git a/ts/features/wallet/onboarding/bancomat/navigation/action.ts b/ts/features/wallet/onboarding/bancomat/navigation/action.ts index 8bf210d342a..b2041d086b3 100644 --- a/ts/features/wallet/onboarding/bancomat/navigation/action.ts +++ b/ts/features/wallet/onboarding/bancomat/navigation/action.ts @@ -1,6 +1,6 @@ import { NavigationActions } from "react-navigation"; import { InferNavigationParams } from "../../../../../types/react"; -import { ActivateBpdOnNewCreditCardScreen } from "../screens/bpd/ActivateBpdOnNewCreditCardScreen"; +import { ActivateBpdOnNewCreditCardScreen } from "../../common/screens/bpd/ActivateBpdOnNewCreditCardScreen"; import WALLET_ONBOARDING_BANCOMAT_ROUTES from "./routes"; export const navigateToOnboardingBancomatChooseBank = () => diff --git a/ts/features/wallet/onboarding/bancomat/navigation/navigator.ts b/ts/features/wallet/onboarding/bancomat/navigation/navigator.ts index 46e521ef39a..8d8ecb5e395 100644 --- a/ts/features/wallet/onboarding/bancomat/navigation/navigator.ts +++ b/ts/features/wallet/onboarding/bancomat/navigation/navigator.ts @@ -1,9 +1,9 @@ import { createStackNavigator } from "react-navigation"; -import SuggestBpdActivationScreen from "../screens/bpd/SuggestBpdActivationScreen"; +import SuggestBpdActivationScreen from "../../common/screens/bpd/SuggestBpdActivationScreen"; import SearchBankScreen from "../screens/search/SearchBankScreen"; import SearchAvailableUserBancomatScreen from "../screens/searchBancomat/SearchAvailableUserBancomatScreen"; -import { ActivateBpdOnNewCreditCardScreen } from "../screens/bpd/ActivateBpdOnNewCreditCardScreen"; -import ActivateBpdOnNewBancomatScreen from "../screens/bpd/ActivateBpdOnNewBancomatScreen"; +import { ActivateBpdOnNewCreditCardScreen } from "../../common/screens/bpd/ActivateBpdOnNewCreditCardScreen"; +import ActivateBpdOnNewBancomatScreen from "../screens/ActivateBpdOnNewBancomatScreen"; import WALLET_ONBOARDING_BANCOMAT_ROUTES from "./routes"; const PaymentMethodOnboardingBancomatNavigator = createStackNavigator( diff --git a/ts/features/wallet/onboarding/bancomat/screens/ActivateBpdOnNewBancomatScreen.tsx b/ts/features/wallet/onboarding/bancomat/screens/ActivateBpdOnNewBancomatScreen.tsx new file mode 100644 index 00000000000..9b6aa43a8cf --- /dev/null +++ b/ts/features/wallet/onboarding/bancomat/screens/ActivateBpdOnNewBancomatScreen.tsx @@ -0,0 +1,16 @@ +import * as React from "react"; +import { connect } from "react-redux"; +import { onboardingBancomatAddedPansSelector } from "../store/reducers/addedPans"; +import { GlobalState } from "../../../../../store/reducers/types"; +import ActivateBpdOnNewPaymentMethodScreen from "../../common/screens/bpd/ActivateBpdOnNewPaymentMethodScreen"; + +type Props = ReturnType; + +const ActivateBpdOnNewBancomatScreen = (props: Props) => ( + +); + +const mapStateToProps = (state: GlobalState) => ({ + newBancomat: onboardingBancomatAddedPansSelector(state) +}); +export default connect(mapStateToProps)(ActivateBpdOnNewBancomatScreen); diff --git a/ts/features/wallet/onboarding/bancomat/screens/bpd/ActivateBpdOnNewBancomatScreen.tsx b/ts/features/wallet/onboarding/bancomat/screens/bpd/ActivateBpdOnNewBancomatScreen.tsx deleted file mode 100644 index 39074127120..00000000000 --- a/ts/features/wallet/onboarding/bancomat/screens/bpd/ActivateBpdOnNewBancomatScreen.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import * as React from "react"; -import { connect } from "react-redux"; -import { onboardingBancomatAddedPansSelector } from "../../store/reducers/addedPans"; -import { GlobalState } from "../../../../../../store/reducers/types"; -import ActivateBpdOnNewPaymentMethodScreen from "./ActivateBpdOnNewPaymentMethodScreen"; -export type Props = ReturnType; - -const ActivateBpdOnNewBancomatScreen: React.FC = (props: Props) => ( - -); - -const mapStateToProps = (state: GlobalState) => ({ - newBancomat: onboardingBancomatAddedPansSelector(state) -}); -export default connect(mapStateToProps)(ActivateBpdOnNewBancomatScreen); diff --git a/ts/features/wallet/onboarding/bancomat/screens/bpd/ActivateBpdOnNewCreditCardScreen.tsx b/ts/features/wallet/onboarding/common/screens/bpd/ActivateBpdOnNewCreditCardScreen.tsx similarity index 100% rename from ts/features/wallet/onboarding/bancomat/screens/bpd/ActivateBpdOnNewCreditCardScreen.tsx rename to ts/features/wallet/onboarding/common/screens/bpd/ActivateBpdOnNewCreditCardScreen.tsx diff --git a/ts/features/wallet/onboarding/bancomat/screens/bpd/ActivateBpdOnNewPaymentMethodScreen.tsx b/ts/features/wallet/onboarding/common/screens/bpd/ActivateBpdOnNewPaymentMethodScreen.tsx similarity index 100% rename from ts/features/wallet/onboarding/bancomat/screens/bpd/ActivateBpdOnNewPaymentMethodScreen.tsx rename to ts/features/wallet/onboarding/common/screens/bpd/ActivateBpdOnNewPaymentMethodScreen.tsx diff --git a/ts/features/wallet/onboarding/bancomat/screens/bpd/SuggestBpdActivationScreen.tsx b/ts/features/wallet/onboarding/common/screens/bpd/SuggestBpdActivationScreen.tsx similarity index 100% rename from ts/features/wallet/onboarding/bancomat/screens/bpd/SuggestBpdActivationScreen.tsx rename to ts/features/wallet/onboarding/common/screens/bpd/SuggestBpdActivationScreen.tsx diff --git a/ts/features/wallet/onboarding/satispay/navigation/action.ts b/ts/features/wallet/onboarding/satispay/navigation/action.ts new file mode 100644 index 00000000000..c8bcd17fb95 --- /dev/null +++ b/ts/features/wallet/onboarding/satispay/navigation/action.ts @@ -0,0 +1,27 @@ +import { NavigationActions } from "react-navigation"; +import WALLET_ONBOARDING_SATISPAY_ROUTES from "./routes"; + +export const navigateToOnboardingSatispayStart = () => + NavigationActions.navigate({ + routeName: WALLET_ONBOARDING_SATISPAY_ROUTES.START + }); + +export const navigateToOnboardingSatispaySearchAvailableUserAccount = () => + NavigationActions.navigate({ + routeName: WALLET_ONBOARDING_SATISPAY_ROUTES.SEARCH_AVAILABLE_USER_SATISPAY + }); + +export const navigateToOnboardingSatispayAdd = () => + NavigationActions.navigate({ + routeName: WALLET_ONBOARDING_SATISPAY_ROUTES.ADD_SATISPAY + }); + +export const navigateToSuggestBpdActivation = () => + NavigationActions.navigate({ + routeName: WALLET_ONBOARDING_SATISPAY_ROUTES.SUGGEST_BPD_ACTIVATION + }); + +export const navigateToActivateBpdOnNewSatispay = () => + NavigationActions.navigate({ + routeName: WALLET_ONBOARDING_SATISPAY_ROUTES.ACTIVATE_BPD_NEW_SATISPAY + }); diff --git a/ts/features/wallet/onboarding/satispay/navigation/navigator.ts b/ts/features/wallet/onboarding/satispay/navigation/navigator.ts new file mode 100644 index 00000000000..eb99ef327a7 --- /dev/null +++ b/ts/features/wallet/onboarding/satispay/navigation/navigator.ts @@ -0,0 +1,32 @@ +import { createStackNavigator } from "react-navigation"; +import SuggestBpdActivationScreen from "../../common/screens/bpd/SuggestBpdActivationScreen"; +import ActivateBpdOnNewSatispayScreen from "../screens/ActivateBpdOnNewSatispayScreen"; +import SearchSatispayManagerScreen from "../screens/search/SearchSatispayManagerScreen"; +import StartSatispaySearchScreen from "../screens/StartSatispaySearchScreen"; +import WALLET_ONBOARDING_SATISPAY_ROUTES from "./routes"; + +const PaymentMethodOnboardingSatispayNavigator = createStackNavigator( + { + [WALLET_ONBOARDING_SATISPAY_ROUTES.START]: { + screen: StartSatispaySearchScreen + }, + [WALLET_ONBOARDING_SATISPAY_ROUTES.SEARCH_AVAILABLE_USER_SATISPAY]: { + screen: SearchSatispayManagerScreen + }, + [WALLET_ONBOARDING_SATISPAY_ROUTES.SUGGEST_BPD_ACTIVATION]: { + screen: SuggestBpdActivationScreen + }, + [WALLET_ONBOARDING_SATISPAY_ROUTES.ACTIVATE_BPD_NEW_SATISPAY]: { + screen: ActivateBpdOnNewSatispayScreen + } + }, + { + // Let each screen handle the header and navigation + headerMode: "none", + defaultNavigationOptions: { + gesturesEnabled: false + } + } +); + +export default PaymentMethodOnboardingSatispayNavigator; diff --git a/ts/features/wallet/onboarding/satispay/navigation/routes.ts b/ts/features/wallet/onboarding/satispay/navigation/routes.ts new file mode 100644 index 00000000000..96bf1f09828 --- /dev/null +++ b/ts/features/wallet/onboarding/satispay/navigation/routes.ts @@ -0,0 +1,13 @@ +const WALLET_ONBOARDING_SATISPAY_ROUTES = { + MAIN: "WALLET_ONBOARDING_SATISPAY_MAIN", + + START: "WALLET_ONBOARDING_SATISPAY_START", + SEARCH_AVAILABLE_USER_SATISPAY: + "WALLET_ONBOARDING_SATISPAY_SEARCH_AVAILABLE_USER_SATISPAY", + + ADD_SATISPAY: "WALLET_ONBOARDING_SATISPAY_ADD", + SUGGEST_BPD_ACTIVATION: "WALLET_ONBOARDING_SATISPAY_SUGGEST_BPD_ACTIVATION", + ACTIVATE_BPD_NEW_SATISPAY: "WALLET_ONBOARDING_SATISPAY_ACTIVATE_BPD_NEW" +}; + +export default WALLET_ONBOARDING_SATISPAY_ROUTES; diff --git a/ts/features/wallet/onboarding/satispay/saga/networking/index.ts b/ts/features/wallet/onboarding/satispay/saga/networking/index.ts index f7c09e8dc88..922094e33b3 100644 --- a/ts/features/wallet/onboarding/satispay/saga/networking/index.ts +++ b/ts/features/wallet/onboarding/satispay/saga/networking/index.ts @@ -5,7 +5,6 @@ import { ActionType } from "typesafe-actions"; import { PaymentManagerClient } from "../../../../../../api/pagopa"; import { SessionManager } from "../../../../../../utils/SessionManager"; import { PaymentManagerToken } from "../../../../../../types/pagopa"; -import { searchUserPans } from "../../../bancomat/store/actions"; import { SagaCallReturnType } from "../../../../../../types/utils"; import { searchUserSatispay } from "../../store/actions"; import { getError, getNetworkError } from "../../../../../../utils/errors"; @@ -59,7 +58,7 @@ export function* handleSearchUserSatispay( ); } } catch (e) { - return yield put(searchUserPans.failure(getNetworkError(e))); + return yield put(searchUserSatispay.failure(getNetworkError(e))); } } diff --git a/ts/features/wallet/onboarding/satispay/screens/ActivateBpdOnNewSatispayScreen.tsx b/ts/features/wallet/onboarding/satispay/screens/ActivateBpdOnNewSatispayScreen.tsx new file mode 100644 index 00000000000..0af8091da73 --- /dev/null +++ b/ts/features/wallet/onboarding/satispay/screens/ActivateBpdOnNewSatispayScreen.tsx @@ -0,0 +1,17 @@ +import * as React from "react"; +import { connect } from "react-redux"; +import { GlobalState } from "../../../../../store/reducers/types"; +import { onboardingBancomatAddedPansSelector } from "../../bancomat/store/reducers/addedPans"; +import ActivateBpdOnNewPaymentMethodScreen from "../../common/screens/bpd/ActivateBpdOnNewPaymentMethodScreen"; + +type Props = ReturnType; + +const ActivateBpdOnNewSatispayScreen = (props: Props) => ( + +); + +const mapStateToProps = (state: GlobalState) => ({ + // TODO : replace with onboarding satispay selector + newSatispay: onboardingBancomatAddedPansSelector(state) +}); +export default connect(mapStateToProps)(ActivateBpdOnNewSatispayScreen); diff --git a/ts/features/wallet/onboarding/satispay/screens/StartSatispaySearchScreen.tsx b/ts/features/wallet/onboarding/satispay/screens/StartSatispaySearchScreen.tsx new file mode 100644 index 00000000000..98ce5589302 --- /dev/null +++ b/ts/features/wallet/onboarding/satispay/screens/StartSatispaySearchScreen.tsx @@ -0,0 +1,26 @@ +import { View } from "native-base"; +import * as React from "react"; +import { connect } from "react-redux"; +import { Dispatch } from "redux"; +import { GlobalState } from "../../../../../store/reducers/types"; + +type Props = ReturnType & + ReturnType; + +/** + * Entrypoint for the satispay onboarding. The user can choose to start the search or + * cancel and return back. + * @constructor + */ +const StartSatispaySearchScreen: React.FunctionComponent = () => ( + +); + +const mapDispatchToProps = (_: Dispatch) => ({}); + +const mapStateToProps = (_: GlobalState) => ({}); + +export default connect( + mapStateToProps, + mapDispatchToProps +)(StartSatispaySearchScreen); diff --git a/ts/features/wallet/onboarding/satispay/navigation/placeholder b/ts/features/wallet/onboarding/satispay/screens/add/AddSatispayScreen.tsx similarity index 100% rename from ts/features/wallet/onboarding/satispay/navigation/placeholder rename to ts/features/wallet/onboarding/satispay/screens/add/AddSatispayScreen.tsx diff --git a/ts/features/wallet/onboarding/satispay/screens/placeholder b/ts/features/wallet/onboarding/satispay/screens/add/LoadAddSatispayComponent.tsx similarity index 100% rename from ts/features/wallet/onboarding/satispay/screens/placeholder rename to ts/features/wallet/onboarding/satispay/screens/add/LoadAddSatispayComponent.tsx diff --git a/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoNotFound.tsx b/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoNotFound.tsx new file mode 100644 index 00000000000..e69de29bb2d diff --git a/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoTimeout.tsx b/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoTimeout.tsx new file mode 100644 index 00000000000..e69de29bb2d diff --git a/ts/features/wallet/onboarding/satispay/screens/search/SearchSatispayManagerScreen.tsx b/ts/features/wallet/onboarding/satispay/screens/search/SearchSatispayManagerScreen.tsx new file mode 100644 index 00000000000..e69de29bb2d diff --git a/ts/navigation/MainNavigator.tsx b/ts/navigation/MainNavigator.tsx index 84e55ced46d..16e92e75e9b 100644 --- a/ts/navigation/MainNavigator.tsx +++ b/ts/navigation/MainNavigator.tsx @@ -23,6 +23,7 @@ import WalletTabIcon from "../components/WalletTabIcon"; import BONUSVACANZE_ROUTES from "../features/bonus/bonusVacanze/navigation/routes"; import BPD_ROUTES from "../features/bonus/bpd/navigation/routes"; import WALLET_ONBOARDING_BANCOMAT_ROUTES from "../features/wallet/onboarding/bancomat/navigation/routes"; +import WALLET_ONBOARDING_SATISPAY_ROUTES from "../features/wallet/onboarding/satispay/navigation/routes"; import variables from "../theme/variables"; import MessageNavigator from "./MessagesNavigator"; import ProfileNavigator from "./ProfileNavigator"; @@ -97,6 +98,7 @@ const NoTabBarRoutes: ReadonlyArray = [ BONUSVACANZE_ROUTES.MAIN, BPD_ROUTES.MAIN, WALLET_ONBOARDING_BANCOMAT_ROUTES.MAIN, + WALLET_ONBOARDING_SATISPAY_ROUTES.MAIN, ROUTES.MARKDOWN_PLAYGROUND, ROUTES.WEB_PLAYGROUND, ROUTES.SHOWROOM, From 645583fe9c12f3cabda6d15adec379c28cdd6e93 Mon Sep 17 00:00:00 2001 From: Fabrizio Date: Thu, 26 Nov 2020 20:03:12 +0100 Subject: [PATCH 02/24] [#175883764] add missing screens --- .../screens/add/AddSatispayScreen.tsx | 20 +++++++++++++++ .../screens/add/LoadAddSatispayComponent.tsx | 23 +++++++++++++++++ .../screens/search/SatispayKoNotFound.tsx | 20 +++++++++++++++ .../screens/search/SatispayKoTimeout.tsx | 20 +++++++++++++++ .../search/SearchSatispayManagerScreen.tsx | 25 +++++++++++++++++++ 5 files changed, 108 insertions(+) diff --git a/ts/features/wallet/onboarding/satispay/screens/add/AddSatispayScreen.tsx b/ts/features/wallet/onboarding/satispay/screens/add/AddSatispayScreen.tsx index e69de29bb2d..e782edf1986 100644 --- a/ts/features/wallet/onboarding/satispay/screens/add/AddSatispayScreen.tsx +++ b/ts/features/wallet/onboarding/satispay/screens/add/AddSatispayScreen.tsx @@ -0,0 +1,20 @@ +import { View } from "native-base"; +import * as React from "react"; +import { connect } from "react-redux"; +import { Dispatch } from "redux"; +import { GlobalState } from "../../../../../../store/reducers/types"; + +type Props = ReturnType & + ReturnType; + +/** + * The user can choose to add the found Satispay account to the wallet + * @constructor + */ +const AddSatispayScreen: React.FunctionComponent = () => ; + +const mapDispatchToProps = (_: Dispatch) => ({}); + +const mapStateToProps = (_: GlobalState) => ({}); + +export default connect(mapStateToProps, mapDispatchToProps)(AddSatispayScreen); diff --git a/ts/features/wallet/onboarding/satispay/screens/add/LoadAddSatispayComponent.tsx b/ts/features/wallet/onboarding/satispay/screens/add/LoadAddSatispayComponent.tsx index e69de29bb2d..56b6898389a 100644 --- a/ts/features/wallet/onboarding/satispay/screens/add/LoadAddSatispayComponent.tsx +++ b/ts/features/wallet/onboarding/satispay/screens/add/LoadAddSatispayComponent.tsx @@ -0,0 +1,23 @@ +import { View } from "native-base"; +import * as React from "react"; +import { connect } from "react-redux"; +import { Dispatch } from "redux"; +import { GlobalState } from "../../../../../../store/reducers/types"; + +type Props = ReturnType & + ReturnType; + +/** + * Loading & Error management when adding a satispay account to the wallet + * @constructor + */ +const LoadAddSatispayComponent: React.FunctionComponent = () => ; + +const mapDispatchToProps = (_: Dispatch) => ({}); + +const mapStateToProps = (_: GlobalState) => ({}); + +export default connect( + mapStateToProps, + mapDispatchToProps +)(LoadAddSatispayComponent); diff --git a/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoNotFound.tsx b/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoNotFound.tsx index e69de29bb2d..59f3e3defde 100644 --- a/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoNotFound.tsx +++ b/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoNotFound.tsx @@ -0,0 +1,20 @@ +import { View } from "native-base"; +import * as React from "react"; +import { connect } from "react-redux"; +import { Dispatch } from "redux"; +import { GlobalState } from "../../../../../../store/reducers/types"; + +type Props = ReturnType & + ReturnType; + +/** + * No Satispay account found for the user + * @constructor + */ +const SatispayKoNotFound: React.FunctionComponent = () => ; + +const mapDispatchToProps = (_: Dispatch) => ({}); + +const mapStateToProps = (_: GlobalState) => ({}); + +export default connect(mapStateToProps, mapDispatchToProps)(SatispayKoNotFound); diff --git a/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoTimeout.tsx b/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoTimeout.tsx index e69de29bb2d..3a8ec881dcc 100644 --- a/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoTimeout.tsx +++ b/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoTimeout.tsx @@ -0,0 +1,20 @@ +import { View } from "native-base"; +import * as React from "react"; +import { connect } from "react-redux"; +import { Dispatch } from "redux"; +import { GlobalState } from "../../../../../../store/reducers/types"; + +type Props = ReturnType & + ReturnType; + +/** + * Timeout during the satispay account request + * @constructor + */ +const SatispayKoTimeout: React.FunctionComponent = () => ; + +const mapDispatchToProps = (_: Dispatch) => ({}); + +const mapStateToProps = (_: GlobalState) => ({}); + +export default connect(mapStateToProps, mapDispatchToProps)(SatispayKoTimeout); diff --git a/ts/features/wallet/onboarding/satispay/screens/search/SearchSatispayManagerScreen.tsx b/ts/features/wallet/onboarding/satispay/screens/search/SearchSatispayManagerScreen.tsx index e69de29bb2d..b5e38233620 100644 --- a/ts/features/wallet/onboarding/satispay/screens/search/SearchSatispayManagerScreen.tsx +++ b/ts/features/wallet/onboarding/satispay/screens/search/SearchSatispayManagerScreen.tsx @@ -0,0 +1,25 @@ +import { View } from "native-base"; +import * as React from "react"; +import { connect } from "react-redux"; +import { Dispatch } from "redux"; +import { GlobalState } from "../../../../../../store/reducers/types"; + +type Props = ReturnType & + ReturnType; + +/** + * This screen handles the different search state (loading, ko, error, success) + * @constructor + */ +const SearchSatispayManagerScreen: React.FunctionComponent = () => ( + +); + +const mapDispatchToProps = (_: Dispatch) => ({}); + +const mapStateToProps = (_: GlobalState) => ({}); + +export default connect( + mapStateToProps, + mapDispatchToProps +)(SearchSatispayManagerScreen); From a45062d2a17cf60d556095e3cb3fa8362065b49a Mon Sep 17 00:00:00 2001 From: Fabrizio Date: Fri, 27 Nov 2020 14:13:38 +0100 Subject: [PATCH 03/24] [#175883778] wip --- .../activateBpdOnNewAddedPaymentMethods.ts | 49 +++++++++++++++++++ 1 file changed, 49 insertions(+) create mode 100644 ts/features/bonus/bpd/saga/orchestration/activateBpdOnNewAddedPaymentMethods.ts diff --git a/ts/features/bonus/bpd/saga/orchestration/activateBpdOnNewAddedPaymentMethods.ts b/ts/features/bonus/bpd/saga/orchestration/activateBpdOnNewAddedPaymentMethods.ts new file mode 100644 index 00000000000..3fa00c97ba3 --- /dev/null +++ b/ts/features/bonus/bpd/saga/orchestration/activateBpdOnNewAddedPaymentMethods.ts @@ -0,0 +1,49 @@ +import { NavigationNavigateAction } from "react-navigation"; +import { call, put, select } from "redux-saga/effects"; +import { navigateToWalletHome } from "../../../../../store/actions/navigation"; +import { + EnableableFunctionsTypeEnum, + PaymentMethod +} from "../../../../../types/pagopa"; +import { SagaCallReturnType } from "../../../../../types/utils"; +import { hasFunctionEnabled } from "../../../../../utils/walletv2"; +import { + navigateToActivateBpdOnNewBancomat, + navigateToSuggestBpdActivation +} from "../../../../wallet/onboarding/bancomat/navigation/action"; +import { onboardingBancomatAddedPansSelector } from "../../../../wallet/onboarding/bancomat/store/reducers/addedPans"; +import { isBpdEnabled } from "./onboarding/startOnboarding"; + +/** + * Allows the user to activate bpd on a set of new added payment methods + */ +function* activateBpdOnNewPaymentMethods( + paymentMethods: ReadonlyArray, + navigateToActivateNewMethods: NavigationNavigateAction +) { + // TODO: change enableableFunction with types representing the possibles functionalities + const atLeastOneBancomatWithBpdCapability = paymentMethods.some(b => + hasFunctionEnabled(b, EnableableFunctionsTypeEnum.BPD) + ); + + // No bancomat with bpd capability added in the current workflow, return to wallet home + if (!atLeastOneBancomatWithBpdCapability) { + return yield put(navigateToWalletHome()); + } + const isBpdEnabledResponse: SagaCallReturnType = yield call( + isBpdEnabled + ); + + // Error while reading the bpdEnabled, return to wallet + if (isBpdEnabledResponse.isLeft()) { + yield put(navigateToWalletHome()); + } else { + if (isBpdEnabledResponse.value) { + // navigate to onboarding new bancomat + yield put(navigateToActivateNewMethods); + } else { + // navigate to "ask if u want to start bpd onboarding" + yield put(navigateToSuggestBpdActivation()); + } + } +} From 2613e34e3d242d5780b2f832d2e6503a566492b5 Mon Sep 17 00:00:00 2001 From: Fabrizio Date: Fri, 27 Nov 2020 20:23:32 +0100 Subject: [PATCH 04/24] [#175883778] satispay workflow --- locales/en/index.yml | 2 + locales/it/index.yml | 2 + .../activateBpdOnNewAddedPaymentMethods.ts | 10 +- .../saga/orchestration/addBancomatToWallet.ts | 53 +++-------- .../saga/orchestration/addSatispayToWallet.ts | 94 +++++++++++++++++++ .../onboarding/satispay/saga/placeholder | 0 .../screens/StartSatispaySearchScreen.tsx | 58 ++++++++++-- ts/navigation/WalletNavigator.ts | 9 +- ts/sagas/wallet.ts | 7 +- ts/screens/wallet/WalletHomeScreen.tsx | 3 +- 10 files changed, 180 insertions(+), 58 deletions(-) create mode 100644 ts/features/wallet/onboarding/satispay/saga/orchestration/addSatispayToWallet.ts delete mode 100644 ts/features/wallet/onboarding/satispay/saga/placeholder diff --git a/locales/en/index.yml b/locales/en/index.yml index 71c701fc310..070c8a52688 100644 --- a/locales/en/index.yml +++ b/locales/en/index.yml @@ -724,6 +724,8 @@ wallet: body1: "Turn on your methods saved into your wallet and start collecting cashback on your valid transactions." body2: "If you prefer, you can activate cashback on these methods later as well." skip: "Maybe later" + satispay: + headerTitle: "Add Satispay" alert: msgErrorUpdateApp: "An error occurred while opening the app store" titlePagoPaUpdateApp: Update required diff --git a/locales/it/index.yml b/locales/it/index.yml index 9db966c606e..778c4309af5 100644 --- a/locales/it/index.yml +++ b/locales/it/index.yml @@ -745,6 +745,8 @@ wallet: body1: "Attiva il cashback sui metodi salvati nel tuo portafoglio per iniziare a collezionare le transazioni valide." body2: "Se preferisci, puoi attivare il cashback su questi metodi anche in un secondo momento." skip: "Non ora, grazie" + satispay: + headerTitle: "Aggiungi Satispay" alert: msgErrorUpdateApp: "Si è verificato un errore durante l'apertura dello store delle app" titlePagoPaUpdateApp: Aggiornamento richiesto diff --git a/ts/features/bonus/bpd/saga/orchestration/activateBpdOnNewAddedPaymentMethods.ts b/ts/features/bonus/bpd/saga/orchestration/activateBpdOnNewAddedPaymentMethods.ts index 3fa00c97ba3..50295a7503f 100644 --- a/ts/features/bonus/bpd/saga/orchestration/activateBpdOnNewAddedPaymentMethods.ts +++ b/ts/features/bonus/bpd/saga/orchestration/activateBpdOnNewAddedPaymentMethods.ts @@ -1,5 +1,5 @@ import { NavigationNavigateAction } from "react-navigation"; -import { call, put, select } from "redux-saga/effects"; +import { call, put } from "redux-saga/effects"; import { navigateToWalletHome } from "../../../../../store/actions/navigation"; import { EnableableFunctionsTypeEnum, @@ -7,17 +7,13 @@ import { } from "../../../../../types/pagopa"; import { SagaCallReturnType } from "../../../../../types/utils"; import { hasFunctionEnabled } from "../../../../../utils/walletv2"; -import { - navigateToActivateBpdOnNewBancomat, - navigateToSuggestBpdActivation -} from "../../../../wallet/onboarding/bancomat/navigation/action"; -import { onboardingBancomatAddedPansSelector } from "../../../../wallet/onboarding/bancomat/store/reducers/addedPans"; +import { navigateToSuggestBpdActivation } from "../../../../wallet/onboarding/bancomat/navigation/action"; import { isBpdEnabled } from "./onboarding/startOnboarding"; /** * Allows the user to activate bpd on a set of new added payment methods */ -function* activateBpdOnNewPaymentMethods( +export function* activateBpdOnNewPaymentMethods( paymentMethods: ReadonlyArray, navigateToActivateNewMethods: NavigationNavigateAction ) { diff --git a/ts/features/wallet/onboarding/bancomat/saga/orchestration/addBancomatToWallet.ts b/ts/features/wallet/onboarding/bancomat/saga/orchestration/addBancomatToWallet.ts index e6cf80a11ab..a5ae84bc3ed 100644 --- a/ts/features/wallet/onboarding/bancomat/saga/orchestration/addBancomatToWallet.ts +++ b/ts/features/wallet/onboarding/bancomat/saga/orchestration/addBancomatToWallet.ts @@ -5,13 +5,13 @@ import { withResetNavigationStack } from "../../../../../../sagas/workUnit"; import { navigateToWalletHome } from "../../../../../../store/actions/navigation"; +import { fetchWalletsRequest } from "../../../../../../store/actions/wallet/wallets"; import { navigationCurrentRouteSelector } from "../../../../../../store/reducers/navigation"; import { SagaCallReturnType } from "../../../../../../types/utils"; -import { isBpdEnabled } from "../../../../../bonus/bpd/saga/orchestration/onboarding/startOnboarding"; +import { activateBpdOnNewPaymentMethods } from "../../../../../bonus/bpd/saga/orchestration/activateBpdOnNewAddedPaymentMethods"; import { navigateToActivateBpdOnNewBancomat, - navigateToOnboardingBancomatChooseBank, - navigateToSuggestBpdActivation + navigateToOnboardingBancomatChooseBank } from "../../navigation/action"; import WALLET_ONBOARDING_BANCOMAT_ROUTES from "../../navigation/routes"; import { @@ -20,9 +20,6 @@ import { walletAddBancomatCompleted } from "../../store/actions"; import { onboardingBancomatAddedPansSelector } from "../../store/reducers/addedPans"; -import { hasFunctionEnabled } from "../../../../../../utils/walletv2"; -import { EnableableFunctionsTypeEnum } from "../../../../../../types/pagopa"; -import { fetchWalletsRequest } from "../../../../../../store/actions/wallet/wallets"; /** * Define the workflow that allows the user to add a bancomat to the wallet. @@ -82,41 +79,15 @@ export function* addBancomatToWalletAndActivateBpd() { if (res === "completed") { // refresh wallets list yield put(fetchWalletsRequest()); - yield call(activateBpdOnNewBancomat); - } -} - -/** - * Allows the user to activate bpd on the new added bancomat - */ -function* activateBpdOnNewBancomat() { - // read the new added bancomat - const bancomatAdded: ReturnType = yield select( - onboardingBancomatAddedPansSelector - ); - // TODO: change enableableFunction with types representing the possibles functionalities - const atLeastOneBancomatWithBpdCapability = bancomatAdded.some(b => - hasFunctionEnabled(b, EnableableFunctionsTypeEnum.BPD) - ); - - // No bancomat with bpd capability added in the current workflow, return to wallet home - if (!atLeastOneBancomatWithBpdCapability) { - return yield put(navigateToWalletHome()); - } - const isBpdEnabledResponse: SagaCallReturnType = yield call( - isBpdEnabled - ); + // read the new added bancomat + const bancomatAdded: ReturnType = yield select( + onboardingBancomatAddedPansSelector + ); - // Error while reading the bpdEnabled, return to wallet - if (isBpdEnabledResponse.isLeft()) { - yield put(navigateToWalletHome()); - } else { - if (isBpdEnabledResponse.value) { - // navigate to onboarding new bancomat - yield put(navigateToActivateBpdOnNewBancomat()); - } else { - // navigate to "ask if u want to start bpd onboarding" - yield put(navigateToSuggestBpdActivation()); - } + yield call( + activateBpdOnNewPaymentMethods, + bancomatAdded, + navigateToActivateBpdOnNewBancomat() + ); } } diff --git a/ts/features/wallet/onboarding/satispay/saga/orchestration/addSatispayToWallet.ts b/ts/features/wallet/onboarding/satispay/saga/orchestration/addSatispayToWallet.ts new file mode 100644 index 00000000000..402fe4d4c7a --- /dev/null +++ b/ts/features/wallet/onboarding/satispay/saga/orchestration/addSatispayToWallet.ts @@ -0,0 +1,94 @@ +import { NavigationActions } from "react-navigation"; +import { call, put, select } from "redux-saga/effects"; +import { + executeWorkUnit, + withResetNavigationStack +} from "../../../../../../sagas/workUnit"; +import { navigateToWalletHome } from "../../../../../../store/actions/navigation"; +import { fetchWalletsRequest } from "../../../../../../store/actions/wallet/wallets"; +import { navigationCurrentRouteSelector } from "../../../../../../store/reducers/navigation"; +import { SagaCallReturnType } from "../../../../../../types/utils"; +import { activateBpdOnNewPaymentMethods } from "../../../../../bonus/bpd/saga/orchestration/activateBpdOnNewAddedPaymentMethods"; +import { onboardingBancomatAddedPansSelector } from "../../../bancomat/store/reducers/addedPans"; +import { + navigateToActivateBpdOnNewSatispay, + navigateToOnboardingSatispayStart +} from "../../navigation/action"; +import WALLET_ONBOARDING_SATISPAY_ROUTES from "../../navigation/routes"; +import { + walletAddSatispayBack, + walletAddSatispayCancel, + walletAddSatispayCompleted +} from "../../store/actions"; + +/** + * Define the workflow that allows the user to add a satispay to the wallet. + * The workflow ends when: + * - The user add the satispay account to the wallet {@link walletAddSatispayCompleted} + * - The user abort the insertion {@link walletAddSatispayCancel} + * - The user choose back from the first screen {@link walletAddSatispayBack} + */ +function* satispayWorkUnit() { + return yield call(executeWorkUnit, { + startScreenNavigation: navigateToOnboardingSatispayStart(), + startScreenName: WALLET_ONBOARDING_SATISPAY_ROUTES.START, + complete: walletAddSatispayCompleted, + back: walletAddSatispayBack, + cancel: walletAddSatispayCancel + }); +} + +/** + * A saga that invokes the addition of satispay workflow {@link satispayWorkUnit} and return + * to the wallet after the insertion. + */ +export function* addSatispayToWalletGeneric() { + const res: SagaCallReturnType = yield call( + withResetNavigationStack, + satispayWorkUnit + ); + if (res !== "back") { + yield put(navigateToWalletHome()); + } +} + +/** + * Chain the add satispay to wallet with "activate bpd on the new satispay" + */ +export function* addSatispayToWalletAndActivateBpd() { + const res: SagaCallReturnType = yield call( + withResetNavigationStack, + satispayWorkUnit + ); + if (res !== "back") { + // integration with the legacy "Add a payment" + // If the payment starts from "WALLET_ADD_PAYMENT_METHOD", remove from stack + // This shouldn't happens if all the workflow will use the executeWorkUnit (hope soon!) + const currentRoute: ReturnType = yield select( + navigationCurrentRouteSelector + ); + + if ( + // TODO: The page will be WALLET_ADD_DIGITAL_PAYMENT_METHOD and should do two back + currentRoute.isSome() && + currentRoute.value === "WALLET_ADD_PAYMENT_METHOD" + ) { + yield put(NavigationActions.back()); + } + } + + if (res === "completed") { + // refresh wallets list + yield put(fetchWalletsRequest()); + // read the new added satispay + const satispayAdded: ReturnType = yield select( + onboardingBancomatAddedPansSelector + ); + + yield call( + activateBpdOnNewPaymentMethods, + satispayAdded, + navigateToActivateBpdOnNewSatispay() + ); + } +} diff --git a/ts/features/wallet/onboarding/satispay/saga/placeholder b/ts/features/wallet/onboarding/satispay/saga/placeholder deleted file mode 100644 index e69de29bb2d..00000000000 diff --git a/ts/features/wallet/onboarding/satispay/screens/StartSatispaySearchScreen.tsx b/ts/features/wallet/onboarding/satispay/screens/StartSatispaySearchScreen.tsx index 98ce5589302..3e5d8a7483a 100644 --- a/ts/features/wallet/onboarding/satispay/screens/StartSatispaySearchScreen.tsx +++ b/ts/features/wallet/onboarding/satispay/screens/StartSatispaySearchScreen.tsx @@ -1,22 +1,68 @@ -import { View } from "native-base"; import * as React from "react"; +import { SafeAreaView } from "react-native"; import { connect } from "react-redux"; import { Dispatch } from "redux"; +import { View } from "native-base"; +import { IOStyles } from "../../../../../components/core/variables/IOStyles"; +import FooterWithButtons from "../../../../../components/ui/FooterWithButtons"; +import I18n from "../../../../../i18n"; +import BaseScreenComponent from "../../../../../components/screens/BaseScreenComponent"; import { GlobalState } from "../../../../../store/reducers/types"; +import { + cancelButtonProps, + confirmButtonProps +} from "../../../../bonus/bonusVacanze/components/buttons/ButtonConfigurations"; +import { navigateToOnboardingBancomatSearchAvailableUserBancomat } from "../../bancomat/navigation/action"; +import { searchUserPans } from "../../bancomat/store/actions"; +import { navigateToOnboardingSatispaySearchAvailableUserAccount } from "../navigation/action"; +import { + searchUserSatispay, + walletAddSatispayBack, + walletAddSatispayCancel +} from "../store/actions"; -type Props = ReturnType & +export type Props = ReturnType & ReturnType; +const loadLocales = () => ({ + headerTitle: I18n.t("wallet.onboarding.satispay.headerTitle") +}); + /** * Entrypoint for the satispay onboarding. The user can choose to start the search or * cancel and return back. * @constructor */ -const StartSatispaySearchScreen: React.FunctionComponent = () => ( - -); +const StartSatispaySearchScreen: React.FunctionComponent = props => { + const { headerTitle } = loadLocales(); + return ( + + + + + + + ); +}; -const mapDispatchToProps = (_: Dispatch) => ({}); +const mapDispatchToProps = (dispatch: Dispatch) => ({ + goBack: () => dispatch(walletAddSatispayBack()), + cancel: () => dispatch(walletAddSatispayCancel()), + search: () => { + dispatch(searchUserSatispay.request()); + dispatch(navigateToOnboardingSatispaySearchAvailableUserAccount()); + } +}); const mapStateToProps = (_: GlobalState) => ({}); diff --git a/ts/navigation/WalletNavigator.ts b/ts/navigation/WalletNavigator.ts index 94df720af6f..da979723df7 100644 --- a/ts/navigation/WalletNavigator.ts +++ b/ts/navigation/WalletNavigator.ts @@ -7,9 +7,13 @@ import BPD_ROUTES from "../features/bonus/bpd/navigation/routes"; import BancomatDetailScreen from "../features/wallet/bancomat/screen/BancomatDetailScreen"; import WalletAddBancomatNavigator from "../features/wallet/onboarding/bancomat/navigation/navigator"; import WALLET_ONBOARDING_BANCOMAT_ROUTES from "../features/wallet/onboarding/bancomat/navigation/routes"; +import PaymentMethodOnboardingSatispayNavigator from "../features/wallet/onboarding/satispay/navigation/navigator"; +import WALLET_ONBOARDING_SATISPAY_ROUTES from "../features/wallet/onboarding/satispay/navigation/routes"; import AddCardScreen from "../screens/wallet/AddCardScreen"; import AddPaymentMethodScreen from "../screens/wallet/AddPaymentMethodScreen"; import ConfirmCardDetailsScreen from "../screens/wallet/ConfirmCardDetailsScreen"; +import CreditCardOnboardingAttemptDetailScreen from "../screens/wallet/creditCardOnboardingAttempts/CreditCardOnboardingAttemptDetailScreen"; +import CreditCardOnboardingAttemptsScreen from "../screens/wallet/creditCardOnboardingAttempts/CreditCardOnboardingAttemptsScreen"; import ConfirmPaymentMethodScreen from "../screens/wallet/payment/ConfirmPaymentMethodScreen"; import ManualDataInsertionScreen from "../screens/wallet/payment/ManualDataInsertionScreen"; import PickPaymentMethodScreen from "../screens/wallet/payment/PickPaymentMethodScreen"; @@ -24,8 +28,6 @@ import TransactionDetailsScreen from "../screens/wallet/TransactionDetailsScreen import TransactionsScreen from "../screens/wallet/TransactionsScreen"; import WalletHomeScreen from "../screens/wallet/WalletHomeScreen"; import WalletsScreen from "../screens/wallet/WalletsScreen"; -import CreditCardOnboardingAttemptsScreen from "../screens/wallet/creditCardOnboardingAttempts/CreditCardOnboardingAttemptsScreen"; -import CreditCardOnboardingAttemptDetailScreen from "../screens/wallet/creditCardOnboardingAttempts/CreditCardOnboardingAttemptDetailScreen"; import ROUTES from "./routes"; const baseRouteConfigMap = { @@ -106,6 +108,9 @@ const bpdConfigMap = bpdEnabled }, [WALLET_ONBOARDING_BANCOMAT_ROUTES.MAIN]: { screen: WalletAddBancomatNavigator + }, + [WALLET_ONBOARDING_SATISPAY_ROUTES.MAIN]: { + screen: PaymentMethodOnboardingSatispayNavigator } } : {}; diff --git a/ts/sagas/wallet.ts b/ts/sagas/wallet.ts index 085c38eb832..0002992c474 100644 --- a/ts/sagas/wallet.ts +++ b/ts/sagas/wallet.ts @@ -47,6 +47,7 @@ import { handleAddUserSatispayToWallet, handleSearchUserSatispay } from "../features/wallet/onboarding/satispay/saga/networking"; +import { addSatispayToWalletAndActivateBpd } from "../features/wallet/onboarding/satispay/saga/orchestration/addSatispayToWallet"; import ROUTES from "../navigation/routes"; import { navigateBack } from "../store/actions/navigation"; import { profileLoadSuccess, profileUpsert } from "../store/actions/profile"; @@ -144,7 +145,8 @@ import { navigationHistoryPop } from "../store/actions/navigationHistory"; import { getTitleFromCard } from "../utils/paymentMethod"; import { addSatispayToWallet, - searchUserSatispay + searchUserSatispay, + walletAddSatispayStart } from "../features/wallet/onboarding/satispay/store/actions"; /** @@ -819,6 +821,9 @@ export function* watchWalletSaga( // watch for add Bancomat to Wallet workflow yield takeLatest(walletAddBancomatStart, addBancomatToWalletAndActivateBpd); + // watch for add Satispay to Wallet workflow + yield takeLatest(walletAddSatispayStart, addSatispayToWalletAndActivateBpd); + // watch for load satispay request yield takeLatest( searchUserSatispay.request, diff --git a/ts/screens/wallet/WalletHomeScreen.tsx b/ts/screens/wallet/WalletHomeScreen.tsx index fae2bbcd2b0..618b10d31a8 100644 --- a/ts/screens/wallet/WalletHomeScreen.tsx +++ b/ts/screens/wallet/WalletHomeScreen.tsx @@ -36,6 +36,7 @@ import { import { allBonusActiveSelector } from "../../features/bonus/bonusVacanze/store/reducers/allActive"; import { availableBonusTypesSelector } from "../../features/bonus/bonusVacanze/store/reducers/availableBonusesTypes"; import BpdCardsInWalletContainer from "../../features/bonus/bpd/components/walletCardContainer/BpdCardsInWalletComponent"; +import { walletAddSatispayStart } from "../../features/wallet/onboarding/satispay/store/actions"; import I18n from "../../i18n"; import { navigateBack, @@ -582,7 +583,7 @@ const mapDispatchToProps = (dispatch: Dispatch) => ({ navigateToWalletTransactionsScreen: (selectedWallet: Wallet) => dispatch(navigateToWalletTransactionsScreen({ selectedWallet })), navigateToWalletList: () => dispatch(navigateToWalletList()), - navigateToPaymentScanQrCode: () => dispatch(navigateToPaymentScanQrCode()), + navigateToPaymentScanQrCode: () => dispatch(walletAddSatispayStart()), navigateToTransactionDetailsScreen: (transaction: Transaction) => { dispatch(readTransaction(transaction)); dispatch( From 75cb6683db7d5e85e53e39275a5cb6bd9c2b68cf Mon Sep 17 00:00:00 2001 From: Fabrizio Date: Sat, 28 Nov 2020 12:23:36 +0100 Subject: [PATCH 05/24] [#175883778] store added satispay --- .../satispay/saga/networking/index.ts | 19 +++++----- .../screens/StartSatispaySearchScreen.tsx | 6 ++-- .../satispay/store/actions/index.ts | 4 +-- .../satispay/store/reducers/addedSatispay.ts | 19 ++++++++++ .../satispay/store/reducers/foundSatispay.ts | 30 ++++++++++++++++ .../satispay/store/reducers/index.ts | 36 ++++--------------- 6 files changed, 70 insertions(+), 44 deletions(-) create mode 100644 ts/features/wallet/onboarding/satispay/store/reducers/addedSatispay.ts create mode 100644 ts/features/wallet/onboarding/satispay/store/reducers/foundSatispay.ts diff --git a/ts/features/wallet/onboarding/satispay/saga/networking/index.ts b/ts/features/wallet/onboarding/satispay/saga/networking/index.ts index 922094e33b3..0d56466018d 100644 --- a/ts/features/wallet/onboarding/satispay/saga/networking/index.ts +++ b/ts/features/wallet/onboarding/satispay/saga/networking/index.ts @@ -6,9 +6,8 @@ import { PaymentManagerClient } from "../../../../../../api/pagopa"; import { SessionManager } from "../../../../../../utils/SessionManager"; import { PaymentManagerToken } from "../../../../../../types/pagopa"; import { SagaCallReturnType } from "../../../../../../types/utils"; -import { searchUserSatispay } from "../../store/actions"; +import { addSatispayToWallet, searchUserSatispay } from "../../store/actions"; import { getError, getNetworkError } from "../../../../../../utils/errors"; -import { addSatispayToWallet as addSatispayToWalletAction } from "../../store/actions"; /** * search for user's satispay @@ -66,15 +65,15 @@ export function* handleSearchUserSatispay( * add the user's satispay to the wallet */ export function* handleAddUserSatispayToWallet( - addSatispayToWallet: ReturnType< + addSatispayToWalletClient: ReturnType< typeof PaymentManagerClient >["addSatispayToWallet"], sessionManager: SessionManager, - action: ActionType + action: ActionType ) { try { const addSatispayToWalletWithRefresh = sessionManager.withRefresh( - addSatispayToWallet({ data: action.payload }) + addSatispayToWalletClient({ data: action.payload }) ); const addSatispayToWalletWithRefreshResult: SagaCallReturnType = yield call( @@ -84,17 +83,21 @@ export function* handleAddUserSatispayToWallet( const statusCode = addSatispayToWalletWithRefreshResult.value.status; if (statusCode === 200) { // satispay has been added to the user wallet - return yield put(addSatispayToWalletAction.success()); + return yield put( + addSatispayToWallet.success( + addSatispayToWalletWithRefreshResult.value.value.data + ) + ); } else { return yield put( - addSatispayToWalletAction.failure( + addSatispayToWallet.failure( new Error(`response status ${statusCode}`) ) ); } } else { return yield put( - addSatispayToWalletAction.failure( + addSatispayToWallet.failure( new Error(readableReport(addSatispayToWalletWithRefreshResult.value)) ) ); diff --git a/ts/features/wallet/onboarding/satispay/screens/StartSatispaySearchScreen.tsx b/ts/features/wallet/onboarding/satispay/screens/StartSatispaySearchScreen.tsx index 3e5d8a7483a..c1e2783531e 100644 --- a/ts/features/wallet/onboarding/satispay/screens/StartSatispaySearchScreen.tsx +++ b/ts/features/wallet/onboarding/satispay/screens/StartSatispaySearchScreen.tsx @@ -1,19 +1,17 @@ +import { View } from "native-base"; import * as React from "react"; import { SafeAreaView } from "react-native"; import { connect } from "react-redux"; import { Dispatch } from "redux"; -import { View } from "native-base"; import { IOStyles } from "../../../../../components/core/variables/IOStyles"; +import BaseScreenComponent from "../../../../../components/screens/BaseScreenComponent"; import FooterWithButtons from "../../../../../components/ui/FooterWithButtons"; import I18n from "../../../../../i18n"; -import BaseScreenComponent from "../../../../../components/screens/BaseScreenComponent"; import { GlobalState } from "../../../../../store/reducers/types"; import { cancelButtonProps, confirmButtonProps } from "../../../../bonus/bonusVacanze/components/buttons/ButtonConfigurations"; -import { navigateToOnboardingBancomatSearchAvailableUserBancomat } from "../../bancomat/navigation/action"; -import { searchUserPans } from "../../bancomat/store/actions"; import { navigateToOnboardingSatispaySearchAvailableUserAccount } from "../navigation/action"; import { searchUserSatispay, diff --git a/ts/features/wallet/onboarding/satispay/store/actions/index.ts b/ts/features/wallet/onboarding/satispay/store/actions/index.ts index 9af189ef850..0bd65343b27 100644 --- a/ts/features/wallet/onboarding/satispay/store/actions/index.ts +++ b/ts/features/wallet/onboarding/satispay/store/actions/index.ts @@ -4,6 +4,7 @@ import { createStandardAction } from "typesafe-actions"; import { Satispay } from "../../../../../../../definitions/pagopa/walletv2/Satispay"; +import { RawSatispayPaymentMethod } from "../../../../../../types/pagopa"; import { NetworkError } from "../../../../../../utils/errors"; /** @@ -22,8 +23,7 @@ export const addSatispayToWallet = createAsyncAction( "WALLET_ONBOARDING_SATISPAY_ADD_REQUEST", "WALLET_ONBOARDING_SATISPAY_ADD_SUCCESS", "WALLET_ONBOARDING_SATISPAY_ADD_FAILURE" - // TODO: replace void with the right type -)(); +)(); /** * The user choose to start the workflow to add a new satispay account to the wallet diff --git a/ts/features/wallet/onboarding/satispay/store/reducers/addedSatispay.ts b/ts/features/wallet/onboarding/satispay/store/reducers/addedSatispay.ts new file mode 100644 index 00000000000..5a3c7a6259c --- /dev/null +++ b/ts/features/wallet/onboarding/satispay/store/reducers/addedSatispay.ts @@ -0,0 +1,19 @@ +import { getType } from "typesafe-actions"; +import { Action } from "../../../../../../store/actions/types"; +import { RawSatispayPaymentMethod } from "../../../../../../types/pagopa"; +import { addSatispayToWallet, walletAddSatispayStart } from "../actions"; + +export const addedSatispayReducer = ( + state: RawSatispayPaymentMethod | null = null, + action: Action +): RawSatispayPaymentMethod | null => { + switch (action.type) { + // Register a Satispay account added in the current onboarding session + case getType(addSatispayToWallet.success): + return action.payload; + // Reset the state when starting a new satispay onboarding + case getType(walletAddSatispayStart): + return null; + } + return state; +}; diff --git a/ts/features/wallet/onboarding/satispay/store/reducers/foundSatispay.ts b/ts/features/wallet/onboarding/satispay/store/reducers/foundSatispay.ts new file mode 100644 index 00000000000..b4801c9f41b --- /dev/null +++ b/ts/features/wallet/onboarding/satispay/store/reducers/foundSatispay.ts @@ -0,0 +1,30 @@ +// The satispay account found could be one (Satispay) or null (no satispay account found) +import { getType } from "typesafe-actions"; +import { Satispay } from "../../../../../../../definitions/pagopa/walletv2/Satispay"; +import { Action } from "../../../../../../store/actions/types"; +import { NetworkError } from "../../../../../../utils/errors"; +import { + remoteError, + remoteLoading, + remoteReady, + remoteUndefined, + RemoteValue +} from "../../../../../bonus/bpd/model/RemoteValue"; +import { searchUserSatispay } from "../actions"; + +export type RemoteSatispay = RemoteValue; + +export const foundSatispayReducer = ( + state: RemoteSatispay = remoteUndefined, + action: Action +): RemoteSatispay => { + switch (action.type) { + case getType(searchUserSatispay.request): + return remoteLoading; + case getType(searchUserSatispay.success): + return remoteReady(action.payload); + case getType(searchUserSatispay.failure): + return remoteError(action.payload); + } + return state; +}; diff --git a/ts/features/wallet/onboarding/satispay/store/reducers/index.ts b/ts/features/wallet/onboarding/satispay/store/reducers/index.ts index 7f67a945ddf..914f390a3f2 100644 --- a/ts/features/wallet/onboarding/satispay/store/reducers/index.ts +++ b/ts/features/wallet/onboarding/satispay/store/reducers/index.ts @@ -1,44 +1,20 @@ import { combineReducers } from "redux"; -import { getType } from "typesafe-actions"; import { Action } from "../../../../../../store/actions/types"; -import { Satispay } from "../../../../../../../definitions/pagopa/walletv2/Satispay"; -import { NetworkError } from "../../../../../../utils/errors"; -import { - remoteError, - remoteLoading, - remoteReady, - remoteUndefined, - RemoteValue -} from "../../../../../bonus/bpd/model/RemoteValue"; -import { searchUserSatispay } from "../actions"; +import { RawSatispayPaymentMethod } from "../../../../../../types/pagopa"; +import { addedSatispayReducer } from "./addedSatispay"; +import { foundSatispayReducer, RemoteSatispay } from "./foundSatispay"; export type OnboardSatispayState = { // A RemoteValue that represent the found satispay account for the user foundSatispay: RemoteSatispay; -}; - -// The satispay account found could be one (Satispay) or null (no satispay account found) -export type RemoteSatispay = RemoteValue; - -const foundSatispayReducer = ( - state: RemoteSatispay = remoteUndefined, - action: Action -): RemoteSatispay => { - switch (action.type) { - case getType(searchUserSatispay.request): - return remoteLoading; - case getType(searchUserSatispay.success): - return remoteReady(action.payload); - case getType(searchUserSatispay.failure): - return remoteError(action.payload); - } - return state; + addedSatispay: RawSatispayPaymentMethod | null; }; const onboardingSatispayReducer = combineReducers( { // the satispay account found for the user during the onboarding phase - foundSatispay: foundSatispayReducer + foundSatispay: foundSatispayReducer, + addedSatispay: addedSatispayReducer } ); From 6c7d78150d36d20e0b188a971e4eb81c03ba0b76 Mon Sep 17 00:00:00 2001 From: Fabrizio Date: Sat, 28 Nov 2020 17:19:52 +0100 Subject: [PATCH 06/24] [#175883778] fix return type of satispay add --- ts/api/pagopa.ts | 4 ++- .../satispay/saga/networking/index.ts | 18 ++++++------- .../search/SearchSatispayManagerScreen.tsx | 25 +++++++++++++++---- ts/types/pagopa.ts | 15 +++++++++++ 4 files changed, 46 insertions(+), 16 deletions(-) diff --git a/ts/api/pagopa.ts b/ts/api/pagopa.ts index 20a8153bd83..ba3d27aa65b 100644 --- a/ts/api/pagopa.ts +++ b/ts/api/pagopa.ts @@ -37,6 +37,7 @@ import { import { addWalletCreditCardUsingPOSTDecoder, AddWalletCreditCardUsingPOSTT, + addWalletSatispayUsingPOSTDecoder, checkPaymentUsingGETDefaultDecoder, CheckPaymentUsingGETT, DeleteBySessionCookieExpiredUsingDELETET, @@ -66,6 +67,7 @@ import { NullableWallet, PagoPAErrorResponse, PatchedWalletV2ListResponse, + PatchedWalletV2Response, PaymentManagerToken, PspListResponse, PspResponse, @@ -457,7 +459,7 @@ const addSatispayToWallet: AddWalletSatispayUsingPOSTT = { query: () => ({}), body: ({ satispayRequest }) => JSON.stringify(satispayRequest), headers: composeHeaderProducers(tokenHeaderProducer, ApiHeaderJson), - response_decoder: addWalletSatispayUsingPOSTDefaultDecoder() + response_decoder: addWalletSatispayUsingPOSTDecoder(PatchedWalletV2Response) }; const withPaymentManagerToken =

( diff --git a/ts/features/wallet/onboarding/satispay/saga/networking/index.ts b/ts/features/wallet/onboarding/satispay/saga/networking/index.ts index 0d56466018d..abdb71aa07e 100644 --- a/ts/features/wallet/onboarding/satispay/saga/networking/index.ts +++ b/ts/features/wallet/onboarding/satispay/saga/networking/index.ts @@ -1,13 +1,13 @@ -import { call, put } from "redux-saga/effects"; import { readableReport } from "italia-ts-commons/lib/reporters"; import _ from "lodash"; +import { call, put } from "redux-saga/effects"; import { ActionType } from "typesafe-actions"; import { PaymentManagerClient } from "../../../../../../api/pagopa"; -import { SessionManager } from "../../../../../../utils/SessionManager"; import { PaymentManagerToken } from "../../../../../../types/pagopa"; import { SagaCallReturnType } from "../../../../../../types/utils"; -import { addSatispayToWallet, searchUserSatispay } from "../../store/actions"; import { getError, getNetworkError } from "../../../../../../utils/errors"; +import { SessionManager } from "../../../../../../utils/SessionManager"; +import { addSatispayToWallet, searchUserSatispay } from "../../store/actions"; /** * search for user's satispay @@ -31,7 +31,7 @@ export function* handleSearchUserSatispay( // even if the user doesn't own satispay the response is 200 but the payload is empty // FIXME 200 must always contain a non-empty payload return yield put( - searchUserSatispay.success(_.isEmpty(value.data) ? null : value) + searchUserSatispay.success(_.isEmpty(value.data) ? null : value.data) ); } else if (statusCode === 404) { // the user doesn't own any satispay @@ -82,12 +82,10 @@ export function* handleAddUserSatispayToWallet( if (addSatispayToWalletWithRefreshResult.isRight()) { const statusCode = addSatispayToWalletWithRefreshResult.value.status; if (statusCode === 200) { + const newSatispay = + addSatispayToWalletWithRefreshResult.value.value.data; // satispay has been added to the user wallet - return yield put( - addSatispayToWallet.success( - addSatispayToWalletWithRefreshResult.value.value.data - ) - ); + return yield put(addSatispayToWallet.success(newSatispay)); } else { return yield put( addSatispayToWallet.failure( @@ -103,6 +101,6 @@ export function* handleAddUserSatispayToWallet( ); } } catch (e) { - return yield put(addSatispayToWalletAction.failure(getError(e))); + return yield put(addSatispayToWallet.failure(getError(e))); } } diff --git a/ts/features/wallet/onboarding/satispay/screens/search/SearchSatispayManagerScreen.tsx b/ts/features/wallet/onboarding/satispay/screens/search/SearchSatispayManagerScreen.tsx index b5e38233620..1a9864c0532 100644 --- a/ts/features/wallet/onboarding/satispay/screens/search/SearchSatispayManagerScreen.tsx +++ b/ts/features/wallet/onboarding/satispay/screens/search/SearchSatispayManagerScreen.tsx @@ -1,8 +1,11 @@ -import { View } from "native-base"; +import { Button, View } from "native-base"; import * as React from "react"; import { connect } from "react-redux"; import { Dispatch } from "redux"; import { GlobalState } from "../../../../../../store/reducers/types"; +import { RawSatispayPaymentMethod } from "../../../../../../types/pagopa"; +import { addSatispayToWallet } from "../../store/actions"; +import { isReady } from "../../../../../bonus/bpd/model/RemoteValue"; type Props = ReturnType & ReturnType; @@ -11,13 +14,25 @@ type Props = ReturnType & * This screen handles the different search state (loading, ko, error, success) * @constructor */ -const SearchSatispayManagerScreen: React.FunctionComponent = () => ( - +const SearchSatispayManagerScreen: React.FunctionComponent = props => ( + + + + ); -const mapDispatchToProps = (_: Dispatch) => ({}); +const mapDispatchToProps = (dispatch: Dispatch) => ({ + addSatispay: (w: RawSatispayPaymentMethod) => + dispatch(addSatispayToWallet.request(w)) +}); -const mapStateToProps = (_: GlobalState) => ({}); +const mapStateToProps = (state: GlobalState) => ({ + satispay: state.wallet.onboarding.satispay.foundSatispay +}); export default connect( mapStateToProps, diff --git a/ts/types/pagopa.ts b/ts/types/pagopa.ts index 191654a784d..c0adff6bfb6 100644 --- a/ts/types/pagopa.ts +++ b/ts/types/pagopa.ts @@ -466,3 +466,18 @@ export const PatchedWalletV2ListResponse = t.intersection( export type PatchedWalletV2ListResponse = t.TypeOf< typeof PatchedWalletV2ListResponse >; + +// required attributes +const PatchedWalletV2ResponseR = t.interface({}); + +// optional attributes +const PatchedWalletV2ResponseO = t.partial({ + data: PatchedWalletV2 +}); + +export const PatchedWalletV2Response = t.intersection( + [PatchedWalletV2ResponseR, PatchedWalletV2ResponseO], + "PatchedWalletV2Response" +); + +export type PatchedWalletV2Response = t.TypeOf; From 39d6dd855dbb9bd7ee55ac12322201fee91ce4a3 Mon Sep 17 00:00:00 2001 From: Fabrizio Date: Sun, 29 Nov 2020 11:40:27 +0100 Subject: [PATCH 07/24] [#175883778] merge --- ts/navigation/WalletNavigator.ts | 4 +--- ts/screens/wallet/WalletHomeScreen.tsx | 9 ++++----- 2 files changed, 5 insertions(+), 8 deletions(-) diff --git a/ts/navigation/WalletNavigator.ts b/ts/navigation/WalletNavigator.ts index 24136b3adcb..bafaba596d6 100644 --- a/ts/navigation/WalletNavigator.ts +++ b/ts/navigation/WalletNavigator.ts @@ -5,6 +5,7 @@ import BONUSVACANZE_ROUTES from "../features/bonus/bonusVacanze/navigation/route import BpdNavigator from "../features/bonus/bpd/navigation/navigator"; import BPD_ROUTES from "../features/bonus/bpd/navigation/routes"; import BancomatDetailScreen from "../features/wallet/bancomat/screen/BancomatDetailScreen"; +import AddDigitalMethodScreen from "../features/wallet/onboarding/AddDigitalMethodScreen"; import WalletAddBancomatNavigator from "../features/wallet/onboarding/bancomat/navigation/navigator"; import WALLET_ONBOARDING_BANCOMAT_ROUTES from "../features/wallet/onboarding/bancomat/navigation/routes"; import PaymentMethodOnboardingSatispayNavigator from "../features/wallet/onboarding/satispay/navigation/navigator"; @@ -28,9 +29,6 @@ import TransactionDetailsScreen from "../screens/wallet/TransactionDetailsScreen import TransactionsScreen from "../screens/wallet/TransactionsScreen"; import WalletHomeScreen from "../screens/wallet/WalletHomeScreen"; import WalletsScreen from "../screens/wallet/WalletsScreen"; -import CreditCardOnboardingAttemptsScreen from "../screens/wallet/creditCardOnboardingAttempts/CreditCardOnboardingAttemptsScreen"; -import CreditCardOnboardingAttemptDetailScreen from "../screens/wallet/creditCardOnboardingAttempts/CreditCardOnboardingAttemptDetailScreen"; -import AddDigitalMethodScreen from "../features/wallet/onboarding/AddDigitalMethodScreen"; import ROUTES from "./routes"; const baseRouteConfigMap = { diff --git a/ts/screens/wallet/WalletHomeScreen.tsx b/ts/screens/wallet/WalletHomeScreen.tsx index 618b10d31a8..e533d8683a6 100644 --- a/ts/screens/wallet/WalletHomeScreen.tsx +++ b/ts/screens/wallet/WalletHomeScreen.tsx @@ -36,7 +36,9 @@ import { import { allBonusActiveSelector } from "../../features/bonus/bonusVacanze/store/reducers/allActive"; import { availableBonusTypesSelector } from "../../features/bonus/bonusVacanze/store/reducers/availableBonusesTypes"; import BpdCardsInWalletContainer from "../../features/bonus/bpd/components/walletCardContainer/BpdCardsInWalletComponent"; -import { walletAddSatispayStart } from "../../features/wallet/onboarding/satispay/store/actions"; +import { bpdPeriodsAmountWalletVisibleSelector } from "../../features/bonus/bpd/store/reducers/details/combiner"; +import FeaturedCardCarousel from "../../features/wallet/component/FeaturedCardCarousel"; +import WalletV2PreviewCards from "../../features/wallet/component/WalletV2PreviewCards"; import I18n from "../../i18n"; import { navigateBack, @@ -72,9 +74,6 @@ import { Transaction, Wallet } from "../../types/pagopa"; import { isUpdateNeeded } from "../../utils/appVersion"; import { getCurrentRouteKey } from "../../utils/navigation"; import { setStatusBarColorAndBackground } from "../../utils/statusBar"; -import WalletV2PreviewCards from "../../features/wallet/component/WalletV2PreviewCards"; -import { bpdPeriodsAmountWalletVisibleSelector } from "../../features/bonus/bpd/store/reducers/details/combiner"; -import FeaturedCardCarousel from "../../features/wallet/component/FeaturedCardCarousel"; type NavigationParams = Readonly<{ newMethodAdded: boolean; @@ -583,7 +582,7 @@ const mapDispatchToProps = (dispatch: Dispatch) => ({ navigateToWalletTransactionsScreen: (selectedWallet: Wallet) => dispatch(navigateToWalletTransactionsScreen({ selectedWallet })), navigateToWalletList: () => dispatch(navigateToWalletList()), - navigateToPaymentScanQrCode: () => dispatch(walletAddSatispayStart()), + navigateToPaymentScanQrCode: () => dispatch(navigateToPaymentScanQrCode()), navigateToTransactionDetailsScreen: (transaction: Transaction) => { dispatch(readTransaction(transaction)); dispatch( From c8261bc264b500c46d732111b921c2c0c80de3dc Mon Sep 17 00:00:00 2001 From: Fabrizio Date: Sun, 29 Nov 2020 11:48:35 +0100 Subject: [PATCH 08/24] [#175883778] add entrypoint --- .../wallet/onboarding/DigitalMethodsList.tsx | 22 +++++++++++++++---- 1 file changed, 18 insertions(+), 4 deletions(-) diff --git a/ts/features/wallet/onboarding/DigitalMethodsList.tsx b/ts/features/wallet/onboarding/DigitalMethodsList.tsx index 10258709cf7..9b4d6de4326 100644 --- a/ts/features/wallet/onboarding/DigitalMethodsList.tsx +++ b/ts/features/wallet/onboarding/DigitalMethodsList.tsx @@ -7,9 +7,16 @@ import { ListRenderItemInfo, StyleSheet } from "react-native"; +import { connect } from "react-redux"; +import { Dispatch } from "redux"; import I18n from "../../../i18n"; import { H3 } from "../../../components/core/typography/H3"; import { H5 } from "../../../components/core/typography/H5"; +import { GlobalState } from "../../../store/reducers/types"; +import { walletAddSatispayStart } from "./satispay/store/actions"; + +type Props = ReturnType & + ReturnType; type DigitalPaymentItem = { name: string; @@ -29,7 +36,7 @@ const styles = StyleSheet.create({ logo: { width: 80, height: 40, resizeMode: "cover" } }); -const getMethods = (): ReadonlyArray => [ +const getMethods = (props: Props): ReadonlyArray => [ { name: I18n.t("wallet.methods.bancomatPay.name"), subtitle: I18n.t("wallet.methods.bancomatPay.description"), @@ -40,6 +47,7 @@ const getMethods = (): ReadonlyArray => [ name: I18n.t("wallet.methods.satispay.name"), subtitle: I18n.t("wallet.methods.satispay.description"), logo: require("../../../../img/wallet/cards-icons/satispay.png"), + onPress: props.startSatispayOnboarding, implemented: true }, { @@ -53,10 +61,10 @@ const getMethods = (): ReadonlyArray => [ } ]; -const DigitalMethodsList: React.FunctionComponent = () => ( +const DigitalMethodsList = (props: Props) => ( ) => item.implemented && ( @@ -72,4 +80,10 @@ const DigitalMethodsList: React.FunctionComponent = () => ( /> ); -export default DigitalMethodsList; +const mapDispatchToProps = (dispatch: Dispatch) => ({ + startSatispayOnboarding: () => dispatch(walletAddSatispayStart()) +}); + +const mapStateToProps = (_: GlobalState) => ({}); + +export default connect(mapStateToProps, mapDispatchToProps)(DigitalMethodsList); From c494c0bdc5bfa15f329abbe609fadcb05c32aa82 Mon Sep 17 00:00:00 2001 From: Fabrizio Date: Sun, 29 Nov 2020 12:44:24 +0100 Subject: [PATCH 09/24] [#175883778] handling states --- locales/en/index.yml | 2 + locales/it/index.yml | 2 + .../screens/add/AddSatispayScreen.tsx | 39 +++++++++++++-- .../screens/search/LoadSatispaySearch.tsx | 49 +++++++++++++++++++ .../screens/search/SatispayKoNotFound.tsx | 9 +++- .../screens/search/SatispayKoTimeout.tsx | 9 +++- .../search/SearchSatispayManagerScreen.tsx | 39 ++++++++++----- .../satispay/store/reducers/foundSatispay.ts | 31 +++++++++++- 8 files changed, 159 insertions(+), 21 deletions(-) create mode 100644 ts/features/wallet/onboarding/satispay/screens/search/LoadSatispaySearch.tsx diff --git a/locales/en/index.yml b/locales/en/index.yml index 140291cbbfc..eab53ba30b0 100644 --- a/locales/en/index.yml +++ b/locales/en/index.yml @@ -726,6 +726,8 @@ wallet: skip: "Maybe later" satispay: headerTitle: "Add Satispay" + loadingSearch: + title: "We are verifying your Satispay account \n\n Please wait a few seconds" alert: msgErrorUpdateApp: "An error occurred while opening the app store" titlePagoPaUpdateApp: Update required diff --git a/locales/it/index.yml b/locales/it/index.yml index feee204a4d7..977b043da3e 100644 --- a/locales/it/index.yml +++ b/locales/it/index.yml @@ -747,6 +747,8 @@ wallet: skip: "Non ora, grazie" satispay: headerTitle: "Aggiungi Satispay" + loadingSearch: + title: "Stiamo verificando il tuo account Satispay\n\nAttendi qualche secondo" alert: msgErrorUpdateApp: "Si è verificato un errore durante l'apertura dello store delle app" titlePagoPaUpdateApp: Aggiornamento richiesto diff --git a/ts/features/wallet/onboarding/satispay/screens/add/AddSatispayScreen.tsx b/ts/features/wallet/onboarding/satispay/screens/add/AddSatispayScreen.tsx index e782edf1986..8b7ccd8a261 100644 --- a/ts/features/wallet/onboarding/satispay/screens/add/AddSatispayScreen.tsx +++ b/ts/features/wallet/onboarding/satispay/screens/add/AddSatispayScreen.tsx @@ -1,8 +1,22 @@ import { View } from "native-base"; import * as React from "react"; +import { SafeAreaView } from "react-native"; import { connect } from "react-redux"; import { Dispatch } from "redux"; +import { Satispay } from "../../../../../../../definitions/pagopa/walletv2/Satispay"; +import { H1 } from "../../../../../../components/core/typography/H1"; +import { IOStyles } from "../../../../../../components/core/variables/IOStyles"; +import FooterWithButtons from "../../../../../../components/ui/FooterWithButtons"; import { GlobalState } from "../../../../../../store/reducers/types"; +import { + cancelButtonProps, + confirmButtonProps +} from "../../../../../bonus/bonusVacanze/components/buttons/ButtonConfigurations"; +import { + addSatispayToWallet, + walletAddSatispayCancel +} from "../../store/actions"; +import { onboardingSatispayFoundSelector } from "../../store/reducers/foundSatispay"; type Props = ReturnType & ReturnType; @@ -11,10 +25,29 @@ type Props = ReturnType & * The user can choose to add the found Satispay account to the wallet * @constructor */ -const AddSatispayScreen: React.FunctionComponent = () => ; +const AddSatispayScreen = (props: Props) => ( + + +

Satispay Account found

+
+ props.satispay && props.confirm(props.satispay) + )} + /> + +); -const mapDispatchToProps = (_: Dispatch) => ({}); +const mapDispatchToProps = (dispatch: Dispatch) => ({ + cancel: () => dispatch(walletAddSatispayCancel()), + confirm: (satispay: Satispay) => + dispatch(addSatispayToWallet.request(satispay)) +}); -const mapStateToProps = (_: GlobalState) => ({}); +const mapStateToProps = (state: GlobalState) => ({ + satispay: onboardingSatispayFoundSelector(state) +}); export default connect(mapStateToProps, mapDispatchToProps)(AddSatispayScreen); diff --git a/ts/features/wallet/onboarding/satispay/screens/search/LoadSatispaySearch.tsx b/ts/features/wallet/onboarding/satispay/screens/search/LoadSatispaySearch.tsx new file mode 100644 index 00000000000..9d722f77255 --- /dev/null +++ b/ts/features/wallet/onboarding/satispay/screens/search/LoadSatispaySearch.tsx @@ -0,0 +1,49 @@ +import * as React from "react"; +import { connect } from "react-redux"; +import { Dispatch } from "redux"; +import I18n from "../../../../../../i18n"; +import { GlobalState } from "../../../../../../store/reducers/types"; +import { useHardwareBackButton } from "../../../../../bonus/bonusVacanze/components/hooks/useHardwareBackButton"; +import { LoadingErrorComponent } from "../../../../../bonus/bonusVacanze/components/loadingErrorScreen/LoadingErrorComponent"; +import { onboardingBancomatAbiSelectedSelector } from "../../../bancomat/store/reducers/abiSelected"; +import { onboardingBancomatPansIsError } from "../../../bancomat/store/reducers/pans"; +import { + searchUserSatispay, + walletAddSatispayCancel +} from "../../store/actions"; + +type Props = ReturnType & + ReturnType; + +/** + * The screen that show the loading (or error) to the user + * @constructor + */ +const LoadSatispaySearch = (props: Props) => { + useHardwareBackButton(() => { + if (!props.isLoading) { + props.cancel(); + } + return true; + }); + return ( + props.retry()} + /> + ); +}; + +const mapDispatchToProps = (dispatch: Dispatch) => ({ + cancel: () => dispatch(walletAddSatispayCancel()), + retry: () => dispatch(searchUserSatispay.request()) +}); + +const mapStateToProps = (state: GlobalState) => ({ + abiSelected: onboardingBancomatAbiSelectedSelector(state), + isLoading: !onboardingBancomatPansIsError(state) +}); + +export default connect(mapStateToProps, mapDispatchToProps)(LoadSatispaySearch); diff --git a/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoNotFound.tsx b/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoNotFound.tsx index 59f3e3defde..de9028b89dc 100644 --- a/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoNotFound.tsx +++ b/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoNotFound.tsx @@ -1,7 +1,8 @@ -import { View } from "native-base"; import * as React from "react"; +import { SafeAreaView } from "react-native"; import { connect } from "react-redux"; import { Dispatch } from "redux"; +import { H1 } from "../../../../../../components/core/typography/H1"; import { GlobalState } from "../../../../../../store/reducers/types"; type Props = ReturnType & @@ -11,7 +12,11 @@ type Props = ReturnType & * No Satispay account found for the user * @constructor */ -const SatispayKoNotFound: React.FunctionComponent = () => ; +const SatispayKoNotFound: React.FunctionComponent = () => ( + +

No Satispay account found for the user

+
+); const mapDispatchToProps = (_: Dispatch) => ({}); diff --git a/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoTimeout.tsx b/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoTimeout.tsx index 3a8ec881dcc..9b0ad7b504d 100644 --- a/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoTimeout.tsx +++ b/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoTimeout.tsx @@ -1,7 +1,8 @@ -import { View } from "native-base"; import * as React from "react"; +import { SafeAreaView } from "react-native"; import { connect } from "react-redux"; import { Dispatch } from "redux"; +import { H1 } from "../../../../../../components/core/typography/H1"; import { GlobalState } from "../../../../../../store/reducers/types"; type Props = ReturnType & @@ -11,7 +12,11 @@ type Props = ReturnType & * Timeout during the satispay account request * @constructor */ -const SatispayKoTimeout: React.FunctionComponent = () => ; +const SatispayKoTimeout: React.FunctionComponent = () => ( + +

Timeout during the satispay account request

+
+); const mapDispatchToProps = (_: Dispatch) => ({}); diff --git a/ts/features/wallet/onboarding/satispay/screens/search/SearchSatispayManagerScreen.tsx b/ts/features/wallet/onboarding/satispay/screens/search/SearchSatispayManagerScreen.tsx index 1a9864c0532..4b43ce78686 100644 --- a/ts/features/wallet/onboarding/satispay/screens/search/SearchSatispayManagerScreen.tsx +++ b/ts/features/wallet/onboarding/satispay/screens/search/SearchSatispayManagerScreen.tsx @@ -1,11 +1,18 @@ -import { Button, View } from "native-base"; import * as React from "react"; import { connect } from "react-redux"; import { Dispatch } from "redux"; import { GlobalState } from "../../../../../../store/reducers/types"; import { RawSatispayPaymentMethod } from "../../../../../../types/pagopa"; +import { + isError, + isLoading, + isReady +} from "../../../../../bonus/bpd/model/RemoteValue"; import { addSatispayToWallet } from "../../store/actions"; -import { isReady } from "../../../../../bonus/bpd/model/RemoteValue"; +import AddSatispayScreen from "../add/AddSatispayScreen"; +import LoadSatispaySearch from "./LoadSatispaySearch"; +import SatispayKoNotFound from "./SatispayKoNotFound"; +import SatispayKoTimeout from "./SatispayKoTimeout"; type Props = ReturnType & ReturnType; @@ -14,16 +21,22 @@ type Props = ReturnType & * This screen handles the different search state (loading, ko, error, success) * @constructor */ -const SearchSatispayManagerScreen: React.FunctionComponent = props => ( - - - - -); +const SearchSatispayManagerScreen: React.FunctionComponent = props => { + const satispay = props.foundSatispay; + if (isError(satispay) && satispay.error.kind === "timeout") { + return ; + } + if (isError(satispay) || isLoading(satispay)) { + return ; + } + if (isReady(satispay)) { + if (satispay.value === null) { + return ; + } + return ; + } + return null; +}; const mapDispatchToProps = (dispatch: Dispatch) => ({ addSatispay: (w: RawSatispayPaymentMethod) => @@ -31,7 +44,7 @@ const mapDispatchToProps = (dispatch: Dispatch) => ({ }); const mapStateToProps = (state: GlobalState) => ({ - satispay: state.wallet.onboarding.satispay.foundSatispay + foundSatispay: state.wallet.onboarding.satispay.foundSatispay }); export default connect( diff --git a/ts/features/wallet/onboarding/satispay/store/reducers/foundSatispay.ts b/ts/features/wallet/onboarding/satispay/store/reducers/foundSatispay.ts index b4801c9f41b..f8903687fe0 100644 --- a/ts/features/wallet/onboarding/satispay/store/reducers/foundSatispay.ts +++ b/ts/features/wallet/onboarding/satispay/store/reducers/foundSatispay.ts @@ -1,15 +1,20 @@ // The satispay account found could be one (Satispay) or null (no satispay account found) +import { createSelector } from "reselect"; import { getType } from "typesafe-actions"; import { Satispay } from "../../../../../../../definitions/pagopa/walletv2/Satispay"; import { Action } from "../../../../../../store/actions/types"; +import { GlobalState } from "../../../../../../store/reducers/types"; import { NetworkError } from "../../../../../../utils/errors"; import { + getValueOrElse, remoteError, remoteLoading, remoteReady, remoteUndefined, - RemoteValue + RemoteValue, + fold } from "../../../../../bonus/bpd/model/RemoteValue"; +import { Pans } from "../../../bancomat/store/reducers/pans"; import { searchUserSatispay } from "../actions"; export type RemoteSatispay = RemoteValue; @@ -28,3 +33,27 @@ export const foundSatispayReducer = ( } return state; }; + +/** + * Return the remote value of the found satispay + * @param state + */ +export const onboardingSatispayFoundRemoteSelector = ( + state: GlobalState +): RemoteSatispay => state.wallet.onboarding.satispay.foundSatispay; + +/** + * Return the found satispay + * @param state + */ +export const onboardingSatispayFoundSelector = createSelector( + [onboardingSatispayFoundRemoteSelector], + (remoteSatispay): Satispay | undefined => + fold( + remoteSatispay, + () => undefined, + () => undefined, + val => (val !== null ? val : undefined), + _ => undefined + ) +); From 980512784fc8ac34ab168315b46013c757eff3ce Mon Sep 17 00:00:00 2001 From: Fabrizio Date: Sun, 29 Nov 2020 17:40:09 +0100 Subject: [PATCH 10/24] [#175883778] add satispay to wallet --- .../saga/orchestration/addSatispayToWallet.ts | 2 +- .../screens/add/AddSatispayScreen.tsx | 37 +++++++++++++---- .../screens/add/LoadAddSatispayComponent.tsx | 40 +++++++++++++++++-- .../screens/search/LoadSatispaySearch.tsx | 6 +-- .../satispay/store/reducers/addedSatispay.ts | 1 + .../satispay/store/reducers/addingSatispay.ts | 35 ++++++++++++++++ .../satispay/store/reducers/foundSatispay.ts | 14 ++++--- .../satispay/store/reducers/index.ts | 6 +++ 8 files changed, 119 insertions(+), 22 deletions(-) create mode 100644 ts/features/wallet/onboarding/satispay/store/reducers/addingSatispay.ts diff --git a/ts/features/wallet/onboarding/satispay/saga/orchestration/addSatispayToWallet.ts b/ts/features/wallet/onboarding/satispay/saga/orchestration/addSatispayToWallet.ts index 402fe4d4c7a..a365effd847 100644 --- a/ts/features/wallet/onboarding/satispay/saga/orchestration/addSatispayToWallet.ts +++ b/ts/features/wallet/onboarding/satispay/saga/orchestration/addSatispayToWallet.ts @@ -76,7 +76,7 @@ export function* addSatispayToWalletAndActivateBpd() { yield put(NavigationActions.back()); } } - + console.log(res); if (res === "completed") { // refresh wallets list yield put(fetchWalletsRequest()); diff --git a/ts/features/wallet/onboarding/satispay/screens/add/AddSatispayScreen.tsx b/ts/features/wallet/onboarding/satispay/screens/add/AddSatispayScreen.tsx index 8b7ccd8a261..0d22240a635 100644 --- a/ts/features/wallet/onboarding/satispay/screens/add/AddSatispayScreen.tsx +++ b/ts/features/wallet/onboarding/satispay/screens/add/AddSatispayScreen.tsx @@ -12,20 +12,24 @@ import { cancelButtonProps, confirmButtonProps } from "../../../../../bonus/bonusVacanze/components/buttons/ButtonConfigurations"; +import { + isError, + isLoading, + isUndefined +} from "../../../../../bonus/bpd/model/RemoteValue"; import { addSatispayToWallet, - walletAddSatispayCancel + walletAddSatispayCancel, + walletAddSatispayCompleted } from "../../store/actions"; +import { onboardingSatispayAddingResultSelector } from "../../store/reducers/addingSatispay"; import { onboardingSatispayFoundSelector } from "../../store/reducers/foundSatispay"; +import LoadAddSatispayComponent from "./LoadAddSatispayComponent"; type Props = ReturnType & ReturnType; -/** - * The user can choose to add the found Satispay account to the wallet - * @constructor - */ -const AddSatispayScreen = (props: Props) => ( +const DisplayFoundSatispay = (props: Props) => (

Satispay Account found

@@ -40,14 +44,31 @@ const AddSatispayScreen = (props: Props) => (
); +/** + * The user can choose to add the found Satispay account to the wallet + * @constructor + */ +const AddSatispayScreen = (props: Props) => { + if (isUndefined(props.addingSatispay)) { + return ; + } + if (isError(props.addingSatispay) || isLoading(props.addingSatispay)) { + return ; + } + props.completed(); + return null; +}; + const mapDispatchToProps = (dispatch: Dispatch) => ({ cancel: () => dispatch(walletAddSatispayCancel()), confirm: (satispay: Satispay) => - dispatch(addSatispayToWallet.request(satispay)) + dispatch(addSatispayToWallet.request(satispay)), + completed: () => dispatch(walletAddSatispayCompleted()) }); const mapStateToProps = (state: GlobalState) => ({ - satispay: onboardingSatispayFoundSelector(state) + satispay: onboardingSatispayFoundSelector(state), + addingSatispay: onboardingSatispayAddingResultSelector(state) }); export default connect(mapStateToProps, mapDispatchToProps)(AddSatispayScreen); diff --git a/ts/features/wallet/onboarding/satispay/screens/add/LoadAddSatispayComponent.tsx b/ts/features/wallet/onboarding/satispay/screens/add/LoadAddSatispayComponent.tsx index 56b6898389a..842002de532 100644 --- a/ts/features/wallet/onboarding/satispay/screens/add/LoadAddSatispayComponent.tsx +++ b/ts/features/wallet/onboarding/satispay/screens/add/LoadAddSatispayComponent.tsx @@ -1,8 +1,19 @@ -import { View } from "native-base"; import * as React from "react"; import { connect } from "react-redux"; import { Dispatch } from "redux"; +import { Satispay } from "../../../../../../../definitions/pagopa/Satispay"; +import I18n from "../../../../../../i18n"; import { GlobalState } from "../../../../../../store/reducers/types"; +import { useHardwareBackButton } from "../../../../../bonus/bonusVacanze/components/hooks/useHardwareBackButton"; +import { LoadingErrorComponent } from "../../../../../bonus/bonusVacanze/components/loadingErrorScreen/LoadingErrorComponent"; +import { + addSatispayToWallet, + walletAddSatispayCancel +} from "../../store/actions"; +import { + onboardingSatispayFoundSelector, + onboardingSatispayIsErrorSelector +} from "../../store/reducers/foundSatispay"; type Props = ReturnType & ReturnType; @@ -11,11 +22,32 @@ type Props = ReturnType & * Loading & Error management when adding a satispay account to the wallet * @constructor */ -const LoadAddSatispayComponent: React.FunctionComponent = () => ; +const LoadAddSatispayComponent = (props: Props) => { + useHardwareBackButton(() => { + if (!props.isLoading) { + props.cancel(); + } + return true; + }); + return ( + props.foundSatispay && props.retry(props.foundSatispay)} + /> + ); +}; -const mapDispatchToProps = (_: Dispatch) => ({}); +const mapDispatchToProps = (dispatch: Dispatch) => ({ + cancel: () => dispatch(walletAddSatispayCancel()), + retry: (s: Satispay) => dispatch(addSatispayToWallet.request(s)) +}); -const mapStateToProps = (_: GlobalState) => ({}); +const mapStateToProps = (state: GlobalState) => ({ + foundSatispay: onboardingSatispayFoundSelector(state), + isLoading: !onboardingSatispayIsErrorSelector(state) +}); export default connect( mapStateToProps, diff --git a/ts/features/wallet/onboarding/satispay/screens/search/LoadSatispaySearch.tsx b/ts/features/wallet/onboarding/satispay/screens/search/LoadSatispaySearch.tsx index 9d722f77255..35eb2267191 100644 --- a/ts/features/wallet/onboarding/satispay/screens/search/LoadSatispaySearch.tsx +++ b/ts/features/wallet/onboarding/satispay/screens/search/LoadSatispaySearch.tsx @@ -5,12 +5,11 @@ import I18n from "../../../../../../i18n"; import { GlobalState } from "../../../../../../store/reducers/types"; import { useHardwareBackButton } from "../../../../../bonus/bonusVacanze/components/hooks/useHardwareBackButton"; import { LoadingErrorComponent } from "../../../../../bonus/bonusVacanze/components/loadingErrorScreen/LoadingErrorComponent"; -import { onboardingBancomatAbiSelectedSelector } from "../../../bancomat/store/reducers/abiSelected"; -import { onboardingBancomatPansIsError } from "../../../bancomat/store/reducers/pans"; import { searchUserSatispay, walletAddSatispayCancel } from "../../store/actions"; +import { onboardingSatispayIsErrorSelector } from "../../store/reducers/foundSatispay"; type Props = ReturnType & ReturnType; @@ -42,8 +41,7 @@ const mapDispatchToProps = (dispatch: Dispatch) => ({ }); const mapStateToProps = (state: GlobalState) => ({ - abiSelected: onboardingBancomatAbiSelectedSelector(state), - isLoading: !onboardingBancomatPansIsError(state) + isLoading: !onboardingSatispayIsErrorSelector(state) }); export default connect(mapStateToProps, mapDispatchToProps)(LoadSatispaySearch); diff --git a/ts/features/wallet/onboarding/satispay/store/reducers/addedSatispay.ts b/ts/features/wallet/onboarding/satispay/store/reducers/addedSatispay.ts index 5a3c7a6259c..c15cf7d3fe7 100644 --- a/ts/features/wallet/onboarding/satispay/store/reducers/addedSatispay.ts +++ b/ts/features/wallet/onboarding/satispay/store/reducers/addedSatispay.ts @@ -3,6 +3,7 @@ import { Action } from "../../../../../../store/actions/types"; import { RawSatispayPaymentMethod } from "../../../../../../types/pagopa"; import { addSatispayToWallet, walletAddSatispayStart } from "../actions"; +// TODO: can remove this ad using only addingSatispay?? export const addedSatispayReducer = ( state: RawSatispayPaymentMethod | null = null, action: Action diff --git a/ts/features/wallet/onboarding/satispay/store/reducers/addingSatispay.ts b/ts/features/wallet/onboarding/satispay/store/reducers/addingSatispay.ts new file mode 100644 index 00000000000..f74597bb3be --- /dev/null +++ b/ts/features/wallet/onboarding/satispay/store/reducers/addingSatispay.ts @@ -0,0 +1,35 @@ +import { getType } from "typesafe-actions"; +import { Card } from "../../../../../../../definitions/pagopa/walletv2/Card"; +import { Action } from "../../../../../../store/actions/types"; +import { GlobalState } from "../../../../../../store/reducers/types"; +import { RawSatispayPaymentMethod } from "../../../../../../types/pagopa"; +import { + remoteError, + remoteLoading, + remoteReady, + remoteUndefined, + RemoteValue +} from "../../../../../bonus/bpd/model/RemoteValue"; +import { addSatispayToWallet, walletAddSatispayStart } from "../actions"; + +export const addingSatispayReducer = ( + state: RemoteValue = remoteUndefined, + action: Action +): RemoteValue => { + switch (action.type) { + case getType(addSatispayToWallet.request): + return remoteLoading; + case getType(addSatispayToWallet.success): + return remoteReady(action.payload); + case getType(addSatispayToWallet.failure): + return remoteError(action.payload); + case getType(walletAddSatispayStart): + return remoteUndefined; + } + return state; +}; + +export const onboardingSatispayAddingResultSelector = ( + state: GlobalState +): RemoteValue => + state.wallet.onboarding.satispay.addingSatispay; diff --git a/ts/features/wallet/onboarding/satispay/store/reducers/foundSatispay.ts b/ts/features/wallet/onboarding/satispay/store/reducers/foundSatispay.ts index f8903687fe0..722a0c771e6 100644 --- a/ts/features/wallet/onboarding/satispay/store/reducers/foundSatispay.ts +++ b/ts/features/wallet/onboarding/satispay/store/reducers/foundSatispay.ts @@ -6,15 +6,14 @@ import { Action } from "../../../../../../store/actions/types"; import { GlobalState } from "../../../../../../store/reducers/types"; import { NetworkError } from "../../../../../../utils/errors"; import { - getValueOrElse, + fold, + isError, remoteError, remoteLoading, remoteReady, remoteUndefined, - RemoteValue, - fold + RemoteValue } from "../../../../../bonus/bpd/model/RemoteValue"; -import { Pans } from "../../../bancomat/store/reducers/pans"; import { searchUserSatispay } from "../actions"; export type RemoteSatispay = RemoteValue; @@ -43,7 +42,7 @@ export const onboardingSatispayFoundRemoteSelector = ( ): RemoteSatispay => state.wallet.onboarding.satispay.foundSatispay; /** - * Return the found satispay + * Return the found satispay, without the remote state * @param state */ export const onboardingSatispayFoundSelector = createSelector( @@ -57,3 +56,8 @@ export const onboardingSatispayFoundSelector = createSelector( _ => undefined ) ); + +export const onboardingSatispayIsErrorSelector = createSelector( + [onboardingSatispayFoundRemoteSelector], + remoteSatispay => isError(remoteSatispay) +); diff --git a/ts/features/wallet/onboarding/satispay/store/reducers/index.ts b/ts/features/wallet/onboarding/satispay/store/reducers/index.ts index 914f390a3f2..963e7935fd1 100644 --- a/ts/features/wallet/onboarding/satispay/store/reducers/index.ts +++ b/ts/features/wallet/onboarding/satispay/store/reducers/index.ts @@ -1,12 +1,15 @@ import { combineReducers } from "redux"; import { Action } from "../../../../../../store/actions/types"; import { RawSatispayPaymentMethod } from "../../../../../../types/pagopa"; +import { RemoteValue } from "../../../../../bonus/bpd/model/RemoteValue"; import { addedSatispayReducer } from "./addedSatispay"; +import { addingSatispayReducer } from "./addingSatispay"; import { foundSatispayReducer, RemoteSatispay } from "./foundSatispay"; export type OnboardSatispayState = { // A RemoteValue that represent the found satispay account for the user foundSatispay: RemoteSatispay; + addingSatispay: RemoteValue; addedSatispay: RawSatispayPaymentMethod | null; }; @@ -14,6 +17,9 @@ const onboardingSatispayReducer = combineReducers( { // the satispay account found for the user during the onboarding phase foundSatispay: foundSatispayReducer, + // the user is trying to add the satispay account to the wallet + addingSatispay: addingSatispayReducer, + // the satispay account that the user choose to add to the wallet addedSatispay: addedSatispayReducer } ); From 3bcbc947690c4fd398831efe291784a805db94cc Mon Sep 17 00:00:00 2001 From: Fabrizio Date: Sun, 29 Nov 2020 20:05:32 +0100 Subject: [PATCH 11/24] [#175883778] handle saga --- locales/en/index.yml | 2 ++ locales/it/index.yml | 2 ++ ts/api/pagopa.ts | 1 - .../satispay/saga/networking/index.ts | 18 +++++++++++---- .../saga/orchestration/addSatispayToWallet.ts | 22 ++++++++++--------- .../ActivateBpdOnNewSatispayScreen.tsx | 9 ++++---- .../screens/add/LoadAddSatispayComponent.tsx | 2 +- .../satispay/store/reducers/addedSatispay.ts | 19 +++++++++++++++- .../satispay/store/reducers/addingSatispay.ts | 1 - ts/navigation/routes.ts | 2 +- ts/utils/paymentMethod.ts | 16 ++++++++++++-- ts/utils/walletv2.ts | 17 +++++++++++--- 12 files changed, 83 insertions(+), 28 deletions(-) diff --git a/locales/en/index.yml b/locales/en/index.yml index eab53ba30b0..c02e1035874 100644 --- a/locales/en/index.yml +++ b/locales/en/index.yml @@ -728,6 +728,8 @@ wallet: headerTitle: "Add Satispay" loadingSearch: title: "We are verifying your Satispay account \n\n Please wait a few seconds" + loadingAdd: + title: "We are adding your Satispay account \n\n Please wait a few seconds" alert: msgErrorUpdateApp: "An error occurred while opening the app store" titlePagoPaUpdateApp: Update required diff --git a/locales/it/index.yml b/locales/it/index.yml index 977b043da3e..6d8d0ab64df 100644 --- a/locales/it/index.yml +++ b/locales/it/index.yml @@ -749,6 +749,8 @@ wallet: headerTitle: "Aggiungi Satispay" loadingSearch: title: "Stiamo verificando il tuo account Satispay\n\nAttendi qualche secondo" + loadingAdd: + title: "Stiamo aggiungendo il tuo account Satispay\n\nAttendi qualche secondo" alert: msgErrorUpdateApp: "Si è verificato un errore durante l'apertura dello store delle app" titlePagoPaUpdateApp: Aggiornamento richiesto diff --git a/ts/api/pagopa.ts b/ts/api/pagopa.ts index ba3d27aa65b..76d5f410b81 100644 --- a/ts/api/pagopa.ts +++ b/ts/api/pagopa.ts @@ -24,7 +24,6 @@ import { import { Omit } from "italia-ts-commons/lib/types"; import { BancomatCardsRequest } from "../../definitions/pagopa/walletv2/BancomatCardsRequest"; import { - addWalletSatispayUsingPOSTDefaultDecoder, AddWalletSatispayUsingPOSTT, addWalletsBancomatCardUsingPOSTDecoder, getAbiListUsingGETDefaultDecoder, diff --git a/ts/features/wallet/onboarding/satispay/saga/networking/index.ts b/ts/features/wallet/onboarding/satispay/saga/networking/index.ts index abdb71aa07e..031b479cc61 100644 --- a/ts/features/wallet/onboarding/satispay/saga/networking/index.ts +++ b/ts/features/wallet/onboarding/satispay/saga/networking/index.ts @@ -7,6 +7,7 @@ import { PaymentManagerToken } from "../../../../../../types/pagopa"; import { SagaCallReturnType } from "../../../../../../types/utils"; import { getError, getNetworkError } from "../../../../../../utils/errors"; import { SessionManager } from "../../../../../../utils/SessionManager"; +import { fromPatchedWalletV2ToRawSatispay } from "../../../../../../utils/walletv2"; import { addSatispayToWallet, searchUserSatispay } from "../../store/actions"; /** @@ -82,10 +83,19 @@ export function* handleAddUserSatispayToWallet( if (addSatispayToWalletWithRefreshResult.isRight()) { const statusCode = addSatispayToWalletWithRefreshResult.value.status; if (statusCode === 200) { - const newSatispay = - addSatispayToWalletWithRefreshResult.value.value.data; - // satispay has been added to the user wallet - return yield put(addSatispayToWallet.success(newSatispay)); + const newSatispay = fromPatchedWalletV2ToRawSatispay( + addSatispayToWalletWithRefreshResult.value.value.data + ); + if (newSatispay) { + // satispay has been added to the user wallet + return yield put(addSatispayToWallet.success(newSatispay)); + } else { + return yield put( + addSatispayToWallet.failure( + new Error(`cannot transform in RawSatispayPaymentMethod`) + ) + ); + } } else { return yield put( addSatispayToWallet.failure( diff --git a/ts/features/wallet/onboarding/satispay/saga/orchestration/addSatispayToWallet.ts b/ts/features/wallet/onboarding/satispay/saga/orchestration/addSatispayToWallet.ts index a365effd847..118518e3562 100644 --- a/ts/features/wallet/onboarding/satispay/saga/orchestration/addSatispayToWallet.ts +++ b/ts/features/wallet/onboarding/satispay/saga/orchestration/addSatispayToWallet.ts @@ -9,7 +9,6 @@ import { fetchWalletsRequest } from "../../../../../../store/actions/wallet/wall import { navigationCurrentRouteSelector } from "../../../../../../store/reducers/navigation"; import { SagaCallReturnType } from "../../../../../../types/utils"; import { activateBpdOnNewPaymentMethods } from "../../../../../bonus/bpd/saga/orchestration/activateBpdOnNewAddedPaymentMethods"; -import { onboardingBancomatAddedPansSelector } from "../../../bancomat/store/reducers/addedPans"; import { navigateToActivateBpdOnNewSatispay, navigateToOnboardingSatispayStart @@ -20,6 +19,7 @@ import { walletAddSatispayCancel, walletAddSatispayCompleted } from "../../store/actions"; +import { onboardingSatispayAddedResultSelector } from "../../store/reducers/addedSatispay"; /** * Define the workflow that allows the user to add a satispay to the wallet. @@ -71,24 +71,26 @@ export function* addSatispayToWalletAndActivateBpd() { if ( // TODO: The page will be WALLET_ADD_DIGITAL_PAYMENT_METHOD and should do two back currentRoute.isSome() && - currentRoute.value === "WALLET_ADD_PAYMENT_METHOD" + currentRoute.value === "WALLET_ADD_DIGITAL_PAYMENT_METHOD" ) { yield put(NavigationActions.back()); + yield put(NavigationActions.back()); } } - console.log(res); if (res === "completed") { // refresh wallets list yield put(fetchWalletsRequest()); // read the new added satispay - const satispayAdded: ReturnType = yield select( - onboardingBancomatAddedPansSelector + const satispayAdded: ReturnType = yield select( + onboardingSatispayAddedResultSelector ); - yield call( - activateBpdOnNewPaymentMethods, - satispayAdded, - navigateToActivateBpdOnNewSatispay() - ); + if (satispayAdded) { + yield call( + activateBpdOnNewPaymentMethods, + [satispayAdded], + navigateToActivateBpdOnNewSatispay() + ); + } } } diff --git a/ts/features/wallet/onboarding/satispay/screens/ActivateBpdOnNewSatispayScreen.tsx b/ts/features/wallet/onboarding/satispay/screens/ActivateBpdOnNewSatispayScreen.tsx index 0af8091da73..4958ec9266d 100644 --- a/ts/features/wallet/onboarding/satispay/screens/ActivateBpdOnNewSatispayScreen.tsx +++ b/ts/features/wallet/onboarding/satispay/screens/ActivateBpdOnNewSatispayScreen.tsx @@ -1,17 +1,18 @@ import * as React from "react"; import { connect } from "react-redux"; import { GlobalState } from "../../../../../store/reducers/types"; -import { onboardingBancomatAddedPansSelector } from "../../bancomat/store/reducers/addedPans"; import ActivateBpdOnNewPaymentMethodScreen from "../../common/screens/bpd/ActivateBpdOnNewPaymentMethodScreen"; +import { onboardingSatispayAddedResultSelector } from "../store/reducers/addedSatispay"; type Props = ReturnType; const ActivateBpdOnNewSatispayScreen = (props: Props) => ( - + ); const mapStateToProps = (state: GlobalState) => ({ - // TODO : replace with onboarding satispay selector - newSatispay: onboardingBancomatAddedPansSelector(state) + newSatispay: onboardingSatispayAddedResultSelector(state) }); export default connect(mapStateToProps)(ActivateBpdOnNewSatispayScreen); diff --git a/ts/features/wallet/onboarding/satispay/screens/add/LoadAddSatispayComponent.tsx b/ts/features/wallet/onboarding/satispay/screens/add/LoadAddSatispayComponent.tsx index 842002de532..de6d79c9cd8 100644 --- a/ts/features/wallet/onboarding/satispay/screens/add/LoadAddSatispayComponent.tsx +++ b/ts/features/wallet/onboarding/satispay/screens/add/LoadAddSatispayComponent.tsx @@ -32,7 +32,7 @@ const LoadAddSatispayComponent = (props: Props) => { return ( props.foundSatispay && props.retry(props.foundSatispay)} /> diff --git a/ts/features/wallet/onboarding/satispay/store/reducers/addedSatispay.ts b/ts/features/wallet/onboarding/satispay/store/reducers/addedSatispay.ts index c15cf7d3fe7..e8858149e5b 100644 --- a/ts/features/wallet/onboarding/satispay/store/reducers/addedSatispay.ts +++ b/ts/features/wallet/onboarding/satispay/store/reducers/addedSatispay.ts @@ -1,6 +1,11 @@ import { getType } from "typesafe-actions"; import { Action } from "../../../../../../store/actions/types"; -import { RawSatispayPaymentMethod } from "../../../../../../types/pagopa"; +import { GlobalState } from "../../../../../../store/reducers/types"; +import { + RawSatispayPaymentMethod, + SatispayPaymentMethod +} from "../../../../../../types/pagopa"; +import { enhanceSatispay } from "../../../../../../utils/paymentMethod"; import { addSatispayToWallet, walletAddSatispayStart } from "../actions"; // TODO: can remove this ad using only addingSatispay?? @@ -18,3 +23,15 @@ export const addedSatispayReducer = ( } return state; }; + +/** + * Return the added satispay account during the latest addition + * @param state + */ +export const onboardingSatispayAddedResultSelector = ( + state: GlobalState +): SatispayPaymentMethod | undefined => { + const addedSatispay = state.wallet.onboarding.satispay.addedSatispay; + + return addedSatispay !== null ? enhanceSatispay(addedSatispay) : undefined; +}; diff --git a/ts/features/wallet/onboarding/satispay/store/reducers/addingSatispay.ts b/ts/features/wallet/onboarding/satispay/store/reducers/addingSatispay.ts index f74597bb3be..09934e0d939 100644 --- a/ts/features/wallet/onboarding/satispay/store/reducers/addingSatispay.ts +++ b/ts/features/wallet/onboarding/satispay/store/reducers/addingSatispay.ts @@ -1,5 +1,4 @@ import { getType } from "typesafe-actions"; -import { Card } from "../../../../../../../definitions/pagopa/walletv2/Card"; import { Action } from "../../../../../../store/actions/types"; import { GlobalState } from "../../../../../../store/reducers/types"; import { RawSatispayPaymentMethod } from "../../../../../../types/pagopa"; diff --git a/ts/navigation/routes.ts b/ts/navigation/routes.ts index 3327608ea00..5234eb89ea2 100644 --- a/ts/navigation/routes.ts +++ b/ts/navigation/routes.ts @@ -41,7 +41,7 @@ const ROUTES = { WALLET_BANCOMAT_DETAIL: "WALLET_BANCOMAT_DETAIL", WALLET_SAVE_CARD: "WALLET_SAVE_CARD", WALLET_ADD_PAYMENT_METHOD: "WALLET_ADD_PAYMENT_METHOD", - WALLET_ADD_DIGITAL_PAYMENT_METHOD: "WALLET_ADD_DIGITAl_PAYMENT_METHOD", + WALLET_ADD_DIGITAL_PAYMENT_METHOD: "WALLET_ADD_DIGITAL_PAYMENT_METHOD", WALLET_ADD_CARD: "WALLET_ADD_CARD", WALLET_CONFIRM_CARD_DETAILS: "WALLET_CONFIRM_CARD_DETAILS", WALLET_CHECKOUT_3DS_SCREEN: "WALLET_CHECKOUT_3DS_SCREEN", diff --git a/ts/utils/paymentMethod.ts b/ts/utils/paymentMethod.ts index e06bae4e19b..97e7c6d4a74 100644 --- a/ts/utils/paymentMethod.ts +++ b/ts/utils/paymentMethod.ts @@ -19,7 +19,9 @@ import { PaymentMethod, RawBancomatPaymentMethod, RawCreditCardPaymentMethod, - RawPaymentMethod + RawPaymentMethod, + RawSatispayPaymentMethod, + SatispayPaymentMethod } from "../types/pagopa"; import { contentRepoUrl } from "../config"; import { FOUR_UNICODE_CIRCLES } from "./wallet"; @@ -79,6 +81,8 @@ export const getTitleFromBancomat = ( .chain(abi => fromNullable(abi.name)) .getOrElse(I18n.t("wallet.methods.bancomat.name")); +export const getTitleForSatispay = () => I18n.t("wallet.methods.satispay.name"); + /** * Choose a textual representation for a {@link PatchedWalletV2} * @param paymentMethod @@ -95,7 +99,7 @@ export const getTitleFromPaymentMethod = ( return getTitleFromBancomat(paymentMethod, abiList); } if (isRawSatispay(paymentMethod)) { - return I18n.t("wallet.methods.satispay.name"); + return getTitleForSatispay(); } if (isRawBPay(paymentMethod)) { return ( @@ -119,6 +123,14 @@ export const enhanceBancomat = ( icon: getImageFromPaymentMethod(bancomat) }); +export const enhanceSatispay = ( + raw: RawSatispayPaymentMethod +): SatispayPaymentMethod => ({ + ...raw, + caption: getTitleForSatispay(), + icon: getImageFromPaymentMethod(raw) +}); + export const enhancePaymentMethod = ( pm: RawPaymentMethod, abiList: IndexedById diff --git a/ts/utils/walletv2.ts b/ts/utils/walletv2.ts index e54f6708916..baf94a18961 100644 --- a/ts/utils/walletv2.ts +++ b/ts/utils/walletv2.ts @@ -11,6 +11,7 @@ import { PatchedPaymentMethodInfo, PatchedWalletV2, RawPaymentMethod, + RawSatispayPaymentMethod, Wallet } from "../types/pagopa"; import { @@ -60,7 +61,7 @@ const isWalletV2CreditCard = ( ): paymentMethodInfo is CardInfo => paymentMethodInfo && wallet.walletType === WalletTypeEnum.Card; -const getPaymentMethod = ( +export const fromPatchedWalletV2ToRawPaymentMethod = ( wallet: PatchedWalletV2 ): RawPaymentMethod | undefined => { if (isWalletV2CreditCard(wallet, wallet.info)) { @@ -78,6 +79,16 @@ const getPaymentMethod = ( return undefined; }; +// TODO: should be Either instead of return undefined +export const fromPatchedWalletV2ToRawSatispay = ( + wallet: PatchedWalletV2 +): RawSatispayPaymentMethod | undefined => { + if (isWalletV2Satispay(wallet, wallet.info)) { + return { ...wallet, kind: "Satispay", info: wallet.info }; + } + return undefined; +}; + /** * inject walletV2 into walletV1 structure * @param walletV2 @@ -85,7 +96,7 @@ const getPaymentMethod = ( export const convertWalletV2toWalletV1 = ( walletV2: PatchedWalletV2 ): Wallet => { - const paymentMethodInfo = getPaymentMethod(walletV2); + const paymentMethodInfo = fromPatchedWalletV2ToRawPaymentMethod(walletV2); const card = paymentMethodInfo?.kind === "CreditCard" ? paymentMethodInfo.info @@ -122,6 +133,6 @@ export const convertWalletV2toWalletV1 = ( isPspToIgnore: false, registeredNexi: false, saved: true, - paymentMethod: getPaymentMethod(walletV2) + paymentMethod: fromPatchedWalletV2ToRawPaymentMethod(walletV2) }; }; From e5a17101f1af0f566a7407680ea8728f2c731cb6 Mon Sep 17 00:00:00 2001 From: Fabrizio Date: Sun, 29 Nov 2020 20:13:40 +0100 Subject: [PATCH 12/24] [#175883778] fix titles for activateBpdOnNewMethods --- .../bancomat/screens/ActivateBpdOnNewBancomatScreen.tsx | 6 +++++- .../common/screens/bpd/ActivateBpdOnNewCreditCardScreen.tsx | 2 ++ .../screens/bpd/ActivateBpdOnNewPaymentMethodScreen.tsx | 6 +++--- .../satispay/screens/ActivateBpdOnNewSatispayScreen.tsx | 2 ++ 4 files changed, 12 insertions(+), 4 deletions(-) diff --git a/ts/features/wallet/onboarding/bancomat/screens/ActivateBpdOnNewBancomatScreen.tsx b/ts/features/wallet/onboarding/bancomat/screens/ActivateBpdOnNewBancomatScreen.tsx index 9b6aa43a8cf..8f681b2e967 100644 --- a/ts/features/wallet/onboarding/bancomat/screens/ActivateBpdOnNewBancomatScreen.tsx +++ b/ts/features/wallet/onboarding/bancomat/screens/ActivateBpdOnNewBancomatScreen.tsx @@ -1,5 +1,6 @@ import * as React from "react"; import { connect } from "react-redux"; +import I18n from "../../../../../i18n"; import { onboardingBancomatAddedPansSelector } from "../store/reducers/addedPans"; import { GlobalState } from "../../../../../store/reducers/types"; import ActivateBpdOnNewPaymentMethodScreen from "../../common/screens/bpd/ActivateBpdOnNewPaymentMethodScreen"; @@ -7,7 +8,10 @@ import ActivateBpdOnNewPaymentMethodScreen from "../../common/screens/bpd/Activa type Props = ReturnType; const ActivateBpdOnNewBancomatScreen = (props: Props) => ( - + ); const mapStateToProps = (state: GlobalState) => ({ diff --git a/ts/features/wallet/onboarding/common/screens/bpd/ActivateBpdOnNewCreditCardScreen.tsx b/ts/features/wallet/onboarding/common/screens/bpd/ActivateBpdOnNewCreditCardScreen.tsx index 558a1e941ba..234807c6569 100644 --- a/ts/features/wallet/onboarding/common/screens/bpd/ActivateBpdOnNewCreditCardScreen.tsx +++ b/ts/features/wallet/onboarding/common/screens/bpd/ActivateBpdOnNewCreditCardScreen.tsx @@ -1,5 +1,6 @@ import * as React from "react"; import { NavigationScreenProps } from "react-navigation"; +import I18n from "../../../../../../i18n"; import { PaymentMethod } from "../../../../../../types/pagopa"; import ActivateBpdOnNewPaymentMethodScreen from "./ActivateBpdOnNewPaymentMethodScreen"; @@ -15,5 +16,6 @@ export const ActivateBpdOnNewCreditCardScreen: React.FC = ( ) => ( ); diff --git a/ts/features/wallet/onboarding/common/screens/bpd/ActivateBpdOnNewPaymentMethodScreen.tsx b/ts/features/wallet/onboarding/common/screens/bpd/ActivateBpdOnNewPaymentMethodScreen.tsx index 1c0a37149ce..4614ed96d6c 100644 --- a/ts/features/wallet/onboarding/common/screens/bpd/ActivateBpdOnNewPaymentMethodScreen.tsx +++ b/ts/features/wallet/onboarding/common/screens/bpd/ActivateBpdOnNewPaymentMethodScreen.tsx @@ -15,12 +15,12 @@ import { PaymentMethodRawList } from "../../../../../bonus/bpd/components/paymen type OwnProps = { paymentMethods: ReadonlyArray; + title: string; }; export type Props = ReturnType & OwnProps; const loadLocales = () => ({ - headerTitle: I18n.t("wallet.onboarding.bancomat.headerTitle"), title: I18n.t("wallet.onboarding.bancomat.bpd.activateNew.title"), body1: I18n.t("wallet.onboarding.bancomat.bpd.activateNew.body1"), body2: I18n.t("wallet.onboarding.bancomat.bpd.activateNew.body2"), @@ -29,9 +29,9 @@ const loadLocales = () => ({ }); const ActivateBpdOnNewPaymentMethodScreen: React.FunctionComponent = props => { - const { headerTitle, title, body1, body2, skip, continueStr } = loadLocales(); + const { title, body1, body2, skip, continueStr } = loadLocales(); return ( - + diff --git a/ts/features/wallet/onboarding/satispay/screens/ActivateBpdOnNewSatispayScreen.tsx b/ts/features/wallet/onboarding/satispay/screens/ActivateBpdOnNewSatispayScreen.tsx index 4958ec9266d..6f9da7f8a11 100644 --- a/ts/features/wallet/onboarding/satispay/screens/ActivateBpdOnNewSatispayScreen.tsx +++ b/ts/features/wallet/onboarding/satispay/screens/ActivateBpdOnNewSatispayScreen.tsx @@ -1,5 +1,6 @@ import * as React from "react"; import { connect } from "react-redux"; +import I18n from "../../../../../i18n"; import { GlobalState } from "../../../../../store/reducers/types"; import ActivateBpdOnNewPaymentMethodScreen from "../../common/screens/bpd/ActivateBpdOnNewPaymentMethodScreen"; import { onboardingSatispayAddedResultSelector } from "../store/reducers/addedSatispay"; @@ -9,6 +10,7 @@ type Props = ReturnType; const ActivateBpdOnNewSatispayScreen = (props: Props) => ( ); From ce3d240f79eee1f87cd568987879c7ef0a35abd1 Mon Sep 17 00:00:00 2001 From: fabriziofff Date: Tue, 1 Dec 2020 09:58:02 +0100 Subject: [PATCH 13/24] Update locales/en/index.yml Co-authored-by: Matteo Boschi --- locales/en/index.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/locales/en/index.yml b/locales/en/index.yml index 3ef08e09fe0..20b1adf4c31 100644 --- a/locales/en/index.yml +++ b/locales/en/index.yml @@ -732,7 +732,7 @@ wallet: satispay: headerTitle: "Add Satispay" loadingSearch: - title: "We are verifying your Satispay account \n\n Please wait a few seconds" + title: "We are verifying your Satispay account\n\nPlease wait a few seconds" loadingAdd: title: "We are adding your Satispay account \n\n Please wait a few seconds" alert: From 01cd9afa4c03de1fbdfdc71ccbfc05d639c083fa Mon Sep 17 00:00:00 2001 From: fabriziofff Date: Tue, 1 Dec 2020 09:58:12 +0100 Subject: [PATCH 14/24] Update locales/en/index.yml Co-authored-by: Matteo Boschi --- locales/en/index.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/locales/en/index.yml b/locales/en/index.yml index 20b1adf4c31..9b9c79487b6 100644 --- a/locales/en/index.yml +++ b/locales/en/index.yml @@ -734,7 +734,7 @@ wallet: loadingSearch: title: "We are verifying your Satispay account\n\nPlease wait a few seconds" loadingAdd: - title: "We are adding your Satispay account \n\n Please wait a few seconds" + title: "We are adding your Satispay account\n\nPlease wait a few seconds" alert: msgErrorUpdateApp: "An error occurred while opening the app store" titlePagoPaUpdateApp: Update required From 8de14be25b1f8784973265ede35541ce02dfa6aa Mon Sep 17 00:00:00 2001 From: fabriziofff Date: Tue, 1 Dec 2020 09:59:49 +0100 Subject: [PATCH 15/24] Update ts/features/bonus/bpd/saga/orchestration/activateBpdOnNewAddedPaymentMethods.ts Co-authored-by: Matteo Boschi --- .../saga/orchestration/activateBpdOnNewAddedPaymentMethods.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/ts/features/bonus/bpd/saga/orchestration/activateBpdOnNewAddedPaymentMethods.ts b/ts/features/bonus/bpd/saga/orchestration/activateBpdOnNewAddedPaymentMethods.ts index 50295a7503f..85c0576468d 100644 --- a/ts/features/bonus/bpd/saga/orchestration/activateBpdOnNewAddedPaymentMethods.ts +++ b/ts/features/bonus/bpd/saga/orchestration/activateBpdOnNewAddedPaymentMethods.ts @@ -17,7 +17,6 @@ export function* activateBpdOnNewPaymentMethods( paymentMethods: ReadonlyArray, navigateToActivateNewMethods: NavigationNavigateAction ) { - // TODO: change enableableFunction with types representing the possibles functionalities const atLeastOneBancomatWithBpdCapability = paymentMethods.some(b => hasFunctionEnabled(b, EnableableFunctionsTypeEnum.BPD) ); From ed49a5bda57b8e351bce3c51b9d5ba196a4ad89c Mon Sep 17 00:00:00 2001 From: fabriziofff Date: Tue, 1 Dec 2020 10:00:03 +0100 Subject: [PATCH 16/24] Update ts/features/bonus/bpd/saga/orchestration/activateBpdOnNewAddedPaymentMethods.ts Co-authored-by: Matteo Boschi --- .../saga/orchestration/activateBpdOnNewAddedPaymentMethods.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ts/features/bonus/bpd/saga/orchestration/activateBpdOnNewAddedPaymentMethods.ts b/ts/features/bonus/bpd/saga/orchestration/activateBpdOnNewAddedPaymentMethods.ts index 85c0576468d..8901ddf504d 100644 --- a/ts/features/bonus/bpd/saga/orchestration/activateBpdOnNewAddedPaymentMethods.ts +++ b/ts/features/bonus/bpd/saga/orchestration/activateBpdOnNewAddedPaymentMethods.ts @@ -21,7 +21,7 @@ export function* activateBpdOnNewPaymentMethods( hasFunctionEnabled(b, EnableableFunctionsTypeEnum.BPD) ); - // No bancomat with bpd capability added in the current workflow, return to wallet home + // No payment method with bpd capability added in the current workflow, return to wallet home if (!atLeastOneBancomatWithBpdCapability) { return yield put(navigateToWalletHome()); } From 6a819b04b97eb093a78965679f2f78c20a5ce7de Mon Sep 17 00:00:00 2001 From: fabriziofff Date: Tue, 1 Dec 2020 10:00:11 +0100 Subject: [PATCH 17/24] Update ts/features/wallet/onboarding/satispay/store/reducers/foundSatispay.ts Co-authored-by: Matteo Boschi --- .../wallet/onboarding/satispay/store/reducers/foundSatispay.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ts/features/wallet/onboarding/satispay/store/reducers/foundSatispay.ts b/ts/features/wallet/onboarding/satispay/store/reducers/foundSatispay.ts index 722a0c771e6..3b72b60e909 100644 --- a/ts/features/wallet/onboarding/satispay/store/reducers/foundSatispay.ts +++ b/ts/features/wallet/onboarding/satispay/store/reducers/foundSatispay.ts @@ -52,7 +52,7 @@ export const onboardingSatispayFoundSelector = createSelector( remoteSatispay, () => undefined, () => undefined, - val => (val !== null ? val : undefined), + val => (val ?? undefined), _ => undefined ) ); From 765990a2f47ade9ab39ca4f33667a349a9e331f8 Mon Sep 17 00:00:00 2001 From: fabriziofff Date: Tue, 1 Dec 2020 10:00:27 +0100 Subject: [PATCH 18/24] Update ts/features/wallet/onboarding/satispay/screens/search/SatispayKoNotFound.tsx Co-authored-by: Matteo Boschi --- .../onboarding/satispay/screens/search/SatispayKoNotFound.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoNotFound.tsx b/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoNotFound.tsx index de9028b89dc..0fbdb8055e6 100644 --- a/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoNotFound.tsx +++ b/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoNotFound.tsx @@ -14,6 +14,7 @@ type Props = ReturnType & */ const SatispayKoNotFound: React.FunctionComponent = () => ( + // TODO replace with localized message

No Satispay account found for the user

); From 63932040206bc66815c5afcb1cbbee1e5981dbd8 Mon Sep 17 00:00:00 2001 From: fabriziofff Date: Tue, 1 Dec 2020 10:00:33 +0100 Subject: [PATCH 19/24] Update ts/features/wallet/onboarding/satispay/screens/search/SatispayKoTimeout.tsx Co-authored-by: Matteo Boschi --- .../onboarding/satispay/screens/search/SatispayKoTimeout.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoTimeout.tsx b/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoTimeout.tsx index 9b0ad7b504d..fac6b831e3d 100644 --- a/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoTimeout.tsx +++ b/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoTimeout.tsx @@ -14,6 +14,7 @@ type Props = ReturnType & */ const SatispayKoTimeout: React.FunctionComponent = () => ( + // TODO replace with localized message

Timeout during the satispay account request

); From 271169c31a5fdf4febc1170d63210270ba85b826 Mon Sep 17 00:00:00 2001 From: Fabrizio Date: Tue, 1 Dec 2020 10:02:01 +0100 Subject: [PATCH 20/24] [#175883778] isTimeoutError --- .../satispay/screens/search/SearchSatispayManagerScreen.tsx | 3 ++- ts/utils/errors.ts | 3 +++ 2 files changed, 5 insertions(+), 1 deletion(-) diff --git a/ts/features/wallet/onboarding/satispay/screens/search/SearchSatispayManagerScreen.tsx b/ts/features/wallet/onboarding/satispay/screens/search/SearchSatispayManagerScreen.tsx index 4b43ce78686..7f657059b92 100644 --- a/ts/features/wallet/onboarding/satispay/screens/search/SearchSatispayManagerScreen.tsx +++ b/ts/features/wallet/onboarding/satispay/screens/search/SearchSatispayManagerScreen.tsx @@ -3,6 +3,7 @@ import { connect } from "react-redux"; import { Dispatch } from "redux"; import { GlobalState } from "../../../../../../store/reducers/types"; import { RawSatispayPaymentMethod } from "../../../../../../types/pagopa"; +import { isTimoutError } from "../../../../../../utils/errors"; import { isError, isLoading, @@ -23,7 +24,7 @@ type Props = ReturnType & */ const SearchSatispayManagerScreen: React.FunctionComponent = props => { const satispay = props.foundSatispay; - if (isError(satispay) && satispay.error.kind === "timeout") { + if (isError(satispay) && isTimoutError(satispay.error)) { return ; } if (isError(satispay) || isLoading(satispay)) { diff --git a/ts/utils/errors.ts b/ts/utils/errors.ts index 1b68e30c40c..b706c577e76 100644 --- a/ts/utils/errors.ts +++ b/ts/utils/errors.ts @@ -20,3 +20,6 @@ export const getNetworkError = (error: unknown): NetworkError => { } return { kind: "generic", value: getError(error) }; }; + +export const isTimoutError = (error: NetworkError): error is TimeoutError => + error.kind === "timeout"; From d11a5910999495b82d1899c4fe7d541f4436e207 Mon Sep 17 00:00:00 2001 From: fabriziofff Date: Tue, 1 Dec 2020 10:04:03 +0100 Subject: [PATCH 21/24] Update ts/features/wallet/onboarding/satispay/store/reducers/addedSatispay.ts Co-authored-by: Matteo Boschi --- .../wallet/onboarding/satispay/store/reducers/addedSatispay.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ts/features/wallet/onboarding/satispay/store/reducers/addedSatispay.ts b/ts/features/wallet/onboarding/satispay/store/reducers/addedSatispay.ts index e8858149e5b..f2b21f79ad0 100644 --- a/ts/features/wallet/onboarding/satispay/store/reducers/addedSatispay.ts +++ b/ts/features/wallet/onboarding/satispay/store/reducers/addedSatispay.ts @@ -8,7 +8,7 @@ import { import { enhanceSatispay } from "../../../../../../utils/paymentMethod"; import { addSatispayToWallet, walletAddSatispayStart } from "../actions"; -// TODO: can remove this ad using only addingSatispay?? +// TODO: can remove this and using only addingSatispay?? export const addedSatispayReducer = ( state: RawSatispayPaymentMethod | null = null, action: Action From 85c88bcc3a22f2871aa9d095251462a9a2dc3d32 Mon Sep 17 00:00:00 2001 From: Fabrizio Date: Tue, 1 Dec 2020 11:24:04 +0100 Subject: [PATCH 22/24] [#175883778] fix --- ts/navigation/WalletNavigator.ts | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/ts/navigation/WalletNavigator.ts b/ts/navigation/WalletNavigator.ts index 0fc70180f3c..324dc542fe1 100644 --- a/ts/navigation/WalletNavigator.ts +++ b/ts/navigation/WalletNavigator.ts @@ -10,6 +10,7 @@ import WalletAddBancomatNavigator from "../features/wallet/onboarding/bancomat/n import WALLET_ONBOARDING_BANCOMAT_ROUTES from "../features/wallet/onboarding/bancomat/navigation/routes"; import PaymentMethodOnboardingSatispayNavigator from "../features/wallet/onboarding/satispay/navigation/navigator"; import WALLET_ONBOARDING_SATISPAY_ROUTES from "../features/wallet/onboarding/satispay/navigation/routes"; +import SatispayDetailScreen from "../features/wallet/satispay/screen/SatispayDetailScreen"; import AddCardScreen from "../screens/wallet/AddCardScreen"; import AddPaymentMethodScreen from "../screens/wallet/AddPaymentMethodScreen"; import ConfirmCardDetailsScreen from "../screens/wallet/ConfirmCardDetailsScreen"; @@ -29,10 +30,6 @@ import TransactionDetailsScreen from "../screens/wallet/TransactionDetailsScreen import TransactionsScreen from "../screens/wallet/TransactionsScreen"; import WalletHomeScreen from "../screens/wallet/WalletHomeScreen"; import WalletsScreen from "../screens/wallet/WalletsScreen"; -import CreditCardOnboardingAttemptsScreen from "../screens/wallet/creditCardOnboardingAttempts/CreditCardOnboardingAttemptsScreen"; -import CreditCardOnboardingAttemptDetailScreen from "../screens/wallet/creditCardOnboardingAttempts/CreditCardOnboardingAttemptDetailScreen"; -import AddDigitalMethodScreen from "../features/wallet/onboarding/AddDigitalMethodScreen"; -import SatispayDetailScreen from "../features/wallet/satispay/screen/SatispayDetailScreen"; import ROUTES from "./routes"; const baseRouteConfigMap = { From 0156e1d389938117aaee88cd6d68e62819f77bdb Mon Sep 17 00:00:00 2001 From: Fabrizio Date: Tue, 1 Dec 2020 11:30:18 +0100 Subject: [PATCH 23/24] [#175883778] fix eslint --- .../onboarding/satispay/screens/search/SatispayKoNotFound.tsx | 2 +- .../onboarding/satispay/screens/search/SatispayKoTimeout.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoNotFound.tsx b/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoNotFound.tsx index 0fbdb8055e6..6cc187d217f 100644 --- a/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoNotFound.tsx +++ b/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoNotFound.tsx @@ -14,7 +14,7 @@ type Props = ReturnType & */ const SatispayKoNotFound: React.FunctionComponent = () => ( - // TODO replace with localized message + {/* TODO replace with the real screen */}

No Satispay account found for the user

); diff --git a/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoTimeout.tsx b/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoTimeout.tsx index fac6b831e3d..ef3954dd61e 100644 --- a/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoTimeout.tsx +++ b/ts/features/wallet/onboarding/satispay/screens/search/SatispayKoTimeout.tsx @@ -14,7 +14,7 @@ type Props = ReturnType & */ const SatispayKoTimeout: React.FunctionComponent = () => ( - // TODO replace with localized message + {/* TODO replace with the real screen */}

Timeout during the satispay account request

); From e51b8b9a6ba67e6fe274409f3f1e90c1487a9bcb Mon Sep 17 00:00:00 2001 From: Matteo Boschi Date: Tue, 1 Dec 2020 12:42:21 +0100 Subject: [PATCH 24/24] [#175883778] refactoring --- ts/features/bonus/bpd/analytics/index.ts | 8 ++++---- .../searchBancomat/SearchAvailableUserBancomatScreen.tsx | 3 ++- .../satispay/screens/search/LoadSatispaySearch.tsx | 2 +- .../screens/search/SearchSatispayManagerScreen.tsx | 4 ++-- ts/utils/errors.ts | 2 +- 5 files changed, 10 insertions(+), 9 deletions(-) diff --git a/ts/features/bonus/bpd/analytics/index.ts b/ts/features/bonus/bpd/analytics/index.ts index 2f93f43f92b..5ac1c9d816e 100644 --- a/ts/features/bonus/bpd/analytics/index.ts +++ b/ts/features/bonus/bpd/analytics/index.ts @@ -40,6 +40,7 @@ import { bpdPaymentMethodActivation, bpdUpdatePaymentMethodActivation } from "../store/actions/paymentMethods"; +import { isTimeoutError } from "../../../../utils/errors"; // eslint-disable-next-line complexity const trackAction = (mp: NonNullable) => ( @@ -152,10 +153,9 @@ const trackAction = (mp: NonNullable) => ( case getType(searchUserPans.failure): return mp.track(action.type, { - reason: - action.payload.kind === "timeout" - ? action.payload.kind - : action.payload.value.message + reason: isTimeoutError(action.payload) + ? action.payload.kind + : action.payload.value.message }); // Amount diff --git a/ts/features/wallet/onboarding/bancomat/screens/searchBancomat/SearchAvailableUserBancomatScreen.tsx b/ts/features/wallet/onboarding/bancomat/screens/searchBancomat/SearchAvailableUserBancomatScreen.tsx index c829d69845e..45cbfc91d0f 100644 --- a/ts/features/wallet/onboarding/bancomat/screens/searchBancomat/SearchAvailableUserBancomatScreen.tsx +++ b/ts/features/wallet/onboarding/bancomat/screens/searchBancomat/SearchAvailableUserBancomatScreen.tsx @@ -10,6 +10,7 @@ import { import { onboardingBancomatAbiSelectedSelector } from "../../store/reducers/abiSelected"; import { onboardingBancomatFoundPansSelector } from "../../store/reducers/pans"; import AddBancomatScreen from "../add-pans/AddBancomatScreen"; +import { isTimeoutError } from "../../../../../../utils/errors"; import BancomatKoNotFound from "./BancomatKoNotFound"; import BancomatKoSingleBankNotFound from "./BancomatKoSingleBankNotFound"; import BancomatKoTimeout from "./BancomatKoTimeout"; @@ -56,7 +57,7 @@ const SearchAvailableUserBancomatScreen: React.FunctionComponent = props // and he should try to search for a single bank return ; } - if (isError(pans) && pans.error.kind === "timeout") { + if (isError(pans) && isTimeoutError(pans.error)) { return ; } if (isLoading(pans) || isError(pans)) { diff --git a/ts/features/wallet/onboarding/satispay/screens/search/LoadSatispaySearch.tsx b/ts/features/wallet/onboarding/satispay/screens/search/LoadSatispaySearch.tsx index 35eb2267191..aca889a77f3 100644 --- a/ts/features/wallet/onboarding/satispay/screens/search/LoadSatispaySearch.tsx +++ b/ts/features/wallet/onboarding/satispay/screens/search/LoadSatispaySearch.tsx @@ -30,7 +30,7 @@ const LoadSatispaySearch = (props: Props) => { {...props} loadingCaption={I18n.t("wallet.onboarding.satispay.loadingSearch.title")} onAbort={props.cancel} - onRetry={() => props.retry()} + onRetry={props.retry} /> ); }; diff --git a/ts/features/wallet/onboarding/satispay/screens/search/SearchSatispayManagerScreen.tsx b/ts/features/wallet/onboarding/satispay/screens/search/SearchSatispayManagerScreen.tsx index 7f657059b92..e1757403f2a 100644 --- a/ts/features/wallet/onboarding/satispay/screens/search/SearchSatispayManagerScreen.tsx +++ b/ts/features/wallet/onboarding/satispay/screens/search/SearchSatispayManagerScreen.tsx @@ -3,7 +3,7 @@ import { connect } from "react-redux"; import { Dispatch } from "redux"; import { GlobalState } from "../../../../../../store/reducers/types"; import { RawSatispayPaymentMethod } from "../../../../../../types/pagopa"; -import { isTimoutError } from "../../../../../../utils/errors"; +import { isTimeoutError } from "../../../../../../utils/errors"; import { isError, isLoading, @@ -24,7 +24,7 @@ type Props = ReturnType & */ const SearchSatispayManagerScreen: React.FunctionComponent = props => { const satispay = props.foundSatispay; - if (isError(satispay) && isTimoutError(satispay.error)) { + if (isError(satispay) && isTimeoutError(satispay.error)) { return ; } if (isError(satispay) || isLoading(satispay)) { diff --git a/ts/utils/errors.ts b/ts/utils/errors.ts index b706c577e76..f4842b3c0bc 100644 --- a/ts/utils/errors.ts +++ b/ts/utils/errors.ts @@ -21,5 +21,5 @@ export const getNetworkError = (error: unknown): NetworkError => { return { kind: "generic", value: getError(error) }; }; -export const isTimoutError = (error: NetworkError): error is TimeoutError => +export const isTimeoutError = (error: NetworkError): error is TimeoutError => error.kind === "timeout";