.

chatdesk-ui/components/messages/message.tsx

@@ -38,32 +38,63 @@ interface MessageProps {
 
 
 // ✅ 提取为组件，放在同文件中也没问题
+// const MessageContent: React.FC<{ content: string }> = ({ content }) => {
+//   const [showThink, setShowThink] = useState(false)
+
+//   let thinkContent = ""
+//   let visibleContent = content.trim()
+
+//   const fullMatch = content.match(/<think>([\s\S]*?)<\/think>/i)
+//   if (fullMatch) {
+//     thinkContent = fullMatch[1].trim()
+//     visibleContent = content.replace(fullMatch[0], "").trim()
+//   } else {
+//     const endOnlyMatch = content.match(/([\s\S]*?)<\/think>/i)
+//     if (endOnlyMatch) {
+//       thinkContent = endOnlyMatch[1].trim()
+//       visibleContent = content.replace(endOnlyMatch[0], "").trim()
+//     }
+//   }
+
+//   return (
+//     <div className="space-y-2">
+//       <MessageMarkdown content={visibleContent} />
+
+//       {thinkContent && (
+//         <div className="mt-2 text-sm text-muted-foreground">
+//           <button
+//             className="text-blue-500 hover:underline"
+//             onClick={() => setShowThink(prev => !prev)}
+//           >
+//             {showThink ? "隐藏思考过程 ▲" : "显示思考过程 ▼"}
+//           </button>
+
+//           {showThink && (
+//             <div className="mt-2 rounded bg-gray-100 p-3 text-sm dark:bg-gray-800">
+//               <MessageMarkdown content={thinkContent} />
+//             </div>
+//           )}
+//         </div>
+//       )}
+//     </div>
+//   )
+// }
+
 const MessageContent: React.FC<{ content: string }> = ({ content }) => {
   const [showThink, setShowThink] = useState(false)
 
-  let thinkContent = ""
-  let visibleContent = content.trim()
-
-  const fullMatch = content.match(/<think>([\s\S]*?)<\/think>/i)
-  if (fullMatch) {
-    thinkContent = fullMatch[1].trim()
-    visibleContent = content.replace(fullMatch[0], "").trim()
-  } else {
-    const endOnlyMatch = content.match(/([\s\S]*?)<\/think>/i)
-    if (endOnlyMatch) {
-      thinkContent = endOnlyMatch[1].trim()
-      visibleContent = content.replace(endOnlyMatch[0], "").trim()
-    }
-  }
+  const thinkMatch = content.match(/<think>([\s\S]*?)<\/think>/i)
+  const thinkContent = thinkMatch?.[1]?.trim() || ""
+  const visibleContent = thinkMatch
+    ? content.replace(thinkMatch[0], "").trim()
+    : content.trim()
 
   return (
     <div className="space-y-2">
-      <MessageMarkdown content={visibleContent} />
-
-      {thinkContent && (
+      {thinkMatch && thinkContent && (
         <div className="mt-2 text-sm text-muted-foreground">
           <button
-            className="text-blue-500 hover:underline"
+            className="text-sm font-medium text-foreground/70 hover:text-foreground underline-offset-2 hover:underline"
             onClick={() => setShowThink(prev => !prev)}
           >
             {showThink ? "隐藏思考过程 ▲" : "显示思考过程 ▼"}
@@ -76,6 +107,8 @@ const MessageContent: React.FC<{ content: string }> = ({ content }) => {
           )}
         </div>
       )}
+
+      <MessageMarkdown content={visibleContent} />
     </div>
   )
 }