@botonic/react
Version:
Build Chatbots using React
47 lines • 2.52 kB
JavaScript
import { jsx as _jsx } from "react/jsx-runtime";
import { INPUT } from '@botonic/core';
import { truncateText } from '../util';
import { renderComponent } from '../util/react';
import { Message } from './message';
import { WHATSAPP_MAX_BUTTON_CHARS } from './multichannel/whatsapp/constants';
import { convertToMarkdownMeta } from './multichannel/whatsapp/markdown-meta';
// TODO: Add validation in component
export const WHATSAPP_MAX_BUTTON_LIST_CHARS = 24;
export const WHATSAPP_MAX_BUTTON_LIST_DESCRIPTION_CHARS = 72;
export const WHATSAPP_MAX_BUTTON_LIST_ID_CHARS = 200;
const serialize = _whatsappButtonListProps => {
// TODO: Implement to have data persistence in localStorage, not needed for this WhatsApp development
return {};
};
export const WhatsappButtonList = (props) => {
const truncateSectionsContents = (sections) => {
const truncateRowContents = (row) => {
const title = truncateText(row.title, WHATSAPP_MAX_BUTTON_LIST_CHARS);
const description = row.description
? truncateText(row.description, WHATSAPP_MAX_BUTTON_LIST_DESCRIPTION_CHARS)
: undefined;
if (row.id.length > WHATSAPP_MAX_BUTTON_LIST_ID_CHARS) {
console.error(`Button id "${row.id}" exceeds the maximum length of ${WHATSAPP_MAX_BUTTON_LIST_ID_CHARS} characters`);
}
return Object.assign(Object.assign({}, row), { title, description });
};
return sections.map(section => ({
title: section.title
? truncateText(section.title, WHATSAPP_MAX_BUTTON_LIST_CHARS)
: undefined,
rows: section.rows.map(truncateRowContents),
}));
};
const renderBrowser = () => {
// Return a dummy message for browser
const message = `${JSON.stringify(props)}`;
return (_jsx(Message, Object.assign({ json: serialize(message) }, props, { type: INPUT.WHATSAPP_BUTTON_LIST }, { children: message })));
};
const renderNode = () => {
return (
// @ts-ignore Property 'message' does not exist on type 'JSX.IntrinsicElements'.
_jsx("message", Object.assign({}, props, { body: convertToMarkdownMeta(props.body), button: truncateText(props.button, WHATSAPP_MAX_BUTTON_CHARS), sections: JSON.stringify(truncateSectionsContents(props.sections)), type: INPUT.WHATSAPP_BUTTON_LIST })));
};
return renderComponent({ renderBrowser, renderNode });
};
//# sourceMappingURL=whatsapp-button-list.js.map