29 lines
735 B
TypeScript
29 lines
735 B
TypeScript
import React from 'react';
|
|
import DOMPurify from 'dompurify';
|
|
|
|
interface SafeHTMLProps {
|
|
html: string;
|
|
className?: string;
|
|
}
|
|
|
|
export function SafeHTML({ html, className }: SafeHTMLProps) {
|
|
const sanitizedHTML = DOMPurify.sanitize(html, {
|
|
USE_PROFILES: { html: true },
|
|
ALLOWED_TAGS: [
|
|
'a', 'p', 'br', 'b', 'i', 'em', 'strong', 'span', 'div',
|
|
'img', 'ul', 'ol', 'li', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6',
|
|
'code', 'pre', 'blockquote'
|
|
],
|
|
ALLOWED_ATTR: [
|
|
'href', 'target', 'class', 'id', 'style', 'src', 'alt',
|
|
'data-tagged-user-id', 'data-mention'
|
|
]
|
|
});
|
|
|
|
return (
|
|
<div
|
|
className={className}
|
|
dangerouslySetInnerHTML={{ __html: sanitizedHTML }}
|
|
/>
|
|
);
|
|
}
|