diff --git a/web/components/chat/ChatUserMessage/ChatUserMessage.tsx b/web/components/chat/ChatUserMessage/ChatUserMessage.tsx index fda45619e..26b032a13 100644 --- a/web/components/chat/ChatUserMessage/ChatUserMessage.tsx +++ b/web/components/chat/ChatUserMessage/ChatUserMessage.tsx @@ -1,11 +1,10 @@ /* eslint-disable react/no-danger */ import { FC, ReactNode, useEffect, useState } from 'react'; -import he from 'he'; import cn from 'classnames'; -import { Tooltip } from 'antd'; import { LinkOutlined } from '@ant-design/icons'; import { useRecoilValue } from 'recoil'; import dynamic from 'next/dynamic'; +import { decodeHTML } from 'entities'; import styles from './ChatUserMessage.module.scss'; import { formatTimestamp } from './messageFmt'; import { ChatMessage } from '../../../interfaces/chat-message.model'; @@ -15,6 +14,8 @@ import { User } from '../../../interfaces/user.model'; // Lazy loaded components +const Tooltip = dynamic(() => import('antd').then(mod => mod.Tooltip)); + const ChatModerationActionMenu = dynamic(() => import('../ChatModerationActionMenu/ChatModerationActionMenu').then( mod => mod.ChatModerationActionMenu, @@ -80,10 +81,8 @@ export const ChatUserMessage: FC = ({ ); } - // TODO: Find a solution to get rid of or replace "he" library since - // it's overly large for only use in this one place. useEffect(() => { - setFormattedMessage(he.decode(body)); + setFormattedMessage(decodeHTML(body)); }, [message]); return ( diff --git a/web/package-lock.json b/web/package-lock.json index 656e40c7d..935618327 100644 --- a/web/package-lock.json +++ b/web/package-lock.json @@ -14,7 +14,6 @@ "@codemirror/language-data": "6.1.0", "@fontsource/open-sans": "4.5.13", "@fontsource/poppins": "4.5.10", - "@next/bundle-analyzer": "^13.0.0", "@uiw/codemirror-theme-bbedit": "4.19.5", "@uiw/react-codemirror": "4.19.5", "@xstate/react": "3.0.1", @@ -24,7 +23,8 @@ "chartkick": "4.2.0", "classnames": "2.3.2", "date-fns": "2.29.3", - "he": "1.2.0", + "entities": "^4.4.0", + "install": "^0.13.0", "lodash": "4.17.21", "next": "13.1.1", "next-with-less": "2.0.5", @@ -56,6 +56,7 @@ "devDependencies": { "@babel/core": "7.20.7", "@mdx-js/react": "2.2.1", + "@next/bundle-analyzer": "^13.1.1", "@storybook/addon-a11y": "6.5.15", "@storybook/addon-actions": "6.5.15", "@storybook/addon-docs": "6.5.15", @@ -3173,6 +3174,7 @@ "version": "13.1.1", "resolved": "https://registry.npmjs.org/@next/bundle-analyzer/-/bundle-analyzer-13.1.1.tgz", "integrity": "sha512-zxC/MOj7gDjvQffHT4QZqcPe1Ny+e6o3wethCZn3liSElMA+kxgEopbziTUXdrvJcd/porq+3Itc8P+gxE/xog==", + "dev": true, "dependencies": { "webpack-bundle-analyzer": "4.7.0" } @@ -3592,7 +3594,8 @@ "node_modules/@polka/url": { "version": "1.0.0-next.21", "resolved": "https://registry.npmjs.org/@polka/url/-/url-1.0.0-next.21.tgz", - "integrity": "sha512-a5Sab1C4/icpTZVzZc5Ghpz88yQtGOyNqYXcZgOssB2uuAr+wF/MvN6bgtW32q7HHrvBki+BsZ0OuNv6EV3K9g==" + "integrity": "sha512-a5Sab1C4/icpTZVzZc5Ghpz88yQtGOyNqYXcZgOssB2uuAr+wF/MvN6bgtW32q7HHrvBki+BsZ0OuNv6EV3K9g==", + "dev": true }, "node_modules/@rc-component/portal": { "version": "1.1.0", @@ -17377,7 +17380,8 @@ "node_modules/duplexer": { "version": "0.1.2", "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.2.tgz", - "integrity": "sha512-jtD6YG370ZCIi/9GTaJKQxWTZD045+4R4hTk/x1UyoqadyJ9x9CgSi1RlVDQF8U2sxLLSnFkCaMihqljHIWgMg==" + "integrity": "sha512-jtD6YG370ZCIi/9GTaJKQxWTZD045+4R4hTk/x1UyoqadyJ9x9CgSi1RlVDQF8U2sxLLSnFkCaMihqljHIWgMg==", + "dev": true }, "node_modules/duplexer3": { "version": "0.1.5", @@ -17558,7 +17562,6 @@ "version": "4.4.0", "resolved": "https://registry.npmjs.org/entities/-/entities-4.4.0.tgz", "integrity": "sha512-oYp7156SP8LkeGD0GF85ad1X9Ai79WtRsZ2gxJqtBuzH+98YUV6jkHEKlZkMbcrjJjIVJNIDP/3WL9wQkoPbWA==", - "dev": true, "engines": { "node": ">=0.12" }, @@ -20279,6 +20282,7 @@ "version": "6.0.0", "resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-6.0.0.tgz", "integrity": "sha512-ax7ZYomf6jqPTQ4+XCpUGyXKHk5WweS+e05MBO4/y3WJ5RkmPXNKvX+bx1behVILVwr6JSQvZAku021CHPXG3Q==", + "dev": true, "dependencies": { "duplexer": "^0.1.2" }, @@ -20757,6 +20761,7 @@ "version": "1.2.0", "resolved": "https://registry.npmjs.org/he/-/he-1.2.0.tgz", "integrity": "sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==", + "dev": true, "bin": { "he": "bin/he" } @@ -21169,6 +21174,14 @@ "fast-loops": "^1.1.3" } }, + "node_modules/install": { + "version": "0.13.0", + "resolved": "https://registry.npmjs.org/install/-/install-0.13.0.tgz", + "integrity": "sha512-zDml/jzr2PKU9I8J/xyZBQn8rPCAY//UOYNmR01XwNwyfhEWObo2SWfSl1+0tm1u6PhxLwDnfsT/6jB7OUxqFA==", + "engines": { + "node": ">= 0.10" + } + }, "node_modules/internal-slot": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/internal-slot/-/internal-slot-1.0.4.tgz", @@ -25121,6 +25134,7 @@ "version": "1.0.1", "resolved": "https://registry.npmjs.org/mrmime/-/mrmime-1.0.1.tgz", "integrity": "sha512-hzzEagAgDyoU1Q6yg5uI+AorQgdvMCur3FcKf7NhMKWsaYg+RnbTyHRa/9IlLF9rf455MOCtcqqrQQ83pPP7Uw==", + "dev": true, "engines": { "node": ">=10" } @@ -25994,6 +26008,7 @@ "version": "1.5.2", "resolved": "https://registry.npmjs.org/opener/-/opener-1.5.2.tgz", "integrity": "sha512-ur5UIdyw5Y7yEj9wLzhqXiy6GZ3Mwx0yGI+5sMn2r0N0v3cKJvUmFH5yPP+WXh9e0xfyzyJX95D8l088DNFj7A==", + "dev": true, "bin": { "opener": "bin/opener-bin.js" } @@ -30491,6 +30506,7 @@ "version": "1.0.19", "resolved": "https://registry.npmjs.org/sirv/-/sirv-1.0.19.tgz", "integrity": "sha512-JuLThK3TnZG1TAKDwNIqNq6QA2afLOCcm+iE8D1Kj3GA40pSPsxQjjJl0J8X3tsR7T+CP1GavpzLwYkgVLWrZQ==", + "dev": true, "dependencies": { "@polka/url": "^1.0.0-next.20", "mrmime": "^1.0.0", @@ -32428,6 +32444,7 @@ "version": "1.1.0", "resolved": "https://registry.npmjs.org/totalist/-/totalist-1.1.0.tgz", "integrity": "sha512-gduQwd1rOdDMGxFG1gEvhV88Oirdo2p+KjoYFU7k2g+i7n6AFFbDQ5kMPUsW0pNbfQsB/cwXvT1i4Bue0s9g5g==", + "dev": true, "engines": { "node": ">=6" } @@ -34034,6 +34051,7 @@ "version": "4.7.0", "resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-4.7.0.tgz", "integrity": "sha512-j9b8ynpJS4K+zfO5GGwsAcQX4ZHpWV+yRiHDiL+bE0XHJ8NiPYLTNVQdlFYWxtpg9lfAQNlwJg16J9AJtFSXRg==", + "dev": true, "dependencies": { "acorn": "^8.0.4", "acorn-walk": "^8.0.0", @@ -34056,6 +34074,7 @@ "version": "8.8.1", "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.8.1.tgz", "integrity": "sha512-7zFpHzhnqYKrkYdUjF1HI1bzd0VygEGX8lFk4k5zVMqHEoES+P+7TKI+EvLO9WVMJ8eekdO0aDEK044xTXwPPA==", + "dev": true, "bin": { "acorn": "bin/acorn" }, @@ -34067,6 +34086,7 @@ "version": "8.2.0", "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.2.0.tgz", "integrity": "sha512-k+iyHEuPgSw6SbuDpGQM+06HQUa04DZ3o+F6CSzXMvvI5KMvnaEqXe+YVe555R9nn6GPt404fos4wcgpw12SDA==", + "dev": true, "engines": { "node": ">=0.4.0" } @@ -34075,6 +34095,7 @@ "version": "4.3.0", "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==", + "dev": true, "dependencies": { "color-convert": "^2.0.1" }, @@ -34089,6 +34110,7 @@ "version": "4.1.2", "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz", "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==", + "dev": true, "dependencies": { "ansi-styles": "^4.1.0", "supports-color": "^7.1.0" @@ -34104,6 +34126,7 @@ "version": "2.0.1", "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==", + "dev": true, "dependencies": { "color-name": "~1.1.4" }, @@ -34114,12 +34137,14 @@ "node_modules/webpack-bundle-analyzer/node_modules/color-name": { "version": "1.1.4", "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz", - "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==" + "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==", + "dev": true }, "node_modules/webpack-bundle-analyzer/node_modules/commander": { "version": "7.2.0", "resolved": "https://registry.npmjs.org/commander/-/commander-7.2.0.tgz", "integrity": "sha512-QrWXB+ZQSVPmIWIhtEO9H+gwHaMGYiF5ChvoJ+K9ZGHG/sVsa6yiesAD1GC/x46sET00Xlwo1u49RVVVzvcSkw==", + "dev": true, "engines": { "node": ">= 10" } @@ -34128,6 +34153,7 @@ "version": "4.0.0", "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz", "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==", + "dev": true, "engines": { "node": ">=8" } @@ -34136,6 +34162,7 @@ "version": "7.2.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==", + "dev": true, "dependencies": { "has-flag": "^4.0.0" }, @@ -34147,6 +34174,7 @@ "version": "7.5.9", "resolved": "https://registry.npmjs.org/ws/-/ws-7.5.9.tgz", "integrity": "sha512-F+P9Jil7UiSKSkppIiD94dN07AwvFixvLIj1Og1Rl9GGMuNipJnV9JzjD6XuqmAeiswGvUmNLjr5cFuXwNS77Q==", + "dev": true, "engines": { "node": ">=8.3.0" }, diff --git a/web/package.json b/web/package.json index 4fcdc61c9..2e1956355 100644 --- a/web/package.json +++ b/web/package.json @@ -18,7 +18,6 @@ "@codemirror/language-data": "6.1.0", "@fontsource/open-sans": "4.5.13", "@fontsource/poppins": "4.5.10", - "@next/bundle-analyzer": "^13.0.0", "@uiw/codemirror-theme-bbedit": "4.19.5", "@uiw/react-codemirror": "4.19.5", "@xstate/react": "3.0.1", @@ -28,7 +27,8 @@ "chartkick": "4.2.0", "classnames": "2.3.2", "date-fns": "2.29.3", - "he": "1.2.0", + "entities": "^4.4.0", + "install": "^0.13.0", "lodash": "4.17.21", "next": "13.1.1", "next-with-less": "2.0.5", @@ -60,6 +60,7 @@ "devDependencies": { "@babel/core": "7.20.7", "@mdx-js/react": "2.2.1", + "@next/bundle-analyzer": "^13.1.1", "@storybook/addon-a11y": "6.5.15", "@storybook/addon-actions": "6.5.15", "@storybook/addon-docs": "6.5.15",