@huyooo/ai-chat-frontend-react 0.1.6 → 0.1.8

package/src/types/index.ts

@@ -1,26 +1,29 @@
 /**
  * AI Chat 前端类型定义
- * 核心类型（ChatAdapter, SessionRecord, MessageRecord 等）从 bridge-electron 导出
- * 这里只定义前端特有的类型
+ * 核心类型从 bridge-electron 导出，保持类型一致性
+ * 
+ * 架构：消息内容使用 ContentPart 数组，支持流式渲染和自定义 UI
  */
 
-// 从 bridge-electron 导入类型（用于本文件）
+// 从 bridge-electron 导入类型
 import type {
   ChatMode as ChatModeType,
-  ModelConfig as ModelConfigType,
-  ModelProvider as ModelProviderType,
   ThinkingMode as ThinkingModeType,
   SessionRecord as SessionRecordType,
   MessageRecord as MessageRecordType,
+  ModelOption as ModelOptionType,
+  ProviderType as ProviderTypeType,
 } from '@huyooo/ai-chat-bridge-electron/renderer'
 
 // 重新导出核心类型
 export type ChatMode = ChatModeType
-export type ModelConfig = ModelConfigType
-export type ModelProvider = ModelProviderType
 export type ThinkingMode = ThinkingModeType
 export type SessionRecord = SessionRecordType
 export type MessageRecord = MessageRecordType
+export type ModelOption = ModelOptionType
+export type ProviderType = ProviderTypeType
+
+// ==================== Content Part 类型 ====================
 
 /** 搜索结果 */
 export interface SearchResult {
@@ -29,115 +32,181 @@ export interface SearchResult {
   snippet: string
 }
 
-/** 工具调用 */
-export interface ToolCall {
+/** 文本内容 Part */
+export interface TextPart {
+  type: 'text'
+  text: string
+}
+
+/** 思考过程 Part */
+export interface ThinkingPart {
+  type: 'thinking'
+  text: string
+  status: 'running' | 'done'
+  duration?: number // 秒
+}
+
+/** 搜索 Part */
+export interface SearchPart {
+  type: 'search'
+  query?: string
+  results?: SearchResult[]
+  status: 'running' | 'done'
+}
+
+/** 工具调用 Part */
+export interface ToolCallPart {
+  type: 'tool_call'
+  id: string
   name: string
   args?: Record<string, unknown>
-  result?: string
-  status: 'running' | 'success' | 'error'
+  status: 'pending' | 'running' | 'done' | 'error' | 'cancelled' | 'skipped'  // pending: 等待用户批准, cancelled: 已取消, skipped: 已跳过
+  result: unknown | null  // 执行结果，null 表示尚未执行或没有结果
+}
+
+/** 工具结果 Part - 用于自定义 UI 渲染（备用，主要使用 ToolCallPart） */
+export interface ToolResultPart {
+  type: 'tool_result'
+  id: string
+  name: string
+  args?: Record<string, unknown>
+  result: unknown  // 解析后的结构化数据
+  status: 'done' | 'error' | 'cancelled' | 'skipped'
+}
+
+/** 图片 Part */
+export interface ImagePart {
+  type: 'image'
+  url: string
+}
+
+/** 错误 Part */
+export interface ErrorPart {
+  type: 'error'
+  message: string
+  category?: string
+  retryable?: boolean
+}
+
+/** 内容 Part 联合类型 */
+export type ContentPart =
+  | TextPart
+  | ThinkingPart
+  | SearchPart
+  | ToolCallPart
+  | ToolResultPart
+  | ImagePart
+  | ErrorPart
+
+/** 内容 Part 类型字符串 */
+export type ContentPartType = ContentPart['type']
+
+/** 步骤折叠模式 */
+export type StepsExpandedType = 'open' | 'close' | 'auto'
+
+// ==================== 消息类型 ====================
+
+/** 错误详情（结构化错误信息） */
+export interface ErrorDetails {
+  category?: string
+  message: string
+  code?: string
+  statusCode?: number
+  retryable?: boolean
+  retryAfter?: number
 }
 
-/** 聊天消息（前端显示用） */
+/** 聊天消息（前端显示用）- 新架构：基于 parts 数组 */
 export interface ChatMessage {
   id: string
   role: 'user' | 'assistant'
-  content: string
+  /** 内容 parts 数组 - 核心渲染数据 */
+  parts: ContentPart[]
+  /** 生成此消息时使用的模型 */
+  model?: string
+  /** 生成此消息时使用的模式 (ask/agent) */
+  mode?: string
+  /** 生成此消息时是否启用 web 搜索 */
+  webSearchEnabled?: boolean
+  /** 生成此消息时是否启用深度思考 */
+  thinkingEnabled?: boolean
+  /** 用户上传的图片（仅用户消息） */
   images?: string[]
-  thinking?: string
-  thinkingComplete?: boolean
-  searchResults?: SearchResult[]
-  searching?: boolean
-  toolCalls?: ToolCall[]
-  copied?: boolean
+  /** 是否正在加载 */
   loading?: boolean
+  /** 是否已复制 */
+  copied?: boolean
+  /** 消息时间戳 */
   timestamp?: Date
+  /** 错误详情（如果有错误） */
+  error?: ErrorDetails
+  /** 是否被用户中止 */
+  aborted?: boolean
 }
 
-/** 默认模型列表 */
-export const DEFAULT_MODELS: ModelConfigType[] = [
-  {
-    provider: 'openrouter',
-    model: 'anthropic/claude-opus-4.5',
-    displayName: 'Claude Opus 4.5',
-    supportsTools: true,
-    supportsWebSearch: true,
-    supportedThinkingModes: ['enabled', 'disabled'],
-  },
-  {
-    provider: 'doubao',
-    model: 'doubao-seed-1-6-251015',
-    displayName: 'Doubao Seed',
-    supportsTools: true,
-    supportsWebSearch: true,
-    supportedThinkingModes: ['enabled', 'disabled'],
-  },
-  {
-    provider: 'deepseek',
-    model: 'deepseek-v3-1-terminus',
-    displayName: 'DeepSeek V3',
-    supportsTools: true,
-    supportsWebSearch: true,
-    supportedThinkingModes: ['enabled', 'disabled'],
-  },
-  {
-    provider: 'qwen',
-    model: 'qwen3-max-preview',
-    displayName: 'Qwen Max',
-    supportsTools: true,
-    supportsWebSearch: true,
-    supportedThinkingModes: ['enabled', 'disabled'],
-  },
-  {
-    provider: 'gemini',
-    model: 'gemini-3-pro-preview',
-    displayName: 'Gemini 3 Pro',
-    supportsTools: true,
-    supportsWebSearch: true,
-    supportedThinkingModes: ['enabled', 'disabled'],
-  },
-]
-
-// ================ 以下为向后兼容的类型 ================
-
-/** @deprecated 使用 SessionRecord */
-export interface ChatSession {
-  id: string
-  title: string
-  messages: ChatMessage[]
-  createdAt: Date
-  updatedAt: Date
+/** 获取消息的纯文本内容（用于复制、保存等） */
+export function getMessageText(message: ChatMessage): string {
+  return message.parts
+    .filter((p): p is TextPart => p.type === 'text')
+    .map(p => p.text)
+    .join('')
+}
+
+/** 输入区配置快照（用于历史回溯/重发） */
+export interface ChatInputOptions {
+  mode: ChatMode
+  model: string
+  webSearchEnabled: boolean
+  thinkingEnabled: boolean
 }
 
-/** 音视频操作类型 */
-export interface MediaOperation {
+// ==================== 兼容旧类型（逐步废弃）====================
+
+/** @deprecated 使用 ContentPart 替代 */
+export type ExecutionStepType = 'thinking' | 'search' | 'tool_call' | 'error'
+
+/** @deprecated 使用 ContentPart 替代 */
+export type ExecutionStepStatus = 'running' | 'completed' | 'error'
+
+/** @deprecated 使用 ContentPart 替代 */
+export type ExecutionStep = {
   id: string
-  type: 'clip' | 'transcode' | 'merge' | 'extract_audio' | 'add_subtitle' | 'analyze'
-  description: string
-  sourceFiles: string[]
-  targetFile?: string
-  parameters?: Record<string, unknown>
-  status?: 'pending' | 'applied' | 'rejected'
-  preview?: string
-}
-
-/** @deprecated 使用字符串枚举 */
-export type AiModel = 'gemini-3-pro-preview' | 'gemini-3-pro-image-preview'
-
-export enum FileType {
-  FOLDER = 'folder',
-  IMAGE = 'image',
-  VIDEO = 'video',
-  AUDIO = 'audio',
-  TEXT = 'text',
-  PDF = 'pdf',
-  CODE = 'code',
-  ARCHIVE = 'archive',
-  OTHER = 'other'
-}
-
-export interface DiffStat {
-  file: string
-  additions: number
-  deletions: number
-  type: 'modified' | 'added' | 'deleted'
+  type: ExecutionStepType
+  status: ExecutionStepStatus
+  startedAt?: number
+  completedAt?: number
+  duration?: number
+  content?: string
+  query?: string
+  results?: SearchResult[]
+  callId?: string
+  name?: string
+  args?: Record<string, unknown>
+  result?: string
+  message?: string
+  category?: string
+}
+
+/** @deprecated 使用 ContentPart 替代 - 思考步骤类型 */
+export type ThinkingStep = ExecutionStep & {
+  type: 'thinking'
+  status: 'running' | 'completed'
+}
+
+/** @deprecated 使用 ContentPart 替代 - 搜索步骤类型 */
+export type SearchStep = ExecutionStep & {
+  type: 'search'
+  status: 'running' | 'completed'
+}
+
+/** @deprecated 使用 ContentPart 替代 - 工具调用步骤类型 */
+export type ToolCallStep = ExecutionStep & {
+  type: 'tool_call'
+  status: 'running' | 'completed' | 'error'
+}
+
+/** @deprecated 使用 ContentPart 替代 - 错误步骤类型 */
+export type ErrorStep = ExecutionStep & {
+  type: 'error'
+  status: 'error'
 }

package/src/utils/fileIcon.ts

@@ -0,0 +1,49 @@
+/**
+ * 根据文件名或路径获取对应的图标
+ */
+export function getFileIcon(nameOrPath: string): string {
+  const name = basename(nameOrPath).toLowerCase();
+  const ext = name.includes('.') ? name.slice(name.lastIndexOf('.')) : '';
+
+  if (ext === '.vue') return 'vscode-icons:file-type-vue';
+  if (ext === '.tsx') return 'vscode-icons:file-type-reactts';
+  if (ext === '.jsx') return 'vscode-icons:file-type-reactjs';
+  if (ext === '.ts') return 'vscode-icons:file-type-typescript';
+  if (ext === '.js') return 'vscode-icons:file-type-js';
+  if (ext === '.css') return 'vscode-icons:file-type-css';
+  if (ext === '.scss' || ext === '.sass') return 'vscode-icons:file-type-scss';
+  if (ext === '.less') return 'vscode-icons:file-type-less';
+  if (ext === '.json') return 'vscode-icons:file-type-json';
+  if (ext === '.yaml' || ext === '.yml') return 'vscode-icons:file-type-yaml';
+  if (ext === '.xml') return 'vscode-icons:file-type-xml';
+  if (ext === '.md') return 'vscode-icons:file-type-markdown';
+  if (ext === '.txt') return 'vscode-icons:file-type-text';
+  if (['.png', '.jpg', '.jpeg', '.gif', '.webp', '.svg', '.ico'].includes(ext)) {
+    return 'vscode-icons:file-type-image';
+  }
+  if (ext === '.html' || ext === '.htm') return 'vscode-icons:file-type-html';
+  if (ext === '.py') return 'vscode-icons:file-type-python';
+  if (ext === '.go') return 'vscode-icons:file-type-go';
+  if (ext === '.rs') return 'vscode-icons:file-type-rust';
+  if (ext === '.sh' || ext === '.bash' || ext === '.zsh') return 'vscode-icons:file-type-shell';
+
+  return 'lucide:file';
+}
+
+/**
+ * 获取路径的文件名部分
+ */
+export function basename(p: string): string {
+  const normalized = p.replace(/\\/g, '/');
+  const idx = normalized.lastIndexOf('/');
+  return idx >= 0 ? normalized.slice(idx + 1) || normalized : normalized;
+}
+
+/**
+ * 获取路径的目录部分
+ */
+export function dirname(p: string): string {
+  const normalized = p.replace(/\\/g, '/');
+  const idx = normalized.lastIndexOf('/');
+  return idx > 0 ? normalized.slice(0, idx) : '';
+}