@memori.ai/memori-react
Version:
[](https://www.npmjs.com/package/@memori.ai/memori-react)  ![TypeScript Support](https
199 lines • 21.4 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.RenderMediaItem = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const media_1 = require("../../helpers/media");
const translations_1 = require("../../helpers/translations");
const constants_1 = require("../../helpers/constants");
const ModelViewer_1 = tslib_1.__importDefault(require("../CustomGLBModelViewer/ModelViewer"));
const Snippet_1 = tslib_1.__importDefault(require("../Snippet/Snippet"));
const Card_1 = tslib_1.__importDefault(require("../ui/Card"));
const Modal_1 = tslib_1.__importDefault(require("../ui/Modal"));
const Button_1 = tslib_1.__importDefault(require("../ui/Button"));
const File_1 = tslib_1.__importDefault(require("../icons/File"));
const FilePdf_1 = tslib_1.__importDefault(require("../icons/FilePdf"));
const FileExcel_1 = tslib_1.__importDefault(require("../icons/FileExcel"));
const FileWord_1 = tslib_1.__importDefault(require("../icons/FileWord"));
const Copy_1 = tslib_1.__importDefault(require("../icons/Copy"));
const react_2 = require("@headlessui/react");
const utils_1 = require("../../helpers/utils");
const classnames_1 = tslib_1.__importDefault(require("classnames"));
const RenderMediaItem = ({ isChild = false, item, sessionID, tenantID, preview = false, baseURL, apiURL, onClick, customMediaRenderer, }) => {
var _a, _b;
const [modalOpen, setModalOpen] = (0, react_1.useState)(false);
const [copyNotification, setCopyNotification] = (0, react_1.useState)(false);
const url = (0, media_1.getResourceUrl)({
resourceURI: item.url,
sessionID,
tenantID,
baseURL,
apiURL,
});
const customRenderer = customMediaRenderer === null || customMediaRenderer === void 0 ? void 0 : customMediaRenderer(item.mimeType);
if (customRenderer) {
return customRenderer;
}
const renderMediaContent = (item) => {
switch (item.mimeType) {
case 'image/jpeg':
case 'image/png':
case 'image/jpg':
case 'image/gif':
return isImageRGB ? ((0, jsx_runtime_1.jsxs)("picture", { className: "memori-media-item--figure", children: [(0, jsx_runtime_1.jsx)("div", { className: "memori-media-item--rgb-item", style: {
backgroundColor: item.url,
} }), item.title && ((0, jsx_runtime_1.jsx)("figcaption", { className: "memori-media-item--figure-caption", children: item.title }))] })) : ((0, jsx_runtime_1.jsxs)("picture", { className: "memori-media-item--figure", children: [!preview && ((0, jsx_runtime_1.jsx)("source", { srcSet: [url, item.url, item.content].join(', '), type: item.mimeType })), (0, jsx_runtime_1.jsx)("img", { alt: item.title, src: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMIAAADDCAYAAADQvc6UAAABRWlDQ1BJQ0MgUHJvZmlsZQAAKJFjYGASSSwoyGFhYGDIzSspCnJ3UoiIjFJgf8LAwSDCIMogwMCcmFxc4BgQ4ANUwgCjUcG3awyMIPqyLsis7PPOq3QdDFcvjV3jOD1boQVTPQrgSkktTgbSf4A4LbmgqISBgTEFyFYuLykAsTuAbJEioKOA7DkgdjqEvQHEToKwj4DVhAQ5A9k3gGyB5IxEoBmML4BsnSQk8XQkNtReEOBxcfXxUQg1Mjc0dyHgXNJBSWpFCYh2zi+oLMpMzyhRcASGUqqCZ16yno6CkYGRAQMDKMwhqj/fAIcloxgHQqxAjIHBEugw5sUIsSQpBobtQPdLciLEVJYzMPBHMDBsayhILEqEO4DxG0txmrERhM29nYGBddr//5/DGRjYNRkY/l7////39v///y4Dmn+LgeHANwDrkl1AuO+pmgAAADhlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAAqACAAQAAAABAAAAwqADAAQAAAABAAAAwwAAAAD9b/HnAAAHlklEQVR4Ae3dP3PTWBSGcbGzM6GCKqlIBRV0dHRJFarQ0eUT8LH4BnRU0NHR0UEFVdIlFRV7TzRksomPY8uykTk/zewQfKw/9znv4yvJynLv4uLiV2dBoDiBf4qP3/ARuCRABEFAoBEgghggQAQZQKAnYEaQBAQaASKIAQJEkAEEegJmBElAoBEgghggQAQZQKAnYEaQBAQaASKIAQJEkAEEegJmBElAoBEgghggQAQZQKAnYEaQBAQaASKIAQJEkAEEegJmBElAoBEgghggQAQZQKAnYEaQBAQaASKIAQJEkAEEegJmBElAoBEgghggQAQZQKAnYEaQBAQaASKIAQJEkAEEegJmBElAoBEgghggQAQZQKAnYEaQBAQaASKIAQJEkAEEegJmBElAoBEgghggQAQZQKAnYEaQBAQaASKIAQJEkAEEegJmBElAoBEgghggQAQZQKAnYEaQBAQaASKIAQJEkAEEegJmBElAoBEgghggQAQZQKAnYEaQBAQaASKIAQJEkAEEegJmBElAoBEgghggQAQZQKAnYEaQBAQaASKIAQJEkAEEegJmBElAoBEgghggQAQZQKAnYEaQBAQaASKIAQJEkAEEegJmBElAoBEgghggQAQZQKAnYEaQBAQaASKIAQJEkAEEegJmBElAoBEgghgg0Aj8i0JO4OzsrPv69Wv+hi2qPHr0qNvf39+iI97soRIh4f3z58/u7du3SXX7Xt7Z2enevHmzfQe+oSN2apSAPj09TSrb+XKI/f379+08+A0cNRE2ANkupk+ACNPvkSPcAAEibACyXUyfABGm3yNHuAECRNgAZLuYPgEirKlHu7u7XdyytGwHAd8jjNyng4OD7vnz51dbPT8/7z58+NB9+/bt6jU/TI+AGWHEnrx48eJ/EsSmHzx40L18+fLyzxF3ZVMjEyDCiEDjMYZZS5wiPXnyZFbJaxMhQIQRGzHvWR7XCyOCXsOmiDAi1HmPMMQjDpbpEiDCiL358eNHurW/5SnWdIBbXiDCiA38/Pnzrce2YyZ4//59F3ePLNMl4PbpiL2J0L979+7yDtHDhw8vtzzvdGnEXdvUigSIsCLAWavHp/+qM0BcXMd/q25n1vF57TYBp0a3mUzilePj4+7k5KSLb6gt6ydAhPUzXnoPR0dHl79WGTNCfBnn1uvSCJdegQhLI1vvCk+fPu2ePXt2tZOYEV6/fn31dz+shwAR1sP1cqvLntbEN9MxA9xcYjsxS1jWR4AIa2Ibzx0tc44fYX/16lV6NDFLXH+YL32jwiACRBiEbf5KcXoTIsQSpzXx4N28Ja4BQoK7rgXiydbHjx/P25TaQAJEGAguWy0+2Q8PD6/Ki4R8EVl+bzBOnZY95fq9rj9zAkTI2SxdidBHqG9+skdw43borCXO/ZcJdraPWdv22uIEiLA4q7nvvCug8WTqzQveOH26fodo7g6uFe/a17W3+nFBAkRYENRdb1vkkz1CH9cPsVy/jrhr27PqMYvENYNlHAIesRiBYwRy0V+8iXP8+/fvX11Mr7L7ECueb/r48eMqm7FuI2BGWDEG8cm+7G3NEOfmdcTQw4h9/55lhm7DekRYKQPZF2ArbXTAyu4kDYB2YxUzwg0gi/41ztHnfQG26HbGel/crVrm7tNY+/1btkOEAZ2M05r4FB7r9GbAIdxaZYrHdOsgJ/wCEQY0J74TmOKnbxxT9n3FgGGWWsVdowHtjt9Nnvf7yQM2aZU/TIAIAxrw6dOnAWtZZcoEnBpNuTuObWMEiLAx1HY0ZQJEmHJ3HNvGCBBhY6jtaMoEiJB0Z29vL6ls58vxPcO8/zfrdo5qvKO+d3Fx8Wu8zf1dW4p/cPzLly/dtv9Ts/EbcvGAHhHyfBIhZ6NSiIBTo0LNNtScABFyNiqFCBChULMNNSdAhJyNSiECRCjUbEPNCRAhZ6NSiAARCjXbUHMCRMjZqBQiQIRCzTbUnAARcjYqhQgQoVCzDTUnQIScjUohAkQo1GxDzQkQIWejUogAEQo121BzAkTI2agUIkCEQs021JwAEXI2KoUIEKFQsw01J0CEnI1KIQJEKNRsQ80JECFno1KIABEKNdtQcwJEyNmoFCJAhELNNtScABFyNiqFCBChULMNNSdAhJyNSiECRCjUbEPNCRAhZ6NSiAARCjXbUHMCRMjZqBQiQIRCzTbUnAARcjYqhQgQoVCzDTUnQIScjUohAkQo1GxDzQkQIWejUogAEQo121BzAkTI2agUIkCEQs021JwAEXI2KoUIEKFQsw01J0CEnI1KIQJEKNRsQ80JECFno1KIABEKNdtQcwJEyNmoFCJAhELNNtScABFyNiqFCBChULMNNSdAhJyNSiECRCjUbEPNCRAhZ6NSiAARCjXbUHMCRMjZqBQiQIRCzTbUnAARcjYqhQgQoVCzDTUnQIScjUohAkQo1GxDzQkQIWejUogAEQo121BzAkTI2agUIkCEQs021JwAEXI2KoUIEKFQsw01J0CEnI1KIQJEKNRsQ80JECFno1KIABEKNdtQcwJEyNmoFCJAhELNNtScABFyNiqFCBChULMNNSdAhJyNSiEC/wGgKKC4YMA4TAAAAABJRU5ErkJggg==" }), item.title && ((0, jsx_runtime_1.jsx)("figcaption", { className: "memori-media-item--figure-caption", children: item.title }))] }));
case 'application/msword':
case 'application/vnd.openxmlformats-officedocument.wordprocessingml.document':
return (0, jsx_runtime_1.jsx)(FileWord_1.default, { className: "memori-media-item--icon" });
case 'application/vnd.ms-excel':
case 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet':
return (0, jsx_runtime_1.jsx)(FileExcel_1.default, { className: "memori-media-item--icon" });
case 'application/pdf':
return (0, jsx_runtime_1.jsx)(FilePdf_1.default, { className: "memori-media-item--icon" });
case 'video/mp4':
case 'video/quicktime':
case 'video/avi':
case 'video/mpeg':
return ((0, jsx_runtime_1.jsxs)("video", { style: { width: '100%', height: '100%' }, controls: true, src: url, title: item.title, children: [item.mimeType === 'video/quicktime' && ((0, jsx_runtime_1.jsx)("source", { src: item.url, type: "video/mp4" })), (0, jsx_runtime_1.jsx)("source", { src: item.url, type: item.mimeType }), "Your browser does not support this video format.", (0, jsx_runtime_1.jsx)("br", {}), (0, jsx_runtime_1.jsx)("a", { href: item.url, target: "_blank", rel: "noopener noreferrer", children: "Download the video" })] }));
case 'audio/mpeg3':
case 'audio/wav':
case 'audio/mpeg':
return ((0, jsx_runtime_1.jsx)("audio", { style: { width: '100%', height: '100%' }, controls: true, src: url }));
case 'model/gltf-binary':
return ((0, jsx_runtime_1.jsx)(ModelViewer_1.default, { src: url, alt: "", poster: "data:image/png;base64,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" }));
default:
return (0, jsx_runtime_1.jsx)(File_1.default, { className: "memori-media-item--icon" });
}
};
if (!item.url && (item === null || item === void 0 ? void 0 : item.type) === 'document' && item.content) {
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("a", { className: "memori-media-item--link", href: "#", onClick: e => {
e.preventDefault();
setModalOpen(true);
}, title: item.title, children: (0, jsx_runtime_1.jsx)(Card_1.default, { hoverable: true, cover: renderMediaContent(item), title: item.title }) }), (0, jsx_runtime_1.jsx)(Modal_1.default, { open: modalOpen, onClose: () => setModalOpen(false), title: item.title, className: "memori-media-item-preview--modal", width: "60%", widthMd: "70%", footer: (0, jsx_runtime_1.jsx)("div", { style: { display: 'flex', justifyContent: 'flex-end', gap: '0.5rem' }, children: (0, jsx_runtime_1.jsx)(Button_1.default, { onClick: async () => {
try {
await navigator.clipboard.writeText(item.content || '');
setCopyNotification(true);
setTimeout(() => setCopyNotification(false), 2000);
}
catch (err) {
console.error('Failed to copy content:', err);
}
}, icon: (0, jsx_runtime_1.jsx)(Copy_1.default, {}), children: copyNotification ? 'Copied!' : 'Copy Content' }) }), children: (0, jsx_runtime_1.jsx)("div", { className: "memori-media-item-preview--content", children: (0, jsx_runtime_1.jsx)("div", { className: "memori-media-item-preview--text", dangerouslySetInnerHTML: {
__html: (0, utils_1.stripHTML)(item.content || ''),
} }) }) })] }));
}
const isImageRGB = ((_a = item.url) === null || _a === void 0 ? void 0 : _a.startsWith('rgb(')) || ((_b = item.url) === null || _b === void 0 ? void 0 : _b.startsWith('rgba('));
switch (item.mimeType) {
case 'image/jpeg':
case 'image/png':
case 'image/jpg':
case 'image/gif':
return isImageRGB ? ((0, jsx_runtime_1.jsx)(Card_1.default, { hoverable: true, className: "memori-media-item--card memori-media-item--image", cover: renderMediaContent(item) })) : ((0, jsx_runtime_1.jsx)("a", { className: "memori-media-item--link", href: item.url, onClick: e => {
if (isChild) {
e.preventDefault();
}
if (onClick) {
e.preventDefault();
onClick(item.mediumID);
}
}, target: "_blank", rel: "noopener noreferrer", title: item.title, children: (0, jsx_runtime_1.jsx)(Card_1.default, { hoverable: true, className: "memori-media-item--card memori-media-item--image", cover: renderMediaContent(item) }) }));
case 'application/msword':
case 'application/vnd.openxmlformats-officedocument.wordprocessingml.document':
case 'application/vnd.ms-excel':
case 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet':
case 'application/pdf':
return ((0, jsx_runtime_1.jsx)("a", { className: "memori-media-item--link", href: url, target: "_blank", rel: "noopener noreferrer", title: item.title, children: (0, jsx_runtime_1.jsx)(Card_1.default, { hoverable: true, cover: renderMediaContent(item), title: item.title }) }));
case 'video/mp4':
case 'video/quicktime':
case 'video/avi':
case 'video/mpeg':
return ((0, jsx_runtime_1.jsx)("a", { className: "memori-media-item--link", href: url, onClick: e => {
if (isChild) {
e.preventDefault();
}
if (onClick) {
e.preventDefault();
onClick(item.mediumID);
}
}, target: "_blank", rel: "noopener noreferrer", title: item.title, children: (0, jsx_runtime_1.jsx)(Card_1.default, { hoverable: true, cover: renderMediaContent(item), title: item.title }) }));
case 'audio/mpeg3':
case 'audio/wav':
case 'audio/mpeg':
return ((0, jsx_runtime_1.jsx)("a", { className: "memori-media-item--link", href: url, target: "_blank", rel: "noopener noreferrer", title: item.title, children: (0, jsx_runtime_1.jsx)(Card_1.default, { hoverable: true, cover: renderMediaContent(item), title: item.title }) }));
case 'model/gltf-binary':
return (0, jsx_runtime_1.jsx)(Card_1.default, { hoverable: true, cover: renderMediaContent(item) });
default:
return ((0, jsx_runtime_1.jsx)("a", { className: "memori-media-item--link", href: url, target: "_blank", rel: "noopener noreferrer", title: item.title, children: (0, jsx_runtime_1.jsx)(Card_1.default, { hoverable: true, cover: renderMediaContent(item), title: item.title }) }));
}
};
exports.RenderMediaItem = RenderMediaItem;
const MediaItemWidget = ({ items, sessionID, tenantID, translateTo, baseURL, apiURL, customMediaRenderer, fromUser = false, }) => {
const [media, setMedia] = (0, react_1.useState)(items);
const [openModalMedium, setOpenModalMedium] = (0, react_1.useState)();
const translateMediaCaptions = (0, react_1.useCallback)(async () => {
if (!translateTo)
return;
const translatedMedia = await Promise.all((items !== null && items !== void 0 ? items : []).map(async (media) => {
var _a;
if (media.title) {
try {
const tTitle = await (0, translations_1.getTranslation)(media.title, translateTo);
return { ...media, title: (_a = tTitle.text) !== null && _a !== void 0 ? _a : media.title };
}
catch (e) {
console.error(e);
return media;
}
}
else {
return media;
}
}));
setMedia(translatedMedia);
}, [translateTo, items]);
(0, react_1.useEffect)(() => {
if (translateTo)
translateMediaCaptions();
}, [translateTo, translateMediaCaptions]);
const nonCodeDisplayMedia = media
.filter(m => {
var _a;
return !((_a = m.properties) === null || _a === void 0 ? void 0 : _a.executable) &&
!constants_1.prismSyntaxLangs.map(l => l.mimeType).includes(m.mimeType);
})
.sort((a, b) => {
return a.creationTimestamp > b.creationTimestamp
? 1
: a.creationTimestamp < b.creationTimestamp
? -1
: 0;
});
const codeSnippets = media.filter(m => {
var _a;
return !((_a = m.properties) === null || _a === void 0 ? void 0 : _a.executable) &&
constants_1.prismSyntaxLangs.map(l => l.mimeType).includes(m.mimeType);
});
const cssExecutableCode = media.filter(m => { var _a; return m.mimeType === 'text/css' && !!((_a = m.properties) === null || _a === void 0 ? void 0 : _a.executable); });
return ((0, jsx_runtime_1.jsxs)(react_2.Transition, { appear: true, show: true, as: "div", className: "memori-media-items", children: [!!nonCodeDisplayMedia.length && ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('memori-media-items--grid', {
'memori-media-items--user': fromUser,
'memori-media-items--agent': !fromUser,
}), children: nonCodeDisplayMedia.map((item, index) => ((0, jsx_runtime_1.jsx)(react_2.Transition.Child, { as: "div", className: "memori-media-item", enter: `ease-out duration-500 delay-${index * 100}`, enterFrom: "opacity-0 scale-95", enterTo: "opacity-1 scale-100", leave: "ease-in duration-300", leaveFrom: "opacity-1 scale-100", leaveTo: "opacity-0 scale-95", children: (0, jsx_runtime_1.jsx)(exports.RenderMediaItem, { isChild: true, sessionID: sessionID, tenantID: tenantID, baseURL: baseURL, apiURL: apiURL, onClick: mediumID => {
setOpenModalMedium(media.find(m => m.mediumID === mediumID));
}, item: {
...item,
title: item.title,
url: item.url,
content: item.content,
type: 'document',
}, customMediaRenderer: customMediaRenderer }) }, item.url + '&index=' + index))) })), codeSnippets.map(medium => ((0, jsx_runtime_1.jsx)(react_2.Transition.Child, { as: "div", className: "memori-media-item--snippet", enter: "ease-out duration-500", enterFrom: "opacity-0 translate-y-1", enterTo: "opacity-1 translate-y-0", leave: "ease-in duration-300", leaveFrom: "opacity-1", leaveTo: "opacity-0", children: (0, jsx_runtime_1.jsx)(Snippet_1.default, { medium: medium }, medium.mediumID) }, medium.mediumID))), cssExecutableCode.map(medium => ((0, jsx_runtime_1.jsx)("style", { dangerouslySetInnerHTML: { __html: medium.content || '' } }, medium.mediumID))), (openModalMedium === null || openModalMedium === void 0 ? void 0 : openModalMedium.mediumID) && ((0, jsx_runtime_1.jsx)(Modal_1.default, { width: "100%", widthMd: "100%", className: "memori-media-item--modal", open: !!openModalMedium, onClose: () => setOpenModalMedium(undefined), footer: null, children: (0, jsx_runtime_1.jsx)(exports.RenderMediaItem, { isChild: true, sessionID: sessionID, tenantID: tenantID, baseURL: baseURL, apiURL: apiURL, item: {
...openModalMedium,
title: openModalMedium.title,
url: openModalMedium.url,
content: openModalMedium.content,
type: 'document',
}, customMediaRenderer: customMediaRenderer }) }))] }));
};
exports.default = (0, react_1.memo)(MediaItemWidget);
//# sourceMappingURL=MediaItemWidget.js.map