From d96c368660a0ed655cf9cb606592f4f56e991bdb Mon Sep 17 00:00:00 2001
From: "Junjie.M" <118170653@qq.com>
Date: Wed, 19 Feb 2025 22:04:11 +0800
Subject: [PATCH] fix: frontend for <think> tags conflicting with original
 <details> tags (#14039)

---
 web/app/components/base/markdown-blocks/think-block.tsx | 3 +++
 web/app/components/base/markdown.tsx                    | 8 ++------
 2 files changed, 5 insertions(+), 6 deletions(-)

diff --git a/web/app/components/base/markdown-blocks/think-block.tsx b/web/app/components/base/markdown-blocks/think-block.tsx
index b68aff293d..3398502cfd 100644
--- a/web/app/components/base/markdown-blocks/think-block.tsx
+++ b/web/app/components/base/markdown-blocks/think-block.tsx
@@ -68,6 +68,9 @@ export const ThinkBlock = ({ children, ...props }: any) => {
   const displayContent = removeEndThink(children)
   const { t } = useTranslation()
 
+  if (!(props['data-think'] ?? false))
+    return (<details {...props}>{children}</details>)
+
   return (
     <details {...(!isComplete && { open: true })} className="group">
       <summary className="text-gray-500 font-bold list-none pl-2 flex items-center cursor-pointer select-none whitespace-nowrap">
diff --git a/web/app/components/base/markdown.tsx b/web/app/components/base/markdown.tsx
index 8689d44a1c..51c54b7d7d 100644
--- a/web/app/components/base/markdown.tsx
+++ b/web/app/components/base/markdown.tsx
@@ -68,13 +68,9 @@ const preprocessLaTeX = (content: string) => {
 }
 
 const preprocessThinkTag = (content: string) => {
-  if (!(content.trim().startsWith('<think>\n') || content.trim().startsWith('<details style=')))
-    return content
-
   return flow([
-    (str: string) => str.replaceAll('<think>\n', '<details>\n'),
-    (str: string) => str.replaceAll('\n</think>', '\n[ENDTHINKFLAG]</details>'),
-    (str: string) => str.replaceAll('\n</details>', '\n[ENDTHINKFLAG]</details>'),
+    (str: string) => str.replace('<think>\n', '<details data-think=true>\n'),
+    (str: string) => str.replace('\n</think>', '\n[ENDTHINKFLAG]</details>'),
   ])(content)
 }