feat: add rehype-sanitize to protect markdown html from xss

Author: moonrailgun

client/web/package.json

@@ -72,6 +72,7 @@
     "react-virtualized-auto-sizer": "^1.0.7",
     "react-virtuoso": "^4.4.0",
     "rehype-raw": "^6.1.1",
+    "rehype-sanitize": "^6.0.0",
     "remark-gfm": "^3.0.1",
     "socket.io-client": "^4.6.1",
     "source-ref-runtime": "^1.0.7",

client/web/src/components/Markdown/render.tsx

@@ -4,8 +4,8 @@ import { isValidStr, parseUrlStr, useTranslation } from 'tailchat-shared';
 import { Loadable } from '../Loadable';
 import { Image } from 'tailchat-design';
 import remarkGfm from 'remark-gfm';
-// import rehypeRaw from 'rehype-raw';
-// import rehypeSanitize from 'rehype-sanitize';
+import rehypeRaw from 'rehype-raw';
+import rehypeSanitize from 'rehype-sanitize';
 import './render.less';
 
 // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -82,7 +82,7 @@ export const Markdown: React.FC<{
       transformImageUri={(src) => transformUrl(src)}
       transformLinkUri={(href) => transformUrl(href)}
       remarkPlugins={[remarkGfm]}
-      // rehypePlugins={[rehypeRaw, rehypeSanitize]}
+      rehypePlugins={[rehypeRaw, rehypeSanitize]}
       linkTarget="_blank"
       skipHtml={true}
       components={components}