From 81e437d0b475c79a0bfc696eb57d6a19b33e0e4a Mon Sep 17 00:00:00 2001
From: gaoziman <2942894660@qq.com>
Date: Sat, 27 Dec 2025 15:01:57 +0800
Subject: [PATCH] =?UTF-8?q?feat(Hook):=20useStreamChat=20=E6=94=AF?=
 =?UTF-8?q?=E6=8C=81=E5=9B=BE=E7=89=87=E7=94=9F=E6=88=90=E7=8A=B6=E6=80=81?=
 =?UTF-8?q?=E7=AE=A1=E7=90=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 新增 GeneratedImageData 类型定义
- 添加 isGeneratingImage 和 generatedImages 状态
- 处理流式返回的图片生成事件
- 支持图片生成完成后的状态更新
---
 src/hooks/useStreamChat.ts | 68 +++++++++++++++++++++++++++++++++++++-
 1 file changed, 67 insertions(+), 1 deletion(-)

diff --git a/src/hooks/useStreamChat.ts b/src/hooks/useStreamChat.ts
index e0bf493..14e5466 100644
--- a/src/hooks/useStreamChat.ts
+++ b/src/hooks/useStreamChat.ts
@@ -14,7 +14,7 @@ import {
 } from '@/utils/document-utils';
 
 export interface StreamMessage {
-  type: 'thinking' | 'text' | 'tool_use_start' | 'tool_execution_result' | 'tool_search_images' | 'tool_search_videos' | 'pyodide_execution_required' | 'tool_used' | 'done' | 'error';
+  type: 'thinking' | 'text' | 'tool_use_start' | 'tool_execution_result' | 'tool_search_images' | 'tool_search_videos' | 'pyodide_execution_required' | 'tool_used' | 'done' | 'error' | 'image_generation_start' | 'generated_image' | 'image_generation_complete';
   content?: string;
   id?: string;
   name?: string;
@@ -36,6 +36,11 @@ export interface StreamMessage {
   // 工具使用相关
   toolName?: string;
   usedTools?: string[];
+  // AI 图片生成相关
+  model?: string;
+  image?: GeneratedImageData;
+  index?: number;
+  imageCount?: number;
 }
 
 // 搜索图片数据类型
@@ -62,6 +67,14 @@ export interface SearchVideoData {
   coverImage: string;
 }
 
+// AI 生成的图片数据类型（Gemini 等图片生成模型返回）
+export interface GeneratedImageData {
+  mimeType: string;    // 图片 MIME 类型，如 "image/png"、"image/jpeg"
+  data: string;        // Base64 编码的图片数据
+  width?: number;      // 图片宽度（可选）
+  height?: number;     // 图片高度（可选）
+}
+
 export interface ChatMessage {
   id: string;
   role: 'user' | 'assistant';
@@ -89,6 +102,10 @@ export interface ChatMessage {
     message: string;
     progress?: number;
   };
+  // AI 生成的图片（Gemini 等图片生成模型）
+  generatedImages?: GeneratedImageData[];
+  // 是否正在生成图片
+  isGeneratingImage?: boolean;
 }
 
 /**
@@ -616,6 +633,55 @@ export function useStreamChat() {
                     return updated;
                   });
                 }
+              } else if (event.type === 'image_generation_start') {
+                // 图片生成开始
+                console.log('[useStreamChat] Image generation started, model:', event.model);
+                setMessages((prev) => {
+                  const updated = [...prev];
+                  const lastIndex = updated.length - 1;
+                  if (updated[lastIndex]?.role === 'assistant') {
+                    updated[lastIndex] = {
+                      ...updated[lastIndex],
+                      isGeneratingImage: true,
+                    };
+                  }
+                  return updated;
+                });
+              } else if (event.type === 'generated_image') {
+                // 收到一张生成的图片
+                if (event.image) {
+                  console.log('[useStreamChat] Received generated image:', {
+                    mimeType: event.image.mimeType,
+                    dataLength: event.image.data?.length || 0,
+                    index: event.index,
+                  });
+                  setMessages((prev) => {
+                    const updated = [...prev];
+                    const lastIndex = updated.length - 1;
+                    if (updated[lastIndex]?.role === 'assistant') {
+                      const existingGeneratedImages = updated[lastIndex].generatedImages || [];
+                      updated[lastIndex] = {
+                        ...updated[lastIndex],
+                        generatedImages: [...existingGeneratedImages, event.image!],
+                      };
+                    }
+                    return updated;
+                  });
+                }
+              } else if (event.type === 'image_generation_complete') {
+                // 图片生成完成
+                console.log('[useStreamChat] Image generation complete, count:', event.imageCount);
+                setMessages((prev) => {
+                  const updated = [...prev];
+                  const lastIndex = updated.length - 1;
+                  if (updated[lastIndex]?.role === 'assistant') {
+                    updated[lastIndex] = {
+                      ...updated[lastIndex],
+                      isGeneratingImage: false,
+                    };
+                  }
+                  return updated;
+                });
               } else if (event.type === 'pyodide_execution_required') {
                 // 需要在浏览器端执行 Python 图形代码
                 const code = event.code || '';