feat: Advanced file editor and file tree improvements (#444)

# Features
- File drag and drop upload: Support uploading files and folders via drag and drop
- Binary file handling: Detect binary files and display a friendly message instead of trying to edit them
- Folder download: Download folders as ZIP files (using JSZip library)
- Context menu integration: Full right-click context menu for file operations (rename, delete, copy path, download, new file/folder)

src/components/file-tree/view/FileTreeBody.tsx

@@ -1,7 +1,6 @@
-import type { ReactNode } from 'react';
+import type { ReactNode, RefObject } from 'react';
 import { Folder, Search } from 'lucide-react';
 import { useTranslation } from 'react-i18next';
-import { ScrollArea } from '../../ui/scroll-area';
 import type { FileTreeNode, FileTreeViewMode } from '../types/types';
 import FileTreeEmptyState from './FileTreeEmptyState';
 import FileTreeList from './FileTreeList';
@@ -16,6 +15,21 @@ type FileTreeBodyProps = {
   renderFileIcon: (filename: string) => ReactNode;
   formatFileSize: (bytes?: number) => string;
   formatRelativeTime: (date?: string) => string;
+  onRename?: (item: FileTreeNode) => void;
+  onDelete?: (item: FileTreeNode) => void;
+  onNewFile?: (path: string) => void;
+  onNewFolder?: (path: string) => void;
+  onCopyPath?: (item: FileTreeNode) => void;
+  onDownload?: (item: FileTreeNode) => void;
+  onRefresh?: () => void;
+  // Rename state for inline editing
+  renamingItem?: FileTreeNode | null;
+  renameValue?: string;
+  setRenameValue?: (value: string) => void;
+  handleConfirmRename?: () => void;
+  handleCancelRename?: () => void;
+  renameInputRef?: RefObject<HTMLInputElement>;
+  operationLoading?: boolean;
 };
 
 export default function FileTreeBody({
@@ -28,11 +42,25 @@ export default function FileTreeBody({
   renderFileIcon,
   formatFileSize,
   formatRelativeTime,
+  onRename,
+  onDelete,
+  onNewFile,
+  onNewFolder,
+  onCopyPath,
+  onDownload,
+  onRefresh,
+  renamingItem,
+  renameValue,
+  setRenameValue,
+  handleConfirmRename,
+  handleCancelRename,
+  renameInputRef,
+  operationLoading,
 }: FileTreeBodyProps) {
   const { t } = useTranslation();
 
   return (
-    <ScrollArea className="flex-1 px-2 py-1">
+    <>
       {files.length === 0 ? (
         <FileTreeEmptyState
           icon={Folder}
@@ -54,9 +82,22 @@ export default function FileTreeBody({
           renderFileIcon={renderFileIcon}
           formatFileSize={formatFileSize}
           formatRelativeTime={formatRelativeTime}
+          onRename={onRename}
+          onDelete={onDelete}
+          onNewFile={onNewFile}
+          onNewFolder={onNewFolder}
+          onCopyPath={onCopyPath}
+          onDownload={onDownload}
+          onRefresh={onRefresh}
+          renamingItem={renamingItem}
+          renameValue={renameValue}
+          setRenameValue={setRenameValue}
+          handleConfirmRename={handleConfirmRename}
+          handleCancelRename={handleCancelRename}
+          renameInputRef={renameInputRef}
+          operationLoading={operationLoading}
         />
       )}
-    </ScrollArea>
+    </>
   );
 }
-