diff --git a/ts/features/bonus/bpd/navigation/action/bpdTestNav.ts b/ts/features/bonus/bpd/navigation/action/bpdTestNav.ts new file mode 100644 index 00000000000..5b3cdaec5cd --- /dev/null +++ b/ts/features/bonus/bpd/navigation/action/bpdTestNav.ts @@ -0,0 +1,8 @@ +// TODO: remove after the introduction of the bpd detail screen +import { NavigationActions } from "react-navigation"; +import BPD_ROUTES from "../routes"; + +export const navigateToBpdTestScreen = () => + NavigationActions.navigate({ + routeName: BPD_ROUTES.TEST + }); diff --git a/ts/features/bonus/bpd/navigation/navigator.ts b/ts/features/bonus/bpd/navigation/navigator.ts index 602cd36e4eb..8435bb81837 100644 --- a/ts/features/bonus/bpd/navigation/navigator.ts +++ b/ts/features/bonus/bpd/navigation/navigator.ts @@ -6,6 +6,7 @@ import EnrollPaymentMethodsScreen from "../screens/onboarding/EnrollPaymentMetho import LoadActivateBpdScreen from "../screens/onboarding/LoadActivateBpdScreen"; import LoadBpdActivationStatus from "../screens/onboarding/LoadBpdActivationStatus"; import NoPaymentMethodsAvailableScreen from "../screens/onboarding/NoPaymentMethodsAvailableScreen"; +import TMPBpdScreen from "../screens/test/TMPBpdScreen"; import BPD_ROUTES from "./routes"; const BpdNavigator = createStackNavigator( @@ -30,6 +31,10 @@ const BpdNavigator = createStackNavigator( }, [BPD_ROUTES.IBAN]: { screen: MainIbanScreen + }, + // TODO: remove after the introduction of the bpd detail screen + [BPD_ROUTES.TEST]: { + screen: TMPBpdScreen } }, { diff --git a/ts/features/bonus/bpd/navigation/routes.ts b/ts/features/bonus/bpd/navigation/routes.ts index f616a946759..f2992d3634a 100644 --- a/ts/features/bonus/bpd/navigation/routes.ts +++ b/ts/features/bonus/bpd/navigation/routes.ts @@ -9,7 +9,9 @@ const BPD_ROUTES = { ENROLL_PAYMENT_METHODS: "BPD_ENROLL_PAYMENT_METHODS", NO_PAYMENT_METHODS: "BPD_NO_PAYMENT_METHODS" }, - IBAN: "BPD_IBAN" + IBAN: "BPD_IBAN", + // TODO: remove after the introduction of the bpd detail screen + TEST: "BPD_TEST" }; export default BPD_ROUTES; diff --git a/ts/features/bonus/bpd/screens/test/TMPBpdScreen.tsx b/ts/features/bonus/bpd/screens/test/TMPBpdScreen.tsx new file mode 100644 index 00000000000..72a8521b20a --- /dev/null +++ b/ts/features/bonus/bpd/screens/test/TMPBpdScreen.tsx @@ -0,0 +1,134 @@ +import * as pot from "italia-ts-commons/lib/pot"; +import { View } from "native-base"; +import { useEffect } from "react"; +import * as React from "react"; +import { SafeAreaView, ScrollView } from "react-native"; +import { connect } from "react-redux"; +import { Dispatch } from "redux"; +import { Body } from "../../../../../components/core/typography/Body"; +import { H1 } from "../../../../../components/core/typography/H1"; +import { Label } from "../../../../../components/core/typography/Label"; +import { LabelSmall } from "../../../../../components/core/typography/LabelSmall"; +import { IOStyles } from "../../../../../components/core/variables/IOStyles"; +import BaseScreenComponent from "../../../../../components/screens/BaseScreenComponent"; +import FooterWithButtons from "../../../../../components/ui/FooterWithButtons"; +import { GlobalState } from "../../../../../store/reducers/types"; +import { walletsSelector } from "../../../../../store/reducers/wallet/wallets"; +import { Wallet } from "../../../../../types/pagopa"; +import { cancelButtonProps } from "../../../bonusVacanze/components/buttons/ButtonConfigurations"; +import { PaymentMethodBpdList } from "../../components/PaymentMethodBpdList"; +import { + fold, + isReady, + isUndefined, + RemoteValue +} from "../../model/RemoteValue"; +import { bpdLoadActivationStatus } from "../../store/actions/details"; +import { bpdDeleteUserFromProgram } from "../../store/actions/onboarding"; +import { bpdEnabledSelector } from "../../store/reducers/details/activation"; + +export type Props = ReturnType & + ReturnType; + +const renderBpdActive = (value: RemoteValue) => + fold( + () => Sconosciuta, + () => In caricamento, + active => ( + + {active ? "Attiva" : "Non attiva"} + + ), + _ => Errore durante il caricamento + )(value); + +const renderPaymentMethod = ( + potWallets: pot.Pot, Error> +) => + pot.fold( + potWallets, + // TODO: handle error, loading with spinner if needed + () => ( + + Metodi di pagamento sconosciuti + + ), + () => ( + + Metodi di pagamento in caricamento + + ), + _ => null, + _ => ( + + Errore nel recuperare i metodi di pagamento + + ), + value => , + value => , + value => , + value => + ); + +/** + * A temp screen created to allow the test of some bpd functionalities waiting for the detail screen. + * TODO: remove after bpd detail screen + * @constructor + */ +const TmpBpdScreen: React.FunctionComponent = props => { + const bpdActive = renderBpdActive(props.bpdActive); + + useEffect(() => { + if (isUndefined(props.bpdActive)) { + props.loadBpdActivation(); + } + }, []); + + return ( + + + + + +

Test bpd screen

+ + La tua iscrizione al cashback รจ: {bpdActive} + + {isReady(props.bpdActive) && props.bpdActive.value ? ( + <> + + {renderPaymentMethod(props.potWallets)} + + ) : ( + + Iscriviti al cashback per visualizzare la lista dei metodi di + pagamento + + )} +
+
+ {isReady(props.bpdActive) && props.bpdActive.value && ( + + )} +
+
+ ); +}; + +const mapDispatchToProps = (dispatch: Dispatch) => ({ + loadBpdActivation: () => dispatch(bpdLoadActivationStatus.request()), + cancelBpd: () => dispatch(bpdDeleteUserFromProgram.request()) +}); + +const mapStateToProps = (state: GlobalState) => ({ + bpdActive: bpdEnabledSelector(state), + potWallets: walletsSelector(state) +}); + +export default connect(mapStateToProps, mapDispatchToProps)(TmpBpdScreen); diff --git a/ts/features/bonus/bpd/store/actions/paymentMethods.ts b/ts/features/bonus/bpd/store/actions/paymentMethods.ts index 98b9997ea51..0277c2befd6 100644 --- a/ts/features/bonus/bpd/store/actions/paymentMethods.ts +++ b/ts/features/bonus/bpd/store/actions/paymentMethods.ts @@ -18,8 +18,8 @@ export type BpdPmActivationStatus = "active" | "inactive" | "notActivable"; export type BpdPaymentMethodActivation = { hPan: HPan; activationStatus: BpdPmActivationStatus; - activationDate?: Date; - deactivationDate?: Date; + activationDate?: string; + deactivationDate?: string; }; /** diff --git a/ts/screens/profile/ProfileMainScreen.tsx b/ts/screens/profile/ProfileMainScreen.tsx index 2f1db30744a..6e8562fe2d4 100644 --- a/ts/screens/profile/ProfileMainScreen.tsx +++ b/ts/screens/profile/ProfileMainScreen.tsx @@ -24,7 +24,7 @@ import { AlertModal } from "../../components/ui/AlertModal"; import { LightModalContextInterface } from "../../components/ui/LightModal"; import Markdown from "../../components/ui/Markdown"; import Switch from "../../components/ui/Switch"; -import { bpdEnabled, isPlaygroundsEnabled } from "../../config"; +import { isPlaygroundsEnabled } from "../../config"; import I18n from "../../i18n"; import ROUTES from "../../navigation/routes"; import { @@ -52,7 +52,6 @@ import { getAppVersion } from "../../utils/appVersion"; import { clipboardSetStringWithFeedback } from "../../utils/clipboard"; import { isDevEnv } from "../../utils/environment"; import { setStatusBarColorAndBackground } from "../../utils/statusBar"; -import { bpdDeleteUserFromProgram } from "../../features/bonus/bpd/store/actions/onboarding"; type OwnProps = Readonly<{ navigation: NavigationScreenProp; @@ -484,13 +483,6 @@ class ProfileMainScreen extends React.PureComponent { this.props.dispatchSessionExpired, true )} - - {bpdEnabled && - this.debugListItem( - "Leave BPD", - this.props.dispatchLeaveBpd, - true - )} )} @@ -556,7 +548,6 @@ const mapDispatchToProps = (dispatch: Dispatch) => ({ preferencesPagoPaTestEnvironmentSetEnabled({ isPagoPATestEnabled }) ), dispatchSessionExpired: () => dispatch(sessionExpired()), - dispatchLeaveBpd: () => dispatch(bpdDeleteUserFromProgram.request()), dispatchPreferencesExperimentalFeaturesSetEnabled: (enabled: boolean) => dispatch(preferencesExperimentalFeaturesSetEnabled(enabled)) }); diff --git a/ts/screens/wallet/WalletHomeScreen.tsx b/ts/screens/wallet/WalletHomeScreen.tsx index f6e54bd87ea..832a0f2b49a 100644 --- a/ts/screens/wallet/WalletHomeScreen.tsx +++ b/ts/screens/wallet/WalletHomeScreen.tsx @@ -1,6 +1,6 @@ import { fromNullable, fromPredicate, none } from "fp-ts/lib/Option"; import * as pot from "italia-ts-commons/lib/pot"; -import { Content, Text, View } from "native-base"; +import { Button, Content, Text, View } from "native-base"; import * as React from "react"; import { BackHandler, Image, RefreshControl, StyleSheet } from "react-native"; import { @@ -12,6 +12,7 @@ import { connect } from "react-redux"; import { BonusActivationWithQrCode } from "../../../definitions/bonus_vacanze/BonusActivationWithQrCode"; import { TypeEnum } from "../../../definitions/pagopa/Wallet"; import ButtonDefaultOpacity from "../../components/ButtonDefaultOpacity"; +import { Label } from "../../components/core/typography/Label"; import { withLightModalContext } from "../../components/helpers/withLightModalContext"; import { withValidatedEmail } from "../../components/helpers/withValidatedEmail"; import { withValidatedPagoPaVersion } from "../../components/helpers/withValidatedPagoPaVersion"; @@ -23,7 +24,7 @@ import { RotatedCards } from "../../components/wallet/card/RotatedCards"; import SectionCardComponent from "../../components/wallet/card/SectionCardComponent"; import TransactionsList from "../../components/wallet/TransactionsList"; import WalletLayout from "../../components/wallet/WalletLayout"; -import { bonusVacanzeEnabled } from "../../config"; +import { bonusVacanzeEnabled, bpdEnabled } from "../../config"; import RequestBonus from "../../features/bonus/bonusVacanze/components/RequestBonus"; import { navigateToAvailableBonusScreen, @@ -35,6 +36,7 @@ import { } from "../../features/bonus/bonusVacanze/store/actions/bonusVacanze"; import { allBonusActiveSelector } from "../../features/bonus/bonusVacanze/store/reducers/allActive"; import { availableBonusTypesSelector } from "../../features/bonus/bonusVacanze/store/reducers/availableBonusesTypes"; +import { navigateToBpdTestScreen } from "../../features/bonus/bpd/navigation/action/bpdTestNav"; import I18n from "../../i18n"; import { navigateBack, @@ -510,6 +512,15 @@ class WalletHomeScreen extends React.PureComponent { gradientHeader={true} headerPaddingMin={true} > + {/* TODO: temp only, for test purpose,to be removed with bpd details */} + {bpdEnabled && ( + + )} {this.newMethodAdded ? this.newMethodAddedContent : transactionContent} {bonusVacanzeEnabled && ( @@ -582,7 +593,9 @@ const mapDispatchToProps = (dispatch: Dispatch) => ({ dispatch(fetchTransactionsRequest({ start })), loadWallets: () => dispatch(fetchWalletsRequest()), dispatchAllTransactionLoaded: (transactions: ReadonlyArray) => - dispatch(fetchTransactionsLoadComplete(transactions)) + dispatch(fetchTransactionsLoadComplete(transactions)), + // TODO: Temp only, remove after bpd details + navigateToBpdTest: () => dispatch(navigateToBpdTestScreen()) }); export default withValidatedPagoPaVersion(