diff --git a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/utilities/HandlebarsRenderer.tsx b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/utilities/HandlebarsRenderer.tsx index 7c7d0e9567d..3466107ed35 100644 --- a/superset-frontend/plugins/legacy-preset-chart-deckgl/src/utilities/HandlebarsRenderer.tsx +++ b/superset-frontend/plugins/legacy-preset-chart-deckgl/src/utilities/HandlebarsRenderer.tsx @@ -16,10 +16,9 @@ * specific language governing permissions and limitations * under the License. */ -import { useEffect, useState, memo } from 'react'; -import { styled, t } from '@superset-ui/core'; +import { useEffect, useState, memo, useMemo } from 'react'; +import { styled, t, sanitizeHtml } from '@superset-ui/core'; import { extendedDayjs as dayjs } from '@superset-ui/core/utils/dates'; -import { SafeMarkdown } from '@superset-ui/core/components'; import Handlebars from 'handlebars'; import { isPlainObject } from 'lodash'; @@ -45,8 +44,6 @@ export const HandlebarsRenderer: React.FC = memo( appContainer?.getAttribute('data-bootstrap') || '{}', ); const htmlSanitization = common?.conf?.HTML_SANITIZATION ?? true; - const htmlSchemaOverrides = - common?.conf?.HTML_SANITIZATION_SCHEMA_EXTENSIONS || {}; useEffect(() => { try { @@ -60,6 +57,12 @@ export const HandlebarsRenderer: React.FC = memo( } }, [templateSource, data]); + const htmlContent = useMemo( + () => + htmlSanitization ? sanitizeHtml(renderedTemplate) : renderedTemplate, + [renderedTemplate, htmlSanitization], + ); + if (error) { return {error}; } @@ -73,13 +76,9 @@ export const HandlebarsRenderer: React.FC = memo( fontSize: '12px', lineHeight: '1.4', }} - > - - + // eslint-disable-next-line react/no-danger + dangerouslySetInnerHTML={{ __html: htmlContent }} + /> ); }