@allbluecn/web-app 0.23.6 → 0.24.0

package/src/components/desktop-agent/__tests__/agent-chat.test.tsx

@@ -1,194 +0,0 @@
-// SPDX-License-Identifier: AGPL-3.0-or-later
-// AllBlue - 理想之海
-// Copyright (C) 2026 AllBlue Contributors
-
-// 本地文件助手 · 对话区（桌面本地优先 P3-B5）：useChat 接线（懒取端点的 connection
-// 包装 + 稳定 threadId + forwardedProps.cwd）、消息渲染（空 assistant 消息跳过、
-// 工具调用折叠卡按 toolCallId 关联结果）、输入（Enter 发送 / Shift+Enter /
-// 输入法组合）、中止（按钮 + agent-abort 热键仅运行中生效）、错误文案映射。
-import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
-import { act, cleanup, fireEvent, render, screen } from '@testing-library/react'
-import { HotkeysProvider } from '@tanstack/react-hotkeys'
-import type { UIMessage } from '@tanstack/ai-client'
-import { TooltipProvider } from '@/components/ui/tooltip'
-import { appHotkeys } from '@/lib/hotkeys/registry'
-import { m } from '@/paraglide/messages.js'
-
-const chat = vi.hoisted(() => ({
-  messages: [] as unknown[],
-  isLoading: false,
-  error: undefined as Error | undefined,
-  sendMessage: vi.fn(async (_text: string) => {}),
-  stop: vi.fn(),
-  options: [] as Array<Record<string, unknown>>,
-}))
-
-vi.mock('@tanstack/ai-react', () => ({
-  useChat: (options: Record<string, unknown>) => {
-    chat.options.push(options)
-    return {
-      messages: chat.messages,
-      isLoading: chat.isLoading,
-      error: chat.error,
-      sendMessage: chat.sendMessage,
-      stop: chat.stop,
-    }
-  },
-}))
-// markdown 渲染器替身（react-markdown/shiki 与本组件行为无关，保测试轻量）
-vi.mock('@/components/harness/ai-message/components/markdown-content', () => ({
-  MarkdownContent: ({ content }: { content: string }) => <div data-testid="markdown">{content}</div>,
-}))
-
-import { AgentChat } from '../agent-chat'
-
-const piResult = (text: string) => ({ content: [{ type: 'text', text }], details: undefined })
-
-function renderChat(props: { cwd?: string | null; onRunningChange?: (running: boolean) => void } = {}) {
-  const ui = (cwd: string | null) => (
-    <HotkeysProvider appHotkeys={appHotkeys}>
-      <TooltipProvider>
-        <AgentChat cwd={cwd} onRunningChange={props.onRunningChange} />
-      </TooltipProvider>
-    </HotkeysProvider>
-  )
-  const cwd = props.cwd === undefined ? '/Users/x/proj' : props.cwd
-  const utils = render(ui(cwd))
-  return { ...utils, rerenderWith: (next: string | null) => utils.rerender(ui(next)) }
-}
-
-beforeEach(() => {
-  chat.messages = []
-  chat.isLoading = false
-  chat.error = undefined
-  chat.options = []
-  chat.sendMessage.mockClear()
-  chat.stop.mockClear()
-})
-
-afterEach(() => cleanup())
-
-describe('AgentChat · useChat 接线', () => {
-  it('connection 为懒取端点的包装（含 connect）、threadId 跨渲染稳定、forwardedProps 携带 cwd', () => {
-    const { rerenderWith } = renderChat({ cwd: '/Users/x/proj' })
-    const first = chat.options[0]!
-    expect(typeof (first.connection as { connect?: unknown }).connect).toBe('function')
-    expect(typeof first.threadId).toBe('string')
-    expect(first.forwardedProps).toEqual({ cwd: '/Users/x/proj' })
-    rerenderWith('/Users/x/proj')
-    const last = chat.options.at(-1)!
-    expect(last.threadId).toBe(first.threadId)
-    expect(last.connection).toBe(first.connection)
-  })
-})
-
-describe('AgentChat · 消息渲染', () => {
-  it('user 气泡 + assistant 正文；pi 回显产生的空 assistant 消息被跳过', () => {
-    chat.messages = [
-      { id: 'u1', role: 'user', parts: [{ type: 'text', content: '列出目录' }] },
-      { id: 'msg-1', role: 'assistant', parts: [] },
-      { id: 'msg-2', role: 'assistant', parts: [{ type: 'text', content: '   ' }] },
-      { id: 'msg-3', role: 'assistant', parts: [{ type: 'text', content: '目录里有 a.txt' }] },
-    ] satisfies UIMessage[]
-    renderChat()
-    expect(screen.getByText('列出目录')).toBeInTheDocument()
-    expect(screen.getByText('目录里有 a.txt')).toBeInTheDocument()
-    const rendered = screen.getAllByTestId('agent-message').map((el) => el.getAttribute('data-role'))
-    expect(rendered).toEqual(['user', 'assistant'])
-  })
-
-  it('工具调用：tool-call 渲染折叠卡，同 toolCallId 的 tool-result 不单独渲染', () => {
-    chat.messages = [
-      { id: 'u1', role: 'user', parts: [{ type: 'text', content: '总结项目' }] },
-      {
-        id: 'msg-2',
-        role: 'assistant',
-        parts: [
-          { type: 'tool-call', id: 'call_ls_1', name: 'ls', arguments: '{"path":"."}', state: 'complete', output: piResult('README.md\nsrc/') },
-          { type: 'tool-result', toolCallId: 'call_ls_1', content: JSON.stringify(piResult('README.md\nsrc/')), state: 'complete' },
-        ],
-      },
-    ] satisfies UIMessage[]
-    renderChat()
-    expect(screen.getAllByTestId('agent-tool-card-trigger')).toHaveLength(1)
-    expect(screen.getByText(m.agent_desktop_toolLs({ target: '.' }))).toBeInTheDocument()
-    expect(screen.getByText(m.agent_desktop_toolCountFiles({ count: 2 }))).toBeInTheDocument()
-  })
-
-  it('空对话：引导空态', () => {
-    renderChat()
-    expect(screen.getByText(m.agent_desktop_chatEmptyTitle())).toBeInTheDocument()
-  })
-})
-
-describe('AgentChat · 输入与发送', () => {
-  it('Enter 发送（trim）并清空输入；Shift+Enter 与输入法组合中的 Enter 不发送', () => {
-    renderChat()
-    const textarea = screen.getByRole('textbox')
-    fireEvent.change(textarea, { target: { value: '  总结这个项目  ' } })
-    fireEvent.keyDown(textarea, { key: 'Enter', shiftKey: true })
-    fireEvent.keyDown(textarea, { key: 'Enter', isComposing: true })
-    expect(chat.sendMessage).not.toHaveBeenCalled()
-    fireEvent.keyDown(textarea, { key: 'Enter' })
-    expect(chat.sendMessage).toHaveBeenCalledWith('总结这个项目')
-    expect(textarea).toHaveValue('')
-  })
-
-  it('发送按钮：空输入禁用，有内容可点', () => {
-    renderChat()
-    const send = screen.getByRole('button', { name: m.agent_desktop_chatSend() })
-    expect(send).toBeDisabled()
-    fireEvent.change(screen.getByRole('textbox'), { target: { value: '找出所有 TODO' } })
-    fireEvent.click(screen.getByRole('button', { name: m.agent_desktop_chatSend() }))
-    expect(chat.sendMessage).toHaveBeenCalledWith('找出所有 TODO')
-  })
-
-  it('无授权目录（cwd=null）：输入禁用 + 引导先选目录', () => {
-    renderChat({ cwd: null })
-    expect(screen.getByRole('textbox')).toBeDisabled()
-    expect(screen.getByTestId('agent-chat-cwd')).toHaveTextContent(m.agent_desktop_chatNoWorkspace())
-  })
-})
-
-describe('AgentChat · 中止（按钮 + agent-abort 热键）', () => {
-  it('运行中：显示中止按钮（替代发送）并调用 stop；思考指示可见', () => {
-    chat.isLoading = true
-    renderChat()
-    expect(screen.queryByRole('button', { name: m.agent_desktop_chatSend() })).toBeNull()
-    fireEvent.click(screen.getByRole('button', { name: m.agent_desktop_chatStop() }))
-    expect(chat.stop).toHaveBeenCalledTimes(1)
-    expect(screen.getByTestId('agent-chat-thinking')).toBeInTheDocument()
-  })
-
-  it('运行中按 Mod+. → stop（声明即绑定：appHotkeys["agent-abort"]）', () => {
-    chat.isLoading = true
-    renderChat()
-    act(() => {
-      fireEvent.keyDown(document.body, { key: '.', code: 'Period', ctrlKey: true })
-    })
-    expect(chat.stop).toHaveBeenCalledTimes(1)
-  })
-
-  it('未运行时 Mod+. 不触发 stop（enabled 门控）', () => {
-    renderChat()
-    act(() => {
-      fireEvent.keyDown(document.body, { key: '.', code: 'Period', ctrlKey: true })
-    })
-    expect(chat.stop).not.toHaveBeenCalled()
-  })
-
-  it('运行态变化通知父级（锁定目录切换用）', () => {
-    const onRunningChange = vi.fn()
-    chat.isLoading = true
-    renderChat({ onRunningChange })
-    expect(onRunningChange).toHaveBeenLastCalledWith(true)
-  })
-})
-
-describe('AgentChat · 错误文案', () => {
-  it('401 令牌失效 → 可读提示（role=alert）', () => {
-    chat.error = Object.assign(new Error('HTTP error! status: 401'), { name: 'StreamHttpError', status: 401 })
-    renderChat()
-    expect(screen.getByRole('alert')).toHaveTextContent(m.agent_desktop_errorUnauthorized())
-  })
-})

package/src/components/desktop-agent/agent-chat.tsx

@@ -1,222 +0,0 @@
-// SPDX-License-Identifier: AGPL-3.0-or-later
-// AllBlue - 理想之海
-// Copyright (C) 2026 AllBlue Contributors
-
-// 本地文件助手 · 对话区（桌面本地优先 P3-B5）：useChat 直连 Pro desktop 域
-// AgentService 的 `POST /prompt`（AG-UI SSE）。
-// - connection：lib/desktop-agent/connection 包装——每次 connect 懒取桌面桥的 agent
-//   端点（新壳 agentCredentials 按需取 {port, token}，旧壳回落 appInfo 的
-//   agentPort/agentToken；backend 重启换端口/令牌后下一问即用新值），引用稳定。
-// - threadId：mount 级稳定值（useChat 1.0 起必填，变化即重建 ChatClient）。B4 端点
-//   每次 POST 新建 pi 会话，threadId 仅作 run 归属回显——一期不保留多轮上下文，
-//   输入区常驻提示告知。
-// - cwd：经 forwardedProps 进 RunAgentInput.forwardedProps（端点 extractCwd 取值位，
-//   服务端再按 workspaces.json 复核授权）；父级以 key={cwd} 让每个目录一份会话。
-// - 消息：user 气泡 / assistant Markdown + 工具调用折叠卡（同 toolCallId 的
-//   tool-result 已由 processor 挂到 tool-call part.output，不重复渲染）；pi 对
-//   user / toolResult 消息也发 message_start/end，processor 会建空 assistant 消息，
-//   渲染层跳过（B3B4 报告疑虑 3）。
-// - 输入：Enter 发送 / Shift+Enter 换行 / 输入法组合中的 Enter 不发送。
-// - 中止：运行中发送按钮换成「中止」+ 应用热键 agent-abort（Mod+.，T23 声明即绑定，
-//   仅运行中 enabled）。
-import { useEffect, useMemo, useRef, useState, type KeyboardEvent, type UIEvent } from 'react'
-import { useChat } from '@tanstack/ai-react'
-import type { UIMessage } from '@tanstack/ai-client'
-import { useAppHotkeys, useHotkey } from '@tanstack/react-hotkeys'
-import { ArrowUp, CircleAlert, FolderSearch, Loader2, MessageSquareText, Square } from 'lucide-react'
-import { AgentToolCard, type AgentToolResultPart } from '@/components/desktop-agent/agent-tool-card'
-import { MarkdownContent } from '@/components/harness/ai-message/components/markdown-content'
-import { ShortcutBadge } from '@/components/hotkeys/shortcut-badge'
-import { Empty, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle } from '@/components/ui/empty'
-import {
-  InputGroup,
-  InputGroupAddon,
-  InputGroupButton,
-  InputGroupTextarea,
-} from '@/components/ui/input-group'
-import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip'
-import { createDesktopAgentConnection } from '@/lib/desktop-agent/connection'
-import { describeDesktopAgentError } from '@/lib/desktop-agent/errors'
-import { formatAppHotkeyForBadge } from '@/lib/hotkeys/registry'
-import { m } from '@/paraglide/messages.js'
-
-/** 距底部小于该值视为「贴底」：新内容到达时自动滚到底；用户上翻阅读时不打断 */
-const STICK_TO_BOTTOM_PX = 80
-
-/** 有可见内容：user 有正文；assistant 有非空正文或工具调用（空消息对跳过） */
-function hasVisibleContent(message: UIMessage): boolean {
-  return message.parts.some((part) =>
-    part.type === 'text' ? part.content.trim() !== '' : part.type === 'tool-call',
-  )
-}
-
-function AgentMessage({ message }: { message: UIMessage }) {
-  if (message.role === 'user') {
-    const text = message.parts.map((part) => (part.type === 'text' ? part.content : '')).join('')
-    return (
-      <div className="flex justify-end" data-testid="agent-message" data-role="user">
-        <div className="max-w-xl rounded-2xl rounded-br-sm bg-primary px-3.5 py-2 text-sm whitespace-pre-wrap text-primary-foreground">
-          {text}
-        </div>
-      </div>
-    )
-  }
-  const results = new Map<string, AgentToolResultPart>()
-  for (const part of message.parts) {
-    if (part.type === 'tool-result') results.set(part.toolCallId, part)
-  }
-  return (
-    <div className="flex flex-col gap-2 text-sm" data-testid="agent-message" data-role="assistant">
-      {message.parts.map((part, index) => {
-        if (part.type === 'text') {
-          // parts 流式只追加不重排，index key 稳定
-          return part.content.trim() === '' ? null : (
-            <MarkdownContent key={index} content={part.content} skipCodeHighlighting />
-          )
-        }
-        if (part.type === 'tool-call') {
-          return <AgentToolCard key={part.id || index} part={part} result={results.get(part.id)} />
-        }
-        return null
-      })}
-    </div>
-  )
-}
-
-export interface AgentChatProps {
-  /** 当前工作目录（授权清单选中项）；null = 尚未授权/选择，输入禁用 */
-  cwd: string | null
-  /** 运行态变化通知父级（运行中锁定目录切换）；须传稳定引用（如 setState） */
-  onRunningChange?: (running: boolean) => void
-}
-
-export function AgentChat({ cwd, onRunningChange }: AgentChatProps) {
-  const [connection] = useState(() => createDesktopAgentConnection())
-  const [threadId] = useState(() => crypto.randomUUID())
-  const forwardedProps = useMemo(() => ({ cwd: cwd ?? '' }), [cwd])
-  const { messages, sendMessage, stop, isLoading, error } = useChat({ connection, threadId, forwardedProps })
-
-  const [input, setInput] = useState('')
-  const scrollRef = useRef<HTMLDivElement>(null)
-  const stickToBottomRef = useRef(true)
-
-  // 声明即绑定：agent-abort 单一来源 lib/hotkeys/registry.ts
-  const hk = useAppHotkeys()
-  useHotkey(hk['agent-abort'], () => stop(), { enabled: isLoading })
-
-  useEffect(() => {
-    onRunningChange?.(isLoading)
-  }, [isLoading, onRunningChange])
-  // 运行中被卸载（离开页面）：解除父级锁定
-  useEffect(() => () => onRunningChange?.(false), [onRunningChange])
-
-  const visible = useMemo(() => messages.filter(hasVisibleContent), [messages])
-
-  useEffect(() => {
-    const el = scrollRef.current
-    if (el && stickToBottomRef.current) el.scrollTop = el.scrollHeight
-  }, [visible, isLoading])
-
-  const onScroll = (event: UIEvent<HTMLDivElement>) => {
-    const el = event.currentTarget
-    stickToBottomRef.current = el.scrollHeight - el.scrollTop - el.clientHeight < STICK_TO_BOTTOM_PX
-  }
-
-  const canSend = cwd !== null && input.trim() !== '' && !isLoading
-
-  const submit = () => {
-    if (!canSend) return
-    const text = input.trim()
-    setInput('')
-    stickToBottomRef.current = true
-    // 失败由 useChat error 态渲染（describeDesktopAgentError），这里只吞 unhandledrejection
-    Promise.resolve(sendMessage(text)).catch(() => {})
-  }
-
-  const onKeyDown = (event: KeyboardEvent<HTMLTextAreaElement>) => {
-    if (event.key !== 'Enter' || event.shiftKey || event.nativeEvent.isComposing) return
-    event.preventDefault()
-    submit()
-  }
-
-  return (
-    <section className="flex min-h-0 flex-1 flex-col overflow-hidden rounded-xl border bg-card">
-      <div className="flex items-center gap-2 border-b px-4 py-2.5 text-xs text-muted-foreground">
-        <FolderSearch className="size-3.5 shrink-0" />
-        <span className="min-w-0 truncate" data-testid="agent-chat-cwd">
-          {cwd ? m.agent_desktop_chatCwd({ path: cwd }) : m.agent_desktop_chatNoWorkspace()}
-        </span>
-      </div>
-
-      <div ref={scrollRef} onScroll={onScroll} className="min-h-0 flex-1 overflow-y-auto overscroll-contain px-4 py-4">
-        {visible.length === 0 && !isLoading ? (
-          <Empty className="h-full">
-            <EmptyHeader>
-              <EmptyMedia variant="icon">
-                <MessageSquareText />
-              </EmptyMedia>
-              <EmptyTitle>{m.agent_desktop_chatEmptyTitle()}</EmptyTitle>
-              <EmptyDescription>{m.agent_desktop_chatEmptyHint()}</EmptyDescription>
-            </EmptyHeader>
-          </Empty>
-        ) : (
-          <div className="mx-auto flex w-full max-w-3xl flex-col gap-5">
-            {visible.map((message) => (
-              <AgentMessage key={message.id} message={message} />
-            ))}
-            {isLoading && (
-              <div className="flex items-center gap-2 text-sm text-muted-foreground" data-testid="agent-chat-thinking">
-                <Loader2 className="size-4 animate-spin" />
-                {m.agent_desktop_chatThinking()}
-              </div>
-            )}
-          </div>
-        )}
-      </div>
-
-      {error && (
-        <div
-          role="alert"
-          className="mx-4 mb-2 flex items-start gap-2 rounded-lg border border-destructive/40 bg-destructive/5 px-3 py-2 text-xs text-destructive"
-        >
-          <CircleAlert className="mt-0.5 size-3.5 shrink-0" />
-          <span className="min-w-0 wrap-break-word">{describeDesktopAgentError(error)}</span>
-        </div>
-      )}
-
-      <div className="border-t p-3">
-        <InputGroup>
-          <InputGroupTextarea
-            value={input}
-            onChange={(event) => setInput(event.target.value)}
-            onKeyDown={onKeyDown}
-            disabled={cwd === null}
-            placeholder={cwd ? m.agent_desktop_chatPlaceholder() : m.agent_desktop_chatNoWorkspace()}
-            className="max-h-40"
-          />
-          <InputGroupAddon align="block-end">
-            <span className="min-w-0 truncate text-xs font-normal">{m.agent_desktop_chatIndependentHint()}</span>
-            {isLoading ? (
-              <Tooltip>
-                <TooltipTrigger
-                  render={<InputGroupButton variant="outline" size="sm" className="ml-auto" onClick={() => stop()} />}
-                >
-                  <Square className="fill-current" />
-                  {m.agent_desktop_chatStop()}
-                </TooltipTrigger>
-                <TooltipContent>
-                  <ShortcutBadge keys={formatAppHotkeyForBadge(hk['agent-abort'].hotkey)} />
-                </TooltipContent>
-              </Tooltip>
-            ) : (
-              <InputGroupButton variant="default" size="sm" className="ml-auto" disabled={!canSend} onClick={submit}>
-                <ArrowUp />
-                {m.agent_desktop_chatSend()}
-              </InputGroupButton>
-            )}
-          </InputGroupAddon>
-        </InputGroup>
-      </div>
-    </section>
-  )
-}