@os1-platform/dispatch-mobile 3.0.3 → 3.1.0

package/lib/commonjs/components/executiontasks/validateOTP/ValidateOTPET.js

@@ -4,359 +4,539 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _reactNative = require("react-native");
 var _react = _interopRequireWildcard(require("react"));
+var _reactNative = require("react-native");
 var _reactNativePaper = require("react-native-paper");
-var _reactNativeSvg = require("react-native-svg");
-var _OTPInput = _interopRequireDefault(require("./sub-components/OTPInput"));
-var _useTimer = _interopRequireDefault(require("../../../utils/hooks/useTimer"));
-var _CommonStyles = require("../../../styles/executionTasks/CommonStyles");
-var _utils = require("./utils");
-var _constants = require("./constants");
-var _ETConfig = require("../../../models/execTasks/ETConfig");
 var _ExecTaskUtils = require("../../../utils/ExecTaskUtils");
+var _utils = require("../../../components/utils");
+var _utils2 = require("./utils");
 var _EventCodeContainer = require("../../../manager/dispatchCodes/EventCodeContainer");
+var _ETConfig = require("../../../models/execTasks/ETConfig");
+var _valdiateOTPContext = require("../../../utils/context/valdiateOTPContext");
+var _ValidateOTPSchema = require("./ValidateOTPSchema");
+var _constants = require("../../../constants/constants");
+var _constants2 = require("./constants");
 var _SnackBarCustom = _interopRequireWildcard(require("../../../components/widgets/SnackBarCustom"));
-var _MaterialIcons = _interopRequireDefault(require("react-native-vector-icons/MaterialIcons"));
-var _constants2 = require("../../../constants/constants");
-var _utils2 = require("../../../components/utils");
 var _GoBackModal = _interopRequireDefault(require("../../../components/widgets/GoBackModal"));
-var _native = require("@react-navigation/native");
+var _ConfirmCancelModal = _interopRequireDefault(require("../../../components/widgets/ConfirmCancelModal"));
+var _OTPView = require("./components/OTPView");
+var _ContactListView = require("./components/ContactListView");
+var _VerificationComplete = _interopRequireDefault(require("./components/VerificationComplete"));
+var _ProgressDialog = _interopRequireDefault(require("../../widgets/ProgressDialog"));
+var _ValidateOtpStyles = _interopRequireDefault(require("./ValidateOtpStyles"));
+var _CommonStyles = require("../../../styles/executionTasks/CommonStyles");
 var _SentrySdkConstants = require("../../../analytics/sentry/SentrySdkConstants");
 var _SentryAnalyticsUtils = require("../../../analytics/sentry/SentryAnalyticsUtils");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } /* eslint-disable @typescript-eslint/no-unused-vars */ /* eslint-disable react-native/no-inline-styles */ // External Libraries
+// UI Libraries and Icons
+// Utility Functions and Hooks
+// Dispatch Codes and Models
+// Schema and Types
+// Constants
+// Components
+// Styles
+// Analytics
 const ValidateOTPET = props => {
-  var _props$generationLogi, _props$generationLogi2;
-  const [showBackModal, setShowBackModal] = (0, _react.useState)(false);
+  var _validateConfigContex;
+  const {
+    contacts,
+    navigation
+  } = props;
+  // Context
+  const validateConfigContext = (0, _react.useContext)(_valdiateOTPContext.ValidateOTPContext);
+  const domain = (validateConfigContext === null || validateConfigContext === void 0 || (_validateConfigContex = validateConfigContext.sdkConfig) === null || _validateConfigContex === void 0 ? void 0 : _validateConfigContex.validateOtpDomain) ?? '';
 
-  // Handle back-button click
-  (0, _native.useFocusEffect)(_react.default.useCallback(() => {
-    const onBackPress = () => {
-      var _props$taskMeta;
-      if ((_props$taskMeta = props.taskMeta) !== null && _props$taskMeta !== void 0 && _props$taskMeta.enableGoBack && (0, _utils2.hasGoBackConnector)(props.applicableReasons)) {
-        setShowBackModal(true);
-        return true;
-      } else {
-        props.navigation.goBack();
-        return true;
-      }
-    };
-    _reactNative.BackHandler.addEventListener('hardwareBackPress', onBackPress);
-    return () => _reactNative.BackHandler.removeEventListener('hardwareBackPress', onBackPress);
-  }, []));
-  (0, _react.useLayoutEffect)(() => {
-    props.navigation.setOptions({
-      title: props.title,
-      headerLeft: () => {
-        return /*#__PURE__*/_react.default.createElement(_MaterialIcons.default, {
-          onPress: () => {
-            var _props$taskMeta2;
-            if ((_props$taskMeta2 = props.taskMeta) !== null && _props$taskMeta2 !== void 0 && _props$taskMeta2.enableGoBack && (0, _utils2.hasGoBackConnector)(props.applicableReasons)) setShowBackModal(true);else props.navigation.goBack();
-            const cta = 'Arrow Back';
-            (0, _SentryAnalyticsUtils.fireEventWithScreenName)({
-              severityLevel: _SentrySdkConstants.SeverityLevelValue.LOG,
-              eventName: _SentrySdkConstants.SentryEventNameSdkConstants.BUTTON_CLICKED,
-              screenName: _SentrySdkConstants.ScreenNameSdkConstants.VALIDATE_OTP_ET_SCREEN,
-              cta: cta
-            });
-          },
-          name: "arrow-back",
-          color: 'black',
-          size: 25,
-          style: {
-            paddingRight: 15,
-            paddingTop: 5
-          }
-        });
-      }
-    });
-  }, [props.navigation, props.title]);
-  const retryConfig = (0, _utils.parseRetryConfig)((_props$generationLogi = props.generationLogic) === null || _props$generationLogi === void 0 ? void 0 : _props$generationLogi.retryConfig);
-  const initialMinute = Math.floor(retryConfig.delay / 60);
-  const initialSeconds = parseInt((retryConfig.delay % 60).toFixed(0));
-  const [timer, resetTimer] = (0, _useTimer.default)({
-    initialMinute,
-    initialSeconds
-  });
-  const [sendOTP, setSendOTP] = (0, _react.useState)(Boolean((_props$generationLogi2 = props.generationLogic) === null || _props$generationLogi2 === void 0 ? void 0 : _props$generationLogi2.generateOnLoad));
-  const [retryCount, setRetryCount] = (0, _react.useState)(0);
+  // Configurations
+  const resendConfig = (0, _utils2.parseResendConfig)(props.resendOTP);
+  const otpInputConfig = {
+    inputType: props.inputType || _ValidateOTPSchema.InputType.NUMBER,
+    length: props.otpLength || 6,
+    validationRegex: `^[0-9]+$`
+  };
+
+  // State: Contact Management
+  const [contactList, setContactList] = (0, _react.useState)(contacts);
+  const [selectedContact, setSelectedContact] = (0, _react.useState)(contactList[0] || null);
+  const [isContactVisited, setIsContactVisited] = (0, _react.useState)(props.doorstepOTP);
+
+  // State: OTP Handling
   const [userInput, setUserInput] = (0, _react.useState)({
     captureInput: ''
   });
   const {
     captureInput: otpCode
   } = userInput;
-  const setOTPCode = otpCode => {
+  const setOTPCode = code => {
     setUserInput({
       ...userInput,
-      captureInput: otpCode
+      captureInput: code
     });
   };
+  const [retryCount, setRetryCount] = (0, _react.useState)(0);
+  const [resendCount, setResendCount] = (0, _react.useState)(0);
+  const [disableProceedBtn, setDisableProceedBtn] = (0, _react.useState)(false);
+
+  // State: UI and Navigation
+  const [showBackModal, setShowBackModal] = (0, _react.useState)(false);
+  const [showCancelModal, setShowCancelModal] = (0, _react.useState)(false);
+  const [loading, setLoading] = (0, _react.useState)(false);
   const [hasError, setHasError] = (0, _react.useState)(false);
   const [errorMessage, setErrorMessage] = (0, _react.useState)('');
+  const [success, setSuccess] = (0, _react.useState)(false);
+  const [shouldNavigateBack, setShouldNavigateBack] = (0, _react.useState)(false);
+  const [currentScreen, setCurrentScreen] = (0, _react.useState)(props.doorstepOTP ? _utils2.VALIDATE_OTP_SCREENS.CONTACT_LIST : _utils2.VALIDATE_OTP_SCREENS.OTP_VIEW);
+
+  // State: SnackBar
   const [snackBar, setSnackBar] = (0, _react.useState)({
     show: false,
-    type: _SnackBarCustom.SnackBarType.SUCCESS,
+    type: _SnackBarCustom.SnackBarType.OTP_SUCCESS,
     message: ''
   });
-  const renderButtons = () => {
-    return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
-      style: styles.bottomView
-    }, /*#__PURE__*/_react.default.createElement(_reactNative.View, null, /*#__PURE__*/_react.default.createElement(_reactNativePaper.Button, {
-      style: [_CommonStyles.CommonStyles.nextButton, {
-        width: 165,
-        marginStart: 10
-      }],
-      labelStyle: _CommonStyles.CommonStyles.nextButtonLabel,
-      mode: 'contained',
-      uppercase: false,
-      onPress: async () => {
-        var _props$generationLogi3;
-        // send OTP Generation using props
-        if (sendOTP && props.generationLogic && (_props$generationLogi3 = props.generationLogic) !== null && _props$generationLogi3 !== void 0 && _props$generationLogi3.generateOnLoad) {
-          const response = await (0, _utils.generateOTP)(props.generationLogic.api);
-          resetTimer();
-          if (response) setSendOTP(false);else setSnackBar({
+  (0, _react.useEffect)(() => {
+    const fetchCounts = async () => {
+      // eslint-disable-next-line no-shadow
+      const retryCount = await (0, _utils2.getCount)(_utils2.countType.RETRY);
+      // eslint-disable-next-line no-shadow
+      const resendCount = await (0, _utils2.getCount)(_utils2.countType.RESEND);
+      setRetryCount(retryCount);
+      setResendCount(resendCount);
+    };
+    fetchCounts();
+  }, []);
+
+  // TO hide header for modal screen
+  (0, _react.useLayoutEffect)(() => {
+    navigation.setOptions({
+      // headerShown: loading ? false : true,
+      headerStyle: {
+        display: loading ? 'none' : 'flex' // Hide the header by setting its display to 'none'
+      }
+    });
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [loading]);
+  (0, _react.useEffect)(() => {
+    if (currentScreen === _utils2.VALIDATE_OTP_SCREENS.OTP_VIEW) {
+      setDisableProceedBtn((otpCode === null || otpCode === void 0 ? void 0 : otpCode.length) !== otpInputConfig.length || !selectedContact || hasError);
+    } else {
+      setDisableProceedBtn(!selectedContact);
+    }
+  }, [currentScreen, hasError, otpCode === null || otpCode === void 0 ? void 0 : otpCode.length, otpInputConfig.length, selectedContact]);
+  (0, _react.useEffect)(() => {
+    if (!contacts) return;
+
+    // Filter contacts based on the delivery method, or use all contacts if BOTH
+    const filteredContacts = contacts.filter(contact => {
+      var _contact$mode, _props$otpDeliveryMet;
+      return props.otpDeliveryMethod === _ValidateOTPSchema.OtpDeliveryMethodTypes.BOTH ? true : ((_contact$mode = contact.mode) === null || _contact$mode === void 0 ? void 0 : _contact$mode.toLowerCase()) === ((_props$otpDeliveryMet = props.otpDeliveryMethod) === null || _props$otpDeliveryMet === void 0 ? void 0 : _props$otpDeliveryMet.toLowerCase());
+    }).map((contact, index) => ({
+      ...contact,
+      isSelected: index === 0 // Select the first contact by default
+    }));
+
+    // Update the state with the filtered contacts
+    setContactList(filteredContacts);
+    if (props.doorstepOTP) {
+      setSelectedContact(filteredContacts[0]);
+    }
+  }, [contacts, props.doorstepOTP, props.otpDeliveryMethod]);
+
+  // Monitor shouldNavigateBack to trigger navigation if set
+  (0, _react.useEffect)(() => {
+    if (shouldNavigateBack) {
+      navigation.goBack();
+      setOTPCode('');
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [navigation, shouldNavigateBack]);
+  const handleBackNavigation = () => {
+    var _props$taskMeta;
+    if ((_props$taskMeta = props.taskMeta) !== null && _props$taskMeta !== void 0 && _props$taskMeta.enableGoBack && (0, _utils.hasGoBackConnector)(props.applicableReasons)) {
+      setShowBackModal(true);
+    } else {
+      setShouldNavigateBack(true);
+    }
+    return true;
+  };
+  const onProceedCancel = async () => {
+    var _props$applicableReas;
+    // Cancel the ET
+    props.onSubmitET({
+      ...(await (0, _ExecTaskUtils.getBaseETResponse)(_ETConfig.EntityCode.VALIDATE_OTP_ET, false, (0, _EventCodeContainer.getEventCodeByET)(_ETConfig.ExecutionTaskID.VALIDATE_OTP_ET, false, (_props$applicableReas = props.applicableReasons) === null || _props$applicableReas === void 0 ? void 0 : _props$applicableReas.failure), '', props.mergedObjectiveId, _ETConfig.ExecutionTaskID.VALIDATE_OTP_ET)),
+      retryCount: retryCount
+    });
+    const cta = 'Cancel';
+    (0, _SentryAnalyticsUtils.fireEventWithScreenName)({
+      severityLevel: _SentrySdkConstants.SeverityLevelValue.LOG,
+      eventName: _SentrySdkConstants.SentryEventNameSdkConstants.BUTTON_CLICKED,
+      screenName: _SentrySdkConstants.ScreenNameSdkConstants.VALIDATE_OTP_ET_SCREEN,
+      cta: cta
+    });
+  };
+  const handleContactListProceed = async () => {
+    try {
+      var _props$orderData$, _props$orderData, _response$data3, _response$additionalI;
+      setSnackBar({
+        show: false,
+        message: '',
+        type: _SnackBarCustom.SnackBarType.OTP_SUCCESS
+      });
+      setLoading(true);
+      const payload = {
+        jobId: (_props$orderData$ = props.orderData[0]) === null || _props$orderData$ === void 0 ? void 0 : _props$orderData$.jobId,
+        refId: props.refId,
+        objectiveId: props.workflowId,
+        contactInfo: {
+          id: selectedContact.id,
+          mode: selectedContact.mode,
+          type: selectedContact.type,
+          index: selectedContact.index
+        },
+        meta: {
+          orderIds: (_props$orderData = props.orderData) === null || _props$orderData === void 0 ? void 0 : _props$orderData.map(order => {
+            var _order$displayInfo;
+            return order === null || order === void 0 || (_order$displayInfo = order.displayInfo) === null || _order$displayInfo === void 0 ? void 0 : _order$displayInfo.orderId;
+          })
+        }
+      };
+      const response = await (0, _utils2.generateOTP)(payload, {
+        ...props,
+        domain
+      });
+      if (!(response !== null && response !== void 0 && response.status)) {
+        if (!response.status && (response === null || response === void 0 ? void 0 : response.code) === '101080001017') {
+          var _response$data;
+          setCurrentScreen(_utils2.VALIDATE_OTP_SCREENS.OTP_VIEW);
+          setLoading(false);
+          setSnackBar({
             show: true,
-            message: _constants.ERROR_GENERATING_OTP,
-            type: _SnackBarCustom.SnackBarType.FAILURE
+            message: (response === null || response === void 0 || (_response$data = response.data) === null || _response$data === void 0 || (_response$data = _response$data.result) === null || _response$data === void 0 ? void 0 : _response$data.message) || _constants2.UNABLE_TO_SEND_OTP,
+            type: _SnackBarCustom.SnackBarType.OTP_FAILED
+          });
+        } else {
+          var _response$data2;
+          setLoading(false);
+          setSnackBar({
+            show: true,
+            message: (response === null || response === void 0 || (_response$data2 = response.data) === null || _response$data2 === void 0 || (_response$data2 = _response$data2.result) === null || _response$data2 === void 0 ? void 0 : _response$data2.message) || _constants2.ERROR_GENERATING_OTP,
+            type: _SnackBarCustom.SnackBarType.OTP_FAILED
           });
         }
-        // check for Validation
-        else if (!sendOTP) {
-          if (otpCode.length < props.captureInput.length) {
-            setSnackBar({
-              show: true,
-              message: _constants.INVALID_OTP_LENGTH.replace('<length>', `${props.captureInput.length}`),
-              type: _SnackBarCustom.SnackBarType.FAILURE
-            });
-          } else {
-            const isValid = await (0, _utils.checkForValidation)(otpCode, props.validation, {
-              userInput
-            });
-            if (!isValid) {
-              setErrorMessage(_constants.INVALID_OTP);
-              setHasError(true);
-            } else {
-              var _props$applicableReas;
-              props.onSubmitET({
-                ...(await (0, _ExecTaskUtils.getBaseETResponse)(_ETConfig.EntityCode.VALIDATE_OTP_ET, true, (0, _EventCodeContainer.getEventCodeByET)(_ETConfig.ExecutionTaskID.VALIDATE_OTP_ET, true, (_props$applicableReas = props.applicableReasons) === null || _props$applicableReas === void 0 ? void 0 : _props$applicableReas.success), '', props.mergedObjectiveId, _ETConfig.ExecutionTaskID.VALIDATE_OTP_ET))
-              });
-            }
-          }
-        }
-        const cta = 'Proceed';
-        (0, _SentryAnalyticsUtils.fireEventWithScreenName)({
-          severityLevel: _SentrySdkConstants.SeverityLevelValue.LOG,
-          eventName: _SentrySdkConstants.SentryEventNameSdkConstants.BUTTON_CLICKED,
-          screenName: _SentrySdkConstants.ScreenNameSdkConstants.VALIDATE_OTP_ET_SCREEN,
-          cta: cta
+        return;
+      }
+      const resendCountValue = Number((response === null || response === void 0 || (_response$data3 = response.data) === null || _response$data3 === void 0 || (_response$data3 = _response$data3.result) === null || _response$data3 === void 0 ? void 0 : _response$data3.resendCount) || (response === null || response === void 0 || (_response$additionalI = response.additionalInfo) === null || _response$additionalI === void 0 ? void 0 : _response$additionalI.resendOTP)) || 0;
+      setResendCount(resendCountValue);
+      await (0, _utils2.updateResendCount)(resendCountValue);
+      setCurrentScreen(_utils2.VALIDATE_OTP_SCREENS.OTP_VIEW);
+      setLoading(false);
+      setSnackBar({
+        show: true,
+        message: _constants2.OTP_SENT_SUCCESSFULLY,
+        type: _SnackBarCustom.SnackBarType.OTP_SUCCESS
+      });
+    } catch (error) {
+      setLoading(false);
+      console.error('Error in handleContactListProceed:', error);
+      setSnackBar({
+        show: true,
+        message: _constants2.ERROR_GENERATING_OTP,
+        type: _SnackBarCustom.SnackBarType.OTP_FAILED
+      });
+    }
+  };
+  const handleOTPViewProceed = async () => {
+    var _props$otpValidation, _ValidationType$ONLIN, _response$result, _response$additionalI2;
+    if (otpCode.length < props.otpLength) {
+      // Show error if OTP length is invalid
+      setSnackBar({
+        show: true,
+        message: _constants2.INVALID_OTP_LENGTH.replace('<length>', `${props.otpLength}`),
+        type: _SnackBarCustom.SnackBarType.OTP_FAILED
+      });
+      return;
+    }
+    const payload = {
+      refId: props.refId,
+      otp: otpCode
+    };
+    const isOnlineValidation = props !== null && props !== void 0 && props.otpValidation ? (props === null || props === void 0 || (_props$otpValidation = props.otpValidation) === null || _props$otpValidation === void 0 || (_props$otpValidation = _props$otpValidation.toString()) === null || _props$otpValidation === void 0 ? void 0 : _props$otpValidation.toLowerCase()) === ((_ValidationType$ONLIN = _ValidateOTPSchema.ValidationType.ONLINE) === null || _ValidationType$ONLIN === void 0 || (_ValidationType$ONLIN = _ValidationType$ONLIN.toString()) === null || _ValidationType$ONLIN === void 0 ? void 0 : _ValidationType$ONLIN.toLowerCase()) : true;
+    const response = isOnlineValidation ? await (0, _utils2.verifyOTP)(payload, {
+      ...props,
+      domain
+    }) : otpCode === props.offlineOtpValue;
+    const retryCountValue = Number((response === null || response === void 0 || (_response$result = response.result) === null || _response$result === void 0 ? void 0 : _response$result.retryCount) || (response === null || response === void 0 || (_response$additionalI2 = response.additionalInfo) === null || _response$additionalI2 === void 0 ? void 0 : _response$additionalI2.retryCount)) || retryCount + 1;
+    if (response === false || (response === null || response === void 0 ? void 0 : response.status) === false || !response) {
+      setOTPCode('');
+      setRetryCount(retryCountValue);
+      await (0, _utils2.updateRetryCount)(retryCountValue);
+      if (props.maxRetries - retryCountValue === 1) {
+        setSnackBar({
+          show: true,
+          message: _constants2.INVALID_OTP_ONE_ATTEMPT_LEFT,
+          type: _SnackBarCustom.SnackBarType.OTP_FAILED
+        });
+      } else if (retryCountValue >= props.maxRetries) {
+        setSuccess(false);
+        setSnackBar({
+          show: false,
+          message: '',
+          type: _SnackBarCustom.SnackBarType.OTP_SUCCESS
+        });
+        setLoading(true);
+        setTimeout(() => {
+          setCurrentScreen(_utils2.VALIDATE_OTP_SCREENS.VERIFICATION_COMPLETE);
+          setLoading(false);
+        }, 1000);
+      } else {
+        setSnackBar({
+          show: true,
+          message: _constants2.INVALID_OTP.replace('<length>', `${props.maxRetries - retryCountValue}`),
+          type: _SnackBarCustom.SnackBarType.OTP_FAILED
         });
       }
-    }, "Proceed")), /*#__PURE__*/_react.default.createElement(_reactNative.View, null, /*#__PURE__*/_react.default.createElement(_reactNativePaper.Button, {
-      style: [_CommonStyles.CommonStyles.cancelButton, {
-        width: 165,
-        marginEnd: 10
-      }],
-      labelStyle: _CommonStyles.CommonStyles.cancelButtonLabel,
-      mode: 'outlined',
-      uppercase: false,
-      onPress: async () => {
-        var _props$applicableReas2;
-        // Cancel the ET
-        props.onSubmitET({
-          ...(await (0, _ExecTaskUtils.getBaseETResponse)(_ETConfig.EntityCode.VALIDATE_OTP_ET, false, (0, _EventCodeContainer.getEventCodeByET)(_ETConfig.ExecutionTaskID.VALIDATE_OTP_ET, false, (_props$applicableReas2 = props.applicableReasons) === null || _props$applicableReas2 === void 0 ? void 0 : _props$applicableReas2.failure), '', props.mergedObjectiveId, _ETConfig.ExecutionTaskID.VALIDATE_OTP_ET))
+    } else {
+      setSuccess(true);
+      setSnackBar({
+        show: false,
+        message: '',
+        type: _SnackBarCustom.SnackBarType.OTP_SUCCESS
+      });
+      setLoading(true);
+      setTimeout(() => {
+        setCurrentScreen(_utils2.VALIDATE_OTP_SCREENS.VERIFICATION_COMPLETE);
+        setLoading(false);
+      }, 1000);
+    }
+  };
+  const onProceed = async () => {
+    try {
+      if (currentScreen === _utils2.VALIDATE_OTP_SCREENS.CONTACT_LIST) {
+        handleContactListProceed();
+      } else {
+        handleOTPViewProceed();
+      }
+      const cta = 'Proceed';
+      (0, _SentryAnalyticsUtils.fireEventWithScreenName)({
+        severityLevel: _SentrySdkConstants.SeverityLevelValue.LOG,
+        eventName: _SentrySdkConstants.SentryEventNameSdkConstants.BUTTON_CLICKED,
+        screenName: _SentrySdkConstants.ScreenNameSdkConstants.VALIDATE_OTP_ET_SCREEN,
+        cta: cta
+      });
+    } catch (error) {
+      setLoading(false);
+      if (currentScreen === _utils2.VALIDATE_OTP_SCREENS.CONTACT_LIST) {
+        setSnackBar({
+          show: true,
+          message: _constants2.ERROR_GENERATING_OTP,
+          type: _SnackBarCustom.SnackBarType.OTP_FAILED
         });
-        const cta = 'Skip';
-        (0, _SentryAnalyticsUtils.fireEventWithScreenName)({
-          severityLevel: _SentrySdkConstants.SeverityLevelValue.LOG,
-          eventName: _SentrySdkConstants.SentryEventNameSdkConstants.BUTTON_CLICKED,
-          screenName: _SentrySdkConstants.ScreenNameSdkConstants.VALIDATE_OTP_ET_SCREEN,
-          cta: cta
+      }
+      if (currentScreen === _utils2.VALIDATE_OTP_SCREENS.OTP_VIEW) {
+        setSnackBar({
+          show: true,
+          message: _constants2.ERROR_VALIDATE_OTP,
+          type: _SnackBarCustom.SnackBarType.OTP_FAILED
         });
       }
-    }, "Skip")));
+    }
+    return;
   };
-  const renderRetryButton = () => {
-    var _props$generationLogi4;
-    const generationLogic = props.generationLogic;
-    const enableRetry = (_props$generationLogi4 = props.generationLogic) === null || _props$generationLogi4 === void 0 ? void 0 : _props$generationLogi4.enableRetry;
-    if (generationLogic && enableRetry) {
-      return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
-        style: styles.retryButton
-      }, /*#__PURE__*/_react.default.createElement(_reactNativePaper.Button, {
-        disabled: Boolean(timer) || retryCount === retryConfig.maxAttempt,
-        uppercase: false,
-        onPress: async () => {
-          setOTPCode('');
-          setRetryCount(retryCount => retryCount + 1);
-          await (0, _utils.generateOTP)(generationLogic.api);
-          resetTimer();
-          const cta = retryConfig.buttonTitle;
-          (0, _SentryAnalyticsUtils.fireEventWithScreenName)({
-            severityLevel: _SentrySdkConstants.SeverityLevelValue.LOG,
-            eventName: _SentrySdkConstants.SentryEventNameSdkConstants.BUTTON_CLICKED,
-            screenName: _SentrySdkConstants.ScreenNameSdkConstants.VALIDATE_OTP_ET_SCREEN,
-            cta: cta
-          });
-        }
-      }, `${retryConfig.buttonTitle} ${timer ? `in ${timer}` : ''}`));
-    } else return null;
+  const onCancelET = () => {
+    setShowCancelModal(true);
   };
-  const renderErrorMessage = () => {
-    return errorMessage ? /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
-      style: styles.errorMessage
-    }, errorMessage) : null;
+  const handleSelectContact = contactDetails => {
+    setSelectedContact(contactDetails);
+    setContactList(prevContactList => prevContactList.map(contact => ({
+      ...contact,
+      isSelected: (contact === null || contact === void 0 ? void 0 : contact.value) === contactDetails.value
+    })));
   };
-  const renderModal = () => {
+
+  // *Rendering components*
+  const renderGoBackModal = () => {
     return /*#__PURE__*/_react.default.createElement(_GoBackModal.default, {
       showModal: showBackModal,
       setShowModal: setShowBackModal,
       onSuccess: async () => {
         props.onSubmitET({
-          ...(await (0, _ExecTaskUtils.getBaseETResponse)(_ETConfig.EntityCode.VALIDATE_OTP_ET, false, _constants2.GO_BACK_EVENT_CODE, '', props.mergedObjectiveId, _ETConfig.ExecutionTaskID.VALIDATE_OTP_ET))
+          ...(await (0, _ExecTaskUtils.getBaseETResponse)(_ETConfig.EntityCode.VALIDATE_OTP_ET, false, _constants.GO_BACK_EVENT_CODE, '', props.mergedObjectiveId, _ETConfig.ExecutionTaskID.VALIDATE_OTP_ET)),
+          retryCount: retryCount
         });
         setShowBackModal(false);
       },
       onFailure: () => setShowBackModal(false)
     });
   };
-  if (sendOTP) {
-    return /*#__PURE__*/_react.default.createElement(_reactNativePaper.Provider, null, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
-      style: _CommonStyles.CommonStyles.mainContainer
-    }, renderModal(), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+  const renderCancelModal = () => {
+    return /*#__PURE__*/_react.default.createElement(_ConfirmCancelModal.default, {
+      showModal: showCancelModal,
+      setShowModal: setShowCancelModal,
+      onSuccess: () => {
+        onProceedCancel();
+        setShowCancelModal(false);
+      },
+      onFailure: () => setShowCancelModal(false)
+    });
+  };
+  const renderButtons = () => {
+    if (loading || currentScreen === _utils2.VALIDATE_OTP_SCREENS.VERIFICATION_COMPLETE) return null;
+    return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+      style: _ValidateOtpStyles.default.bottomView
+    }, /*#__PURE__*/_react.default.createElement(_reactNativePaper.Button, {
+      style: [_ValidateOtpStyles.default.mainBtnStyles, _CommonStyles.CommonStyles.nextButton, {
+        borderRadius: 6
+      }, disableProceedBtn && {
+        backgroundColor: '#E0E3EB'
+      }],
+      labelStyle: [_CommonStyles.CommonStyles.nextButtonLabel, _ValidateOtpStyles.default.activeBtnText, disableProceedBtn && disableProceedBtn && {
+        color: '#A3AAC2'
+      }],
+      mode: 'contained',
+      uppercase: false,
+      disabled: disableProceedBtn,
+      onPress: onProceed
+    }, "Proceed"), props.restrictCancel === true || props.allowCancel === false ? null : props.isSelfLoop == false && /*#__PURE__*/_react.default.createElement(_reactNativePaper.Button, {
+      style: [_ValidateOtpStyles.default.mainBtnStyles, _CommonStyles.CommonStyles.cancelButton, {
+        borderRadius: 4
+      }],
+      labelStyle: [_CommonStyles.CommonStyles.cancelButtonLabel, _ValidateOtpStyles.default.cancelBtnText],
+      mode: 'outlined',
+      uppercase: false,
+      onPress: onCancelET
+    }, "Cancel"));
+  };
+  const renderLoadingCard = () => {
+    return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
       style: {
         flex: 1,
-        justifyContent: 'center',
-        alignItems: 'center',
-        marginHorizontal: 18
+        justifyContent: 'center'
       }
     }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+      style: _ValidateOtpStyles.default.loadingCard
+    }, /*#__PURE__*/_react.default.createElement(_reactNativePaper.ActivityIndicator, {
+      size: "small",
+      color: "rgba(107, 142, 255, 1)"
+    }), /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
+      style: _ValidateOtpStyles.default.loadingText
+    }, "Loading")));
+  };
+  const renderSnackBar = () => {
+    if (!snackBar.show) return null; // Show snackbar only when `snackBar.show` is true
+    return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
       style: {
-        marginBottom: 16
-      }
-    }, _reactNative.Platform.OS === 'android' && /*#__PURE__*/_react.default.createElement(_reactNativeSvg.SvgXml, {
-      xml: _constants.mobileSVG
-    })), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
-      style: {
-        marginTop: 16
-      }
-    }, /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
-      style: styles.titleText
-    }, "Do you want to proceed to OTP verification? This will send a verification code to your consignee."))), renderButtons(), /*#__PURE__*/_react.default.createElement(_SnackBarCustom.default, {
-      type: snackBar.type,
-      message: `${snackBar.message}`,
-      visible: snackBar.show,
-      onDismiss: () => {
-        setSnackBar({
-          show: false,
-          message: '',
-          type: _SnackBarCustom.SnackBarType.SUCCESS
-        });
+        marginHorizontal: 6
       }
-    })));
-  }
-  if (!sendOTP) {
-    var _props$captureInput;
-    return /*#__PURE__*/_react.default.createElement(_reactNativePaper.Provider, null, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
-      style: _CommonStyles.CommonStyles.mainContainer
-    }, renderModal(), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
-      style: styles.otpContainer
-    }, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
-      style: styles.otpTitle
-    }, /*#__PURE__*/_react.default.createElement(_reactNative.Text, null, "Enter the ", (_props$captureInput = props.captureInput) === null || _props$captureInput === void 0 ? void 0 : _props$captureInput.length, " digit OTP sent to the consignee to confirm order completion")), /*#__PURE__*/_react.default.createElement(_OTPInput.default, {
-      input: props.captureInput,
-      otpCode: otpCode,
-      setOTPCode: setOTPCode,
-      hasError: hasError,
-      setHasError: setHasError,
-      setErrorMessage: setErrorMessage
-    }), renderErrorMessage(), renderRetryButton()), renderButtons(), /*#__PURE__*/_react.default.createElement(_SnackBarCustom.default, {
+    }, /*#__PURE__*/_react.default.createElement(_SnackBarCustom.default, {
+      duration: 2000,
       type: snackBar.type,
+      customBottom: 80,
       message: `${snackBar.message}`,
       visible: snackBar.show,
       onDismiss: () => {
         setSnackBar({
           show: false,
           message: '',
-          type: _SnackBarCustom.SnackBarType.SUCCESS
+          type: _SnackBarCustom.SnackBarType.OTP_SUCCESS
         });
       }
-    })));
-  }
-  return null;
+    }));
+  };
+  const renderContent = () => {
+    // if (loading) {
+    //   return renderLoadingCard;
+    // }
+
+    if (currentScreen === _utils2.VALIDATE_OTP_SCREENS.VERIFICATION_COMPLETE) {
+      return /*#__PURE__*/_react.default.createElement(_VerificationComplete.default, _extends({}, props, {
+        setLoading: setLoading,
+        success: success,
+        retryCount: retryCount
+      }));
+    }
+    if (currentScreen === _utils2.VALIDATE_OTP_SCREENS.CONTACT_LIST) {
+      return /*#__PURE__*/_react.default.createElement(_ContactListView.ContactListView, _extends({}, props, {
+        setIsContactVisited: setIsContactVisited,
+        handleSelectContact: handleSelectContact,
+        handleBackNavigation: handleBackNavigation,
+        contactList: contactList,
+        domain: domain
+      }));
+    }
+    if (currentScreen === _utils2.VALIDATE_OTP_SCREENS.OTP_VIEW) {
+      return /*#__PURE__*/_react.default.createElement(_OTPView.OTPView, _extends({}, props, {
+        isContactVisited: isContactVisited,
+        otpCode: otpCode,
+        otpInputConfig: otpInputConfig,
+        selectedContact: selectedContact,
+        setCurrentScreen: setCurrentScreen,
+        setErrorMessage: setErrorMessage,
+        setSnackBar: setSnackBar,
+        errorMessage: errorMessage,
+        setHasError: setHasError,
+        setOTPCode: setOTPCode,
+        setLoading: setLoading,
+        handleBackNavigation: handleBackNavigation,
+        hasError: hasError,
+        doorstepOTP: props.doorstepOTP,
+        setResendCount: setResendCount,
+        resendCount: resendCount,
+        resendConfig: resendConfig,
+        domain: domain
+      }));
+    }
+    return null;
+  };
+  return /*#__PURE__*/_react.default.createElement(_reactNativePaper.Provider, null, /*#__PURE__*/_react.default.createElement(_reactNativePaper.Portal, null, loading ? /*#__PURE__*/_react.default.createElement(_ProgressDialog.default, {
+    customModalContentStyle: {
+      paddingVertical: 32
+    },
+    visible: loading,
+    label: "Loading",
+    labelStyle: {
+      fontWeight: '400',
+      marginTop: 16,
+      fontFamily: _reactNative.Platform.OS === 'android' ? _CommonStyles.Fonts.IBMPlexSans_400Regular : 'IBMPlexSans-Regular',
+      color: '#525B7A',
+      letterSpacing: 0.25
+    }
+  }) : currentScreen === _utils2.VALIDATE_OTP_SCREENS.VERIFICATION_COMPLETE ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: [_CommonStyles.CommonStyles.mainContainer]
+  }, /*#__PURE__*/_react.default.createElement(_VerificationComplete.default, _extends({}, props, {
+    setLoading: setLoading,
+    success: success,
+    retryCount: retryCount
+  }))) : currentScreen === _utils2.VALIDATE_OTP_SCREENS.CONTACT_LIST ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: [_CommonStyles.CommonStyles.mainContainer]
+  }, renderGoBackModal(), renderCancelModal(), /*#__PURE__*/_react.default.createElement(_ContactListView.ContactListView, _extends({}, props, {
+    setIsContactVisited: setIsContactVisited,
+    handleSelectContact: handleSelectContact,
+    handleBackNavigation: handleBackNavigation,
+    contactList: contactList,
+    domain: domain
+  })), renderButtons(), renderSnackBar()) : currentScreen === _utils2.VALIDATE_OTP_SCREENS.OTP_VIEW ? /*#__PURE__*/_react.default.createElement(_reactNative.View, {
+    style: [_CommonStyles.CommonStyles.mainContainer]
+  }, renderGoBackModal(), renderCancelModal(), /*#__PURE__*/_react.default.createElement(_OTPView.OTPView, _extends({}, props, {
+    isContactVisited: isContactVisited,
+    otpCode: otpCode,
+    otpInputConfig: otpInputConfig,
+    selectedContact: selectedContact,
+    setCurrentScreen: setCurrentScreen,
+    setErrorMessage: setErrorMessage,
+    setSnackBar: setSnackBar,
+    errorMessage: errorMessage,
+    setHasError: setHasError,
+    setOTPCode: setOTPCode,
+    setLoading: setLoading,
+    handleBackNavigation: handleBackNavigation,
+    hasError: hasError,
+    doorstepOTP: props.doorstepOTP,
+    setResendCount: setResendCount,
+    resendCount: resendCount,
+    resendConfig: resendConfig,
+    domain: domain
+  })), renderButtons(), renderSnackBar()) : null));
 };
 var _default = exports.default = ValidateOTPET;
-const styles = _reactNative.StyleSheet.create({
-  bottomView: {
-    flexDirection: 'row-reverse',
-    justifyContent: 'space-evenly',
-    padding: 16,
-    backgroundColor: 'white'
-  },
-  titleText: {
-    justifyContent: 'center',
-    fontFamily: _reactNative.Platform.OS === 'android' ? _CommonStyles.Fonts.IBMPlexSans_400Regular : 'IBMPlexSans-Regular',
-    fontStyle: 'normal',
-    fontSize: 16,
-    lineHeight: 20,
-    letterSpacing: 0.25,
-    textAlign: 'center',
-    color: '#3D445C',
-    marginBottom: 10
-  },
-  otpTitle: {
-    marginTop: 10,
-    marginBottom: 20,
-    fontFamily: _reactNative.Platform.OS === 'android' ? _CommonStyles.Fonts.IBMPlexSans_400Regular : 'IBMPlexSans-Regular',
-    fontStyle: 'normal',
-    fontSize: 16,
-    lineHeight: 20,
-    letterSpacing: 0.25,
-    color: '#3D445C',
-    alignItems: 'center'
-  },
-  otpContainer: {
-    marginTop: 20,
-    marginBottom: 40,
-    marginHorizontal: 10,
-    flex: 1
-  },
-  retryButton: {
-    alignItems: 'flex-start',
-    marginVertical: 10
-  },
-  errorMessage: {
-    marginTop: 16,
-    marginHorizontal: 10,
-    color: '#DC2626',
-    fontFamily: _reactNative.Platform.OS === 'android' ? _CommonStyles.Fonts.IBMPlexSans_400Regular : 'IBMPlexSans-Regular',
-    fontSize: 12,
-    lineHeight: 16
-  },
-  subText: {
-    justifyContent: 'center',
-    fontFamily: _reactNative.Platform.OS === 'android' ? _CommonStyles.Fonts.IBMPlexSans_400Regular : 'IBMPlexSans-Regular',
-    fontStyle: 'normal',
-    fontSize: 14,
-    letterSpacing: 0.25,
-    lineHeight: 20,
-    textAlign: 'center',
-    color: '#000000',
-    marginBottom: 10
-  },
-  modalContent: {
-    marginStart: 60,
-    marginEnd: 60,
-    flex: 1,
-    marginBottom: 60
-  },
-  modalView: {
-    backgroundColor: 'white',
-    padding: 15,
-    borderRadius: 9
-  }
-});
 //# sourceMappingURL=ValidateOTPET.js.map