46 lines
1.5 KiB
TypeScript
46 lines
1.5 KiB
TypeScript
|
import React from 'react';
|
||
|
|
import type { MessageBlock } from '@/store/commStore';
|
||
|
|
|
||
|
|
interface HtmlBlockProps {
|
||
|
|
block: MessageBlock;
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Basic HTML sanitization: removes <script> tags and event handler attributes.
|
||
|
|
* This is a minimal sanitizer — for production use DOMPurify or similar.
|
||
|
|
*/
|
||
|
|
function sanitizeHtml(html: string): string {
|
||
|
|
let sanitized = html;
|
||
|
|
// Remove <script>...</script> blocks (including content)
|
||
|
|
sanitized = sanitized.replace(/<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi, '');
|
||
|
|
// Remove <script ...> self-referencing or incomplete tags
|
||
|
|
sanitized = sanitized.replace(/<script\b[^>]*>/gi, '');
|
||
|
|
// Remove on* event handler attributes (onclick, onload, onerror, etc.)
|
||
|
|
sanitized = sanitized.replace(/\son\w+\s*=\s*"[^"]*"/gi, '');
|
||
|
|
sanitized = sanitized.replace(/\son\w+\s*=\s*'[^']*'/gi, '');
|
||
|
|
sanitized = sanitized.replace(/\son\w+\s*=\s*[^\s>]+/gi, '');
|
||
|
|
// Remove javascript: URLs in href/src
|
||
|
|
sanitized = sanitized.replace(/(href|src)\s*=\s*"javascript:[^"]*"/gi, '$1="#"');
|
||
|
|
sanitized = sanitized.replace(/(href|src)\s*=\s*'javascript:[^']*'/gi, '$1="#"');
|
||
|
|
return sanitized;
|
||
|
|
}
|
||
|
|
|
||
|
|
const HtmlBlock: React.FC<HtmlBlockProps> = ({ block }) => {
|
||
|
|
const rawHtml: string = block.block_data.html || '';
|
||
|
|
|
||
|
|
if (!rawHtml) {
|
||
|
|
return null;
|
||
|
|
}
|
||
|
|
|
||
|
|
const sanitized = sanitizeHtml(rawHtml);
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div
|
||
|
|
className="prose prose-sm max-w-none text-inherit"
|
||
|
|
dangerouslySetInnerHTML={{ __html: sanitized }}
|
||
|
|
/>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
export default HtmlBlock;
|