diff --git a/src/components/RenderHTML.tsx b/src/components/RenderHTML.tsx index 1b67ff94c80c..e61a9fa0b5a7 100644 --- a/src/components/RenderHTML.tsx +++ b/src/components/RenderHTML.tsx @@ -1,6 +1,7 @@ -import React from 'react'; +import React, {useMemo} from 'react'; import {RenderHTMLSource} from 'react-native-render-html'; import useWindowDimensions from '@hooks/useWindowDimensions'; +import Parser from '@libs/Parser'; type RenderHTMLProps = { /** HTML string to render */ @@ -11,8 +12,13 @@ type RenderHTMLProps = { // Configuration for RenderHTML is handled in a top-level component providing // context to RenderHTMLSource components. See https://git.io/JRcZb // The provider is available at src/components/HTMLEngineProvider/ -function RenderHTML({html}: RenderHTMLProps) { +function RenderHTML({html: htmlParam}: RenderHTMLProps) { const {windowWidth} = useWindowDimensions(); + const html = useMemo(() => { + // Sanitize emoji characters already wrapped in tags to prevent double-tagging. + const sanitizedHtml = htmlParam.replaceAll(/<\/?emoji>/g, ''); + return Parser.replace(sanitizedHtml, {shouldEscapeText: false, filterRules: ['emoji']}); + }, [htmlParam]); return (