UNPKG

@kiwicom/smart-faq

Version:
200 lines (160 loc) 9.63 kB
"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.GUARANTEE_ARTICLE_ID = void 0; var _style = _interopRequireDefault(require("styled-jsx/style")); var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")); 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 _reactRouterDom = require("react-router-dom"); var _Text = _interopRequireDefault(require("@kiwicom/orbit-components/lib/Text")); var _Heading = _interopRequireDefault(require("@kiwicom/orbit-components/lib/Heading")); var _reactRelay = require("react-relay"); var _idx = _interopRequireDefault(require("idx")); var _User = require("../../context/User"); var _Markdown = _interopRequireDefault(require("../../common/Markdown")); var _GuaranteeChat = _interopRequireDefault(require("./GuaranteeChat")); var _FAQArticleFeedback = _interopRequireDefault(require("../ArticleFeedback/FAQArticleFeedback")); var _trackers = require("../../helpers/analytics/trackers"); var _GuaranteeChatInfo = require("../../context/GuaranteeChatInfo"); // @flow var GUARANTEE_ARTICLE_ID = 'RkFRQXJ0aWNsZToxNDY='; /*:: type Props = { article: ArticleContent_article, showGuaranteeChat: boolean, };*/ exports.GUARANTEE_ARTICLE_ID = GUARANTEE_ARTICLE_ID; var globalStyle = new String(".faq-article-text ul{padding-left:43px;list-style:none;}.faq-article-text ul,.faq-article-text ol{margin-left:20px;padding-bottom:20px;margin-bottom:10px;}.faq-article-text li:before{content:'';display:inline-block;margin-right:19px;width:6px;height:6px;margin-bottom:2px;}.faq-article-text ul li:before{background-color:#d5dee7;}.faq-article-text a{color:#00ad98;-webkit-text-decoration:none;text-decoration:none;}.faq-article-text img{width:100%;height:auto;object-fit:contain;}.faq-article-text li{display:list-item;padding-top:10px;text-indent:-25px;}.faq-article-text li,.faq-article-text div{font-size:14px;font-weight:400;line-height:22px;}"); globalStyle.__hash = "3138325620"; globalStyle.__scoped = ".faq-article-text.jsx-302682421 ul.jsx-302682421{padding-left:43px;list-style:none;}.faq-article-text.jsx-302682421 ul.jsx-302682421,.faq-article-text.jsx-302682421 ol.jsx-302682421{margin-left:20px;padding-bottom:20px;margin-bottom:10px;}.faq-article-text.jsx-302682421 li.jsx-302682421:before{content:'';display:inline-block;margin-right:19px;width:6px;height:6px;margin-bottom:2px;}.faq-article-text.jsx-302682421 ul.jsx-302682421 li.jsx-302682421:before{background-color:#d5dee7;}.faq-article-text.jsx-302682421 a.jsx-302682421{color:#00ad98;-webkit-text-decoration:none;text-decoration:none;}.faq-article-text.jsx-302682421 img.jsx-302682421{width:100%;height:auto;object-fit:contain;}.faq-article-text.jsx-302682421 li.jsx-302682421{display:list-item;padding-top:10px;text-indent:-25px;}.faq-article-text.jsx-302682421 li.jsx-302682421,.faq-article-text.jsx-302682421 div.jsx-302682421{font-size:14px;font-weight:400;line-height:22px;}"; globalStyle.__scopedHash = "302682421"; var ArticleContent = /*#__PURE__*/ function (_React$Component) { (0, _inherits2.default)(ArticleContent, _React$Component); function ArticleContent() { var _getPrototypeOf2; var _this; (0, _classCallCheck2.default)(this, ArticleContent); 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)(ArticleContent)).call.apply(_getPrototypeOf2, [this].concat(args))); (0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "renderArticle", function (isLoggedIn) { var _this$props = _this.props, article = _this$props.article, showGuaranteeChat = _this$props.showGuaranteeChat; return React.createElement("div", { "data-cy": "faq-article-content", className: _style.default.dynamic([["891091513", [isLoggedIn ? '40px 72px 40px 80px' : '40px 36px']]]) + " " + "faq-article-content" }, React.createElement(_Heading.default, { type: "title2" }, article.title), React.createElement("div", { className: _style.default.dynamic([["891091513", [isLoggedIn ? '40px 72px 40px 80px' : '40px 36px']]]) + " " + "faq-article-perex" }, React.createElement(_Text.default, { type: "attention", weight: "bold", element: "span" }, "Summary:"), React.createElement(_Text.default, { element: "span" }, " ", article.perex)), React.createElement("hr", { className: _style.default.dynamic([["891091513", [isLoggedIn ? '40px 72px 40px 80px' : '40px 36px']]]) + " " + "faq-article-delimiter" }), React.createElement("div", { className: _style.default.dynamic([["891091513", [isLoggedIn ? '40px 72px 40px 80px' : '40px 36px']]]) + " " + "faq-article-text" }, React.createElement(_Markdown.default, null, article.content)), showGuaranteeChat && React.createElement(_GuaranteeChat.default, null), React.createElement("hr", { className: _style.default.dynamic([["891091513", [isLoggedIn ? '40px 72px 40px 80px' : '40px 36px']]]) + " " + "faq-article-delimiter" }), React.createElement(_FAQArticleFeedback.default, { articleId: article.id }), React.createElement(_style.default, { styleId: "891091513", css: ".faq-article-content.__jsx-style-dynamic-selector{padding:".concat(isLoggedIn ? '40px 72px 40px 80px' : '40px 36px', ";}.faq-article-perex.__jsx-style-dynamic-selector{padding:24px 0;line-height:20px;}.faq-article-delimiter.__jsx-style-dynamic-selector{border:0;height:1px;background-color:#e8edf1;margin:0;}.faq-article-text.__jsx-style-dynamic-selector{padding:24px 0;}@media only screen and (max-width:901px){.faq-article-content.__jsx-style-dynamic-selector{padding:16px;padding-top:0;}}"), dynamic: [isLoggedIn ? '40px 72px 40px 80px' : '40px 36px'] }), React.createElement(_style.default, { styleId: globalStyle.__hash, css: globalStyle })); }); return _this; } (0, _createClass2.default)(ArticleContent, [{ key: "render", value: function render() { var _this2 = this; return React.createElement(_User.UserContext.Consumer, null, function (_ref) { var user = _ref.user; return _this2.renderArticle(Boolean(user)); }); } }]); return ArticleContent; }(React.Component); var EnterTrackedDetail = (0, _trackers.EnterTracker)(ArticleContent, 'smartFAQCategories', function (props /*: Props*/ ) { return { action: 'clickOnArticle', articleId: (0, _idx.default)(props.article, function (_) { return _.id; }) || '', articleName: (0, _idx.default)(props.article, function (_) { return _.title; }) || '' }; }); var TimeTrackedDetail = (0, _trackers.TimeTracker)(EnterTrackedDetail, 'smartFAQCategories', function (props /*: Props*/ ) { return { action: 'articleClose', articleId: (0, _idx.default)(props.article, function (_) { return _.id; }) || '', articleName: (0, _idx.default)(props.article, function (_) { return _.title; }) || '' }; }); /*:: type ContainerProps = { match: { params: { articleId: string, categoryId: string, [key: string]: ?string, }, }, };*/ var WrappedArticle = function WrappedArticle(props /*: Props & ContainerProps*/ ) { return React.createElement(_GuaranteeChatInfo.GuaranteeChatInfoState.Consumer, null, function (_ref2) { var showGuaranteeChat = _ref2.showGuaranteeChat; // show Guarantee Chat only in Guarantee article var articleId = (0, _idx.default)(props.match, function (_) { return _.params.articleId; }); var isInGuaranteeArticle = articleId === GUARANTEE_ARTICLE_ID; var forceGuaranteeChat = typeof window !== 'undefined' && window.GuaranteeChatForce; return React.createElement(TimeTrackedDetail, (0, _extends2.default)({ showGuaranteeChat: (showGuaranteeChat || forceGuaranteeChat) && isInGuaranteeArticle }, props)); }); }; var _default = (0, _reactRelay.createFragmentContainer)((0, _reactRouterDom.withRouter)(WrappedArticle), { article: function article() { var node = require("./__generated__/ArticleContent_article.graphql"); if (node.hash && node.hash !== "c5c3622ca8d9a9b3677fa3d24f7f5eba") { console.error("The definition of 'ArticleContent_article' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."); } return require("./__generated__/ArticleContent_article.graphql"); } }); exports.default = _default;