diff --git a/packages/bruno-app/src/components/MarkDown/index.jsx b/packages/bruno-app/src/components/MarkDown/index.jsx index dfe9ccb6c..c3e975b65 100644 --- a/packages/bruno-app/src/components/MarkDown/index.jsx +++ b/packages/bruno-app/src/components/MarkDown/index.jsx @@ -6,9 +6,9 @@ import { isValidUrl } from 'utils/url/index'; import DOMPurify from 'dompurify'; import { useMemo } from 'react'; -const Markdown = ({ collectionPath, onDoubleClick, content }) => { +const Markdown = ({ collectionPath, onDoubleClick, content, allowHtml = true }) => { const markdownItOptions = { - html: true, + html: allowHtml, breaks: true, linkify: true, replaceLink: function (link, env) { @@ -35,7 +35,7 @@ const Markdown = ({ collectionPath, onDoubleClick, content }) => { }; const md = new MarkdownIt(markdownItOptions).use(MarkdownItReplaceLink); - const htmlFromMarkdown = useMemo(() => md.render(content || ''), [content, collectionPath]); + const htmlFromMarkdown = useMemo(() => md.render(content || ''), [content, collectionPath, allowHtml]); const cleanHTML = useMemo(() => DOMPurify.sanitize(htmlFromMarkdown), [htmlFromMarkdown]); return ( diff --git a/packages/bruno-app/src/components/Notifications/NotificationsModal/NotificationDetail.js b/packages/bruno-app/src/components/Notifications/NotificationsModal/NotificationDetail.js index 59db5bfc8..76bb8c414 100644 --- a/packages/bruno-app/src/components/Notifications/NotificationsModal/NotificationDetail.js +++ b/packages/bruno-app/src/components/Notifications/NotificationsModal/NotificationDetail.js @@ -1,4 +1,4 @@ -import DOMPurify from 'dompurify'; +import Markdown from 'components/MarkDown'; import { parseToRgb, rgba } from 'polished'; import { useTheme } from 'providers/Theme'; import { humanizeDate } from 'utils/common'; @@ -19,47 +19,9 @@ export const getBadgeStyle = (color, theme) => { }; }; -const getSanitizedDescription = (description) => { - return DOMPurify.sanitize(description || '', { - ALLOWED_TAGS: ['a', 'ul', 'img', 'li', 'div', 'span', 'p', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'br', 'strong', 'em'], - ALLOWED_ATTR: ['href', 'style', 'target', 'src', 'alt'] - }); -}; - const NotificationDetail = ({ notification }) => { const { theme } = useTheme(); - // Rendered in a sandboxed iframe (no allow-scripts); theme CSS is inlined - // since the iframe doesn't inherit app styles. - const buildDescriptionDocument = (description) => { - const body = getSanitizedDescription(description); - return ` - - - - - - - ${body} -`; - }; - if (!notification) { return (
@@ -81,13 +43,9 @@ const NotificationDetail = ({ notification }) => {
{notification.title}
-