From 5b701f23e58a99a2be3da985c8140aed6454c588 Mon Sep 17 00:00:00 2001
From: balibabu <cike8899@users.noreply.github.com>
Date: Wed, 12 Aug 2026 19:08:48 +0800
Subject: [PATCH] Fix: Preserve the text format returned by the API. (#18167)

---
 web/src/components/top-select.tsx             | 37 ++++++++++---------
 .../pages/dataset/testing/testing-result.tsx  |  4 +-
 2 files changed, 23 insertions(+), 18 deletions(-)

diff --git a/web/src/components/top-select.tsx b/web/src/components/top-select.tsx
index 08c68ba3ad..0276a16ce0 100644
--- a/web/src/components/top-select.tsx
+++ b/web/src/components/top-select.tsx
@@ -14,7 +14,7 @@
  *  limitations under the License.
  */
 
-import { useMemo } from 'react';
+import { forwardRef, useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
 import { SelectWithSearch } from './originui/select-with-search';
 import { RAGFlowFormItem } from './ragflow-form';
@@ -24,24 +24,27 @@ type TopSelectProps = {
   onChange?(value: number): void;
 };
 
-export function TopSelect({ value = 10, onChange }: TopSelectProps) {
-  const { t } = useTranslation();
+export const TopSelect = forwardRef<HTMLButtonElement, TopSelectProps>(
+  function TopSelect({ value = 10, onChange }, ref) {
+    const { t } = useTranslation();
 
-  const sizeChangerOptions = useMemo(() => {
-    return [10, 20, 50, 100].map((x) => ({
-      label: <span>{t('common.top', { top: x })}</span>,
-      value: x.toString(),
-    }));
-  }, [t]);
+    const sizeChangerOptions = useMemo(() => {
+      return [10, 20, 50, 100].map((x) => ({
+        label: <span>{t('common.top', { top: x })}</span>,
+        value: x.toString(),
+      }));
+    }, [t]);
 
-  return (
-    <SelectWithSearch
-      options={sizeChangerOptions}
-      value={value.toString()}
-      onChange={(val) => onChange?.(Number(val))}
-    ></SelectWithSearch>
-  );
-}
+    return (
+      <SelectWithSearch
+        ref={ref}
+        options={sizeChangerOptions}
+        value={value.toString()}
+        onChange={(val) => onChange?.(Number(val))}
+      ></SelectWithSearch>
+    );
+  },
+);
 
 export function TopSelectFormItem() {
   const { t } = useTranslation();
diff --git a/web/src/pages/dataset/testing/testing-result.tsx b/web/src/pages/dataset/testing/testing-result.tsx
index 183efbb457..9fc16742e1 100644
--- a/web/src/pages/dataset/testing/testing-result.tsx
+++ b/web/src/pages/dataset/testing/testing-result.tsx
@@ -84,7 +84,9 @@ export function TestingResult({
                 <article key={x.chunk_id}>
                   <Card className="px-5 py-2.5 bg-transparent shadow-none">
                     <ChunkTitle item={x}></ChunkTitle>
-                    <p className="!mt-2.5"> {x.content_with_weight}</p>
+                    <p className="!mt-2.5 whitespace-pre-wrap">
+                      {x.content_with_weight}
+                    </p>
                     <div className="mt-2.5 text-right text-xs text-text-sub-title-invert">
                       {x.doc_name || x.docnm_kwd}
                     </div>