@kiwicom/smart-faq/lib/shared/GuaranteeChat/GuaranteeChatWrapper.js

Smart FAQ

"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.GuaranteeChatWrapperRaw = void 0;

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));

var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));

var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));

var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));

var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));

var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));

var _getPrototypeOf3 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));

var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));

var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));

var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));

var React = _interopRequireWildcard(require("react"));

var _classnames = _interopRequireDefault(require("classnames"));

var _reactRouterDom = require("react-router-dom");

var _context2 = require("@kiwicom/nitro/lib/services/intl/context");

var chatUtils = _interopRequireWildcard(require("./utils"));

var _trackers = require("../helpers/analytics/trackers");

var _GuaranteeChatInfo = require("../context/GuaranteeChatInfo");

var _tracker = require("../cuckoo/tracker");

// @flow
var GuaranteeChatWrapper =
/*#__PURE__*/
function (_React$Component) {
  (0, _inherits2.default)(GuaranteeChatWrapper, _React$Component);

  function GuaranteeChatWrapper() {
    var _getPrototypeOf2;

    var _this;

    (0, _classCallCheck2.default)(this, GuaranteeChatWrapper);

    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    _this = (0, _possibleConstructorReturn2.default)(this, (_getPrototypeOf2 = (0, _getPrototypeOf3.default)(GuaranteeChatWrapper)).call.apply(_getPrototypeOf2, [this].concat(args)));
    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "chatContainer", void 0);
    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "state", {
      showButton: true,
      isChatReady: false
    });
    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "onClickDisplayChat", function () {
      _this.setState({
        showButton: false
      });

      if (!window.webchat) {
        throw new Error('Unexpected: webchat not initialized.');
      }

      var guaranteeChatBookingInfo = _this.props.guaranteeChatBookingInfo;
      chatUtils.setData(window.webchat, guaranteeChatBookingInfo);
      (0, _trackers.simpleTracker)('smartFAQBookingOverview', {
        action: 'chatOpened',
        where: _this.props.eventSource
      });
      (0, _tracker.track)('GuaranteeChat', 'chatOpened', {
        where: _this.props.eventSource
      });
      window.webchat.renderFrame({
        containerEl: _this.props.elementId
      });

      _this.props.toggleIsChatActive(true);
    });
    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "onChatEnded", function () {
      _this.props.toggleIsChatActive(false);
    });
    return _this;
  }

  (0, _createClass2.default)(GuaranteeChatWrapper, [{
    key: "componentDidMount",
    value: function () {
      var _componentDidMount = (0, _asyncToGenerator2.default)(
      /*#__PURE__*/
      _regenerator.default.mark(function _callee() {
        var _this$props, chatConfig, elementId;

        return _regenerator.default.wrap(function _callee$(_context) {
          while (1) {
            switch (_context.prev = _context.next) {
              case 0:
                if (!((typeof window === "undefined" ? "undefined" : (0, _typeof2.default)(window)) !== 'object')) {
                  _context.next = 2;
                  break;
                }

                return _context.abrupt("return");

              case 2:
                _this$props = this.props, chatConfig = _this$props.chatConfig, elementId = _this$props.elementId;
                _context.next = 5;
                return chatUtils.initialize(chatConfig, elementId);

              case 5:
                window.webchat.chatEnded = this.onChatEnded; // eslint-disable-next-line react/no-did-mount-set-state

                this.setState({
                  isChatReady: true
                });

                if (window.webchat.isAutoJoined()) {
                  this.props.toggleIsChatActive(true); // eslint-disable-next-line react/no-did-mount-set-state

                  this.setState({
                    showButton: false
                  });
                }

              case 8:
              case "end":
                return _context.stop();
            }
          }
        }, _callee, this);
      }));

      return function componentDidMount() {
        return _componentDidMount.apply(this, arguments);
      };
    }()
  }, {
    key: "componentWillUnmount",
    value: function componentWillUnmount() {
      this.props.toggleIsChatActive(false);
    }
  }, {
    key: "render",
    value: function render() {
      var _this2 = this;

      var _this$state = this.state,
          showButton = _this$state.showButton,
          isChatReady = _this$state.isChatReady;
      var isChatActive = this.props.isChatActive;
      return React.createElement(React.Fragment, null, showButton && this.props.children({
        isChatReady: isChatReady,
        onClickDisplayChat: this.onClickDisplayChat
      }), React.createElement("div", {
        id: this.props.elementId,
        ref: function ref(c) {
          _this2.chatContainer = c;
        },
        className: (0, _classnames.default)('guaranteeChat', {
          open: !showButton
        }),
        "data-cy": "guaranteeChatIFrame"
      }), this.props.withPrompt && React.createElement(_context2.Consumer, null, function (intl) {
        return React.createElement(_reactRouterDom.Prompt, {
          when: isChatActive,
          message: intl.translate("smartfaq.guarantee_chat.confirmation")
        });
      }), React.createElement("style", {
        jsx: true
      }, "\n            .guaranteeChat.open {\n              height: 500px;\n            }\n          "));
    }
  }]);
  return GuaranteeChatWrapper;
}(React.Component);

var GuaranteeChatWrapperRaw = GuaranteeChatWrapper;
exports.GuaranteeChatWrapperRaw = GuaranteeChatWrapperRaw;

var WrappedGuaranteeChat = function WrappedGuaranteeChat(props
/*: ContainerProps*/
) {
  return React.createElement(_GuaranteeChatInfo.GuaranteeChatContext.Consumer, null, function (_ref) {
    var guaranteeChatBookingInfo = _ref.guaranteeChatBookingInfo,
        chatConfig = _ref.chatConfig,
        isChatActive = _ref.isChatActive,
        toggleIsChatActive = _ref.toggleIsChatActive;
    return React.createElement(GuaranteeChatWrapper, (0, _extends2.default)({}, props, {
      guaranteeChatBookingInfo: guaranteeChatBookingInfo,
      chatConfig: chatConfig,
      isChatActive: isChatActive,
      toggleIsChatActive: toggleIsChatActive
    }));
  });
};

var _default = WrappedGuaranteeChat;
exports.default = _default;