@botonic/react
Version:
Build Chatbots using React
142 lines • 6.36 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.msgToBotonic = msgToBotonic;
exports.msgsToBotonic = msgsToBotonic;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = 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 system_debug_trace_1 = require("./components/system-debug-trace");
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}
*/
// eslint-disable-next-line complexity
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, { ...msg, key: msg.key }, elementsParse(elements)));
}
else if ((0, message_utils_1.isImage)(msg)) {
return ((0, jsx_runtime_1.jsx)(image_1.Image, { ...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, { ...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, { ...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, { ...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, { ...msg, lat: lat, long: long });
}
else if ((0, message_utils_1.isButtonMessage)(msg)) {
const buttons = buttonsParse(msg.buttons);
return ((0, react_1.createElement)(text_1.Text, { ...msg, key: msg.key },
msg.text,
buttons));
}
else if ((0, message_utils_1.isSystemDebugTrace)(msg)) {
return (0, react_1.createElement)(system_debug_trace_1.SystemDebugTrace, { ...msg, key: msg.key });
}
console.warn(`Not converting message of type ${msg.type}`);
return null;
}
/**
* @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);
}
function textToBotonic(msg) {
const txt = msg.data?.text ?? String(msg.data);
if (msg.replies?.length || msg.keyboard?.length) {
return ((0, react_1.createElement)(text_1.Text, { ...msg, key: msg.key },
txt,
parseQuickReplies(msg)));
}
if (msg.buttons?.length) {
return ((0, react_1.createElement)(text_1.Text, { ...msg, key: msg.key },
txt,
buttonsParse(msg.buttons)));
}
return ((0, react_1.createElement)(text_1.Text, { ...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)] }, `element-${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, { payload: payload, url: url, target: target, webview: webview, ...disabledProps, children: title }, `button-${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, { payload: payload, children: el.text }, `reply-${i}`));
});
}
if (msg.keyboard) {
replies = msg.keyboard.map((el, i) => ((0, jsx_runtime_1.jsx)(reply_1.Reply, { payload: el.data, children: el.label }, `reply-${i}`)));
}
return replies;
}
//# sourceMappingURL=msg-to-botonic.js.map