[#172992641] Check bonus eligibility

locales/en/index.yml

@@ -1235,3 +1235,7 @@ faq:
   57:
     title: "Did you have problems during a payment?"
     content: !include faq/faq57.md
+bonus:
+  bonusVacanza:
+    checkBonusEligibility:
+      loading: Checking bonus eligibility

locales/it/index.yml

@@ -1268,3 +1268,7 @@ faq:
   57:
     title: "Hai avuto problemi durante un pagamento?"
     content: !include faq/faq57.md
+bonus:
+  bonusVacanza:
+    checkBonusEligibility:
+      loading: Verifico l'idoneità per l'accesso al bonus 

ts/features/bonusVacanze/components/GenericLoadingErrorScreen.tsx

@@ -0,0 +1,54 @@
+import { View } from "native-base";
+import * as React from "react";
+import { StyleSheet } from "react-native";
+import { withLoadingSpinner } from "../../../components/helpers/withLoadingSpinner";
+import GenericErrorComponent from "../../../components/screens/GenericErrorComponent";
+import customVariables from "../../../theme/variables";
+
+type Props = {
+  isLoading: boolean;
+  loadingCaption?: string;
+  loadingOpacity?: number;
+  errorText?: string;
+  onRetry: () => void;
+  onCancel?: () => void;
+};
+
+const styles = StyleSheet.create({
+  main: {
+    backgroundColor: customVariables.colorWhite,
+    flex: 1,
+    position: "absolute",
+    top: 0,
+    bottom: 0,
+    left: 0,
+    right: 0
+  }
+});
+/**
+ * This component is a generic error component composed with a loading.
+ * In this way it is testable regardless of how it will be connected to the application flow.
+ * This component, when {@link Props.isLoading} display a loading overlay, hiding the background, using
+ * {@link withLoadingSpinner}.
+ * When {@link Props.isLoading} is false, display a {@link GenericErrorComponent} displaying the reasons of the error
+ * and two buttons to cancel the operation or retry.
+ * @param props
+ * @constructor
+ */
+const InnerGenericLoadingErrorScreen: React.FunctionComponent<
+  Props
+> = props => {
+  return (
+    <View style={styles.main}>
+      <GenericErrorComponent
+        onRetry={props.onRetry}
+        onCancel={props.onCancel}
+        text={props.errorText}
+      />
+    </View>
+  );
+};
+
+export const GenericLoadingErrorScreen = withLoadingSpinner(
+  InnerGenericLoadingErrorScreen
+);

ts/features/bonusVacanze/screens/CheckBonusEligibilityScreen.tsx

@@ -0,0 +1,52 @@
+import * as React from "react";
+import { connect } from "react-redux";
+import { Dispatch } from "redux";
+import { RTron } from "../../../boot/configureStoreAndPersistor";
+import I18n from "../../../i18n";
+import { GlobalState } from "../../../store/reducers/types";
+import { GenericLoadingErrorScreen } from "../components/GenericLoadingErrorScreen";
+
+type Props = ReturnType<typeof mapDispatchToProps> &
+  ReturnType<typeof mapStateToProps>;
+
+const loadingCaption = I18n.t(
+  "bonus.bonusVacanza.checkBonusEligibility.loading"
+);
+/**
+ * This component link the generic {@link GenericLoadingErrorScreen} with the application flow using the {@link connect}
+ * of redux.
+ * @param props
+ * @constructor
+ */
+const CheckBonusEligibilityScreen: React.FunctionComponent<Props> = props => {
+  return (
+    <GenericLoadingErrorScreen
+      {...props}
+      loadingCaption={loadingCaption}
+      loadingOpacity={1}
+    />
+  );
+};
+
+const mapDispatchToProps = (_: Dispatch) => ({
+  // TODO: link with the right dispatch action
+  onCancel: () => {
+    RTron.log("CANCEL");
+  },
+  // TODO: link with the right dispatch action
+  onRetry: () => {
+    RTron.log("RETRY");
+  }
+});
+
+const mapStateToProps = (_: GlobalState) => ({
+  // TODO: link with the right reducer
+  isLoading: true,
+  // TODO: link with the right reducer
+  errorText: "A text that explains why the operation failed"
+});
+
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(CheckBonusEligibilityScreen);