@kiwicom/smart-faq
Version:
Smart FAQ
180 lines (143 loc) • 9.34 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _style = _interopRequireDefault(require("styled-jsx/style"));
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 _Button = _interopRequireDefault(require("@kiwicom/orbit-components/lib/Button"));
var _Text = _interopRequireDefault(require("@kiwicom/orbit-components/lib/Text"));
var _Heading = _interopRequireDefault(require("@kiwicom/orbit-components/lib/Heading"));
var _Close = _interopRequireDefault(require("@kiwicom/orbit-components/lib/icons/Close"));
var _Translate = _interopRequireDefault(require("@kiwicom/nitro/lib/components/Translate"));
var _context = require("@kiwicom/nitro/lib/services/intl/context");
var _Box = _interopRequireDefault(require("../../../SmartFAQ/common/Box"));
var _CreateCommentMutation = _interopRequireDefault(require("../../../SmartFAQ/mutations/CreateCommentMutation"));
var _screenList = _interopRequireDefault(require("./screenList"));
var _commentTypeList = _interopRequireDefault(require("./commentTypeList"));
var _trackers = require("../../../shared/helpers/analytics/trackers");
var _tracker = require("../../../shared/cuckoo/tracker");
var _commentTypeValues;
var commentTypeValues = (_commentTypeValues = {}, (0, _defineProperty2.default)(_commentTypeValues, _commentTypeList.default.DONT_LIKE, 'DONT_LIKE'), (0, _defineProperty2.default)(_commentTypeValues, _commentTypeList.default.CONFUSING, 'CONFUSING'), (0, _defineProperty2.default)(_commentTypeValues, _commentTypeList.default.NOT_ACCURATE, 'NOT_ACCURATE'), (0, _defineProperty2.default)(_commentTypeValues, _commentTypeList.default.DOESNT_ANSWER, 'DOESNT_ANSWER'), _commentTypeValues);
var style = new String("div.question{margin-top:16px;margin-bottom:4px;}div.inputArea.invalid textarea{border-color:#d21c1c;}div.inputArea p{font-family:'Roboto';font-size:12px;font-weight:400;color:#d21c1c;}div.inputArea textarea{width:100%;height:72px;border-radius:3px;background-color:#ffffff;border:solid 1px #bac7d5;resize:none;}div.inputArea textarea::-webkit-input-placeholder{color:#bac7d5;}div.inputArea textarea::-moz-placeholder{color:#bac7d5;}div.inputArea textarea:-ms-input-placeholder{color:#bac7d5;}div.inputArea textarea::placeholder{color:#bac7d5;}div.button{margin-top:19px;}div.close-icon{position:absolute;top:8px;right:8px;cursor:pointer;}div.inputArea textarea{padding:12px 16px;font-size:14px;}@media only screen and (max-width:901px){div.inputArea textarea{width:100%;}}");
style.__hash = "3623736511";
style.__scoped = "div.question.jsx-2730678398{margin-top:16px;margin-bottom:4px;}div.inputArea.invalid.jsx-2730678398 textarea.jsx-2730678398{border-color:#d21c1c;}div.inputArea.jsx-2730678398 p.jsx-2730678398{font-family:'Roboto';font-size:12px;font-weight:400;color:#d21c1c;}div.inputArea.jsx-2730678398 textarea.jsx-2730678398{width:100%;height:72px;border-radius:3px;background-color:#ffffff;border:solid 1px #bac7d5;resize:none;}div.inputArea.jsx-2730678398 textarea.jsx-2730678398::-webkit-input-placeholder{color:#bac7d5;}div.inputArea.jsx-2730678398 textarea.jsx-2730678398::-moz-placeholder{color:#bac7d5;}div.inputArea.jsx-2730678398 textarea.jsx-2730678398:-ms-input-placeholder{color:#bac7d5;}div.inputArea.jsx-2730678398 textarea.jsx-2730678398::placeholder{color:#bac7d5;}div.button.jsx-2730678398{margin-top:19px;}div.close-icon.jsx-2730678398{position:absolute;top:8px;right:8px;cursor:pointer;}div.inputArea.jsx-2730678398 textarea.jsx-2730678398{padding:12px 16px;font-size:14px;}@media only screen and (max-width:901px){div.inputArea.jsx-2730678398 textarea.jsx-2730678398{width:100%;}}";
style.__scopedHash = "2730678398";
var ScreenAdditionalFeedback =
/*#__PURE__*/
function (_React$Component) {
(0, _inherits2.default)(ScreenAdditionalFeedback, _React$Component);
function ScreenAdditionalFeedback() {
var _getPrototypeOf2;
var _this;
(0, _classCallCheck2.default)(this, ScreenAdditionalFeedback);
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)(ScreenAdditionalFeedback)).call.apply(_getPrototypeOf2, [this].concat(args)));
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "state", {
comment: ''
});
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "handleChange", function (e
/*: SyntheticInputEvent<HTMLInputElement>*/
) {
_this.setState({
comment: e.target.value
});
});
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "handleSubmit", function (e
/*: SyntheticEvent<HTMLFormElement>*/
) {
e.preventDefault();
var _this$props = _this.props,
changeScreen = _this$props.changeScreen,
articleId = _this$props.articleId,
commentType = _this$props.commentType;
var comment = _this.state.comment;
(0, _CreateCommentMutation.default)(articleId, commentTypeValues[commentType], comment, function () {
return changeScreen(_screenList.default.THANK_YOU);
}, function () {
return changeScreen(_screenList.default.COMMENT_LIMIT_REACHED);
}, function () {
return changeScreen(_screenList.default.ERROR);
});
(0, _trackers.simpleTracker)('smartFAQCategories', {
action: 'submitFeedback',
comment: commentType
});
(0, _tracker.track)('FAQs', 'submitFeedback', {
comment: commentType
});
_this.props.clearCommentType();
});
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)), "closeScreen", function () {
_this.props.changeScreen(_screenList.default.VOTING);
_this.props.clearCommentType();
});
return _this;
}
(0, _createClass2.default)(ScreenAdditionalFeedback, [{
key: "render",
value: function render() {
var _this2 = this;
return React.createElement(_Box.default, {
border: "none",
padding: "40px 24px 24px 24px",
borderRadius: "4px",
backgroundColor: "#f5f7f9"
}, React.createElement("form", {
onSubmit: this.handleSubmit,
className: "jsx-".concat(style.__scopedHash)
}, React.createElement("div", {
onClick: this.closeScreen,
onKeyUp: null,
tabIndex: "-1",
role: "button",
className: "jsx-".concat(style.__scopedHash) + " " + "close-icon"
}, React.createElement(_Close.default, {
customColor: "#bac7d5",
size: "small"
})), React.createElement(_Heading.default, {
type: "title3"
}, React.createElement(_Translate.default, {
t: "smartfaq.article_feedback.additional_feedback.title"
})), React.createElement("div", {
className: "jsx-".concat(style.__scopedHash) + " " + "question"
}, React.createElement(_Text.default, null, React.createElement(_Translate.default, {
t: "smartfaq.article_feedback.additional_feedback.subtitle"
}))), React.createElement(_context.Consumer, null, function (intl) {
return React.createElement("div", {
className: "jsx-".concat(style.__scopedHash) + " " + "inputArea"
}, React.createElement("textarea", {
"data-gramm_editor": "false",
onChange: _this2.handleChange,
value: _this2.state.comment,
placeholder: intl.translate("smartfaq.article_feedback.additional_feedback.textarea_placeholder"),
className: "jsx-".concat(style.__scopedHash)
}));
}), React.createElement("div", {
className: "jsx-".concat(style.__scopedHash) + " " + "button"
}, React.createElement(_Button.default, {
submit: true,
onClick: function onClick() {}
}, React.createElement(_Translate.default, {
t: "smartfaq.article_feedback.additional_feedback.submit_button"
})))), React.createElement(_style.default, {
styleId: style.__scopedHash,
css: style.__scoped
}));
}
}]);
return ScreenAdditionalFeedback;
}(React.Component);
var _default = ScreenAdditionalFeedback;
exports.default = _default;