From 237be9007df7eca6c2a6ba4ff956273d90b53563 Mon Sep 17 00:00:00 2001
From: Your Name <your.email@example.com>
Date: Sun, 18 Jan 2026 11:34:04 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E7=A7=BB=E9=99=A4=20Response=20?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6=E7=9A=84=20memo=EF=BC=8C=E4=BF=AE=E5=A4=8D?=
 =?UTF-8?q?=E6=8C=89=E9=92=AE=E7=8A=B6=E6=80=81=E4=B8=8D=E6=9B=B4=E6=96=B0?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 移除 memo 的自定义比较函数
- 确保 isProcessing* 状态变化时组件能正确重新渲染
- 之前的 memo 可能导致 Streamdown 内部的 ImagePreview 没有正确更新
---
 components/elements/response.tsx | 101 ++++++++++++++++---------------
 1 file changed, 51 insertions(+), 50 deletions(-)

diff --git a/components/elements/response.tsx b/components/elements/response.tsx
index d52e5f9..a1053ed 100644
--- a/components/elements/response.tsx
+++ b/components/elements/response.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { type ComponentProps, memo } from "react";
+import type { ComponentProps } from "react";
 import { Streamdown } from "streamdown";
 import { cn } from "@/lib/utils";
 import { ImagePreview } from "@/components/image-preview";
@@ -19,55 +19,56 @@ type ResponseProps = ComponentProps<typeof Streamdown> & {
   isProcessingAngleEdit?: boolean;
 };
 
-export const Response = memo(
-  ({ className, onImageEdit, onDrawingComplete, onImageEnhance, onImageRmbg, onImageExtend, onImageAngleEdit, isProcessingEnhance, isProcessingRmbg, isProcessingExtend, isProcessingAngleEdit, ...props }: ResponseProps) => (
-    <Streamdown
-      className={cn(
-        "size-full [&>*:first-child]:mt-0 [&>*:last-child]:mb-0 [&_code]:whitespace-pre-wrap [&_code]:break-words [&_pre]:max-w-full [&_pre]:overflow-x-auto",
-        className
-      )}
-      components={{
-        img: ({ src, alt }: { src?: string; alt?: string }) => {
-          if (!src) {
-            return null;
-          }
-          return <ImagePreview 
-            src={src} 
-            alt={alt} 
-            onImageEdit={onImageEdit} 
-            onDrawingComplete={onDrawingComplete}
-            onImageEnhance={onImageEnhance}
-            onImageRmbg={onImageRmbg}
-            onImageExtend={onImageExtend}
-            onImageAngleEdit={onImageAngleEdit}
-            isProcessingEnhance={isProcessingEnhance}
-            isProcessingRmbg={isProcessingRmbg}
-            isProcessingExtend={isProcessingExtend}
-            isProcessingAngleEdit={isProcessingAngleEdit}
-          />;
-        },
-        video: ({ src, alt }: { src?: string; alt?: string }) => {
-          if (!src) {
-            return null;
-          }
-          return <VideoPreview src={src} alt={alt} />;
-        },
-      }}
-      {...props}
-    />
-  ),
-  (prevProps: ResponseProps, nextProps: ResponseProps) => 
-    prevProps.children === nextProps.children && 
-    prevProps.onImageEdit === nextProps.onImageEdit && 
-    prevProps.onDrawingComplete === nextProps.onDrawingComplete &&
-    prevProps.onImageEnhance === nextProps.onImageEnhance &&
-    prevProps.onImageRmbg === nextProps.onImageRmbg &&
-    prevProps.onImageExtend === nextProps.onImageExtend &&
-    prevProps.onImageAngleEdit === nextProps.onImageAngleEdit &&
-    prevProps.isProcessingEnhance === nextProps.isProcessingEnhance &&
-    prevProps.isProcessingRmbg === nextProps.isProcessingRmbg &&
-    prevProps.isProcessingExtend === nextProps.isProcessingExtend &&
-    prevProps.isProcessingAngleEdit === nextProps.isProcessingAngleEdit
+// 注意：移除了 memo 的自定义比较函数，确保 isProcessing* 状态变化时组件能正确重新渲染
+// 之前的 memo 比较函数可能导致 Streamdown 内部的 ImagePreview 组件没有正确更新
+export const Response = ({ 
+  className, 
+  onImageEdit, 
+  onDrawingComplete, 
+  onImageEnhance, 
+  onImageRmbg, 
+  onImageExtend, 
+  onImageAngleEdit, 
+  isProcessingEnhance, 
+  isProcessingRmbg, 
+  isProcessingExtend, 
+  isProcessingAngleEdit, 
+  ...props 
+}: ResponseProps) => (
+  <Streamdown
+    className={cn(
+      "size-full [&>*:first-child]:mt-0 [&>*:last-child]:mb-0 [&_code]:whitespace-pre-wrap [&_code]:break-words [&_pre]:max-w-full [&_pre]:overflow-x-auto",
+      className
+    )}
+    components={{
+      img: ({ src, alt }: { src?: string; alt?: string }) => {
+        if (!src) {
+          return null;
+        }
+        return <ImagePreview 
+          src={src} 
+          alt={alt} 
+          onImageEdit={onImageEdit} 
+          onDrawingComplete={onDrawingComplete}
+          onImageEnhance={onImageEnhance}
+          onImageRmbg={onImageRmbg}
+          onImageExtend={onImageExtend}
+          onImageAngleEdit={onImageAngleEdit}
+          isProcessingEnhance={isProcessingEnhance}
+          isProcessingRmbg={isProcessingRmbg}
+          isProcessingExtend={isProcessingExtend}
+          isProcessingAngleEdit={isProcessingAngleEdit}
+        />;
+      },
+      video: ({ src, alt }: { src?: string; alt?: string }) => {
+        if (!src) {
+          return null;
+        }
+        return <VideoPreview src={src} alt={alt} />;
+      },
+    }}
+    {...props}
+  />
 );
 
 Response.displayName = "Response";