@botonic/react
Version:
Build Chatbots using React
138 lines • 6.56 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.msgsToBotonic = exports.msgToBotonic = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const react_2 = tslib_1.__importDefault(require("react"));
const audio_1 = require("./components/audio");
const index_1 = require("./components/button/index");
const buttons_disabler_1 = require("./components/buttons-disabler");
const carousel_1 = require("./components/carousel");
const document_1 = require("./components/document");
const element_1 = require("./components/element");
const image_1 = require("./components/image");
const location_1 = require("./components/location");
const pic_1 = require("./components/pic");
const reply_1 = require("./components/reply");
const subtitle_1 = require("./components/subtitle");
const text_1 = require("./components/text");
const title_1 = require("./components/title");
const video_1 = require("./components/video");
const message_utils_1 = require("./message-utils");
/**
*
* @param msg {object}
* @param customMessageTypes {{customTypeName}[]?}
* @return {React.ReactNode}
*/
function msgToBotonic(msg, customMessageTypes = []) {
delete msg.display;
if ((0, message_utils_1.isCustom)(msg)) {
try {
return customMessageTypes
.find(mt => mt.customTypeName === msg.data.customTypeName)
.deserialize(msg);
}
catch (e) {
console.log(e);
}
}
else if ((0, message_utils_1.isText)(msg)) {
return textToBotonic(msg);
}
else if ((0, message_utils_1.isCarousel)(msg)) {
const elements = msg.elements || msg.data.elements;
return ((0, react_1.createElement)(carousel_1.Carousel, Object.assign({}, msg, { key: msg.key }), elementsParse(elements)));
}
else if ((0, message_utils_1.isImage)(msg)) {
return ((0, jsx_runtime_1.jsx)(image_1.Image, Object.assign({}, msg, { src: msg.data.image !== undefined ? msg.data.image : msg.data }), msg.key));
}
else if ((0, message_utils_1.isVideo)(msg)) {
return ((0, jsx_runtime_1.jsx)(video_1.Video, Object.assign({}, msg, { src: msg.data.video !== undefined ? msg.data.video : msg.data })));
}
else if ((0, message_utils_1.isAudio)(msg)) {
return ((0, jsx_runtime_1.jsx)(audio_1.Audio, Object.assign({}, msg, { src: msg.data.audio !== undefined ? msg.data.audio : msg.data })));
}
else if ((0, message_utils_1.isDocument)(msg)) {
return ((0, jsx_runtime_1.jsx)(document_1.Document, Object.assign({}, msg, { src: msg.data.document !== undefined ? msg.data.document : msg.data })));
}
else if ((0, message_utils_1.isLocation)(msg)) {
const lat = msg.data ? msg.data.location.lat : msg.latitude;
const long = msg.data ? msg.data.location.long : msg.longitude;
return (0, jsx_runtime_1.jsx)(location_1.Location, Object.assign({}, msg, { lat: lat, long: long }));
}
else if ((0, message_utils_1.isButtonMessage)(msg)) {
const buttons = buttonsParse(msg.buttons);
return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, react_1.createElement)(text_1.Text, Object.assign({}, msg, { key: msg.key }),
msg.text,
buttons) }));
}
console.warn(`Not converting message of type ${msg.type}`);
return null;
}
exports.msgToBotonic = msgToBotonic;
/**
* @param msgs {object|object[]}
* @param customMessageTypes {{customTypeName}[]?}
* @return {React.ReactNode}
*/
function msgsToBotonic(msgs, customMessageTypes) {
if (Array.isArray(msgs)) {
return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: msgs.map((msg, i) => {
if (msg.key == null) {
msg.key = `msg${i}`;
}
return msgToBotonic(msg, customMessageTypes);
}) }));
}
return msgToBotonic(msgs, customMessageTypes);
}
exports.msgsToBotonic = msgsToBotonic;
function textToBotonic(msg) {
var _a, _b;
const txt = (_b = (_a = msg.data) === null || _a === void 0 ? void 0 : _a.text) !== null && _b !== void 0 ? _b : String(msg.data);
if ((msg.replies && msg.replies.length) ||
(msg.keyboard && msg.keyboard.length))
return ((0, react_1.createElement)(text_1.Text, Object.assign({}, msg, { key: msg.key }),
txt,
parseQuickReplies(msg)));
if (msg.buttons && msg.buttons.length)
return ((0, react_1.createElement)(text_1.Text, Object.assign({}, msg, { key: msg.key }),
txt,
buttonsParse(msg.buttons)));
return ((0, react_1.createElement)(text_1.Text, Object.assign({}, msg, { key: msg.key }), txt));
}
function elementsParse(elements) {
return elements.map((e, i) => ((0, jsx_runtime_1.jsxs)(element_1.Element, { children: [(0, jsx_runtime_1.jsx)(pic_1.Pic, { src: e.img || e.pic || e.image_url }), (0, jsx_runtime_1.jsx)(title_1.Title, { children: e.title }), (0, jsx_runtime_1.jsx)(subtitle_1.Subtitle, { children: e.subtitle }), buttonsParse(e.button || e.buttons)] }, i)));
}
function buttonsParse(buttons) {
return buttons.map((b, i) => {
const props = b.props || b;
let payload = props.payload;
if (props.path)
payload = `__PATH_PAYLOAD__${props.path}`;
const url = props.messenger_extensions ? null : props.url;
const target = props.messenger_extensions ? null : props.target;
const title = props.title;
const webview = props.messenger_extensions ? props.url : props.webview;
const disabledProps = buttons_disabler_1.ButtonsDisabler.constructBrowserProps(props);
return ((0, jsx_runtime_1.jsx)(index_1.Button, Object.assign({ payload: payload, url: url, target: target, webview: webview }, disabledProps, { children: title }), i));
});
}
function parseQuickReplies(msg) {
let replies = null;
if (msg.replies) {
replies = msg.replies.map((el, i) => {
let payload = el.payload;
if (el.path)
payload = `__PATH_PAYLOAD__${el.path}`;
return ((0, jsx_runtime_1.jsx)(reply_1.Reply, Object.assign({ payload: payload }, { children: el.text }), i));
});
}
if (msg.keyboard) {
replies = msg.keyboard.map((el, i) => ((0, jsx_runtime_1.jsx)(reply_1.Reply, Object.assign({ payload: el.data }, { children: el.label }), i)));
}
return replies;
}
//# sourceMappingURL=msg-to-botonic.js.map