From ed54bf8810ceef354dd435605ac3359d3b554abb Mon Sep 17 00:00:00 2001
From: Shemol <shemol@163.com>
Date: Wed, 21 Jan 2026 14:53:45 +0800
Subject: [PATCH] refactor(ThinkingEffect): replace useState+useEffect with
 useMemo (#12536)

refactor(ThinkingEffect): replace useState+useEffect with useMemo for derived state

The messages array is purely derived from content and isThinking props,
not fetched from an API. Using useState+useEffect for derived state is
a React anti-pattern that causes unnecessary re-renders.

This change:
- Removes lodash isEqual dependency
- Reduces code complexity
- Avoids double render cycle

Signed-off-by: SherlockShemol <shemol@163.com>
---
 src/renderer/src/components/ThinkingEffect.tsx | 15 ++++-----------
 1 file changed, 4 insertions(+), 11 deletions(-)

diff --git a/src/renderer/src/components/ThinkingEffect.tsx b/src/renderer/src/components/ThinkingEffect.tsx
index 5013332a17..975a6a9d6c 100644
--- a/src/renderer/src/components/ThinkingEffect.tsx
+++ b/src/renderer/src/components/ThinkingEffect.tsx
@@ -1,8 +1,7 @@
 import { lightbulbVariants } from '@renderer/utils/motionVariants'
-import { isEqual } from 'lodash'
 import { ChevronRight, Lightbulb } from 'lucide-react'
 import { motion } from 'motion/react'
-import React, { useEffect, useMemo, useState } from 'react'
+import React, { useMemo } from 'react'
 import styled from 'styled-components'
 
 interface Props {
@@ -13,17 +12,11 @@ interface Props {
 }
 
 const ThinkingEffect: React.FC<Props> = ({ isThinking, thinkingTimeText, content, expanded }) => {
-  const [messages, setMessages] = useState<string[]>([])
-
-  useEffect(() => {
+  const messages = useMemo(() => {
     const allLines = (content || '').split('\n')
     const newMessages = isThinking ? allLines.slice(0, -1) : allLines
-    const validMessages = newMessages.filter((line) => line.trim() !== '')
-
-    if (!isEqual(messages, validMessages)) {
-      setMessages(validMessages)
-    }
-  }, [content, isThinking, messages])
+    return newMessages.filter((line) => line.trim() !== '')
+  }, [content, isThinking])
 
   const showThinking = useMemo(() => {
     return isThinking && !expanded