react-native-unit-components/lib/commonjs/components/UNBottomSheetComponent/UNBottomSheetComponent.utils.js

Unit React Native components

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.resetHtml = exports.renderingBottomSheetRequest = exports.injectHtmlFullScreenHeight = exports.getNativeComponentDataFromEvent = exports.getBottomSheetScript = void 0;
var _bodyScript = require("./../../scripts/html/bodyScript");
var _bodyHtml = require("../../scripts/html/bodyHtml");
var _bottomSheet = require("../../types/internal/bottomSheet.types");
var _webComponent = require("../../types/internal/webComponent.types");
var _shared = require("../../types/shared");
const getBottomSheetScript = () => {
  return _bodyScript.LISTENERS.requestRefresh;
};
exports.getBottomSheetScript = getBottomSheetScript;
const renderingBottomSheetRequest = (currentWebView, renderingRequest) => {
  currentWebView?.injectJavaScript(`
    document.activeElement && document.activeElement.blur();
    dispatchRenderingEvent('${JSON.stringify(renderingRequest.data)}');
  `);
};
exports.renderingBottomSheetRequest = renderingBottomSheetRequest;
const resetHtml = currentWebView => {
  currentWebView?.injectJavaScript(`
    document.activeElement && document.activeElement.blur();
    document.getElementById('${_bodyHtml.webViewId}').style.height = null;
  `);
};
exports.resetHtml = resetHtml;
const injectHtmlFullScreenHeight = (currentWebView, bottomSheetHeight) => {
  currentWebView && currentWebView?.injectJavaScript(`
    document.getElementById('${_bodyHtml.webViewId}').style.height = '${bottomSheetHeight}px';
  `);
};
exports.injectHtmlFullScreenHeight = injectHtmlFullScreenHeight;
const getParamsFromRequestRenderingEvent = event => {
  const eventString = event.data.nativeComponent;
  const componentName = event.data.nativeComponentName;
  const regexStringParams = `(<${componentName})(.*?)(><\\/${componentName}>)`;
  const regexParams = new RegExp(regexStringParams);
  const matchParams = eventString?.match(regexParams);
  if (matchParams && matchParams[2]) {
    return matchParams[2];
  }
  return null;
};
const extractValueFromRequestRenderingEvent = (event, key) => {
  const paramsString = getParamsFromRequestRenderingEvent(event);
  const regexString = `${key}=([^\\ \\s]+)`;
  const regex = new RegExp(regexString);
  const match = paramsString?.match(regex);
  if (match && match[1]) {
    return match[1];
  } else {
    return undefined;
  }
};
const getAddToWalletComponentDataFromEvent = (event, customerToken) => {
  const cardId = event.componentResourceId ?? extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'card-id');
  if (!cardId) {
    console.error('componentResourceId is missing in getAddToWalletComponentDataFromEvent and no cardId in requestRenderingEvent');
    return null;
  }
  return {
    type: _bottomSheet.BottomSheetNativeComponentType.AddToWalletComponent,
    props: {
      cardId: cardId,
      customerToken: customerToken
    }
  };
};
const getACHCreditComponentDataFromEvent = event => {
  const accountId = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'account-id');
  const fee = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'fee');
  const initialStageBackButton = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'initial-stage-back-button');
  const finalStageDoneButton = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'final-stage-done-button');
  const withPlaid = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'with-plaid');
  const plaidLinkCustomizationName = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'plaid-link-customization-name');
  const isAutoFocus = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'is-auto-focus');
  const sameDay = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'same-day');
  const plaidAccountFiltersAsString = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'plaid-account-filters');
  const plaidAccountFiltersArray = (0, _shared.parseUNAccountFilters)(plaidAccountFiltersAsString);
  return {
    type: _bottomSheet.BottomSheetNativeComponentType.ACHCreditComponent,
    props: {
      accountId: accountId,
      fee: fee ? parseInt(fee) : undefined,
      initialStageBackButton: initialStageBackButton ? initialStageBackButton === 'true' : undefined,
      finalStageDoneButton: finalStageDoneButton ? finalStageDoneButton === 'true' : undefined,
      withPlaid: withPlaid ? withPlaid === 'true' : undefined,
      plaidAccountFilters: plaidAccountFiltersArray,
      plaidLinkCustomizationName: plaidLinkCustomizationName,
      isAutoFocus: isAutoFocus ? isAutoFocus === 'true' : undefined,
      sameDay: sameDay ? sameDay === 'true' : undefined
    }
  };
};
const getACHDebitComponentDataFromEvent = event => {
  const accountId = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'account-id');
  const fee = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'fee');
  const initialStageBackButton = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'initial-stage-back-button');
  const finalStageDoneButton = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'final-stage-done-button');
  const plaidLinkCustomizationName = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'plaid-link-customization-name');
  const isAutoFocus = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'is-auto-focus');
  const sameDay = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'same-day');
  const plaidAccountFiltersAsString = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'plaid-account-filters');
  const plaidAccountFiltersArray = (0, _shared.parseUNAccountFilters)(plaidAccountFiltersAsString);
  return {
    type: _bottomSheet.BottomSheetNativeComponentType.ACHDebitComponent,
    props: {
      accountId: accountId,
      fee: fee ? parseInt(fee) : undefined,
      initialStageBackButton: initialStageBackButton ? initialStageBackButton === 'true' : undefined,
      finalStageDoneButton: finalStageDoneButton ? finalStageDoneButton === 'true' : undefined,
      plaidAccountFilters: plaidAccountFiltersArray,
      plaidLinkCustomizationName: plaidLinkCustomizationName,
      isAutoFocus: isAutoFocus ? isAutoFocus === 'true' : undefined,
      sameDay: sameDay ? sameDay === 'true' : undefined
    }
  };
};
const getCheckDepositComponentDataFromEvent = event => {
  const accountId = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'account-id');
  const fee = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'fee');
  const initialStageBackButton = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'initial-stage-back-button');
  const finalStageDoneButton = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'final-stage-done-button');
  if (!accountId) {
    console.error('accountId is missing in getCheckDepositComponentDataFromEvent');
    return null;
  }
  return {
    type: _bottomSheet.BottomSheetNativeComponentType.CheckDepositComponent,
    props: {
      accountId: accountId,
      fee: fee ? parseInt(fee) : undefined,
      initialStageBackButton: initialStageBackButton ? initialStageBackButton === 'true' : undefined,
      finalStageDoneButton: finalStageDoneButton ? finalStageDoneButton === 'true' : undefined
    }
  };
};
const getBookPaymentComponentDataFromEvent = event => {
  const accountId = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'account-id');
  const counterPartyAccountId = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'counterparty-account-id');
  const counterPartyName = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'counterparty-name');
  const isSameCustomer = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'is-same-customer');
  const isAutoFocus = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'is-auto-focus');
  const initialStageBackButton = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'initial-stage-back-button');
  const finalStageDoneButton = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'final-stage-done-button');
  return {
    type: _bottomSheet.BottomSheetNativeComponentType.BookPaymentComponent,
    props: {
      accountId: accountId,
      counterPartyAccountId: counterPartyAccountId,
      counterPartyName: counterPartyName,
      isSameCustomer: isSameCustomer ? isSameCustomer === 'true' : undefined,
      isAutoFocus: isAutoFocus ? isAutoFocus === 'true' : undefined,
      initialStageBackButton: initialStageBackButton ? initialStageBackButton === 'true' : undefined,
      finalStageDoneButton: finalStageDoneButton ? finalStageDoneButton === 'true' : undefined
    }
  };
};
const getWirePaymentComponentDataFromEvent = event => {
  const accountId = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'account-id');
  const fee = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'fee');
  const isAutoFocus = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'is-auto-focus');
  const initialStageBackButton = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'initial-stage-back-button');
  const finalStageDoneButton = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'final-stage-done-button');
  if (!accountId) {
    console.error('accountId is missing in getWirePaymentComponentDataFromEvent');
    return null;
  }
  return {
    type: _bottomSheet.BottomSheetNativeComponentType.WirePaymentComponent,
    props: {
      accountId: accountId,
      fee: fee ? parseInt(fee) : undefined,
      isAutoFocus: isAutoFocus ? isAutoFocus === 'true' : undefined,
      initialStageBackButton: initialStageBackButton ? initialStageBackButton === 'true' : undefined,
      finalStageDoneButton: finalStageDoneButton ? finalStageDoneButton === 'true' : undefined
    }
  };
};
const getNativeComponentDataFromEvent = event => {
  let componentData = null;
  let nativePlace = _bottomSheet.BottomSheetNativePlaceType.modal;
  const requestRenderingEventData = event.requestRenderingEvent.data;
  const customerToken = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'customer-token');
  if (!customerToken) {
    console.error('customerToken is missing in getNativeComponentDataFromEvent');
    return null;
  }
  switch (requestRenderingEventData.nativeComponentName) {
    case _webComponent.WebComponentType.cardAction:
      if (requestRenderingEventData.nativeComponent?.includes('action=AddToWallet')) {
        nativePlace = _bottomSheet.BottomSheetNativePlaceType.overFullScreen;
        componentData = getAddToWalletComponentDataFromEvent(event, customerToken);
      }
      break;
    case _webComponent.WebComponentType.achCreditPayment:
      componentData = getACHCreditComponentDataFromEvent(event);
      break;
    case _webComponent.WebComponentType.achDebitPayment:
      componentData = getACHDebitComponentDataFromEvent(event);
      break;
    case _webComponent.WebComponentType.checkDeposit:
      componentData = getCheckDepositComponentDataFromEvent(event);
      break;
    case _webComponent.WebComponentType.bookPayment:
      componentData = getBookPaymentComponentDataFromEvent(event);
      break;
    case _webComponent.WebComponentType.wirePayment:
      componentData = getWirePaymentComponentDataFromEvent(event);
      break;
    default:
      break;
  }
  if (!componentData) {
    return null;
  }
  return {
    component: componentData,
    nativePlace: nativePlace
  };
};
exports.getNativeComponentDataFromEvent = getNativeComponentDataFromEvent;
//# sourceMappingURL=UNBottomSheetComponent.utils.js.map