react-native-unit-components/lib/module/components/UNCreateCardComponent/UNCreateCardComponent.js

Unit React Native components

import React, { useState } from 'react';
import { UNBaseView } from '../../nativeComponents/UNBaseView';
import { WebComponent } from '../../webComponent/WebComponent';
import { PresentationMode, WebComponentType } from '../../types/internal/webComponent.types';
import { withReduxStore } from '../../helpers/store/helpers';
import { getCreateCardParams } from './UNCreateCardComponent.utils';
import { PageMessage } from '../../messages/webMessages/pageMessage';
import { UnitComponentsMessage } from '../../messages/webMessages/unitComponentsMessages';
import { RESPONSE_KEYS } from '../../messages/webMessages/onLoadMessage';
import { CardMessage } from '../../messages/webMessages/cardMessage';
import { useDispatch } from 'react-redux';
import { setEvent } from '../../slices/SharedEventsSlice';
const UNCreateCardComponent = props => {
  const dispatch = useDispatch();
  const [height, setHeight] = useState(0);
  const [presentationMode, setPresentationMode] = useState(PresentationMode.Inherit);
  const handleUnitOnLoad = response => {
    if (!props.onLoad) {
      return;
    }
    if (RESPONSE_KEYS.errors in response) {
      props.onLoad(response);
      return;
    }
    if (RESPONSE_KEYS.createCardResult in response) {
      const createCardResponse = response[RESPONSE_KEYS.createCardResult];
      props.onLoad(createCardResponse);
      return;
    }
    console.error('On Load Error: unexpected response type.');
    return;
  };
  const handleWebViewMessage = message => {
    if (!message || !message.details) return;
    switch (message.type) {
      case UnitComponentsMessage.UNIT_ON_LOAD:
        handleUnitOnLoad(message.details);
        break;
      case PageMessage.PAGE_HEIGHT:
        {
          const currentHeight = message.details.height;
          setHeight(currentHeight);
          if (presentationMode === PresentationMode.Inherit && currentHeight === 0) {
            setPresentationMode(PresentationMode.Default);
          }
          break;
        }
      case CardMessage.CARD_CREATED:
        dispatch(setEvent({
          key: CardMessage.CARD_CREATED,
          data: message.details
        }));
        props.onCardCreated && props.onCardCreated(message.details);
        break;
    }
  };
  const style = presentationMode === PresentationMode.Inherit ? {
    flex: 1
  } : {
    height: height
  };
  return /*#__PURE__*/React.createElement(UNBaseView, {
    style: style,
    onLoadError: handleUnitOnLoad,
    fallback: /*#__PURE__*/React.createElement(React.Fragment, null)
  }, /*#__PURE__*/React.createElement(WebComponent, {
    type: WebComponentType.createCard,
    presentationMode: PresentationMode.Inherit,
    params: getCreateCardParams(props),
    onMessage: message => handleWebViewMessage(message),
    theme: props.theme,
    language: props.language
  }));
};
export default withReduxStore(UNCreateCardComponent);
//# sourceMappingURL=UNCreateCardComponent.js.map