gapp-payment-method-flow/lib/module/gapp/index.js

Mobile Gapp flow for Payment Method

import React, { Children, cloneElement, isValidElement } from 'react';
import useViewModel from './useViewModel';
const PaymentMethodGAppFlow = _ref => {
  let {
    dataLoad,
    dataIn,
    dataOut,
    children
  } = _ref;
  const model = useViewModel({
    dataLoad,
    dataIn,
    dataOut
  });
  const Stack = dataIn === null || dataIn === void 0 ? void 0 : dataIn.StackNavigator;
  const isActiveNavigation = Stack ? Stack : null;

  // list of screen's
  const screens = dataIn === null || dataIn === void 0 ? void 0 : dataIn.screens;

  /**
   * assigning dataLoad, dataIn, dataOut per mini-apps
   * @param child any - child of GApp wrapper
   * @param index number - index of GApp child
   * @returns ReactElement - react element(mini-app) that has a modified dataIn, dataLoad, and dataOut
   */
  const modifyChildrens = (child, index) => {
    if ( /*#__PURE__*/isValidElement(child)) {
      var _mAppProps, _mAppProps3, _mAppProps5;
      // mini-app index
      const mAppIndex = index || 0;
      const screen = screens === null || screens === void 0 ? void 0 : screens[mAppIndex];

      // mini-app key based on mini-app-key or screen-key
      const mAppScreenKey = (child === null || child === void 0 ? void 0 : child.key) || (screen === null || screen === void 0 ? void 0 : screen.key);

      // this will be the props of your children
      let mAppProps = child.props;
      const dataInProps = (_mAppProps = mAppProps) === null || _mAppProps === void 0 ? void 0 : _mAppProps.dataLoad;

      // if child element has dataLoad props
      if (dataInProps !== undefined) {
        var _model$mAppScreenKey, _mAppProps2;
        // data of GApp internal dataLoad (view model)
        const internalDataLoad = (_model$mAppScreenKey = model[mAppScreenKey]) === null || _model$mAppScreenKey === void 0 ? void 0 : _model$mAppScreenKey.dataLoad;
        // data of screen dataLoad
        const screenDataLoad = screen === null || screen === void 0 ? void 0 : screen.dataLoad;
        mAppProps = {
          ...mAppProps,
          dataLoad: Array.isArray(internalDataLoad) ? screenDataLoad || internalDataLoad || dataInProps : {
            ...((_mAppProps2 = mAppProps) === null || _mAppProps2 === void 0 ? void 0 : _mAppProps2.dataLoad),
            ...internalDataLoad,
            ...screenDataLoad
          }
        };
      }

      // if child element has dataIn props
      if (((_mAppProps3 = mAppProps) === null || _mAppProps3 === void 0 ? void 0 : _mAppProps3.dataIn) !== undefined) {
        var _model$mAppScreenKey2, _mAppProps4;
        // data of GApp internal dataIn (view model)
        const internalDataIn = (_model$mAppScreenKey2 = model[mAppScreenKey]) === null || _model$mAppScreenKey2 === void 0 ? void 0 : _model$mAppScreenKey2.dataIn;

        // data of screen dataIn
        const screenDataIn = (screen === null || screen === void 0 ? void 0 : screen.dataIn) || {};
        mAppProps = {
          ...mAppProps,
          dataIn: {
            ...((_mAppProps4 = mAppProps) === null || _mAppProps4 === void 0 ? void 0 : _mAppProps4.dataIn),
            ...internalDataIn,
            ...screenDataIn
          }
        };
      }

      // if child element has dataOut props
      if (((_mAppProps5 = mAppProps) === null || _mAppProps5 === void 0 ? void 0 : _mAppProps5.dataOut) !== undefined) {
        var _model$mAppScreenKey3;
        // dataOut of GApp internal dataOut (view model)
        const internalDataOut = (_model$mAppScreenKey3 = model[mAppScreenKey]) === null || _model$mAppScreenKey3 === void 0 ? void 0 : _model$mAppScreenKey3.dataOut;
        mAppProps = {
          ...mAppProps,
          dataOut: (screen === null || screen === void 0 ? void 0 : screen.dataOut) || internalDataOut || mAppProps.dataOut
        };
      }
      if (isActiveNavigation) {
        return modifyChildElement({
          child,
          mAppProps,
          screen
        });
      }
      return /*#__PURE__*/cloneElement(child, mAppProps);
    } else {
      return child;
    }
  };
  const modifyChildElement = _ref2 => {
    let {
      child,
      mAppProps,
      screen
    } = _ref2;
    return /*#__PURE__*/React.createElement(Stack.Screen, {
      name: screen.stackName,
      options: screen.stackOptions
    }, stackProps => /*#__PURE__*/cloneElement(child, Object.assign(stackProps, mAppProps)));
  };
  const modifyAllChildrens = () => {
    if (isActiveNavigation) {
      return /*#__PURE__*/React.createElement(Stack.Navigator, {
        initialRouteName: dataIn.initialRouteName
      }, Children.map(children, modifyChildrens));
    } else {
      return Children.map(children, modifyChildrens);
    }
  };
  return modifyAllChildrens();
};
export default PaymentMethodGAppFlow;
//# sourceMappingURL=index.js.map