diff --git a/ui/common/package.json b/ui/common/package.json
index d5d002ad..fbb745e2 100644
--- a/ui/common/package.json
+++ b/ui/common/package.json
@@ -18,11 +18,13 @@
"@solid-primitives/resize-observer": "^2.1.0",
"lodash": "^4.17.21",
"moment": "^2.30.1",
+ "sanitize-html": "^2.17.0",
"solid-js": "^1.9.5",
"solid-styled-components": "^0.28.5"
},
"devDependencies": {
"@types/lodash": "^4.17.16",
+ "@types/sanitize-html": "^2.16.0",
"esbuild": "^0.25.1",
"esbuild-plugin-solid-js": "^1.0.1",
"eslint": "^9.22.0",
diff --git a/ui/common/src/components/CollapsableText.tsx b/ui/common/src/components/CollapsableText.tsx
index c45e9753..80e532fb 100644
--- a/ui/common/src/components/CollapsableText.tsx
+++ b/ui/common/src/components/CollapsableText.tsx
@@ -1,6 +1,8 @@
import { createEffect, createSignal, on, Show } from 'solid-js';
import { css } from 'solid-styled-components';
+import { formatSummaryField } from '../utils/formatSummaryField';
+
interface Props {
text: string;
maxLinesNumber?: number;
@@ -61,6 +63,7 @@ export const CollapsableText = (props: Props) => {
return (
+ {/* eslint-disable solid/no-innerhtml */}
{
}
: {}
}
- >
- {props.text}
-
+ innerHTML={formatSummaryField(props.text)}
+ />
+ {/* eslint-enable solid/no-innerhtml */}