@os1-platform/dispatch-mobile 2.1.22 → 2.1.24

package/lib/module/components/executiontasks/collectPayment/components/PaymentContactDetails.js

@@ -0,0 +1,531 @@
+import React, { useEffect, useState, useLayoutEffect, useContext } from 'react';
+import { BackHandler, FlatList, Platform, StyleSheet, Text, View } from 'react-native';
+import {
+// PAYMENT_SHARED_PREF_KEY,
+getPaymentDataMO, getPaymentType, removeSharedPrefPaymentData } from '../PaymentUtils';
+import { getBaseETResponse, maskContact } from '../../../../utils/ExecTaskUtils';
+import { EntityCode, ExecutionTaskID } from '../../../../models/execTasks/ETConfig';
+import { getEventCodeByET } from '../../../../manager/dispatchCodes/EventCodeContainer';
+import { CommonStyles, Fonts } from '../../../../styles/executionTasks/CommonStyles';
+import { Button, Provider, RadioButton, TextInput } from 'react-native-paper';
+import Icon from 'react-native-vector-icons/MaterialIcons';
+import { EMAIL_REGEX, PAYMENT_NOTIFICATION } from '../../../../constants/constants';
+import EventListener from '../../../../events';
+import { PAYMENT_SCREEN, STATUS } from '../CollectPaymentSchema';
+import { useFocusEffect } from '@react-navigation/native';
+import { RouteParams } from '../../../../ui/uiConfig/RouteParams';
+import { DispatchExecutor as dispatchExecutor } from '@os1-platform/platform-coreos-execution-engine-sdk';
+import callbackHandler from '../../../../manager/sdk/callbacksHandler';
+import ModalWidget from '../../../../components/widgets/ModalWidget';
+import Storage from '../../../../utils/storage';
+import { PaymentContext } from '../../../../utils/context/paymentContext';
+import { ENDPOINTS } from '../../../../constants/apiConstants';
+import { PROGRESS_GROUP } from '../../../../utils/Constants';
+import Logger, { LOG_TYPE } from '../../../../utils/Logger';
+let storage = Storage.getInstance();
+const PaymentContactDetails = props => {
+  var _props$route$params$R, _props$onsiteLinkShar;
+  const paymentConfigContext = useContext(PaymentContext);
+  const [selectedContact, setSelectedContact] = useState('');
+  const [displayContactModal, setDisplayContactModal] = useState(false);
+  const [manualContactDetails, setManualContactDetails] = useState();
+  const [displayError, setErrorDisplay] = useState(false);
+  const [manualContact, setManualContact] = useState('');
+  const [contactList, setContactList] = useState([]);
+  const paymentRefId = (_props$route$params$R = props.route.params[RouteParams.ROOT_META_DATA].paymentConfig) === null || _props$route$params$R === void 0 ? void 0 : _props$route$params$R.paymentRefId;
+  useEffect(() => {
+    (async () => {
+      if (props.route.params[RouteParams.ROOT_META_DATA]) {
+        var _phoneNumbers$value;
+        //Call objectiveDetails fn and fetch sds ids
+        let progressGroup = null;
+        try {
+          progressGroup = await Storage.getInstance().getSharedItem(PROGRESS_GROUP, false);
+        } catch (error) {
+          var _error$response;
+          Logger.getInstance().logEvent('~ getPaymentStatus triggered ', JSON.stringify((error === null || error === void 0 || (_error$response = error.response) === null || _error$response === void 0 ? void 0 : _error$response.data) || error), LOG_TYPE.SDK_ERROR);
+          progressGroup = null;
+        }
+        const {
+          contact
+        } = await dispatchExecutor.getObjectiveTaskDetails(props.mergedObjectiveId[0], progressGroup, props.route.params[RouteParams.ROOT_META_DATA].statusFilter);
+
+        // run callback to get corresponding phone numbers
+        const phoneNumbers = await callbackHandler.getPhoneNumbers(contact);
+        if (phoneNumbers && (_phoneNumbers$value = phoneNumbers.value) !== null && _phoneNumbers$value !== void 0 && _phoneNumbers$value.length) {
+          setContactList(phoneNumbers.value);
+        }
+      }
+    })();
+    EventListener.on(PAYMENT_NOTIFICATION, async data => {
+      console.log("PaymentCollectDetail:", JSON.stringify(data));
+      let sharedPrefPaymentData = null;
+      if (data && (data.status === STATUS.SUCCESS || data.status === STATUS.FAILED)) {
+        sharedPrefPaymentData = await getPaymentDataMO(props.mergedObjectiveId, data.refId, storage);
+      }
+      if (sharedPrefPaymentData && data && data.status === STATUS.SUCCESS) {
+        var _sharedPrefPaymentDat, _sharedPrefPaymentDat2, _sharedPrefPaymentDat3, _paymentConfigContext, _props$applicableReas;
+        props.next({
+          paymentMode: ((_sharedPrefPaymentDat = sharedPrefPaymentData) === null || _sharedPrefPaymentDat === void 0 ? void 0 : _sharedPrefPaymentDat.paymentMode) || props.paymentMode,
+          collectedAmount: {
+            value: ((_sharedPrefPaymentDat2 = sharedPrefPaymentData) === null || _sharedPrefPaymentDat2 === void 0 ? void 0 : _sharedPrefPaymentDat2.amount.value) || props.expectedAmount,
+            currencyCode: ((_sharedPrefPaymentDat3 = sharedPrefPaymentData) === null || _sharedPrefPaymentDat3 === void 0 ? void 0 : _sharedPrefPaymentDat3.amount.currencyCode) || (paymentConfigContext === null || paymentConfigContext === void 0 || (_paymentConfigContext = paymentConfigContext.sdkConfig) === null || _paymentConfigContext === void 0 || (_paymentConfigContext = _paymentConfigContext.etConfig) === null || _paymentConfigContext === void 0 ? void 0 : _paymentConfigContext.currencyCode) || ''
+          },
+          refId: data.refId,
+          screen: PAYMENT_SCREEN.COMPLETE,
+          sourceScreen: PAYMENT_SCREEN.CONTACTS,
+          ...(await getBaseETResponse(EntityCode.COLLECT_PAYMENT_ET, true, getEventCodeByET(ExecutionTaskID.COLLECT_PAYMENT_ET, true, (_props$applicableReas = props.applicableReasons) === null || _props$applicableReas === void 0 ? void 0 : _props$applicableReas.success), '', props.mergedObjectiveId, ExecutionTaskID.COLLECT_PAYMENT_ET))
+        });
+      } else if (sharedPrefPaymentData && data && data.status === STATUS.FAILED) {
+        /* const _sharedPrefPaymentData = JSON.parse(
+          JSON.stringify(sharedPrefPaymentData)
+        ); */
+        /* await storage.removeSharedItems(
+          props.mergedObjectiveId.map((_id) => PAYMENT_SHARED_PREF_KEY + _id)
+        ); */
+        await removeSharedPrefPaymentData(data.refId, storage);
+      }
+    });
+    return () => EventListener.remove(PAYMENT_NOTIFICATION);
+  }, []);
+  const handleOnCancelClick = async () => {
+    var _props$applicableReas2, _paymentConfigContext2;
+    props.onSubmitET({
+      paymentMode: props.paymentMode,
+      refId: paymentRefId,
+      ...(await getBaseETResponse(EntityCode.COLLECT_PAYMENT_ET, false, getEventCodeByET(ExecutionTaskID.COLLECT_PAYMENT_ET, false, (_props$applicableReas2 = props.applicableReasons) === null || _props$applicableReas2 === void 0 ? void 0 : _props$applicableReas2.failure), '', props.mergedObjectiveId, ExecutionTaskID.COLLECT_PAYMENT_ET)),
+      collectedAmount: {
+        value: props.expectedAmount,
+        currencyCode: (paymentConfigContext === null || paymentConfigContext === void 0 || (_paymentConfigContext2 = paymentConfigContext.sdkConfig) === null || _paymentConfigContext2 === void 0 || (_paymentConfigContext2 = _paymentConfigContext2.etConfig) === null || _paymentConfigContext2 === void 0 ? void 0 : _paymentConfigContext2.currencyCode) || ''
+      }
+    });
+  };
+  const getPaymentStatus = async isProceed => {
+    try {
+      var _ps$data$transactions, _ps$data$meta, _ps$data$meta2, _ps$data$transactions2;
+      let sharedPrefPaymentData = null;
+      const paymentResp = await (paymentConfigContext === null || paymentConfigContext === void 0 ? void 0 : paymentConfigContext.networkInstance.requestGet(ENDPOINTS.PAYMENT_STATUS + paymentRefId, {
+        requestId: 'payment:' + paymentRefId
+      }, {
+        appAbbr: paymentConfigContext.sdkConfig.etConfig.appAbbr,
+        latest: true
+      }));
+      // const paymentResp = {
+      //   data: {
+      //     data: {
+      //       meta: { totalCount: 1 },
+      //       transactions: [
+      //         {
+      //           refId: paymentRefId,
+      //           status: STATUS.FAILED,
+      //           subStatus: SUB_STATUS.completed,
+      //           money: {
+      //             amount: 1000,
+      //             currency: 'INR',
+      //           },
+      //           txnId: '123',
+      //           txnType: TRANSACTION_TYPE.LINK,
+      //           appAbbr: 'testApp31',
+      //         },
+      //       ],
+      //     },
+      //   },
+      // };
+      const _ps = paymentResp === null || paymentResp === void 0 ? void 0 : paymentResp.data;
+      console.log('Contact getPaymentStatus _ps: ', JSON.stringify(_ps));
+      sharedPrefPaymentData = await getPaymentDataMO(props.mergedObjectiveId, paymentRefId, storage);
+      if (_ps !== null && _ps !== void 0 && (_ps$data$transactions = _ps.data.transactions) !== null && _ps$data$transactions !== void 0 && _ps$data$transactions.length && (sharedPrefPaymentData || getPaymentType(_ps === null || _ps === void 0 ? void 0 : _ps.data.transactions[0].txnType)) && (_ps$data$meta = _ps.data.meta) !== null && _ps$data$meta !== void 0 && _ps$data$meta.totalCount && (_ps === null || _ps === void 0 ? void 0 : _ps.data.transactions[0].status) === STATUS.SUCCESS) {
+        var _sharedPrefPaymentDat4, _sharedPrefPaymentDat5, _sharedPrefPaymentDat6, _paymentConfigContext3, _props$applicableReas3;
+        props.next({
+          paymentMode: ((_sharedPrefPaymentDat4 = sharedPrefPaymentData) === null || _sharedPrefPaymentDat4 === void 0 ? void 0 : _sharedPrefPaymentDat4.paymentMode) || getPaymentType(_ps === null || _ps === void 0 ? void 0 : _ps.data.transactions[0].txnType) || props.paymentMode,
+          collectedAmount: {
+            value: ((_sharedPrefPaymentDat5 = sharedPrefPaymentData) === null || _sharedPrefPaymentDat5 === void 0 ? void 0 : _sharedPrefPaymentDat5.amount.value) || (_ps === null || _ps === void 0 ? void 0 : _ps.data.transactions[0].money.amount) || props.expectedAmount,
+            currencyCode: ((_sharedPrefPaymentDat6 = sharedPrefPaymentData) === null || _sharedPrefPaymentDat6 === void 0 ? void 0 : _sharedPrefPaymentDat6.amount.currencyCode) || (_ps === null || _ps === void 0 ? void 0 : _ps.data.transactions[0].money.currency) || (paymentConfigContext === null || paymentConfigContext === void 0 || (_paymentConfigContext3 = paymentConfigContext.sdkConfig) === null || _paymentConfigContext3 === void 0 || (_paymentConfigContext3 = _paymentConfigContext3.etConfig) === null || _paymentConfigContext3 === void 0 ? void 0 : _paymentConfigContext3.currencyCode) || ''
+          },
+          refId: _ps.data.transactions[0].refId,
+          screen: PAYMENT_SCREEN.COMPLETE,
+          sourceScreen: PAYMENT_SCREEN.CONTACTS,
+          ...(await getBaseETResponse(EntityCode.COLLECT_PAYMENT_ET, true, getEventCodeByET(ExecutionTaskID.COLLECT_PAYMENT_ET, true, (_props$applicableReas3 = props.applicableReasons) === null || _props$applicableReas3 === void 0 ? void 0 : _props$applicableReas3.success), '', props.mergedObjectiveId, ExecutionTaskID.COLLECT_PAYMENT_ET))
+        });
+        return;
+      } else if (sharedPrefPaymentData && (_ps$data$meta2 = _ps.data.meta) !== null && _ps$data$meta2 !== void 0 && _ps$data$meta2.totalCount && _ps !== null && _ps !== void 0 && (_ps$data$transactions2 = _ps.data.transactions) !== null && _ps$data$transactions2 !== void 0 && _ps$data$transactions2.length && (_ps === null || _ps === void 0 ? void 0 : _ps.data.transactions[0].status) === STATUS.FAILED) {
+        await removeSharedPrefPaymentData(paymentRefId, storage);
+      }
+      if (isProceed) await sendPaymentLink(selectedContact);else if (isProceed === false) await handleOnCancelClick();
+    } catch (err) {
+      var _err$response, _err$response2;
+      Logger.getInstance().logEvent('~ getPaymentStatus triggered ', JSON.stringify((err === null || err === void 0 || (_err$response = err.response) === null || _err$response === void 0 ? void 0 : _err$response.data) || err), LOG_TYPE.SDK_ERROR);
+      console.error('STATUS: ', (err === null || err === void 0 || (_err$response2 = err.response) === null || _err$response2 === void 0 ? void 0 : _err$response2.data) || err.message);
+    }
+  };
+
+  // Handle back-button click
+  useFocusEffect(React.useCallback(() => {
+    const onBackPress = () => {
+      (async (_props$applicableReas4, _paymentConfigContext4) => props.next({
+        paymentMode: props.paymentMode,
+        refId: paymentRefId,
+        ...(await getBaseETResponse(EntityCode.COLLECT_PAYMENT_ET, true, getEventCodeByET(ExecutionTaskID.COLLECT_PAYMENT_ET, true, (_props$applicableReas4 = props.applicableReasons) === null || _props$applicableReas4 === void 0 ? void 0 : _props$applicableReas4.success), '', props.mergedObjectiveId, ExecutionTaskID.COLLECT_PAYMENT_ET)),
+        screen: PAYMENT_SCREEN.INIT,
+        sourceScreen: PAYMENT_SCREEN.CONTACTS,
+        collectedAmount: {
+          value: props.expectedAmount,
+          currencyCode: (paymentConfigContext === null || paymentConfigContext === void 0 || (_paymentConfigContext4 = paymentConfigContext.sdkConfig) === null || _paymentConfigContext4 === void 0 || (_paymentConfigContext4 = _paymentConfigContext4.etConfig) === null || _paymentConfigContext4 === void 0 ? void 0 : _paymentConfigContext4.currencyCode) || ''
+        }
+      }))();
+      return true;
+    };
+    BackHandler.addEventListener('hardwareBackPress', onBackPress);
+    return () => BackHandler.removeEventListener('hardwareBackPress', onBackPress);
+  }, []));
+  useLayoutEffect(() => {
+    props.navigation.setOptions({
+      headerShown: true,
+      title: 'Payment Link',
+      headerLeft: () => {
+        return /*#__PURE__*/React.createElement(Icon, {
+          onPress: async () => {
+            var _props$applicableReas5, _paymentConfigContext5;
+            props.next({
+              paymentMode: props.paymentMode,
+              refId: paymentRefId,
+              ...(await getBaseETResponse(EntityCode.COLLECT_PAYMENT_ET, true, getEventCodeByET(ExecutionTaskID.COLLECT_PAYMENT_ET, true, (_props$applicableReas5 = props.applicableReasons) === null || _props$applicableReas5 === void 0 ? void 0 : _props$applicableReas5.success), '', props.mergedObjectiveId, ExecutionTaskID.COLLECT_PAYMENT_ET)),
+              screen: PAYMENT_SCREEN.INIT,
+              sourceScreen: PAYMENT_SCREEN.CONTACTS,
+              collectedAmount: {
+                value: props.expectedAmount,
+                currencyCode: (paymentConfigContext === null || paymentConfigContext === void 0 || (_paymentConfigContext5 = paymentConfigContext.sdkConfig) === null || _paymentConfigContext5 === void 0 || (_paymentConfigContext5 = _paymentConfigContext5.etConfig) === null || _paymentConfigContext5 === void 0 ? void 0 : _paymentConfigContext5.currencyCode) || ''
+              }
+            });
+          },
+          name: "arrow-back",
+          color: 'black',
+          size: 25,
+          style: {
+            paddingRight: 15,
+            paddingTop: 5
+          }
+        });
+      }
+    });
+  }, [props.navigation, props.title]);
+  const renderItem = ({
+    item
+  }) => {
+    return /*#__PURE__*/React.createElement(View, {
+      style: styles.reasonItemStyle
+    }, /*#__PURE__*/React.createElement(RadioButton, {
+      color: '#5B80F7',
+      value: item,
+      status: selectedContact === item ? 'checked' : 'unchecked',
+      onPress: () => {
+        setSelectedContact(item);
+      }
+    }), /*#__PURE__*/React.createElement(Text, {
+      style: [styles.reasonTextStyle, {
+        fontWeight: 'bold'
+      }],
+      onPress: () => {
+        setSelectedContact(item);
+      }
+    }, maskContact(item)));
+  };
+  const inputValidation = (data, _regex) => {
+    if (_regex) {
+      const regex = new RegExp(_regex);
+      return regex.test(data);
+    }
+    return false;
+  };
+  const sendPaymentLink = async contactDetails => {
+    var _props$applicableReas6, _paymentConfigContext6;
+    props.next({
+      paymentMode: props.paymentMode,
+      refId: paymentRefId,
+      ...(await getBaseETResponse(EntityCode.COLLECT_PAYMENT_ET, true, getEventCodeByET(ExecutionTaskID.COLLECT_PAYMENT_ET, true, (_props$applicableReas6 = props.applicableReasons) === null || _props$applicableReas6 === void 0 ? void 0 : _props$applicableReas6.success), '', props.mergedObjectiveId, ExecutionTaskID.COLLECT_PAYMENT_ET)),
+      screen: PAYMENT_SCREEN.PROCESS,
+      sourceScreen: PAYMENT_SCREEN.CONTACTS,
+      collectedAmount: {
+        value: props.expectedAmount,
+        currencyCode: (paymentConfigContext === null || paymentConfigContext === void 0 || (_paymentConfigContext6 = paymentConfigContext.sdkConfig) === null || _paymentConfigContext6 === void 0 || (_paymentConfigContext6 = _paymentConfigContext6.etConfig) === null || _paymentConfigContext6 === void 0 ? void 0 : _paymentConfigContext6.currencyCode) || ''
+      },
+      contactDetails
+    });
+  };
+  const onModalSubmit = () => {
+    var _paymentConfigContext7;
+    const regex = (manualContactDetails === null || manualContactDetails === void 0 ? void 0 : manualContactDetails.type) === 'PHONE' ? (paymentConfigContext === null || paymentConfigContext === void 0 || (_paymentConfigContext7 = paymentConfigContext.sdkConfig) === null || _paymentConfigContext7 === void 0 || (_paymentConfigContext7 = _paymentConfigContext7.etConfig) === null || _paymentConfigContext7 === void 0 ? void 0 : _paymentConfigContext7.mobilePhoneRegex) || '' : EMAIL_REGEX;
+    if (inputValidation(manualContact, regex)) {
+      setErrorDisplay(false);
+      (async _paymentConfigContext8 => {
+        const contact = (manualContactDetails === null || manualContactDetails === void 0 ? void 0 : manualContactDetails.type) === 'PHONE' ? (paymentConfigContext === null || paymentConfigContext === void 0 || (_paymentConfigContext8 = paymentConfigContext.sdkConfig) === null || _paymentConfigContext8 === void 0 || (_paymentConfigContext8 = _paymentConfigContext8.etConfig) === null || _paymentConfigContext8 === void 0 ? void 0 : _paymentConfigContext8.phoneCode) + manualContact : manualContact;
+        await sendPaymentLink(contact);
+      })();
+    } else {
+      setErrorDisplay(true);
+    }
+  };
+  const renderManualContactsModal = () => {
+    return /*#__PURE__*/React.createElement(ModalWidget, {
+      title: {
+        label: (manualContactDetails === null || manualContactDetails === void 0 ? void 0 : manualContactDetails.title) || ''
+      },
+      contentContainerStyle: {
+        marginBottom: 120
+      },
+      showModal: displayContactModal,
+      renderChildren: () => {
+        var _paymentConfigContext9, _paymentConfigContext10, _paymentConfigContext11;
+        return (manualContactDetails === null || manualContactDetails === void 0 ? void 0 : manualContactDetails.type) === 'PHONE' ? /*#__PURE__*/React.createElement(View, {
+          style: {
+            marginVertical: 10
+          }
+        }, /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(Text, {
+          style: [styles.inputLabel, {
+            marginBottom: 8
+          }]
+        }, "Phone Number")), /*#__PURE__*/React.createElement(View, {
+          style: [{
+            justifyContent: 'flex-start',
+            display: 'flex',
+            flexDirection: 'row'
+          }]
+        }, paymentConfigContext !== null && paymentConfigContext !== void 0 && (_paymentConfigContext9 = paymentConfigContext.sdkConfig) !== null && _paymentConfigContext9 !== void 0 && (_paymentConfigContext9 = _paymentConfigContext9.etConfig) !== null && _paymentConfigContext9 !== void 0 && _paymentConfigContext9.phoneCode ? /*#__PURE__*/React.createElement(TextInput, {
+          style: [styles.input, {
+            borderTopEndRadius: 0,
+            borderBottomEndRadius: 0
+          }, displayError ? {
+            borderColor: 'red'
+          } : {}],
+          disabled: true,
+          value: '(' + (paymentConfigContext === null || paymentConfigContext === void 0 || (_paymentConfigContext10 = paymentConfigContext.sdkConfig) === null || _paymentConfigContext10 === void 0 || (_paymentConfigContext10 = _paymentConfigContext10.etConfig) === null || _paymentConfigContext10 === void 0 ? void 0 : _paymentConfigContext10.phoneCode) + ')'
+        }) : null, /*#__PURE__*/React.createElement(TextInput, {
+          style: [styles.input, {
+            flexGrow: 1,
+            flex: 1
+          }, paymentConfigContext !== null && paymentConfigContext !== void 0 && (_paymentConfigContext11 = paymentConfigContext.sdkConfig) !== null && _paymentConfigContext11 !== void 0 && (_paymentConfigContext11 = _paymentConfigContext11.etConfig) !== null && _paymentConfigContext11 !== void 0 && _paymentConfigContext11.phoneCode ? {
+            borderLeftWidth: 0,
+            borderTopStartRadius: 0,
+            borderBottomStartRadius: 0
+          } : {}, displayError ? {
+            borderColor: 'red'
+          } : {}],
+          autoFocus: true,
+          placeholder: "Add Phone Number",
+          onChangeText: setManualContact,
+          activeUnderlineColor: "transparent"
+        })), displayError ? /*#__PURE__*/React.createElement(Text, {
+          style: {
+            color: 'red'
+          }
+        }, "Enter valid phone number.") : null) : /*#__PURE__*/React.createElement(View, {
+          style: {
+            marginVertical: 10
+          }
+        }, /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(Text, {
+          style: [styles.inputLabel, {
+            marginBottom: 8
+          }]
+        }, "Email Address")), /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(TextInput, {
+          style: [styles.input, displayError ? {
+            borderColor: 'red'
+          } : {}],
+          autoFocus: true,
+          placeholder: "Add Email Address",
+          onChangeText: setManualContact,
+          activeUnderlineColor: 'transparent'
+        })), displayError ? /*#__PURE__*/React.createElement(Text, {
+          style: {
+            color: 'red'
+          }
+        }, "Enter valid email address.") : null);
+      },
+      primaryButton: {
+        label: 'Send Payment Link',
+        onPress: () => {
+          onModalSubmit();
+        },
+        labelStyles: {
+          ...CommonStyles.nextButtonLabel
+        },
+        styles: {
+          ...CommonStyles.nextButton,
+          padding: 8,
+          borderRadius: 5,
+          marginVertical: 10,
+          marginTop: 15
+        }
+      },
+      secondaryButton: {
+        label: 'Cancel',
+        onPress: () => {
+          setErrorDisplay(false);
+          setDisplayContactModal(false);
+        },
+        labelStyles: {
+          ...CommonStyles.cancelButtonLabel
+        },
+        styles: {
+          ...CommonStyles.cancelButton,
+          padding: 8,
+          borderRadius: 5
+        }
+      }
+    });
+  };
+  return /*#__PURE__*/React.createElement(Provider, null, renderManualContactsModal(), /*#__PURE__*/React.createElement(View, {
+    style: CommonStyles.mainContainer
+  }, /*#__PURE__*/React.createElement(Text, {
+    style: [styles.title, {
+      paddingBottom: 0
+    }]
+  }, "Select or add contact details to send the payment link"), contactList.length ? /*#__PURE__*/React.createElement(View, {
+    style: {
+      marginBottom: 16,
+      maxHeight: 500
+    }
+  }, /*#__PURE__*/React.createElement(FlatList, {
+    data: contactList,
+    renderItem: renderItem,
+    keyExtractor: item => item
+  })) : null, (_props$onsiteLinkShar = props.onsiteLinkSharing) !== null && _props$onsiteLinkShar !== void 0 && _props$onsiteLinkShar.length ? /*#__PURE__*/React.createElement(View, {
+    style: [{
+      backgroundColor: 'white',
+      padding: 16,
+      flexDirection: 'row',
+      justifyContent: 'space-evenly'
+    }, props.onsiteLinkSharing.includes('Email') && props.onsiteLinkSharing.includes('Phone Number') ? {} : {
+      justifyContent: 'flex-start',
+      paddingStart: 55
+    }]
+  }, props.onsiteLinkSharing.includes('Email') ? /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(Text, {
+    style: [styles.link],
+    onPress: () => {
+      setDisplayContactModal(true);
+      setManualContactDetails({
+        title: 'Add Email Address',
+        type: 'EMAIL'
+      });
+    }
+  }, "Add Email Address")) : null, props.onsiteLinkSharing.includes('Email') && props.onsiteLinkSharing.includes('Phone Number') ? /*#__PURE__*/React.createElement(View, {
+    style: {
+      borderLeftWidth: 1,
+      borderColor: '#cccccc'
+    }
+  }) : null, props.onsiteLinkSharing.includes('Phone Number') ? /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(Text, {
+    style: [styles.link],
+    onPress: () => {
+      setDisplayContactModal(true);
+      setManualContactDetails({
+        title: 'Add Phone Number',
+        type: 'PHONE'
+      });
+    }
+  }, "Add Phone Number")) : null) : null, /*#__PURE__*/React.createElement(View, {
+    style: styles.btnContainer
+  }, /*#__PURE__*/React.createElement(View, {
+    style: styles.buttonParentContainer
+  }, /*#__PURE__*/React.createElement(Button, {
+    style: [CommonStyles.cancelButton, {
+      marginEnd: 5,
+      flex: 1
+    }],
+    labelStyle: {
+      ...CommonStyles.cancelButtonLabel,
+      color: '#5B80F7',
+      textTransform: 'capitalize'
+    },
+    mode: 'outlined',
+    onPress: async () => {
+      await getPaymentStatus(false);
+    }
+  }, "Cancel"), /*#__PURE__*/React.createElement(Button, {
+    style: [CommonStyles.nextButton, {
+      flex: 1,
+      marginStart: 5
+    }, !selectedContact ? {
+      backgroundColor: '#E0E3EB'
+    } : {}],
+    labelStyle: [CommonStyles.nextButtonLabel, {
+      textTransform: 'capitalize'
+    }, !selectedContact ? {
+      color: '#A3AAC2'
+    } : {}],
+    disabled: !selectedContact,
+    mode: 'contained',
+    onPress: async () => {
+      await getPaymentStatus(true);
+    }
+  }, "Send Payment Link")))));
+};
+export default PaymentContactDetails;
+const styles = StyleSheet.create({
+  title: {
+    fontFamily: Platform.OS === 'android' ? Fonts.IBMPlexSans_400Regular : 'IBMPlexSans-Regular',
+    fontWeight: '400',
+    fontSize: 16,
+    lineHeight: 24,
+    color: '#3D445C',
+    margin: 20
+  },
+  reasonItemStyle: {
+    flexDirection: 'row',
+    paddingVertical: 5,
+    paddingStart: 20,
+    paddingEnd: 20,
+    backgroundColor: 'white',
+    marginBottom: 5
+  },
+  reasonTextStyle: {
+    flex: 1,
+    flexWrap: 'wrap',
+    fontFamily: Platform.OS === 'android' ? Fonts.IBMPlexSans_400Regular : 'IBMPlexSans-Regular',
+    fontStyle: 'normal',
+    fontSize: 14,
+    lineHeight: 21,
+    letterSpacing: 0.25,
+    textAlign: 'justify',
+    color: '#111111',
+    paddingTop: 5
+  },
+  link: {
+    color: '#5B80F7',
+    fontSize: 14,
+    fontWeight: '500',
+    lineHeight: 20
+  },
+  inputLabel: {
+    fontSize: 14,
+    lineHeight: 20,
+    fontWeight: '500',
+    fontFamily: Platform.OS === 'android' ? Fonts.IBMPlexSans_500Medium : 'IBMPlexSans-Medium',
+    color: '#3D445C'
+  },
+  input: {
+    // flex: 1,
+    fontSize: 14,
+    lineHeight: 24,
+    fontFamily: Platform.OS === 'android' ? Fonts.IBMPlexSans_400Regular : 'IBMPlexSans-Regular',
+    borderColor: '#E0E3EB',
+    borderWidth: 1,
+    height: 22,
+    borderRadius: 6,
+    paddingHorizontal: 13,
+    paddingVertical: 9,
+    backgroundColor: '#ffffff'
+  },
+  buttonParentContainer: {
+    flexDirection: 'row',
+    padding: 10,
+    paddingTop: 16,
+    backgroundColor: 'white',
+    borderTopWidth: 1,
+    borderTopColor: '#eeeeee'
+  },
+  btnContainer: {
+    justifyContent: 'flex-end',
+    marginBottom: 10,
+    flexGrow: 1
+  }
+});
+//# sourceMappingURL=PaymentContactDetails.js.map