feat: directory double-click, Ctrl+W close tab, tree animations

- Double-click directory to expand + switch to code view
- Ctrl+W / Cmd+W closes current file tab
- Added to keyboard shortcuts dialog
- FileTree AnimatePresence expand/collapse animation
- onDirDoubleClick handler propagated through FileTree

Author: yeahhe365

structure-insight/components/FileTree.tsx

@@ -1,5 +1,6 @@
 
 import React from 'react';
+import { motion, AnimatePresence } from 'framer-motion';
 import { FileNode } from '../types';
 
 interface FileTreeProps {
@@ -8,6 +9,7 @@ interface FileTreeProps {
   onDeleteFile: (path: string) => void;
   onCopyPath: (path: string) => void;
   onToggleExclude: (path: string) => void;
+  onDirDoubleClick?: () => void;
   selectedFilePath: string | null;
   showCharCount: boolean;
 }
@@ -138,16 +140,17 @@ const getFileIcon = (fileName: string): IconEntry => {
 export { getFileIcon };
 export type { IconEntry };
 
-const FileTreeNode: React.FC<{ 
-    node: FileNode; 
-    onFileSelect: (path: string) => void; 
-    onDeleteFile: (path: string) => void; 
-    onCopyPath: (path: string) => void; 
+const FileTreeNode: React.FC<{
+    node: FileNode;
+    onFileSelect: (path: string) => void;
+    onDeleteFile: (path: string) => void;
+    onCopyPath: (path: string) => void;
     onToggleExclude: (path: string) => void;
-    level: number; 
-    selectedFilePath: string | null; 
-    showCharCount: boolean; 
-}> = React.memo(({ node, onFileSelect, onDeleteFile, onCopyPath, onToggleExclude, level, selectedFilePath, showCharCount }) => {
+    onDirDoubleClick?: () => void;
+    level: number;
+    selectedFilePath: string | null;
+    showCharCount: boolean;
+}> = React.memo(({ node, onFileSelect, onDeleteFile, onCopyPath, onToggleExclude, onDirDoubleClick, level, selectedFilePath, showCharCount }) => {
   const [isOpen, setIsOpen] = React.useState(true);
 
   const handleToggle = () => {
@@ -163,6 +166,13 @@ const FileTreeNode: React.FC<{
       handleToggle();
     }
   };
+
+  const handleDoubleClick = () => {
+    if (node.isDirectory && onDirDoubleClick) {
+      setIsOpen(!isOpen);
+      onDirDoubleClick();
+    }
+  };
 
   const handleDelete = (e: React.MouseEvent) => {
       e.stopPropagation();
@@ -214,6 +224,7 @@ const FileTreeNode: React.FC<{
       <div
         className={`group flex flex-col py-1 px-2 rounded-md cursor-pointer hover:bg-light-border dark:hover:bg-dark-border/50 transition-colors duration-150 ${statusClass} ${isSelected ? 'bg-primary/10 dark:bg-primary/20' : ''}`}
         onClick={handleSelect}
+        onDoubleClick={handleDoubleClick}
         title={title}
       >
         {/* Top Row: Icon, Name, Stats */}
@@ -275,18 +286,28 @@ const FileTreeNode: React.FC<{
             </div>
         )}
       </div>
-      {node.isDirectory && isOpen && (
-        <ul className="pl-0">
-          {node.children.map(child => (
-            <FileTreeNode key={child.path} node={child} onFileSelect={onFileSelect} onDeleteFile={onDeleteFile} onCopyPath={onCopyPath} onToggleExclude={onToggleExclude} level={level + 1} selectedFilePath={selectedFilePath} showCharCount={showCharCount} />
-          ))}
-        </ul>
+      {node.isDirectory && (
+        <AnimatePresence initial={false}>
+          {isOpen && (
+            <motion.ul
+              className="pl-0 overflow-hidden"
+              initial={{ height: 0, opacity: 0 }}
+              animate={{ height: 'auto', opacity: 1 }}
+              exit={{ height: 0, opacity: 0 }}
+              transition={{ duration: 0.15, ease: 'easeInOut' }}
+            >
+              {node.children.map(child => (
+                <FileTreeNode key={child.path} node={child} onFileSelect={onFileSelect} onDeleteFile={onDeleteFile} onCopyPath={onCopyPath} onToggleExclude={onToggleExclude} onDirDoubleClick={onDirDoubleClick} level={level + 1} selectedFilePath={selectedFilePath} showCharCount={showCharCount} />
+              ))}
+            </motion.ul>
+          )}
+        </AnimatePresence>
       )}
     </li>
   );
 });
 
-const FileTree: React.FC<FileTreeProps> = ({ nodes, onFileSelect, onDeleteFile, onCopyPath, onToggleExclude, selectedFilePath, showCharCount }) => {
+const FileTree: React.FC<FileTreeProps> = ({ nodes, onFileSelect, onDeleteFile, onCopyPath, onToggleExclude, onDirDoubleClick, selectedFilePath, showCharCount }) => {
   if (!nodes || nodes.length === 0) {
     return <div className="p-4 text-center text-sm text-light-subtle-text dark:text-dark-subtle-text">未加载文件。</div>;
   }
@@ -295,7 +316,7 @@ const FileTree: React.FC<FileTreeProps> = ({ nodes, onFileSelect, onDeleteFile,
       <h3 className="text-xs font-semibold px-2 mb-2 text-light-subtle-text dark:text-dark-subtle-text uppercase tracking-wider">资源管理器</h3>
       <ul className="pl-0">
         {nodes.map(node => (
-          <FileTreeNode key={node.path} node={node} onFileSelect={onFileSelect} onDeleteFile={onDeleteFile} onCopyPath={onCopyPath} onToggleExclude={onToggleExclude} level={1} selectedFilePath={selectedFilePath} showCharCount={showCharCount} />
+          <FileTreeNode key={node.path} node={node} onFileSelect={onFileSelect} onDeleteFile={onDeleteFile} onCopyPath={onCopyPath} onToggleExclude={onToggleExclude} onDirDoubleClick={onDirDoubleClick} level={1} selectedFilePath={selectedFilePath} showCharCount={showCharCount} />
         ))}
       </ul>
     </div>

structure-insight/components/KeyboardShortcutsDialog.tsx

@@ -12,6 +12,7 @@ const shortcuts = [
     { keys: ['Ctrl', 'S'], description: 'Save as text' },
     { keys: ['Escape'], description: 'Close dialog' },
     { keys: ['Ctrl', '/'], description: 'Show this help' },
+    { keys: ['Ctrl', 'W'], description: 'Close current tab' },
 ];
 
 const KeyboardShortcutsDialog: React.FC<KeyboardShortcutsDialogProps> = ({ isOpen, onClose }) => {

structure-insight/hooks/useAppLogic.ts

@@ -123,6 +123,11 @@ export const useAppLogic = (
         processedData, isMobile, setMobileView, setSelectedFilePath, setActiveView,
     });
 
+    const handleDirDoubleClick = React.useCallback(() => {
+        setActiveView('code');
+        setMobileView('editor');
+    }, [setActiveView, setMobileView]);
+
     // Update structure string when showCharCount changes
     React.useEffect(() => {
         if (processedData) {
@@ -250,6 +255,7 @@ export const useAppLogic = (
                 if (e.key === 's') { e.preventDefault(); if (processedData) handleSave(); }
                 if (e.key === 'o') { e.preventDefault(); handleFileSelect(); }
                 if (e.key === '/') { e.preventDefault(); setIsShortcutsOpen(p => !p); }
+                if (e.key === 'w') { e.preventDefault(); if (selectedFilePath) closeTab(selectedFilePath); }
             }
             if (e.key === 'Escape') {
                 if (isShortcutsOpen) { e.preventDefault(); setIsShortcutsOpen(false); }
@@ -262,7 +268,7 @@ export const useAppLogic = (
         };
         window.addEventListener('keydown', handleGlobalKeys);
         return () => window.removeEventListener('keydown', handleGlobalKeys);
-    }, [isSearchOpen, isSettingsOpen, isAiChatOpen, isFileRankOpen, isShortcutsOpen, isLoading, processedData, handleSave, handleFileSelect, handleCancel]);
+    }, [isSearchOpen, isSettingsOpen, isAiChatOpen, isFileRankOpen, isShortcutsOpen, isLoading, processedData, handleSave, handleFileSelect, handleCancel, selectedFilePath, closeTab]);
 
     // --- Memoized Stats ---
     const stats = React.useMemo(() => {
@@ -299,6 +305,7 @@ export const useAppLogic = (
             setActiveView,
             handleCopyPath,
             handleToggleExclude,
+            handleDirDoubleClick,
         },
         settings: {
             setIsDark, setExtractContent, setFontSize, handleClearCache, setShowCharCount, setMaxCharsThreshold, setWordWrap