@botonic/react
Version:
Build Chatbots using React
44 lines • 2.48 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_runtime_1 = require("react/jsx-runtime");
const core_1 = require("@botonic/core");
const react_1 = require("react");
const styled_components_1 = require("styled-components");
const components_1 = require("../../../components");
const context_1 = require("../../context");
const rating_selector_1 = require("./rating-selector");
const styles_1 = require("./styles");
const CustomRatingMessage = props => {
var _a, _b;
const { payloads, messageText, buttonText, ratingType, id, valueSent } = props;
const { updateCustomMessageProps, sendInput } = (0, react_1.useContext)(context_1.WebchatContext);
const theme = (0, react_1.useContext)(styled_components_1.ThemeContext);
const color = (_b = (_a = theme === null || theme === void 0 ? void 0 : theme.brand) === null || _a === void 0 ? void 0 : _a.color) !== null && _b !== void 0 ? _b : '';
const [ratingValue, setRatingValue] = (0, react_1.useState)(valueSent ? valueSent : -1);
const [showRating, setShowRating] = (0, react_1.useState)(true);
const ratingChanged = (newRating) => {
setRatingValue(newRating);
};
const handleButtonSend = () => {
if (ratingValue === -1)
return;
const json = {
valueSent: ratingValue,
};
updateCustomMessageProps(json, id);
setShowRating(false);
const payload = payloads[ratingValue - 1];
const input = {
type: core_1.INPUT.POSTBACK,
payload,
};
void sendInput(input);
};
const disabled = ratingValue === -1;
return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: 'rating-message-container' }, { children: [(0, jsx_runtime_1.jsxs)(styles_1.MessageBubble, Object.assign({ className: 'rating-message-bubble' }, { children: [messageText, (0, jsx_runtime_1.jsx)(rating_selector_1.RatingSelector, { color: color, onRatingChange: ratingChanged, ratingValue: ratingValue, ratingType: ratingType, valueSent: valueSent })] })), !(props === null || props === void 0 ? void 0 : props.valueSent) && showRating && ((0, jsx_runtime_1.jsx)(components_1.Button, Object.assign({ autodisable: true, disabled: disabled, onClick: handleButtonSend }, { children: buttonText })))] })));
};
exports.default = (0, components_1.customMessage)({
name: 'custom-rating',
component: CustomRatingMessage,
});
//# sourceMappingURL=index.js.map