feat: add reasoning check to message list item rendering

frontend/src/components/workspace/messages/message-list-item.tsx

@@ -7,7 +7,11 @@ import {
   MessageResponse as AIElementMessageResponse,
   MessageToolbar,
 } from "@/components/ai-elements/message";
-import { extractContentFromMessage, hasToolCalls } from "@/core/messages/utils";
+import {
+  extractContentFromMessage,
+  hasReasoning,
+  hasToolCalls,
+} from "@/core/messages/utils";
 import { useRehypeSplitWordsIntoSpans } from "@/core/rehype";
 import { cn } from "@/lib/utils";
 
@@ -66,6 +70,9 @@ function MessageContent_({
   const rehypePlugins = useRehypeSplitWordsIntoSpans(isLoading);
   return (
     <AIElementMessageContent className={className}>
+      {hasReasoning(message) && (
+        <MessageGroup messages={messagesInGroup} isLoading={isLoading} />
+      )}
       <AIElementMessageResponse rehypePlugins={rehypePlugins}>
         {extractContentFromMessage(message)}
       </AIElementMessageResponse>

frontend/src/core/messages/utils.ts

@@ -46,9 +46,6 @@ export function groupMessages<T>(
       } else {
         // Assistant messages with content (text or images) are shown as a group if they have content
         // No matter whether it has tool calls or not
-        if (hasReasoning(message)) {
-          currentGroup.push(message);
-        }
         yieldCurrentGroup();
         currentGroup.push(message);
       }