add escape html to htmlContent on conversation list

chaskiq · Jan 13, 2022 · 51768b2 · 51768b2
1 parent 0a18ea1
commit 51768b2
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 2 deletions.
diff --git a/app/javascript/packages/components/src/utils/htmlSanitize.ts b/app/javascript/packages/components/src/utils/htmlSanitize.ts
@@ -2,3 +2,10 @@ export default function extractContent(html) {
   return new DOMParser().parseFromString(html, 'text/html').documentElement
     .textContent;
 }
+
+export function escapeHTML(unsafe) {
+  return unsafe.replace(
+    /[\u0000-\u002F\u003A-\u0040\u005B-\u0060\u007B-\u00FF]/g,
+    (c) => '&#' + ('000' + c.charCodeAt(0)).substr(-4, 4) + ';'
+  );
+}
diff --git a/app/javascript/src/pages/conversations/ItemList.tsx b/app/javascript/src/pages/conversations/ItemList.tsx
@@ -2,7 +2,9 @@ import React from 'react';
 import { Link } from 'react-router-dom';
 import Moment from 'react-moment';
 import { readableColor } from 'polished';
-import sanitizeHtml from '@chaskiq/components/src/utils/htmlSanitize';
+import sanitizeHtml, {
+  escapeHTML,
+} from '@chaskiq/components/src/utils/htmlSanitize';
 import { LabelIcon } from '@chaskiq/components/src/components/icons';
 import Avatar from '@chaskiq/components/src/components/Avatar';
 
@@ -16,7 +18,7 @@ export default function ConversationItemList({ app, conversation }) {
   const renderConversationContent = (o) => {
     const message = o.lastMessage.message;
     if (message.htmlContent) {
-      return sanitizeHtml(message.htmlContent).substring(0, 250);
+      return sanitizeHtml(escapeHTML(message.htmlContent)).substring(0, 250);
     }
   };