react-native-unit-components
Version:
Unit React Native components
162 lines • 6.27 kB
JavaScript
import { LISTENERS } from './../../scripts/html/bodyScript';
import { webViewId } from '../../scripts/html/bodyHtml';
import { BottomSheetNativeComponentType, BottomSheetNativePlaceType } from '../../types/internal/bottomSheet.types';
import { WebComponentType } from '../../types/internal/webComponent.types';
export const getBottomSheetScript = () => {
return LISTENERS.requestRefresh;
};
export const renderingBottomSheetRequest = (currentWebView, renderingRequest) => {
currentWebView?.injectJavaScript(`
document.activeElement && document.activeElement.blur();
dispatchRenderingEvent('${JSON.stringify(renderingRequest.data)}');
`);
};
export const resetHtml = currentWebView => {
currentWebView?.injectJavaScript(`
document.activeElement && document.activeElement.blur();
document.getElementById('${webViewId}').style.height = null;
`);
};
export const injectHtmlFullScreenHeight = (currentWebView, bottomSheetHeight) => {
currentWebView && currentWebView?.injectJavaScript(`
document.getElementById('${webViewId}').style.height = '${bottomSheetHeight}px';
`);
};
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: BottomSheetNativeComponentType.AddToWalletComponent,
props: {
cardId: cardId,
customerToken: customerToken
}
};
};
const getACHCreditComponentDataFromEvent = (event, customerToken) => {
const accountId = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'account-id');
if (!accountId) {
console.error('accountId is missing in getACHCreditComponentDataFromEvent');
return null;
}
return {
type: BottomSheetNativeComponentType.ACHCreditComponent,
props: {
accountId: accountId,
customerToken: customerToken
}
};
};
const getACHDebitComponentDataFromEvent = (event, customerToken) => {
const accountId = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'account-id');
if (!accountId) {
console.error('accountId is missing in getACHDebitComponentDataFromEvent');
return null;
}
return {
type: BottomSheetNativeComponentType.ACHDebitComponent,
props: {
accountId: accountId,
customerToken: customerToken
}
};
};
const getCheckDepositComponentDataFromEvent = (event, customerToken) => {
const accountId = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'account-id');
const fee = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'fee');
if (!accountId || !fee) {
console.error('accountId or fee is missing in getCheckDepositComponentDataFromEvent');
return null;
}
return {
type: BottomSheetNativeComponentType.CheckDepositComponent,
props: {
accountId: accountId,
fee: parseInt(fee),
customerToken: customerToken
}
};
};
const getBookPaymentComponentDataFromEvent = (event, customerToken) => {
const accountId = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'account-id');
const counterPartyAccountId = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'counterparty-account-id');
const counterPartyName = extractValueFromRequestRenderingEvent(event.requestRenderingEvent, 'counterparty-name');
if (!accountId) {
console.error('accountId is missing in getBookPaymentComponentDataFromEvent');
return null;
}
return {
type: BottomSheetNativeComponentType.BookPaymentComponent,
props: {
accountId: accountId,
counterPartyAccountId: counterPartyAccountId,
counterPartyName: counterPartyName,
customerToken: customerToken
}
};
};
export const getNativeComponentDataFromEvent = event => {
let componentData = null;
let nativePlace = 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 WebComponentType.cardAction:
if (requestRenderingEventData.nativeComponent?.includes('action=AddToWallet')) {
nativePlace = BottomSheetNativePlaceType.overFullScreen;
componentData = getAddToWalletComponentDataFromEvent(event, customerToken);
}
break;
case WebComponentType.achCreditPayment:
componentData = getACHCreditComponentDataFromEvent(event, customerToken);
break;
case WebComponentType.achDebitPayment:
componentData = getACHDebitComponentDataFromEvent(event, customerToken);
break;
case WebComponentType.checkDeposit:
componentData = getCheckDepositComponentDataFromEvent(event, customerToken);
break;
case WebComponentType.bookPayment:
componentData = getBookPaymentComponentDataFromEvent(event, customerToken);
break;
default:
break;
}
if (!componentData) {
return null;
}
return {
component: componentData,
nativePlace: nativePlace
};
};
//# sourceMappingURL=UNBottomSheetComponent.utils.js.map