feat(webview): 支持会话重命名与删除及聊天面板独立打开

- 实现AlertDialog组件及相关子组件用于UI交互弹窗
- AssistantBubble组件新增反馈弹窗及请求ID复制功能
- ChatProvider新增renameSession与deleteSession方法，并调用chatService接口
- chatService新增重命名和删除会话相关RPC方法
- 在App组件中传递重命名与删除会话的action
- Header组件新增重命名和删除会话的回调支持
- router层新增重命名、删除会话、打开聊天面板等RPC端点
- extension新增openChatPanel实现，支持面板独占显示及切换
- 添加ContextMenu组件库用于右键菜单拓展
- 修改InputPrompt类型支持SessionMessage类型
- 统一Messages组件中消息内容的空值处理
- 调整webview主题CSS变量以匹配侧边栏背景
- SessionList组件引入编辑与删除图标及相关回调支持
- 修正launch.json预启动任务名称以支持开发启动配置

Author: hqwlkj

packages/vscode-ide-companion/.vscode/launch.json

@@ -7,7 +7,7 @@
       "request": "launch",
       "args": ["--extensionDevelopmentPath=${workspaceFolder}"],
       "outFiles": ["${workspaceFolder}/dist/**/*.js"],
-      "preLaunchTask": "npm: dev:webview",
+      "preLaunchTask": "Start Dev Watch",
       "presentation": {
         "group": "deepcode"
       }

packages/vscode-ide-companion/.vscode/tasks.json

@@ -1,11 +1,16 @@
 {
   "version": "2.0.0",
   "tasks": [
+    {
+      "label": "Start Dev Watch",
+      "dependsOn": ["npm: watch", "npm: dev:webview"],
+      "dependsOrder": "parallel",
+      "problemMatcher": []
+    },
     {
       "type": "npm",
       "script": "dev:webview",
       "isBackground": true,
-      "dependsOn": ["npm: watch"],
       "problemMatcher": {
         "owner": "custom",
         "pattern": {
@@ -33,8 +38,8 @@
         },
         "background": {
           "activeOnStart": true,
-          "beginsPattern": "^.*Watching.*$",
-          "endsPattern": "^$"
+          "beginsPattern": "^.*Copied core/templates.*$",
+          "endsPattern": "^.*Watching for changes.*$"
         }
       },
       "group": "none"

packages/vscode-ide-companion/src/extension.ts

@@ -36,6 +36,7 @@ export class DeepCodeViewProvider implements vscode.WebviewViewProvider {
 
   private readonly context: vscode.ExtensionContext;
   private webviewView: vscode.WebviewView | undefined;
+  private activeChatPanel: vscode.WebviewPanel | undefined;
   private readonly sessionManager: SessionManager;
 
   constructor(context: vscode.ExtensionContext) {
@@ -132,6 +133,47 @@ export class DeepCodeViewProvider implements vscode.WebviewViewProvider {
         }
         return null;
       },
+      openChatPanel: (sessionId, viewColumn) => {
+        // Dispose previous chat panel if exists (mutual exclusion)
+        if (this.activeChatPanel) {
+          this.activeChatPanel.dispose();
+          this.activeChatPanel = undefined;
+        }
+
+        const panel = vscode.window.createWebviewPanel(
+          "deepcode.chatPanel",
+          "Deep Code",
+          { viewColumn: viewColumn as unknown as vscode.ViewColumn, preserveFocus: true },
+          {
+            enableScripts: true,
+            retainContextWhenHidden: true,
+            localResourceRoots: [vscode.Uri.file(path.join(this.context.extensionPath, "dist", "webview"))],
+          }
+        );
+
+        // Track panel and clean up on dispose
+        this.activeChatPanel = panel;
+        panel.onDidDispose(() => {
+          if (this.activeChatPanel === panel) {
+            this.activeChatPanel = undefined;
+          }
+        });
+
+        // Build RPC context for this panel
+        const panelContext: RouterContext = {
+          ...rpcContext,
+          postMessage: (message) => panel.webview.postMessage(message),
+        };
+
+        // Attach RPC router and load content
+        attachRouterToPanel(appRouter, panel, panelContext);
+        getWebviewContent(this.context, panel.webview).then((html) => {
+          panel.webview.html = html;
+        });
+
+        // Switch to this session
+        this.sessionManager.setActiveSessionId(sessionId);
+      },
     };
 
     // Attach RPC router

packages/vscode-ide-companion/src/router.ts

@@ -1,6 +1,9 @@
 import { initWRPC } from "@webview-rpc/host";
+import * as os from "node:os";
+import * as path from "node:path";
 import * as vscodeApi from "vscode";
 import z from "zod";
+import { getProjectCode } from "@vegamo/deepcode-core";
 import type { SessionManager, SkillInfo, UserToolPermission, PermissionScope } from "@vegamo/deepcode-core";
 
 export interface RouterContext {
@@ -11,6 +14,7 @@ export interface RouterContext {
   getWorkspaceRoot: () => string;
   openSettings: () => Promise<void>;
   getActiveEditor: () => { fileName: string; languageId: string; lineCount: number } | null;
+  openChatPanel: (sessionId: string, viewColumn: number) => void;
 }
 
 export const { router, procedure } = initWRPC.context<RouterContext>().create();
@@ -38,6 +42,11 @@ function serializeProcesses(
   return serialized;
 }
 
+function getSessionJsonlPath(workspaceRoot: string, sessionId: string): string {
+  const projectCode = getProjectCode(workspaceRoot);
+  return path.join(os.homedir(), ".deepcode", "projects", projectCode, `${sessionId}.jsonl`);
+}
+
 const sendPromptInput = z.object({
   prompt: z.string().default(""),
   skills: z
@@ -77,6 +86,9 @@ export const appRouter = router({
         .listSessionMessages(activeSessionId)
         .filter((m) => m.visible)
         .map((m) => ({
+          ...m,
+          id: m.id,
+          sessionId: m.sessionId,
           role: m.role,
           content: m.content,
           html:
@@ -195,6 +207,7 @@ export const appRouter = router({
       messages: messages
         .filter((m) => m.visible)
         .map((m) => ({
+          ...m,
           role: m.role,
           content: m.content || (m.messageParams as { reasoning_content?: string } | null)?.reasoning_content || "",
           meta: m.meta,
@@ -264,6 +277,62 @@ export const appRouter = router({
       ctx.sessionManager.addSessionSystemMessage(activeSessionId, input.content, true, input.meta);
       return { ok: true };
     }),
+
+  renameSession: procedure
+    .input(
+      z.object({
+        sessionId: z.string(),
+        summary: z.string().min(1, "Summary cannot be empty"),
+      })
+    )
+    .resolve(({ ctx, input }) => {
+      const ok = ctx.sessionManager.renameSession(input.sessionId, input.summary);
+      if (!ok) {
+        return { ok: false, error: "Session not found or empty summary" };
+      }
+      return { ok: true };
+    }),
+
+  deleteSession: procedure.input(z.object({ sessionId: z.string() })).resolve(async ({ ctx, input }) => {
+    const activeSessionId = ctx.sessionManager.getActiveSessionId();
+    const ok = ctx.sessionManager.deleteSession(input.sessionId);
+    if (!ok) {
+      return { ok: false, error: "Session not found" };
+    }
+    // If the deleted session was the active one, clear the active session
+    if (activeSessionId === input.sessionId) {
+      ctx.sessionManager.setActiveSessionId(null);
+    }
+    return { ok: true, wasActiveSession: activeSessionId === input.sessionId };
+  }),
+
+  getSessionFilePath: procedure.input(z.object({ sessionId: z.string() })).resolve(({ ctx, input }) => {
+    const filePath = getSessionJsonlPath(ctx.getWorkspaceRoot(), input.sessionId);
+    return { filePath };
+  }),
+
+  openChatPanel: procedure
+    .input(
+      z.object({
+        sessionId: z.string(),
+        viewColumn: z.number().describe("ViewColumn: 1=Active, 2=Beside"),
+      })
+    )
+    .resolve(({ ctx, input }) => {
+      ctx.openChatPanel(input.sessionId, input.viewColumn);
+      return { ok: true };
+    }),
+
+  openChatInNewWindow: procedure.input(z.object({ sessionId: z.string() })).resolve(async ({ ctx, input }) => {
+    // Open in current window's editor area (fills it like a dedicated window)
+    ctx.openChatPanel(input.sessionId, vscodeApi.ViewColumn.Active);
+    return { ok: true };
+  }),
+
+  openExternal: procedure.input(z.object({ url: z.string() })).resolve(async ({ input }) => {
+    await vscodeApi.env.openExternal(vscodeApi.Uri.parse(input.url));
+    return { ok: true };
+  }),
 });
 
 export type AppRouter = typeof appRouter;

packages/vscode-ide-companion/src/webview/App.tsx

@@ -25,6 +25,8 @@ export default function App() {
         activeSessionId={state.activeSessionId}
         onSelectSession={actions.selectSession}
         onCreateNewSession={actions.createNewSession}
+        onRenameSession={actions.renameSession}
+        onDeleteSession={actions.deleteSession}
       />
       <Messages
         messages={state.messages}

packages/vscode-ide-companion/src/webview/components/Header.tsx

@@ -12,9 +12,18 @@ interface HeaderProps {
   activeSessionId: string | null;
   onSelectSession: (sessionId: string) => void;
   onCreateNewSession: () => void;
+  onRenameSession: (sessionId: string, summary: string) => void;
+  onDeleteSession: (sessionId: string) => void;
 }
 
-export default function Header({ sessions, activeSessionId, onSelectSession, onCreateNewSession }: HeaderProps) {
+export default function Header({
+  sessions,
+  activeSessionId,
+  onSelectSession,
+  onCreateNewSession,
+  onRenameSession,
+  onDeleteSession,
+}: HeaderProps) {
   const handleSelect = useCallback(
     (sessionId: string) => {
       onSelectSession(sessionId);
@@ -76,6 +85,8 @@ export default function Header({ sessions, activeSessionId, onSelectSession, onC
           activeSessionId={activeSessionId}
           onSelect={handleSelect}
           onCreateNewSession={onCreateNewSession}
+          onRename={onRenameSession}
+          onDelete={onDeleteSession}
         />
       </div>
     </div>

packages/vscode-ide-companion/src/webview/components/InputPrompt.tsx

@@ -3,7 +3,7 @@ import SkillsPanel from "@/webview/components/SkillsPanel";
 import SkillsTags from "@/webview/components/SkillsTags";
 import ContextIndicator from "@/webview/components/ContextIndicator";
 import { PromptAttachments, usePromptAttachments } from "@/webview/components/PromptAttachments";
-import type { ActiveEditor, EditingMessage, SkillInfo, TokenTelemetry } from "@/webview/types";
+import type { ActiveEditor, EditingMessage, SessionMessage, SkillInfo, TokenTelemetry } from "@/webview/types";
 import { FileCodeIcon, Reply, Square } from "lucide-react";
 import { InputGroup, InputGroupAddon, InputGroupButton, InputGroupTextarea } from "@/webview/components/ui/input-group";
 import { Separator } from "@/webview/components/ui/separator";
@@ -20,7 +20,7 @@ export interface InputPromptProps {
   tokenTelemetry?: TokenTelemetry;
   activeEditor: ActiveEditor | null;
   editingMessage: EditingMessage | null;
-  messages?: { role: string; content: string }[]; // Historical messages for history navigation
+  messages?: SessionMessage[]; // Historical messages for history navigation
   onSendPrompt: (
     prompt: string,
     skills?: SkillInfo[],

packages/vscode-ide-companion/src/webview/components/Messages.tsx

@@ -8,7 +8,7 @@ import ToolBubble, {
   type AskUserQuestionMetadata,
 } from "@/webview/components/bubbles/ToolBubble";
 import SystemBubble from "@/webview/components/bubbles/SystemBubble";
-import type { SessionMessage, EditingMessage } from "@/webview/types";
+import type { EditingMessage, SessionMessage } from "@/webview/types";
 
 interface MessagesProps {
   messages: SessionMessage[];
@@ -55,15 +55,17 @@ export default function Messages({ messages, loading, onEditMessage, onAskUserQu
             case "assistant": {
               const meta = msg.meta as { asThinking?: boolean } | undefined;
               if (meta?.asThinking) {
-                return <ThinkingBubble key={`msg-${index}`} content={msg.content} shouldConnect={shouldConnect} />;
+                return (
+                  <ThinkingBubble key={`msg-${index}`} content={msg.content || ""} shouldConnect={shouldConnect} />
+                );
               }
-              return <AssistantBubble key={`msg-${index}`} content={msg.content} shouldConnect={shouldConnect} />;
+              return <AssistantBubble key={`msg-${index}`} message={msg} />;
             }
             case "tool":
               return (
                 <ToolBubble
                   key={`msg-${index}`}
-                  content={msg.content}
+                  content={msg.content || ""}
                   meta={msg.meta as ToolBubbleProps["meta"]}
                   shouldConnect={shouldConnect}
                   isLastMessage={index === messages.length - 1}
@@ -74,7 +76,7 @@ export default function Messages({ messages, loading, onEditMessage, onAskUserQu
               return (
                 <SystemBubble
                   key={`msg-${index}`}
-                  content={msg.content}
+                  content={msg.content || ""}
                   meta={msg.meta}
                   shouldConnect={shouldConnect}
                 />

packages/vscode-ide-companion/src/webview/components/SessionList.test.tsx

@@ -98,6 +98,8 @@ describe("SessionList", () => {
     activeSessionId: null,
     onSelect: vi.fn(),
     onCreateNewSession: vi.fn(),
+    onRename: vi.fn(),
+    onDelete: vi.fn(),
   };
 
   beforeEach(() => {