@kiwicom/smart-faq/lib/SmartFAQApp.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 = void 0;

var _style = _interopRequireDefault(require("styled-jsx/style"));

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

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

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

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

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

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"));

require("url-search-params-polyfill");

var _styledComponents = require("styled-components");

var _reactEventListener = _interopRequireWildcard(require("react-event-listener"));

var _InitIntl = _interopRequireDefault(require("@kiwicom/nitro/lib/components/InitIntl"));

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

var _orbitDesignTokens = require("@kiwicom/orbit-design-tokens");

var _Theme = require("@kiwicom/nitro/lib/records/Theme");

var _Routes = _interopRequireDefault(require("./SmartFAQ/Routes"));

var _Close = require("./SmartFAQ/context/Close");

var _Language = require("./SmartFAQ/context/Language");

var _User = require("./SmartFAQ/context/User");

var _BookingState = _interopRequireDefault(require("./SmartFAQ/context/BookingState"));

var _SearchState = _interopRequireDefault(require("./SmartFAQ/context/SearchState"));

var _SelectedBooking = _interopRequireDefault(require("./SmartFAQ/context/SelectedBooking"));

var _ExtraInfoState = _interopRequireDefault(require("./SmartFAQ/context/ExtraInfoState"));

var _Emergencies = _interopRequireDefault(require("./SmartFAQ/context/Emergencies"));

var _ErrorBoundary = _interopRequireDefault(require("./SmartFAQ/common/ErrorBoundary"));

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

var _MobileSafariScroll = _interopRequireDefault(require("./SmartFAQ/helpers/MobileSafariScroll"));

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

var _langInfos = require("./translations/langInfos");

var _enKeys = _interopRequireDefault(require("./translations/enKeys.json"));

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

// @flow

/* eslint-disable jsx-a11y/no-static-element-interactions */
var style = new String(".smartFAQ{display:none;position:fixed;min-width:480px;top:0;bottom:0;right:0;background-color:#fff;font-family:'Roboto',sans-serif;}.smartFAQ.open{display:block;}.smartFAQ *{box-sizing:border-box;font-family:'Roboto',sans-serif;}@media only screen and (max-width:901px){.smartFAQ{min-width:100%;}}");
style.__hash = "3449904117";
style.__scoped = ".smartFAQ.jsx-2556846004{display:none;position:fixed;min-width:480px;top:0;bottom:0;right:0;background-color:#fff;font-family:'Roboto',sans-serif;}.smartFAQ.open.jsx-2556846004{display:block;}.smartFAQ.jsx-2556846004 *.jsx-2556846004{box-sizing:border-box;font-family:'Roboto',sans-serif;}@media only screen and (max-width:901px){.smartFAQ.jsx-2556846004{min-width:100%;}}";
style.__scopedHash = "2556846004";
/*:: type State = {|
  userContext: UserContextType,
|};*/

var SmartFAQApp =
/*#__PURE__*/
function (_React$PureComponent) {
  (0, _inherits2.default)(SmartFAQApp, _React$PureComponent);
  (0, _createClass2.default)(SmartFAQApp, null, [{
    key: "getDerivedStateFromProps",
    value: function getDerivedStateFromProps(nextProps
    /*: SmartFAQProps*/
    ) {
      if (nextProps.cuckoo) {
        (0, _tracker.setTracker)(nextProps.cuckoo);
      }

      return {
        userContext: {
          user: nextProps.user,
          onLogin: nextProps.onLogin,
          onLogout: nextProps.onLogout,
          loginToken: nextProps.loginToken,
          simpleToken: nextProps.simpleToken,
          kwAuthToken: nextProps.kwAuthToken,
          brand: nextProps.brand
        }
      };
    }
  }]);

  function SmartFAQApp(props
  /*: SmartFAQProps*/
  ) {
    var _this;

    (0, _classCallCheck2.default)(this, SmartFAQApp);
    _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(SmartFAQApp).call(this, props));
    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "onKeyDown", function (e
    /*: KeyboardEvent*/
    ) {
      // $FlowExpectedError: I know "noInputFocus" property doesn't exist...
      e.noInputFocus = true;
    });
    _this.state = {
      userContext: {
        user: props.user,
        onLogin: props.onLogin,
        onLogout: props.onLogout,
        loginToken: props.loginToken,
        simpleToken: props.simpleToken,
        kwAuthToken: props.kwAuthToken,
        brand: props.brand
      }
    };

    if (props.cuckoo) {
      (0, _tracker.setTracker)(props.cuckoo);
    }

    return _this;
  }

  (0, _createClass2.default)(SmartFAQApp, [{
    key: "renderApp",
    value: function renderApp() {
      var _this2 = this;

      var _this$props = this.props,
          route = _this$props.route,
          emergencies = _this$props.emergencies,
          language = _this$props.language,
          brandConfig = _this$props.brandConfig;
      var isOpen = Boolean(route);
      var langInfo = _langInfos.langInfos[language];
      var translations = this.props.translations ? this.props.translations : _enKeys.default;
      var isRtl = this.props.direction === 'rtl';
      var intl = {
        language: langInfo,
        translations: translations
      };
      var theme = (0, _Theme.getBrandTheme)(brandConfig, isRtl);
      return React.createElement("div", {
        "data-test": "SmartFAQHelp",
        className: _style.default.dynamic([["1772301477", [isOpen ? 'hidden' : 'auto']]]) + " " + ((0, _classnames.default)('smartFAQ', {
          open: isOpen
        }) || "")
      }, React.createElement("meta", {
        name: "viewport",
        content: "width=device-width, initial-scale=1 shrink-to-fit=no",
        className: _style.default.dynamic([["1772301477", [isOpen ? 'hidden' : 'auto']]])
      }), React.createElement("meta", {
        httpEquiv: "X-UA-Compatible",
        content: "IE=edge",
        className: _style.default.dynamic([["1772301477", [isOpen ? 'hidden' : 'auto']]])
      }), React.createElement("link", {
        href: "https://fonts.googleapis.com/css?family=Roboto",
        rel: "stylesheet",
        className: _style.default.dynamic([["1772301477", [isOpen ? 'hidden' : 'auto']]])
      }), React.createElement(_ErrorBoundary.default, null, React.createElement(_styledComponents.ThemeProvider, {
        theme: (0, _objectSpread2.default)({}, theme || _orbitDesignTokens.defaultTokens)
      }, React.createElement(_InitIntl.default, {
        raw: intl
      }, function (intl) {
        return React.createElement(intlContext.Provider, {
          value: intl
        }, React.createElement(_Language.LanguageContext.Provider, {
          value: language
        }, React.createElement(_Close.CloseContext.Provider, {
          value: _this2.props.onClose
        }, React.createElement(_User.UserContext.Provider, {
          value: _this2.state.userContext
        }, React.createElement(_SearchState.default, null, React.createElement(_Emergencies.default.Provider, {
          value: emergencies
        }, React.createElement(_SelectedBooking.default, {
          bid: _this2.props.bid
        }, React.createElement(_BookingState.default, {
          onLogout: _this2.props.onLogout,
          showBooking: _this2.props.showBooking
        }, React.createElement(_ExtraInfoState.default, null, React.createElement(_GuaranteeChatInfo.default, {
          isChatActive: _this2.props.isChatActive,
          enableChat: _this2.props.enableChat,
          chatConfig: _this2.props.chatConfig,
          onToggleIsClosable: _this2.props.onToggleIsClosable
        }, isOpen && route && React.createElement(_reactEventListener.default, {
          target: "window",
          onKeydown: (0, _reactEventListener.withOptions)(_this2.onKeyDown, {
            capture: true
          })
        }, React.createElement(_Routes.default, {
          route: route
        }))))))))))));
      }))), React.createElement(_style.default, {
        styleId: style.__hash,
        css: style
      }), React.createElement(_style.default, {
        styleId: "1772301477",
        css: "body{overflow-y:".concat(isOpen ? 'hidden' : 'auto', ";}"),
        dynamic: [isOpen ? 'hidden' : 'auto']
      }), React.createElement(_MobileSafariScroll.default, {
        isOpen: isOpen
      }));
    }
  }, {
    key: "render",
    value: function render() {
      var _this3 = this;

      if (typeof window !== 'undefined' && window.Raven) {
        return window.Raven.context(function () {
          return _this3.renderApp();
        });
      }

      return this.renderApp();
    }
  }]);
  return SmartFAQApp;
}(React.PureComponent);

var isLoggedIn = function isLoggedIn(props) {
  return !!props.user || !!props.simpleToken || !!props.kwAuthToken;
};

var LogladyTrackedApp = (0, _trackers.LogladyTracker)(SmartFAQApp, 'Smart FAQ', 'clickOnHelp', function (props) {
  return {
    loggedIn: isLoggedIn(props)
  };
});
var EnterTrackedApp = (0, _trackers.EnterTracker)(LogladyTrackedApp, 'smartFAQ', function (props) {
  return {
    action: 'clickOnHelp',
    loggedIn: isLoggedIn(props)
  };
});
var LogladyTimeTrackedApp = (0, _trackers.LogladyTimeTracker)(EnterTrackedApp, 'Smart FAQ', 'clickOnHelp', function (props) {
  return {
    loggedIn: isLoggedIn(props)
  };
});
var TimeTrackedApp = (0, _trackers.TimeTracker)(LogladyTimeTrackedApp, 'smartFAQ', function (props) {
  return {
    action: 'close',
    loggedIn: isLoggedIn(props)
  };
});

if (typeof window !== 'undefined') {
  window.SmartFAQApp = TimeTrackedApp;
}

var _default = TimeTrackedApp;
exports.default = _default;