From d8443c2bfc3b038f16fec62e20bca5a9a4b8c21c Mon Sep 17 00:00:00 2001
From: Your Name <your.email@example.com>
Date: Sat, 21 Feb 2026 06:01:46 +0800
Subject: [PATCH] feat: show canvas/chat title in canvas panel header

---
 components/canvas/CanvasChatPanel.tsx | 24 +++++++++++++++++++++++-
 1 file changed, 23 insertions(+), 1 deletion(-)

diff --git a/components/canvas/CanvasChatPanel.tsx b/components/canvas/CanvasChatPanel.tsx
index 0d32e143c..e9fb48a26 100644
--- a/components/canvas/CanvasChatPanel.tsx
+++ b/components/canvas/CanvasChatPanel.tsx
@@ -1338,6 +1338,7 @@ export function CanvasChatPanel({ chatId, initialMessages = [], onClose, onOpenF
   const addNode = useCanvasStore((state) => state.addNode);
   const updateNode = useCanvasStore((state) => state.updateNode);
   const nodes = useCanvasStore((state) => state.nodes);
+  const projectTitle = useCanvasStore((state) => state.projectTitle);
   const selectedNodeIds = useCanvasStore((state) => state.selectedNodeIds);
   const clearSelection = useCanvasStore((state) => state.clearSelection);
   const pendingChatAttachments = useCanvasStore((state) => state.pendingChatAttachments);
@@ -4988,10 +4989,30 @@ export function CanvasChatPanel({ chatId, initialMessages = [], onClose, onOpenF
     toast.success("已切换聊天窗口");
   }, [activeChatId]);
 
+  const activeSessionTitle = useMemo(() => {
+    const current = chatSessions.find((session) => session.id === activeChatId);
+    return String(current?.title || "").trim();
+  }, [chatSessions, activeChatId]);
+
+  const displayCanvasName = useMemo(() => {
+    if (activeSessionTitle) return activeSessionTitle;
+    const fallbackTitle = String(projectTitle || "").trim();
+    return fallbackTitle || "未命名画布";
+  }, [activeSessionTitle, projectTitle]);
+
   return (
     <div className="relative flex h-full min-h-0 flex-col bg-background/50 backdrop-blur-sm">
       {/* Header - Minimal with Icons */}
-      <div className="z-20 ml-auto p-4 flex flex-col items-end gap-2">
+      <div className="z-20 flex items-start justify-between gap-3 p-4 pb-2">
+        <div className="min-w-0 flex-1 pr-2">
+          <h2
+            className="truncate text-[20px] font-semibold leading-tight tracking-tight text-[#111827]"
+            title={displayCanvasName}
+          >
+            {displayCanvasName}
+          </h2>
+        </div>
+        <div className="flex shrink-0 flex-col items-end gap-2">
         <div className="flex items-center gap-1">
           <Button 
             variant="ghost" 
@@ -5081,6 +5102,7 @@ export function CanvasChatPanel({ chatId, initialMessages = [], onClose, onOpenF
             <Maximize2 className="h-4 w-4" />
           </Button>
         </div>
+        </div>
       </div>
       
       {/* 消息列表 */}