Files
qwen-code/packages/vscode-ide-companion/docs-tmp/PR_DESCRIPTION_FORMATTED.md
yiliang114 732220e651 wip(vscode-ide-companion): 实现 quick win 功能
- 将 WebView 调整到编辑器右侧
- 添加 ChatHeader 组件,实现会话下拉菜单
- 替换模态框为紧凑型下拉菜单
- 更新会话切换逻辑,显示当前标题
- 清理旧的会话选择器样式
基于 Claude Code v2.0.43 UI 分析实现。
2025-11-19 00:16:45 +08:00

4.0 KiB
Raw Blame History

TLDR

Added Chat interface to VSCode IDE Companion with support for interactive conversations with Qwen CLI, session management, and streaming responses.

image image

Key Changes:

  • Added WebView-based Chat UI with communication to Qwen CLI
  • Support for viewing, switching, and managing session lists
  • Real-time streaming message display

Dive Deeper

New Modules:

  • packages/vscode-ide-companion/src/acp/AcpConnection.ts - ACP JSON-RPC protocol implementation
  • packages/vscode-ide-companion/src/agents/QwenAgentManager.ts - Qwen Agent lifecycle management
  • packages/vscode-ide-companion/src/services/QwenSessionReader.ts - Read local Qwen session files (~/.qwen/tmp/)
  • packages/vscode-ide-companion/src/storage/ConversationStore.ts - Conversation history persistence (VSCode GlobalState)
  • packages/vscode-ide-companion/src/WebViewProvider.ts - WebView lifecycle management
  • packages/vscode-ide-companion/src/webview/ - React chat UI components

Build Configuration:

  • Updated esbuild.js to support dual-entry bundling (extension + webview)
  • Configured CSS injection plugin for stylesheet handling
  • Using React 18's new JSX transform (jsx: "react-jsx")

Reviewer Test Plan

Prerequisites

  1. Ensure Qwen CLI is installed: npm install -g @qwen/qwen-code
  2. Configure Qwen authentication (OpenAI API Key or Qwen OAuth)

Test Steps

1. Basic Functionality Test

Build Extension
cd packages/vscode-ide-companion
npm run build

Then press F5 in VSCode to launch the extension in debug mode.

2. Session Management Test

  • Click "📋 Sessions" button in the chat interface
  • Verify existing session list is displayed
  • Click " New Session" to create a new session
  • Switch to a historical session and verify messages load correctly
  • Send messages in both new and historical sessions

3. Tool Permission Test

  • Send a request requiring file operations: "Create a new file hello.txt"
  • Verify permission request popup appears with proper details
  • Test allow/reject functionality
  • Verify file operations complete as expected after permission grant

4. Streaming Response Test

  • Send any message to the chat
  • Verify responses stream in real-time (not appearing all at once)
  • Verify the streaming animation works smoothly

Testing Matrix

🍏 🪟 🐧
npm run
npx
Docker
Podman - -
Seatbelt - -

Tested and verified on macOS with npm run

Linked issues / bugs

This PR adds the core chat interface functionality to the VSCode IDE Companion extension, enabling users to interact with Qwen CLI directly from VSCode with full session management capabilities.