@steerable/agent-shell-web 0.6.30 → 0.6.32

package/src/components/AgentSidebar.tsx

@@ -63,8 +63,8 @@
  *   │ ⬡ 智能体管理                     │ ← /settings?section=agents（独立页）
  *   │ ⬡ Skill 设置                    │ ← /settings?section=skills（独立页）
  *   │ 🔌 MCP 设置                     │ ← /settings?section=mcp（独立页）
- *   │  v 会话 · 12                📁+ │ ← 📁+ 新建项目
- *   │  v 📁 项目A · 3      (hover: +✏📂🗑)│ ← 项目组：折叠/新建/重命名/换文件夹/删
+ *   │  会话 v                     📁+ │ ← 📁+ 打开新建项目弹窗
+ *   │  v 📁 项目A · 3      (hover: +··)│ ← + 新建对话；·· 菜单：重命名/换目录/访达/删
  *   │   ...（项目内对话）              │
  *   │   今天                          │
  *   │   ...（无项目对话，按日期分组）  │ ← 无项目排在项目分组之后
@@ -73,19 +73,13 @@
  *   │ ⚙ 设置                          │ ← /settings（模型 + 洞察/遥测/用量/搜索/安全）
  *   └─────────────────────────────────┘
  *
- * 项目模式：项目 = 名字 + 绑定文件夹（ProjectRegistry，electron-store）。
- * 项目内对话的 agent 文件读写与命令执行被硬沙箱在该文件夹内（见
- * tool-router.ts ToolExecContext.projectRoot）；无项目对话不沙箱。
+ * 项目模式：项目 = 名字 + 托管家目录（Documents/<应用名>/<项目名>/）+
+ * 可选源文件夹。写入/命令围栏在家目录；源文件夹只放宽读取。
  */
 
-import {
-  useCallback,
-  useEffect,
-  useMemo,
-  useRef,
-  useState,
-} from 'react';
-import { useLocation, useNavigate, useParams } from 'react-router-dom';
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { createPortal } from "react-dom";
+import { useLocation, useNavigate, useParams } from "react-router-dom";
 import {
   LuChevronDown,
   LuChevronUp,
@@ -104,29 +98,32 @@ import {
   LuFolderPlus,
   LuPencil,
   LuPlug,
-} from 'react-icons/lu';
-import { parseChatTitle } from '@/lib/chat-title';
-import { getDateGroupLabel, getDateGroupPriority } from '@/lib/date-groups';
-import { getElectronBridge, isElectron } from '@/lib/electron-bridge';
+  LuEllipsis,
+} from "react-icons/lu";
+import { parseChatTitle } from "@/lib/chat-title";
+import { getDateGroupLabel, getDateGroupPriority } from "@/lib/date-groups";
+import { getElectronBridge, isElectron } from "@/lib/electron-bridge";
 import {
   createProject,
   deleteProject,
   listProjects,
+  openLocalPath,
   updateProject,
   type LocalChat,
   type LocalChatAgent,
   type LocalProject,
-} from '@/lib/local-api';
-import type { UseChatsAndAgentsResult } from '@/hooks/useChatsAndAgents';
-import type { PackChatSlotContribution } from '@/packs/registry';
-import type { RightPanelState } from '@/layouts/AgentLayout';
-import { BrandLockup } from '@/components/BrandLockup';
+} from "@/lib/local-api";
+import type { UseChatsAndAgentsResult } from "@/hooks/useChatsAndAgents";
+import type { PackChatSlotContribution } from "@/packs/registry";
+import type { RightPanelState } from "@/layouts/AgentLayout";
+import { BrandLockup } from "@/components/BrandLockup";
+import { CreateProjectModal } from "@/components/CreateProjectModal";
 
-const DEFAULT_DOT_COLOR = '#7c3aed';
+const DEFAULT_DOT_COLOR = "#7c3aed";
 
 function agentInitial(agent: LocalChatAgent | null): string {
-  const name = (agent?.name || '').trim();
-  return name ? name[0].toUpperCase() : 'A';
+  const name = (agent?.name || "").trim();
+  return name ? name[0].toUpperCase() : "A";
 }
 
 function AgentDot({
@@ -147,6 +144,125 @@ function AgentDot({
   );
 }
 
+function placeProjectMenu(anchor: HTMLElement): { top: number; left: number } {
+  const box = anchor.getBoundingClientRect();
+  const width = 224;
+  const left = Math.min(box.right + 4, window.innerWidth - width - 8);
+  return { top: Math.max(8, box.top), left };
+}
+
+function ProjectOverflowMenu({
+  project,
+  chatCount,
+  anchor,
+  revealLabel,
+  confirmDelete,
+  deleting,
+  onClose,
+  onRename,
+  onChangeFolder,
+  onReveal,
+  onDelete,
+}: {
+  project: LocalProject;
+  chatCount: number;
+  anchor: HTMLElement;
+  revealLabel: string;
+  confirmDelete: boolean;
+  deleting: boolean;
+  onClose: () => void;
+  onRename: () => void;
+  onChangeFolder: () => void;
+  onReveal: () => void;
+  onDelete: () => void;
+}) {
+  const pos = placeProjectMenu(anchor);
+  useEffect(() => {
+    const onKey = (event: KeyboardEvent) => {
+      if (event.key === "Escape") onClose();
+    };
+    window.addEventListener("keydown", onKey);
+    return () => window.removeEventListener("keydown", onKey);
+  }, [onClose]);
+  return createPortal(
+    <>
+      <div className="fixed inset-0 z-[90]" onClick={onClose} />
+      <div
+        role="menu"
+        className="fixed z-[91] w-56 overflow-hidden rounded-2xl border border-agent-border bg-agent-canvas p-1 shadow-lg"
+        style={pos}
+        data-testid="project-overflow-menu"
+      >
+        <div className="px-2 py-1.5">
+          <div className="flex items-center gap-2 text-xs font-medium text-agent-foreground">
+            <LuFolder className="h-3.5 w-3.5 shrink-0 text-agent-muted-foreground" />
+            <span className="min-w-0 truncate">{project.name}</span>
+          </div>
+          <div className="mt-0.5 pl-[22px] text-[10px] text-agent-muted-foreground">
+            {chatCount} 个会话
+          </div>
+          <div
+            className="mt-0.5 truncate pl-[22px] font-mono text-[10px] text-agent-muted-foreground/70"
+            title={project.folderPath}
+          >
+            {project.folderPath}
+          </div>
+        </div>
+        <div className="mx-1 my-1 border-t border-agent-border/60" />
+        <button
+          type="button"
+          role="menuitem"
+          title="重命名项目"
+          onClick={onRename}
+          className="flex w-full items-center gap-2 rounded-lg px-2 py-1.5 text-left text-xs text-agent-foreground hover:bg-agent-foreground/5"
+        >
+          <LuPencil className="h-3.5 w-3.5 shrink-0 text-agent-muted-foreground" />
+          重命名
+        </button>
+        <button
+          type="button"
+          role="menuitem"
+          title="编辑项目"
+          onClick={onChangeFolder}
+          className="flex w-full items-center gap-2 rounded-lg px-2 py-1.5 text-left text-xs text-agent-foreground hover:bg-agent-foreground/5"
+        >
+          <LuFolderOpen className="h-3.5 w-3.5 shrink-0 text-agent-muted-foreground" />
+          编辑项目
+        </button>
+        <button
+          type="button"
+          role="menuitem"
+          title={revealLabel}
+          onClick={onReveal}
+          className="flex w-full items-center gap-2 rounded-lg px-2 py-1.5 text-left text-xs text-agent-foreground hover:bg-agent-foreground/5"
+        >
+          <LuFolder className="h-3.5 w-3.5 shrink-0 text-agent-muted-foreground" />
+          {revealLabel}
+        </button>
+        <div className="mx-1 my-1 border-t border-agent-border/60" />
+        <button
+          type="button"
+          role="menuitem"
+          disabled={deleting}
+          title={
+            confirmDelete
+              ? "再次点击确认删除（会话会保留为无项目对话）"
+              : "删除项目（会话保留为无项目对话）"
+          }
+          onClick={onDelete}
+          className={`flex w-full items-center gap-2 rounded-lg px-2 py-1.5 text-left text-xs hover:bg-agent-destructive/10 ${
+            confirmDelete ? "text-agent-destructive" : "text-agent-foreground"
+          }`}
+        >
+          <LuTrash2 className={`h-3.5 w-3.5 shrink-0 ${deleting ? "animate-pulse" : ""}`} />
+          {confirmDelete ? "再次点击确认删除" : "删除项目"}
+        </button>
+      </div>
+    </>,
+    document.body,
+  );
+}
+
 interface AgentSidebarProps {
   data: UseChatsAndAgentsResult;
   /** 右侧栏当前打开的面板：null / 'terminal' / 包槽位 id（互斥）。 */
@@ -170,17 +286,17 @@ export function AgentSidebar({
   const location = useLocation();
   const { chatId: currentChatId } = useParams<{ chatId?: string }>();
   const bridge = getElectronBridge();
-  const onSettingsPage = location.pathname === '/settings';
+  const onSettingsPage = location.pathname === "/settings";
   // /settings?section=skills|mcp|agents|（缺省 = 综合设置）—— 各自高亮。
   const settingsSection = useMemo(
-    () => new URLSearchParams(location.search).get('section'),
+    () => new URLSearchParams(location.search).get("section"),
     [location.search],
   );
   const onGeneralSettings =
     onSettingsPage &&
-    settingsSection !== 'skills' &&
-    settingsSection !== 'mcp' &&
-    settingsSection !== 'agents';
+    settingsSection !== "skills" &&
+    settingsSection !== "mcp" &&
+    settingsSection !== "agents";
   const onNewChatHome = !currentChatId && !onSettingsPage;
 
   const {
@@ -198,7 +314,7 @@ export function AgentSidebar({
   const [isMac, setIsMac] = useState(false);
 
   useEffect(() => {
-    if (typeof navigator !== 'undefined') {
+    if (typeof navigator !== "undefined") {
       setIsMac(/Mac|iPod|iPhone|iPad/.test(navigator.platform));
     }
   }, []);
@@ -211,17 +327,29 @@ export function AgentSidebar({
 
   // ───── 项目模式 ─────
   // 项目列表从 local-backend 拉取（electron-store 持久化）。会话按
-  // projectId 分组：项目分组在上（每个项目一个可折叠分组，组头支持内联
-  // 管理：新建对话 / 重命名 / 换文件夹 / 删除），无项目对话在下（日期分组）。
+  // projectId 分组：项目分组在上（组头 hover：+ 新建对话 / ·· 菜单），
+  // 无项目对话在下（日期分组）。
   const [projects, setProjects] = useState<LocalProject[]>([]);
   const [collapsedProjectIds, setCollapsedProjectIds] = useState<Set<string>>(
     () => new Set(),
   );
-  const [renamingProjectId, setRenamingProjectId] = useState<string | null>(null);
-  const [renamingValue, setRenamingValue] = useState('');
-  const [confirmDeleteProjectId, setConfirmDeleteProjectId] = useState<string | null>(null);
-  const [deletingProjectId, setDeletingProjectId] = useState<string | null>(null);
+  const [renamingProjectId, setRenamingProjectId] = useState<string | null>(
+    null,
+  );
+  const [renamingValue, setRenamingValue] = useState("");
+  const [confirmDeleteProjectId, setConfirmDeleteProjectId] = useState<
+    string | null
+  >(null);
+  const [deletingProjectId, setDeletingProjectId] = useState<string | null>(
+    null,
+  );
   const [projectError, setProjectError] = useState<string | null>(null);
+  const [createProjectOpen, setCreateProjectOpen] = useState(false);
+  const [editingProjectId, setEditingProjectId] = useState<string | null>(null);
+  const [projectMenu, setProjectMenu] = useState<{
+    id: string;
+    anchor: HTMLElement;
+  } | null>(null);
 
   const fetchProjects = useCallback(async () => {
     if (!isElectron()) return;
@@ -229,7 +357,7 @@ export function AgentSidebar({
       const res = await listProjects();
       setProjects(res.projects || []);
     } catch (err) {
-      console.error('获取项目列表失败:', err);
+      console.error("获取项目列表失败:", err);
       setProjectError(err instanceof Error ? err.message : String(err));
     }
   }, []);
@@ -238,24 +366,25 @@ export function AgentSidebar({
     void fetchProjects();
   }, [fetchProjects]);
 
-  const handleCreateProject = useCallback(async () => {
-    if (!isElectron()) return;
-    setProjectError(null);
-    try {
-      const result = await bridge?.local?.selectDirectory({
-        title: '选择项目文件夹',
-      });
-      if (!result || result.canceled || result.filePaths.length === 0) return;
-      const folderPath = result.filePaths[0];
-      // 默认用文件夹名做项目名，用户可随后内联重命名。
-      const baseName =
-        folderPath.replace(/[\\/]+$/, '').split(/[\\/]/).pop() || '新项目';
-      await createProject({ name: baseName, folderPath });
-      await fetchProjects();
-    } catch (err) {
-      setProjectError(err instanceof Error ? err.message : String(err));
-    }
-  }, [bridge, fetchProjects]);
+  const handleCreateProject = useCallback(
+    async (input: { name: string; sourceFolders: string[] }) => {
+      setProjectError(null);
+      try {
+        await createProject({
+          name: input.name,
+          ...(input.sourceFolders.length > 0
+            ? { sourceFolders: input.sourceFolders }
+            : {}),
+        });
+        await fetchProjects();
+      } catch (err) {
+        const message = err instanceof Error ? err.message : String(err);
+        setProjectError(message);
+        throw err instanceof Error ? err : new Error(message);
+      }
+    },
+    [fetchProjects],
+  );
 
   const handleRenameProject = useCallback(
     async (projectId: string) => {
@@ -272,48 +401,80 @@ export function AgentSidebar({
     [renamingValue, fetchProjects],
   );
 
-  const handleChangeProjectFolder = useCallback(
-    async (projectId: string) => {
-      if (!isElectron()) return;
+  const handleUpdateProject = useCallback(
+    async (
+      projectId: string,
+      input: { name: string; sourceFolders: string[] },
+    ) => {
       setProjectError(null);
       try {
-        const result = await bridge?.local?.selectDirectory({
-          title: '重新选择项目文件夹',
+        await updateProject(projectId, {
+          name: input.name,
+          sourceFolders: input.sourceFolders,
         });
-        if (!result || result.canceled || result.filePaths.length === 0) return;
-        await updateProject(projectId, { folderPath: result.filePaths[0] });
         await fetchProjects();
       } catch (err) {
-        setProjectError(err instanceof Error ? err.message : String(err));
+        const message = err instanceof Error ? err.message : String(err);
+        setProjectError(message);
+        throw err instanceof Error ? err : new Error(message);
       }
     },
-    [bridge, fetchProjects],
+    [fetchProjects],
   );
 
-  const handleDeleteProject = useCallback(
+  const removeProject = useCallback(
     async (projectId: string) => {
       if (deletingProjectId === projectId) return;
-      // 与会话删除同款两段确认：第一次点击武装红色按钮，第二次才真删。
-      if (confirmDeleteProjectId !== projectId) {
-        setConfirmDeleteProjectId(projectId);
-        return;
-      }
       try {
         setDeletingProjectId(projectId);
-        // 后端会把该项目下的会话降级为无项目对话（不删会话）。
         await deleteProject(projectId);
         setConfirmDeleteProjectId(null);
+        setProjectMenu(null);
+        setEditingProjectId(null);
         await fetchProjects();
         await data.refreshChats();
       } catch (err) {
-        setProjectError(err instanceof Error ? err.message : String(err));
+        const message = err instanceof Error ? err.message : String(err);
+        setProjectError(message);
+        throw err instanceof Error ? err : new Error(message);
       } finally {
         setDeletingProjectId(null);
       }
     },
-    [confirmDeleteProjectId, deletingProjectId, fetchProjects, data],
+    [deletingProjectId, fetchProjects, data],
+  );
+
+  const handleDeleteProject = useCallback(
+    async (projectId: string) => {
+      // 与会话删除同款两段确认：第一次点击武装红色按钮，第二次才真删。
+      if (confirmDeleteProjectId !== projectId) {
+        setConfirmDeleteProjectId(projectId);
+        return;
+      }
+      try {
+        await removeProject(projectId);
+      } catch {
+        // 横幅已写 projectError
+      }
+    },
+    [confirmDeleteProjectId, removeProject],
   );
 
+  const closeProjectMenu = useCallback(() => {
+    setProjectMenu(null);
+    setConfirmDeleteProjectId(null);
+  }, []);
+
+  const handleRevealProjectFolder = useCallback(async (folderPath: string) => {
+    setProjectError(null);
+    try {
+      const res = await openLocalPath(folderPath);
+      if (!res.success && res.error) setProjectError(res.error);
+    } catch (err) {
+      setProjectError(err instanceof Error ? err.message : String(err));
+    }
+  }, []);
+
   const toggleProjectCollapsed = useCallback((projectId: string) => {
     setCollapsedProjectIds((prev) => {
       const next = new Set(prev);
@@ -350,7 +511,7 @@ export function AgentSidebar({
         navigate(`/agent?projectId=${encodeURIComponent(projectId)}`);
         return;
       }
-      navigate('/agent');
+      navigate("/agent");
     },
     [navigate],
   );
@@ -369,7 +530,7 @@ export function AgentSidebar({
         const { displayTitle, isAutomation } = parseChatTitle(chat.title);
         return {
           id: chat.id,
-          title: displayTitle || '新会话',
+          title: displayTitle || "新会话",
           isAutomation,
           isPinned: chat.isPinned,
           sortDate,
@@ -420,7 +581,7 @@ export function AgentSidebar({
     // 分组，「5 天前置顶的会话」会排在「今天」的普通会话之后，置顶语义
     // 就只剩组内有效——与用户点图钉时的预期不符。
     noProjectChats.forEach((chat) => {
-      const label = chat.isPinned ? '置顶' : getDateGroupLabel(chat.sortDate);
+      const label = chat.isPinned ? "置顶" : getDateGroupLabel(chat.sortDate);
       if (!map.has(label)) {
         map.set(label, {
           label,
@@ -448,7 +609,7 @@ export function AgentSidebar({
         const ok = await deleteChat(id);
         if (ok) {
           setConfirmDeleteChatId(null);
-          if (id === currentChatId) navigate('/agent');
+          if (id === currentChatId) navigate("/agent");
         }
       } finally {
         setDeletingChatId(null);
@@ -477,22 +638,17 @@ export function AgentSidebar({
             navigate(`/agent/${chat.id}`);
           }}
           className={[
-            'flex h-7 w-full min-w-0 items-center gap-1.5 rounded-full px-2.5 text-xs transition-colors duration-200',
+            "flex h-7 w-full min-w-0 items-center gap-1.5 rounded-full px-2.5 text-xs transition-colors duration-200",
             isCurrent
-              ? 'bg-agent-foreground/10 font-medium text-agent-foreground'
-              : 'text-agent-muted-foreground hover:bg-agent-foreground/5 hover:text-agent-foreground',
-          ].join(' ')}
+              ? "bg-agent-foreground/10 font-medium text-agent-foreground"
+              : "text-agent-muted-foreground hover:bg-agent-foreground/5 hover:text-agent-foreground",
+          ].join(" ")}
           title={
-            chat.isAutomation
-              ? `[由自动化触发] ${chat.title}`
-              : chat.title
+            chat.isAutomation ? `[由自动化触发] ${chat.title}` : chat.title
           }
         >
           {chat.isPinned && (
-            <span
-              className="shrink-0 text-[10px]"
-              aria-label="已置顶"
-            >
+            <span className="shrink-0 text-[10px]" aria-label="已置顶">
               📌
             </span>
           )}
@@ -503,9 +659,7 @@ export function AgentSidebar({
             />
           )}
           <AgentDot agent={chatAgent} size={16} />
-          <span className="min-w-0 truncate leading-none">
-            {chat.title}
-          </span>
+          <span className="min-w-0 truncate leading-none">{chat.title}</span>
         </button>
         {/* Gradient mask so the trash button doesn't paint
             over the chat title — fade matches the row's
@@ -514,15 +668,15 @@ export function AgentSidebar({
         <div
           aria-hidden="true"
           className={[
-            'pointer-events-none absolute inset-y-0 right-0 w-12 rounded-r-full transition-opacity duration-200',
+            "pointer-events-none absolute inset-y-0 right-0 w-12 rounded-r-full transition-opacity duration-200",
             isConfirmingDelete
               ? isCurrent
-                ? 'bg-gradient-to-l from-agent-canvas via-agent-canvas/95 to-transparent opacity-100'
-                : 'bg-gradient-to-l from-agent-muted via-agent-muted/95 to-transparent opacity-100'
+                ? "bg-gradient-to-l from-agent-canvas via-agent-canvas/95 to-transparent opacity-100"
+                : "bg-gradient-to-l from-agent-muted via-agent-muted/95 to-transparent opacity-100"
               : isCurrent
-                ? 'bg-gradient-to-l from-agent-canvas via-agent-canvas/95 to-transparent opacity-0 group-hover/item:opacity-100'
-                : 'bg-gradient-to-l from-agent-muted via-agent-muted/95 to-transparent opacity-0 group-hover/item:opacity-100',
-          ].join(' ')}
+                ? "bg-gradient-to-l from-agent-canvas via-agent-canvas/95 to-transparent opacity-0 group-hover/item:opacity-100"
+                : "bg-gradient-to-l from-agent-muted via-agent-muted/95 to-transparent opacity-0 group-hover/item:opacity-100",
+          ].join(" ")}
         />
         <button
           type="button"
@@ -532,29 +686,20 @@ export function AgentSidebar({
           }}
           disabled={isDeleting}
           className={[
-            'absolute right-1 top-1/2 flex h-7 w-7 -translate-y-1/2 items-center justify-center rounded-full transition-all duration-200',
+            "absolute right-1 top-1/2 flex h-7 w-7 -translate-y-1/2 items-center justify-center rounded-full transition-all duration-200",
             isConfirmingDelete
-              ? 'bg-agent-destructive/10 text-agent-destructive opacity-100 hover:bg-agent-destructive/20'
-              : 'text-agent-muted-foreground opacity-0 hover:bg-agent-foreground/5 hover:text-agent-destructive group-hover/item:opacity-100 focus:opacity-100',
-            'disabled:cursor-not-allowed disabled:opacity-100',
-          ].join(' ')}
-          title={
-            isConfirmingDelete
-              ? '再次点击确认删除'
-              : '删除会话'
-          }
-          aria-label={
-            isConfirmingDelete
-              ? '再次点击确认删除'
-              : '删除会话'
-          }
+              ? "bg-agent-destructive/10 text-agent-destructive opacity-100 hover:bg-agent-destructive/20"
+              : "text-agent-muted-foreground opacity-0 hover:bg-agent-foreground/5 hover:text-agent-destructive group-hover/item:opacity-100 focus:opacity-100",
+            "disabled:cursor-not-allowed disabled:opacity-100",
+          ].join(" ")}
+          title={isConfirmingDelete ? "再次点击确认删除" : "删除会话"}
+          aria-label={isConfirmingDelete ? "再次点击确认删除" : "删除会话"}
           data-testid="sidebar-chat-delete"
         >
           <LuTrash2
-            className={[
-              'h-3.5 w-3.5',
-              isDeleting ? 'animate-pulse' : '',
-            ].join(' ')}
+            className={["h-3.5 w-3.5", isDeleting ? "animate-pulse" : ""].join(
+              " ",
+            )}
           />
         </button>
       </div>
@@ -587,10 +732,10 @@ export function AgentSidebar({
         container.scrollHeight - 60;
       if (nearBottom) void loadMoreChats();
     };
-    container.addEventListener('scroll', maybeLoadMore, { passive: true });
+    container.addEventListener("scroll", maybeLoadMore, { passive: true });
     const tickId = window.requestAnimationFrame(maybeLoadMore);
     return () => {
-      container.removeEventListener('scroll', maybeLoadMore);
+      container.removeEventListener("scroll", maybeLoadMore);
       window.cancelAnimationFrame(tickId);
     };
   }, [
@@ -608,7 +753,7 @@ export function AgentSidebar({
   useEffect(() => {
     if (!bridge?.onMenuOpenTerminal) return;
     bridge.onMenuOpenTerminal(() => {
-      onToggleRightPanel('terminal');
+      onToggleRightPanel("terminal");
     });
     return () => {
       bridge.offMenuOpenTerminal?.();
@@ -620,7 +765,7 @@ export function AgentSidebar({
   return (
     <div className="flex h-full w-full flex-col border-r border-agent-border/60 bg-agent-muted/70 backdrop-blur-md">
       {/* ───── Brand + actions ───── */}
-      <div className="flex h-9 flex-shrink-0 items-center justify-between px-2.5">
+      <div className="flex h-11 flex-shrink-0 items-center justify-between px-2.5">
         <BrandLockup onClick={() => handleOpenNewChat()} />
         <div className="flex items-center gap-1">
           <button
@@ -643,11 +788,11 @@ export function AgentSidebar({
             type="button"
             onClick={() => handleOpenNewChat()}
             className={[
-              'flex h-7 w-full items-center gap-1.5 rounded-full px-2.5 text-xs transition-colors',
+              "flex h-7 w-full items-center gap-1.5 rounded-full px-2.5 text-xs transition-colors",
               onNewChatHome
-                ? 'bg-agent-foreground/10 font-medium text-agent-foreground'
-                : 'text-agent-muted-foreground hover:bg-agent-foreground/5 hover:text-agent-foreground',
-            ].join(' ')}
+                ? "bg-agent-foreground/10 font-medium text-agent-foreground"
+                : "text-agent-muted-foreground hover:bg-agent-foreground/5 hover:text-agent-foreground",
+            ].join(" ")}
             title="新建对话"
             data-testid="sidebar-new-chat"
           >
@@ -656,13 +801,13 @@ export function AgentSidebar({
           </button>
           <button
             type="button"
-            onClick={() => navigate('/settings?section=agents')}
+            onClick={() => navigate("/settings?section=agents")}
             className={[
-              'flex h-7 w-full items-center gap-1.5 rounded-full px-2.5 text-xs transition-colors',
-              onSettingsPage && settingsSection === 'agents'
-                ? 'bg-agent-foreground/10 font-medium text-agent-foreground'
-                : 'text-agent-muted-foreground hover:bg-agent-foreground/5 hover:text-agent-foreground',
-            ].join(' ')}
+              "flex h-7 w-full items-center gap-1.5 rounded-full px-2.5 text-xs transition-colors",
+              onSettingsPage && settingsSection === "agents"
+                ? "bg-agent-foreground/10 font-medium text-agent-foreground"
+                : "text-agent-muted-foreground hover:bg-agent-foreground/5 hover:text-agent-foreground",
+            ].join(" ")}
             title="智能体管理"
             data-testid="sidebar-agent-settings"
           >
@@ -671,13 +816,13 @@ export function AgentSidebar({
           </button>
           <button
             type="button"
-            onClick={() => navigate('/settings?section=skills')}
+            onClick={() => navigate("/settings?section=skills")}
             className={[
-              'flex h-7 w-full items-center gap-1.5 rounded-full px-2.5 text-xs transition-colors',
-              onSettingsPage && settingsSection === 'skills'
-                ? 'bg-agent-foreground/10 font-medium text-agent-foreground'
-                : 'text-agent-muted-foreground hover:bg-agent-foreground/5 hover:text-agent-foreground',
-            ].join(' ')}
+              "flex h-7 w-full items-center gap-1.5 rounded-full px-2.5 text-xs transition-colors",
+              onSettingsPage && settingsSection === "skills"
+                ? "bg-agent-foreground/10 font-medium text-agent-foreground"
+                : "text-agent-muted-foreground hover:bg-agent-foreground/5 hover:text-agent-foreground",
+            ].join(" ")}
             title="Skill 设置"
             data-testid="sidebar-skill-settings"
           >
@@ -686,13 +831,13 @@ export function AgentSidebar({
           </button>
           <button
             type="button"
-            onClick={() => navigate('/settings?section=mcp')}
+            onClick={() => navigate("/settings?section=mcp")}
             className={[
-              'flex h-7 w-full items-center gap-1.5 rounded-full px-2.5 text-xs transition-colors',
-              onSettingsPage && settingsSection === 'mcp'
-                ? 'bg-agent-foreground/10 font-medium text-agent-foreground'
-                : 'text-agent-muted-foreground hover:bg-agent-foreground/5 hover:text-agent-foreground',
-            ].join(' ')}
+              "flex h-7 w-full items-center gap-1.5 rounded-full px-2.5 text-xs transition-colors",
+              onSettingsPage && settingsSection === "mcp"
+                ? "bg-agent-foreground/10 font-medium text-agent-foreground"
+                : "text-agent-muted-foreground hover:bg-agent-foreground/5 hover:text-agent-foreground",
+            ].join(" ")}
             title="MCP 设置"
             data-testid="sidebar-mcp-settings"
           >
@@ -706,28 +851,22 @@ export function AgentSidebar({
             onClick={() => setChatsExpanded((v) => !v)}
             className="flex h-6 items-center rounded-full px-2.5 text-xs font-semibold tracking-wider text-agent-muted-foreground transition-colors hover:bg-agent-foreground/5 hover:text-agent-foreground"
           >
-            <span className="mr-1">
+            会话
+            <span className="ml-1">
               {chatsExpanded ? (
                 <LuChevronUp className="h-3 w-3" />
               ) : (
                 <LuChevronDown className="h-3 w-3" />
               )}
             </span>
-            会话
-            {normalizedChats.length > 0 && (
-              <span className="ml-1.5 text-[10px] font-normal text-agent-muted-foreground/70">
-                · {normalizedChats.length}
-              </span>
-            )}
           </button>
           <div className="flex items-center gap-1">
-            {/* 新建项目：选文件夹 → 以文件夹名建项目，之后可在组头重命名 */}
             {hasElectron && (
               <button
                 type="button"
-                onClick={() => void handleCreateProject()}
+                onClick={() => setCreateProjectOpen(true)}
                 className="flex h-6 w-6 items-center justify-center rounded-full text-agent-muted-foreground transition-colors duration-200 hover:bg-agent-foreground/5 hover:text-agent-foreground"
-                title="新建项目（绑定文件夹，项目内对话的文件操作被限制在该文件夹）"
+                title="新建项目"
                 aria-label="新建项目"
               >
                 <LuFolderPlus className="h-3.5 w-3.5" />
@@ -753,7 +892,7 @@ export function AgentSidebar({
               </div>
             ) : (
               <>
-                {/* 项目分组在前：组头可折叠，hover 出内联管理动作 */}
+                {/* 项目分组在前：组头可折叠，hover 出 + 新建对话 / ·· 菜单 */}
                 {projectGroups.map(({ project, items }) => (
                   <div key={project.id} className="mb-1">
                     <div className="group/proj relative">
@@ -768,10 +907,13 @@ export function AgentSidebar({
                           <input
                             autoFocus
                             value={renamingValue}
-                            onChange={(event) => setRenamingValue(event.target.value)}
+                            onChange={(event) =>
+                              setRenamingValue(event.target.value)
+                            }
                             onBlur={() => void handleRenameProject(project.id)}
                             onKeyDown={(event) => {
-                              if (event.key === 'Escape') setRenamingProjectId(null);
+                              if (event.key === "Escape")
+                                setRenamingProjectId(null);
                             }}
                             className="h-6 w-full rounded-agent-md border border-agent-border bg-agent-canvas px-2 text-xs text-agent-foreground focus:outline-none focus:ring-2 focus:ring-agent-foreground/30"
                           />
@@ -784,25 +926,30 @@ export function AgentSidebar({
                             className="flex w-full min-w-0 items-center px-2.5 pb-0.5 pt-1.5 text-[10px] font-medium uppercase tracking-wider text-agent-muted-foreground/80 transition-colors hover:text-agent-foreground"
                             title={`${project.name}\n${project.folderPath}`}
                           >
-                            <span className="mr-1">
+                            <LuFolder className="mr-1 h-3 w-3 shrink-0" />
+                            <span className="min-w-0 truncate normal-case">
+                              {project.name}
+                            </span>
+                            <span className="ml-0.5 shrink-0">
                               {collapsedProjectIds.has(project.id) ? (
                                 <LuChevronDown className="h-3 w-3" />
                               ) : (
                                 <LuChevronUp className="h-3 w-3" />
                               )}
                             </span>
-                            <LuFolder className="mr-1 h-3 w-3 shrink-0" />
-                            <span className="min-w-0 truncate normal-case">
-                              {project.name}
-                            </span>
                             {items.length > 0 && (
                               <span className="ml-1 shrink-0 font-normal">
                                 · {items.length}
                               </span>
                             )}
                           </button>
-                          {/* 内联管理：新建对话 / 重命名 / 换文件夹 / 删除（两段确认） */}
-                          <div className="absolute right-1 top-1/2 flex -translate-y-1/2 items-center gap-0.5 opacity-0 transition-opacity group-hover/proj:opacity-100">
+                          <div
+                            className={`absolute right-1 top-1/2 flex -translate-y-1/2 items-center gap-0.5 transition-opacity ${
+                              projectMenu?.id === project.id
+                                ? "opacity-100"
+                                : "opacity-0 group-hover/proj:opacity-100"
+                            }`}
+                          >
                             <button
                               type="button"
                               onClick={() => handleOpenNewChat(project.id)}
@@ -813,41 +960,21 @@ export function AgentSidebar({
                             </button>
                             <button
                               type="button"
-                              onClick={() => {
-                                setRenamingProjectId(project.id);
-                                setRenamingValue(project.name);
+                              aria-label="项目菜单"
+                              aria-expanded={projectMenu?.id === project.id}
+                              onClick={(event) => {
+                                const button = event.currentTarget;
+                                setConfirmDeleteProjectId(null);
+                                setProjectMenu((current) =>
+                                  current?.id === project.id
+                                    ? null
+                                    : { id: project.id, anchor: button },
+                                );
                               }}
                               className="flex h-5 w-5 items-center justify-center rounded-full text-agent-muted-foreground hover:bg-agent-foreground/10 hover:text-agent-foreground"
-                              title="重命名项目"
-                            >
-                              <LuPencil className="h-3 w-3" />
-                            </button>
-                            <button
-                              type="button"
-                              onClick={() => void handleChangeProjectFolder(project.id)}
-                              className="flex h-5 w-5 items-center justify-center rounded-full text-agent-muted-foreground hover:bg-agent-foreground/10 hover:text-agent-foreground"
-                              title="更换绑定文件夹"
-                            >
-                              <LuFolderOpen className="h-3 w-3" />
-                            </button>
-                            <button
-                              type="button"
-                              onClick={() => void handleDeleteProject(project.id)}
-                              disabled={deletingProjectId === project.id}
-                              className={`flex h-5 w-5 items-center justify-center rounded-full transition-colors ${
-                                confirmDeleteProjectId === project.id
-                                  ? 'bg-agent-destructive/10 text-agent-destructive hover:bg-agent-destructive/20'
-                                  : 'text-agent-muted-foreground hover:bg-agent-foreground/10 hover:text-agent-destructive'
-                              }`}
-                              title={
-                                confirmDeleteProjectId === project.id
-                                  ? '再次点击确认删除（会话会保留为无项目对话）'
-                                  : '删除项目（会话保留为无项目对话）'
-                              }
+                              title="项目菜单"
                             >
-                              <LuTrash2
-                                className={`h-3 w-3 ${deletingProjectId === project.id ? 'animate-pulse' : ''}`}
-                              />
+                              <LuEllipsis className="h-3 w-3" />
                             </button>
                           </div>
                         </>
@@ -887,7 +1014,7 @@ export function AgentSidebar({
                     加载更多...
                   </span>
                 ) : hasMoreChats ? (
-                  '继续下滑加载更多'
+                  "继续下滑加载更多"
                 ) : (
                   `共 ${normalizedChats.length} 个会话`
                 )}
@@ -911,20 +1038,20 @@ export function AgentSidebar({
         {chatSlots.length === 0 ? (
           <button
             type="button"
-            onClick={() => onToggleRightPanel('terminal')}
+            onClick={() => onToggleRightPanel("terminal")}
             className={[
-              'flex h-7 w-full items-center gap-1.5 rounded-full px-2.5 text-xs transition-colors',
-              rightPanel === 'terminal'
-                ? 'bg-agent-foreground/10 font-medium text-agent-foreground'
-                : 'text-agent-muted-foreground hover:bg-agent-foreground/5 hover:text-foreground',
-            ].join(' ')}
-            title={`${rightPanel === 'terminal' ? '关闭' : '打开'}终端面板 (${isMac ? '⌘T' : 'Ctrl+T'})`}
+              "flex h-7 w-full items-center gap-1.5 rounded-full px-2.5 text-xs transition-colors",
+              rightPanel === "terminal"
+                ? "bg-agent-foreground/10 font-medium text-agent-foreground"
+                : "text-agent-muted-foreground hover:bg-agent-foreground/5 hover:text-foreground",
+            ].join(" ")}
+            title={`${rightPanel === "terminal" ? "关闭" : "打开"}终端面板 (${isMac ? "⌘T" : "Ctrl+T"})`}
             data-testid="sidebar-terminal"
           >
             <LuTerminal className="h-3.5 w-3.5" />
             <span>终端</span>
             <span className="ml-auto text-[10px] text-agent-muted-foreground/70">
-              {isMac ? '⌘T' : 'Ctrl+T'}
+              {isMac ? "⌘T" : "Ctrl+T"}
             </span>
           </button>
         ) : (
@@ -935,14 +1062,14 @@ export function AgentSidebar({
           >
             <button
               type="button"
-              onClick={() => onToggleRightPanel('terminal')}
+              onClick={() => onToggleRightPanel("terminal")}
               className={[
-                'flex h-7 flex-1 items-center justify-center gap-1.5 rounded-full text-xs font-medium transition-colors',
-                rightPanel === 'terminal'
-                  ? 'bg-agent-foreground/10 text-agent-foreground'
-                  : 'text-agent-muted-foreground hover:bg-agent-foreground/5 hover:text-agent-foreground',
-              ].join(' ')}
-              title={`${rightPanel === 'terminal' ? '关闭' : '打开'}终端面板`}
+                "flex h-7 flex-1 items-center justify-center gap-1.5 rounded-full text-xs font-medium transition-colors",
+                rightPanel === "terminal"
+                  ? "bg-agent-foreground/10 text-agent-foreground"
+                  : "text-agent-muted-foreground hover:bg-agent-foreground/5 hover:text-agent-foreground",
+              ].join(" ")}
+              title={`${rightPanel === "terminal" ? "关闭" : "打开"}终端面板`}
               data-testid="sidebar-terminal"
             >
               <LuTerminal className="h-3.5 w-3.5" />
@@ -954,12 +1081,12 @@ export function AgentSidebar({
                 type="button"
                 onClick={() => onToggleRightPanel(slot.slotId)}
                 className={[
-                  'flex h-7 flex-1 items-center justify-center gap-1.5 rounded-full text-xs font-medium transition-colors',
+                  "flex h-7 flex-1 items-center justify-center gap-1.5 rounded-full text-xs font-medium transition-colors",
                   rightPanel === slot.slotId
-                    ? 'bg-agent-foreground/10 text-agent-foreground'
-                    : 'text-agent-muted-foreground hover:bg-agent-foreground/5 hover:text-agent-foreground',
-                ].join(' ')}
-                title={`${rightPanel === slot.slotId ? '关闭' : '打开'}${slot.title}`}
+                    ? "bg-agent-foreground/10 text-agent-foreground"
+                    : "text-agent-muted-foreground hover:bg-agent-foreground/5 hover:text-agent-foreground",
+                ].join(" ")}
+                title={`${rightPanel === slot.slotId ? "关闭" : "打开"}${slot.title}`}
                 data-testid={`sidebar-slot-${slot.slotId}`}
               >
                 <slot.Icon className="h-3.5 w-3.5" />
@@ -970,13 +1097,13 @@ export function AgentSidebar({
         )}
         <button
           type="button"
-          onClick={() => navigate('/settings')}
+          onClick={() => navigate("/settings")}
           className={[
-            'mt-0.5 flex h-7 w-full items-center gap-1.5 rounded-full px-2.5 text-xs transition-colors',
+            "mt-0.5 flex h-7 w-full items-center gap-1.5 rounded-full px-2.5 text-xs transition-colors",
             onGeneralSettings
-              ? 'bg-agent-foreground/10 font-medium text-agent-foreground'
-              : 'text-agent-muted-foreground hover:bg-agent-foreground/5 hover:text-agent-foreground',
-          ].join(' ')}
+              ? "bg-agent-foreground/10 font-medium text-agent-foreground"
+              : "text-agent-muted-foreground hover:bg-agent-foreground/5 hover:text-agent-foreground",
+          ].join(" ")}
           title="设置"
           data-testid="sidebar-llm-settings"
         >
@@ -984,6 +1111,64 @@ export function AgentSidebar({
           <span>设置</span>
         </button>
       </div>
+
+      {projectMenu &&
+        (() => {
+          const project = projects.find((item) => item.id === projectMenu.id);
+          if (!project) return null;
+          const chatCount =
+            projectGroups.find((group) => group.project.id === project.id)
+              ?.items.length ?? 0;
+          return (
+            <ProjectOverflowMenu
+              project={project}
+              chatCount={chatCount}
+              anchor={projectMenu.anchor}
+              revealLabel={isMac ? "在访达中显示" : "在文件管理器中显示"}
+              confirmDelete={confirmDeleteProjectId === project.id}
+              deleting={deletingProjectId === project.id}
+              onClose={closeProjectMenu}
+              onRename={() => {
+                setProjectMenu(null);
+                setRenamingProjectId(project.id);
+                setRenamingValue(project.name);
+              }}
+              onChangeFolder={() => {
+                setProjectMenu(null);
+                setEditingProjectId(project.id);
+              }}
+              onReveal={() => {
+                setProjectMenu(null);
+                void handleRevealProjectFolder(project.folderPath);
+              }}
+              onDelete={() => void handleDeleteProject(project.id)}
+            />
+          );
+        })()}
+
+      <CreateProjectModal
+        open={createProjectOpen}
+        onClose={() => setCreateProjectOpen(false)}
+        onCreate={handleCreateProject}
+      />
+      {editingProjectId &&
+        (() => {
+          const project = projects.find((item) => item.id === editingProjectId);
+          if (!project) return null;
+          return (
+            <CreateProjectModal
+              open
+              mode="edit"
+              initial={{
+                name: project.name,
+                sourceFolders: project.sourceFolders ?? [],
+              }}
+              onClose={() => setEditingProjectId(null)}
+              onCreate={(input) => handleUpdateProject(project.id, input)}
+              onDelete={() => removeProject(project.id)}
+            />
+          );
+        })()}
     </div>
   );
 }