clean comment

- Updated NotesTreeNode type to include 'hint' as a node type.
- Implemented TreeNode component to handle rendering of notes and folders, including hint nodes.
- Added drag-and-drop functionality for organizing notes.
- Created context hooks for managing notes actions, selection, editing, drag-and-drop, search, and UI state.
- Developed file upload handling for drag-and-drop and file selection.
- Enhanced menu options for notes with actions like create, rename, delete, and export.
- Integrated auto-renaming feature for notes based on content.

package.json

@@ -215,8 +215,8 @@
     "@types/mime-types": "^3",
     "@types/node": "^22.17.1",
     "@types/pako": "^1.0.2",
-    "@types/react": "^19.0.12",
-    "@types/react-dom": "^19.0.4",
+    "@types/react": "^19.2.6",
+    "@types/react-dom": "^19.2.3",
     "@types/react-infinite-scroll-component": "^5.0.0",
     "@types/react-transition-group": "^4.4.12",
     "@types/react-window": "^1",

packages/shared/IpcChannel.ts

@@ -196,6 +196,9 @@ export enum IpcChannel {
   File_ValidateNotesDirectory = 'file:validateNotesDirectory',
   File_StartWatcher = 'file:startWatcher',
   File_StopWatcher = 'file:stopWatcher',
+  File_PauseWatcher = 'file:pauseWatcher',
+  File_ResumeWatcher = 'file:resumeWatcher',
+  File_BatchUploadMarkdown = 'file:batchUploadMarkdown',
   File_ShowInFolder = 'file:showInFolder',
 
   // file service

packages/shared/config/types.ts

@@ -10,7 +10,7 @@ export type LoaderReturn = {
   messageSource?: 'preprocess' | 'embedding' | 'validation'
 }
 
-export type FileChangeEventType = 'add' | 'change' | 'unlink' | 'addDir' | 'unlinkDir'
+export type FileChangeEventType = 'add' | 'change' | 'unlink' | 'addDir' | 'unlinkDir' | 'refresh'
 
 export type FileChangeEvent = {
   eventType: FileChangeEventType

src/main/ipc.ts

@@ -557,6 +557,9 @@ export function registerIpc(mainWindow: BrowserWindow, app: Electron.App) {
   ipcMain.handle(IpcChannel.File_ValidateNotesDirectory, fileManager.validateNotesDirectory.bind(fileManager))
   ipcMain.handle(IpcChannel.File_StartWatcher, fileManager.startFileWatcher.bind(fileManager))
   ipcMain.handle(IpcChannel.File_StopWatcher, fileManager.stopFileWatcher.bind(fileManager))
+  ipcMain.handle(IpcChannel.File_PauseWatcher, fileManager.pauseFileWatcher.bind(fileManager))
+  ipcMain.handle(IpcChannel.File_ResumeWatcher, fileManager.resumeFileWatcher.bind(fileManager))
+  ipcMain.handle(IpcChannel.File_BatchUploadMarkdown, fileManager.batchUploadMarkdownFiles.bind(fileManager))
   ipcMain.handle(IpcChannel.File_ShowInFolder, fileManager.showInFolder.bind(fileManager))
 
   // file service

src/main/services/FileStorage.ts

@@ -1605,6 +1605,164 @@ class FileStorage {
       logger.error('Failed to show item in folder:', error as Error)
     }
   }
+
+  /**
+   * Batch upload markdown files from native File objects
+   * This handles all I/O operations in the Main process to avoid blocking Renderer
+   */
+  public batchUploadMarkdownFiles = async (
+    _: Electron.IpcMainInvokeEvent,
+    filePaths: string[],
+    targetPath: string
+  ): Promise<{
+    fileCount: number
+    folderCount: number
+    skippedFiles: number
+  }> => {
+    try {
+      logger.info('Starting batch upload', { fileCount: filePaths.length, targetPath })
+
+      const basePath = path.resolve(targetPath)
+      const MARKDOWN_EXTS = ['.md', '.markdown']
+
+      // Filter markdown files
+      const markdownFiles = filePaths.filter((filePath) => {
+        const ext = path.extname(filePath).toLowerCase()
+        return MARKDOWN_EXTS.includes(ext)
+      })
+
+      const skippedFiles = filePaths.length - markdownFiles.length
+
+      if (markdownFiles.length === 0) {
+        return { fileCount: 0, folderCount: 0, skippedFiles }
+      }
+
+      // Collect unique folders needed
+      const foldersSet = new Set<string>()
+      const fileOperations: Array<{ sourcePath: string; targetPath: string }> = []
+
+      for (const filePath of markdownFiles) {
+        try {
+          // Get relative path if file is from a directory upload
+          const fileName = path.basename(filePath)
+          const relativePath = path.dirname(filePath)
+
+          // Determine target directory structure
+          let targetDir = basePath
+          const folderParts: string[] = []
+
+          // Extract folder structure from file path for nested uploads
+          // This is a simplified version - in real scenario we'd need the original directory structure
+          if (relativePath && relativePath !== '.') {
+            const parts = relativePath.split(path.sep)
+            // Get the last few parts that represent the folder structure within upload
+            const relevantParts = parts.slice(Math.max(0, parts.length - 3))
+            folderParts.push(...relevantParts)
+          }
+
+          // Build target directory path
+          for (const part of folderParts) {
+            targetDir = path.join(targetDir, part)
+            foldersSet.add(targetDir)
+          }
+
+          // Determine final file name
+          const nameWithoutExt = fileName.endsWith('.md')
+            ? fileName.slice(0, -3)
+            : fileName.endsWith('.markdown')
+              ? fileName.slice(0, -9)
+              : fileName
+
+          const { safeName } = await this.fileNameGuard(_, targetDir, nameWithoutExt, true)
+          const finalPath = path.join(targetDir, safeName + '.md')
+
+          fileOperations.push({ sourcePath: filePath, targetPath: finalPath })
+        } catch (error) {
+          logger.error('Failed to prepare file operation:', error as Error, { filePath })
+        }
+      }
+
+      // Create folders in order (shallow to deep)
+      const sortedFolders = Array.from(foldersSet).sort((a, b) => a.length - b.length)
+      for (const folder of sortedFolders) {
+        try {
+          if (!fs.existsSync(folder)) {
+            await fs.promises.mkdir(folder, { recursive: true })
+          }
+        } catch (error) {
+          logger.debug('Folder already exists or creation failed', { folder, error: (error as Error).message })
+        }
+      }
+
+      // Process files in batches
+      const BATCH_SIZE = 10 // Higher batch size since we're in Main process
+      let successCount = 0
+
+      for (let i = 0; i < fileOperations.length; i += BATCH_SIZE) {
+        const batch = fileOperations.slice(i, i + BATCH_SIZE)
+
+        const results = await Promise.allSettled(
+          batch.map(async (op) => {
+            // Read from source and write to target in Main process
+            const content = await fs.promises.readFile(op.sourcePath, 'utf-8')
+            await fs.promises.writeFile(op.targetPath, content, 'utf-8')
+            return true
+          })
+        )
+
+        results.forEach((result, index) => {
+          if (result.status === 'fulfilled') {
+            successCount++
+          } else {
+            logger.error('Failed to upload file:', result.reason, {
+              file: batch[index].sourcePath
+            })
+          }
+        })
+      }
+
+      logger.info('Batch upload completed', {
+        successCount,
+        folderCount: foldersSet.size,
+        skippedFiles
+      })
+
+      return {
+        fileCount: successCount,
+        folderCount: foldersSet.size,
+        skippedFiles
+      }
+    } catch (error) {
+      logger.error('Batch upload failed:', error as Error)
+      throw error
+    }
+  }
+
+  /**
+   * Pause file watcher to prevent events during batch operations
+   */
+  public pauseFileWatcher = async (): Promise<void> => {
+    if (this.watcher) {
+      logger.debug('Pausing file watcher')
+      // Chokidar doesn't have pause, so we temporarily set a flag
+      // We'll handle this by clearing the debounce timer
+      if (this.debounceTimer) {
+        clearTimeout(this.debounceTimer)
+        this.debounceTimer = undefined
+      }
+    }
+  }
+
+  /**
+   * Resume file watcher and trigger a refresh
+   */
+  public resumeFileWatcher = async (): Promise<void> => {
+    if (this.watcher && this.currentWatchPath) {
+      logger.debug('Resuming file watcher')
+      // Send a synthetic refresh event to trigger tree reload
+      this.notifyChange('refresh', this.currentWatchPath)
+    }
+  }
 }
 
 export const fileStorage = new FileStorage()

src/preload/index.ts

@@ -220,6 +220,10 @@ const api = {
     startFileWatcher: (dirPath: string, config?: any) =>
       ipcRenderer.invoke(IpcChannel.File_StartWatcher, dirPath, config),
     stopFileWatcher: () => ipcRenderer.invoke(IpcChannel.File_StopWatcher),
+    pauseFileWatcher: () => ipcRenderer.invoke(IpcChannel.File_PauseWatcher),
+    resumeFileWatcher: () => ipcRenderer.invoke(IpcChannel.File_ResumeWatcher),
+    batchUploadMarkdown: (filePaths: string[], targetPath: string) =>
+      ipcRenderer.invoke(IpcChannel.File_BatchUploadMarkdown, filePaths, targetPath),
     onFileChange: (callback: (data: FileChangeEvent) => void) => {
       const listener = (_event: Electron.IpcRendererEvent, data: any) => {
         if (data && typeof data === 'object') {

src/renderer/src/components/VirtualList/__tests__/DynamicVirtualList.test.tsx

@@ -140,11 +140,11 @@ describe('DynamicVirtualList', () => {
       // Should call isSticky function during rendering
       expect(isSticky).toHaveBeenCalled()
 
-      // Should apply sticky styles to sticky items
+      // Sticky items within visible range should have proper z-index but may be absolute until scrolled
       const stickyItem = document.querySelector('[data-index="0"]') as HTMLElement
       expect(stickyItem).toBeInTheDocument()
-      expect(stickyItem).toHaveStyle('position: sticky')
-      expect(stickyItem).toHaveStyle('z-index: 1')
+      // When sticky item is in visible range, it gets z-index but may not be sticky yet
+      expect(stickyItem).toHaveStyle('z-index: 999')
     })
 
     it('should apply absolute positioning to non-sticky items', () => {

src/renderer/src/components/VirtualList/__tests__/__snapshots__/DynamicVirtualList.test.tsx.snap

@@ -24,7 +24,7 @@ exports[`DynamicVirtualList > basic rendering > snapshot test 1`] = `
     >
       <div
         data-index="0"
-        style="position: absolute; top: 0px; left: 0px; transform: translateY(0px); width: 100%;"
+        style="position: absolute; top: 0px; left: 0px; z-index: 0; pointer-events: auto; transform: translateY(0px); width: 100%;"
       >
         <div
           data-testid="item-0"
@@ -34,7 +34,7 @@ exports[`DynamicVirtualList > basic rendering > snapshot test 1`] = `
       </div>
       <div
         data-index="1"
-        style="position: absolute; top: 0px; left: 0px; transform: translateY(50px); width: 100%;"
+        style="position: absolute; top: 0px; left: 0px; z-index: 0; pointer-events: auto; transform: translateY(50px); width: 100%;"
       >
         <div
           data-testid="item-1"
@@ -44,7 +44,7 @@ exports[`DynamicVirtualList > basic rendering > snapshot test 1`] = `
       </div>
       <div
         data-index="2"
-        style="position: absolute; top: 0px; left: 0px; transform: translateY(100px); width: 100%;"
+        style="position: absolute; top: 0px; left: 0px; z-index: 0; pointer-events: auto; transform: translateY(100px); width: 100%;"
       >
         <div
           data-testid="item-2"

src/renderer/src/components/VirtualList/dynamic.tsx

@@ -62,6 +62,12 @@ export interface DynamicVirtualListProps<T> extends InheritedVirtualizerOptions
    */
   isSticky?: (index: number) => boolean
 
+  /**
+   * Get the depth/level of an item for hierarchical sticky positioning
+   * Used with isSticky to determine ancestor relationships
+   */
+  getItemDepth?: (index: number) => number
+
   /**
    * Range extractor function, cannot be used with isSticky
    */
@@ -101,6 +107,7 @@ function DynamicVirtualList<T>(props: DynamicVirtualListProps<T>) {
     size,
     estimateSize,
     isSticky,
+    getItemDepth,
     rangeExtractor: customRangeExtractor,
     itemContainerStyle,
     scrollerStyle,
@@ -115,7 +122,7 @@ function DynamicVirtualList<T>(props: DynamicVirtualListProps<T>) {
   const internalScrollerRef = useRef<HTMLDivElement>(null)
   const scrollerRef = internalScrollerRef
 
-  const activeStickyIndexRef = useRef(0)
+  const activeStickyIndexesRef = useRef<number[]>([])
 
   const stickyIndexes = useMemo(() => {
     if (!isSticky) return []
@@ -124,21 +131,54 @@ function DynamicVirtualList<T>(props: DynamicVirtualListProps<T>) {
 
   const internalStickyRangeExtractor = useCallback(
     (range: Range) => {
-      // The active sticky index is the last one that is before or at the start of the visible range
-      const newActiveStickyIndex =
-        [...stickyIndexes].reverse().find((index) => range.startIndex >= index) ?? stickyIndexes[0] ?? 0
+      const activeStickies: number[] = []
 
-      if (newActiveStickyIndex !== activeStickyIndexRef.current) {
-        activeStickyIndexRef.current = newActiveStickyIndex
+      if (getItemDepth) {
+        // With depth information, we can build a proper ancestor chain
+        // Find all sticky items before the visible range
+        const stickiesBeforeRange = stickyIndexes.filter((index) => index < range.startIndex)
+
+        if (stickiesBeforeRange.length > 0) {
+          // Find the depth of the first visible item (or last sticky before it)
+          const firstVisibleIndex = range.startIndex
+          const referenceDepth = getItemDepth(firstVisibleIndex)
+
+          // Build ancestor chain: include all sticky parents
+          const ancestorChain: number[] = []
+          let minDepth = referenceDepth
+
+          // Walk backwards from the last sticky before visible range
+          for (let i = stickiesBeforeRange.length - 1; i >= 0; i--) {
+            const stickyIndex = stickiesBeforeRange[i]
+            const stickyDepth = getItemDepth(stickyIndex)
+
+            // Include this sticky if it's a parent (smaller depth) of our reference
+            if (stickyDepth < minDepth) {
+              ancestorChain.unshift(stickyIndex)
+              minDepth = stickyDepth
+            }
+          }
+
+          activeStickies.push(...ancestorChain)
+        }
+      } else {
+        // Fallback: without depth info, just use the last sticky before range
+        const lastStickyBeforeRange = [...stickyIndexes].reverse().find((index) => index < range.startIndex)
+        if (lastStickyBeforeRange !== undefined) {
+          activeStickies.push(lastStickyBeforeRange)
+        }
       }
 
-      // Merge the active sticky index and the default range extractor
-      const next = new Set([activeStickyIndexRef.current, ...defaultRangeExtractor(range)])
+      // Update the ref with current active stickies
+      activeStickyIndexesRef.current = activeStickies
+
+      // Merge the active sticky indexes and the default range extractor
+      const next = new Set([...activeStickyIndexesRef.current, ...defaultRangeExtractor(range)])
 
       // Sort the set to maintain proper order
       return [...next].sort((a, b) => a - b)
     },
-    [stickyIndexes]
+    [stickyIndexes, getItemDepth]
   )
 
   const rangeExtractor = customRangeExtractor ?? (isSticky ? internalStickyRangeExtractor : undefined)
@@ -221,14 +261,47 @@ function DynamicVirtualList<T>(props: DynamicVirtualListProps<T>) {
         }}>
         {virtualItems.map((virtualItem) => {
           const isItemSticky = stickyIndexes.includes(virtualItem.index)
-          const isItemActiveSticky = isItemSticky && activeStickyIndexRef.current === virtualItem.index
+          const isItemActiveSticky = isItemSticky && activeStickyIndexesRef.current.includes(virtualItem.index)
+
+          // Calculate the sticky offset for multi-level sticky headers
+          const activeStickyIndex = isItemActiveSticky ? activeStickyIndexesRef.current.indexOf(virtualItem.index) : -1
+
+          // Calculate cumulative offset based on actual sizes of previous sticky items
+          let stickyOffset = 0
+          if (activeStickyIndex >= 0) {
+            for (let i = 0; i < activeStickyIndex; i++) {
+              const prevStickyIndex = activeStickyIndexesRef.current[i]
+              stickyOffset += estimateSize(prevStickyIndex)
+            }
+          }
+
+          // Check if this item is visually covered by sticky items
+          // If covered, disable pointer events to prevent hover/click bleeding through
+          const isCoveredBySticky = (() => {
+            if (!activeStickyIndexesRef.current.length) return false
+            if (isItemActiveSticky) return false // Sticky items themselves are not covered
+
+            // Calculate if this item's visual position is under any sticky header
+            const itemVisualTop = virtualItem.start
+            let totalStickyHeight = 0
+            for (const stickyIdx of activeStickyIndexesRef.current) {
+              totalStickyHeight += estimateSize(stickyIdx)
+            }
+
+            // If item starts within the sticky area, it's covered
+            return itemVisualTop < totalStickyHeight
+          })()
 
           const style: React.CSSProperties = {
             ...itemContainerStyle,
             position: isItemActiveSticky ? 'sticky' : 'absolute',
-            top: 0,
+            top: isItemActiveSticky ? stickyOffset : 0,
             left: 0,
-            zIndex: isItemSticky ? 1 : undefined,
+            zIndex: isItemActiveSticky ? 1000 + (100 - activeStickyIndex) : isItemSticky ? 999 : 0,
+            pointerEvents: isCoveredBySticky ? 'none' : 'auto',
+            ...(isItemActiveSticky && {
+              backgroundColor: 'var(--color-background)'
+            }),
             ...(horizontal
               ? {
                   transform: isItemActiveSticky ? undefined : `translateX(${virtualItem.start}px)`,

src/renderer/src/hooks/useInPlaceEdit.ts

@@ -1,7 +1,7 @@
-import { useCallback, useEffect, useRef, useState } from 'react'
-
-import { useTimer } from './useTimer'
+import { loggerService } from '@logger'
+import { useCallback, useLayoutEffect, useRef, useState } from 'react'
 
+const logger = loggerService.withContext('useInPlaceEdit')
 export interface UseInPlaceEditOptions {
   onSave: ((value: string) => void) | ((value: string) => Promise<void>)
   onCancel?: () => void
@@ -12,14 +12,10 @@ export interface UseInPlaceEditOptions {
 export interface UseInPlaceEditReturn {
   isEditing: boolean
   isSaving: boolean
-  editValue: string
-  inputRef: React.RefObject<HTMLInputElement | null>
   startEdit: (initialValue: string) => void
   saveEdit: () => void
   cancelEdit: () => void
-  handleKeyDown: (e: React.KeyboardEvent) => void
-  handleInputChange: (e: React.ChangeEvent<HTMLInputElement>) => void
-  handleValueChange: (value: string) => void
+  inputProps: React.InputHTMLAttributes<HTMLInputElement> & { ref: React.RefObject<HTMLInputElement | null> }
 }
 
 /**
@@ -37,58 +33,55 @@ export function useInPlaceEdit(options: UseInPlaceEditOptions): UseInPlaceEditRe
   const [isSaving, setIsSaving] = useState(false)
   const [isEditing, setIsEditing] = useState(false)
   const [editValue, setEditValue] = useState('')
-  const [originalValue, setOriginalValue] = useState('')
+  const originalValueRef = useRef('')
   const inputRef = useRef<HTMLInputElement>(null)
-  const { setTimeoutTimer } = useTimer()
 
-  const startEdit = useCallback(
-    (initialValue: string) => {
-      setIsEditing(true)
-      setEditValue(initialValue)
-      setOriginalValue(initialValue)
+  const startEdit = useCallback((initialValue: string) => {
+    setIsEditing(true)
+    setEditValue(initialValue)
+    originalValueRef.current = initialValue
+  }, [])
 
-      setTimeoutTimer(
-        'startEdit',
-        () => {
-          inputRef.current?.focus()
-          if (autoSelectOnStart) {
-            inputRef.current?.select()
-          }
-        },
-        0
-      )
-    },
-    [autoSelectOnStart, setTimeoutTimer]
-  )
+  useLayoutEffect(() => {
+    if (isEditing) {
+      inputRef.current?.focus()
+      if (autoSelectOnStart) {
+        inputRef.current?.select()
+      }
+    }
+  }, [autoSelectOnStart, isEditing])
 
   const saveEdit = useCallback(async () => {
     if (isSaving) return
 
+    const finalValue = trimOnSave ? editValue.trim() : editValue
+    if (finalValue === originalValueRef.current) {
+      setIsEditing(false)
+      return
+    }
+
     setIsSaving(true)
 
     try {
-      const finalValue = trimOnSave ? editValue.trim() : editValue
-      if (finalValue !== originalValue) {
-        await onSave(finalValue)
-      }
+      await onSave(finalValue)
       setIsEditing(false)
       setEditValue('')
-      setOriginalValue('')
-    } finally {
+    } catch (error) {
+      logger.error('Error saving in-place edit', { error })
       setIsSaving(false)
     }
-  }, [isSaving, trimOnSave, editValue, originalValue, onSave])
+  }, [isSaving, trimOnSave, editValue, onSave])
 
   const cancelEdit = useCallback(() => {
     setIsEditing(false)
     setEditValue('')
-    setOriginalValue('')
     onCancel?.()
   }, [onCancel])
 
   const handleKeyDown = useCallback(
     (e: React.KeyboardEvent) => {
-      if (e.key === 'Enter' && !e.nativeEvent.isComposing) {
+      if (e.nativeEvent.isComposing) return
+      if (e.key === 'Enter') {
         e.preventDefault()
         saveEdit()
       } else if (e.key === 'Escape') {
@@ -104,37 +97,29 @@ export function useInPlaceEdit(options: UseInPlaceEditOptions): UseInPlaceEditRe
     setEditValue(e.target.value)
   }, [])
 
-  const handleValueChange = useCallback((value: string) => {
-    setEditValue(value)
-  }, [])
-
-  // Handle clicks outside the input to save
-  useEffect(() => {
-    const handleClickOutside = (event: MouseEvent) => {
-      if (isEditing && inputRef.current && !inputRef.current.contains(event.target as Node)) {
-        saveEdit()
-      }
+  const handleBlur = useCallback(() => {
+    // 这里的逻辑需要注意：
+    // 如果点击了“取消”按钮，可能会先触发 Blur 保存。
+    // 通常 InPlaceEdit 的逻辑是 Blur 即 Save。
+    // 如果不想 Blur 保存，可以去掉这一行，或者判断 relatedTarget。
+    if (!isSaving) {
+      saveEdit()
     }
-
-    if (isEditing) {
-      document.addEventListener('mousedown', handleClickOutside)
-      return () => {
-        document.removeEventListener('mousedown', handleClickOutside)
-      }
-    }
-    return
-  }, [isEditing, saveEdit])
+  }, [saveEdit, isSaving])
 
   return {
     isEditing,
     isSaving,
-    editValue,
-    inputRef,
     startEdit,
     saveEdit,
     cancelEdit,
-    handleKeyDown,
-    handleInputChange,
-    handleValueChange
+    inputProps: {
+      ref: inputRef,
+      value: editValue,
+      onChange: handleInputChange,
+      onKeyDown: handleKeyDown,
+      onBlur: handleBlur,
+      disabled: isSaving // 保存时禁用输入
+    }
   }
 }

src/renderer/src/i18n/locales/en-us.json

@@ -2175,7 +2175,10 @@
     "untitled_folder": "New Folder",
     "untitled_note": "Untitled Note",
     "upload_failed": "Note upload failed",
-    "upload_success": "Note uploaded success"
+    "upload_files": "Upload Files",
+    "upload_folder": "Upload Folder",
+    "upload_success": "Note uploaded success",
+    "uploading_files": "Uploading {{count}} files..."
   },
   "notification": {
     "assistant": "Assistant Response",

src/renderer/src/i18n/locales/zh-cn.json

@@ -2175,7 +2175,10 @@
     "untitled_folder": "新文件夹",
     "untitled_note": "无标题笔记",
     "upload_failed": "笔记上传失败",
-    "upload_success": "笔记上传成功"
+    "upload_files": "上传文件",
+    "upload_folder": "上传文件夹",
+    "upload_success": "笔记上传成功",
+    "uploading_files": "正在上传 {{count}} 个文件..."
   },
   "notification": {
     "assistant": "助手响应",

src/renderer/src/i18n/locales/zh-tw.json

@@ -2175,7 +2175,10 @@
     "untitled_folder": "新資料夾",
     "untitled_note": "無標題筆記",
     "upload_failed": "筆記上傳失敗",
-    "upload_success": "筆記上傳成功"
+    "upload_files": "[to be translated]:Upload Files",
+    "upload_folder": "[to be translated]:Upload Folder",
+    "upload_success": "筆記上傳成功",
+    "uploading_files": "正在上傳 {{count}} 個檔案..."
   },
   "notification": {
     "assistant": "助手回應",

src/renderer/src/i18n/translate/de-de.json

@@ -2175,7 +2175,10 @@
     "untitled_folder": "Neuer Ordner",
     "untitled_note": "Unbenannte Notiz",
     "upload_failed": "Notizen-Upload fehlgeschlagen",
-    "upload_success": "Notizen erfolgreich hochgeladen"
+    "upload_files": "[to be translated]:Upload Files",
+    "upload_folder": "[to be translated]:Upload Folder",
+    "upload_success": "Notizen erfolgreich hochgeladen",
+    "uploading_files": "[to be translated]:Uploading {{count}} files..."
   },
   "notification": {
     "assistant": "Assistenten-Antwort",

src/renderer/src/i18n/translate/el-gr.json

@@ -2175,7 +2175,10 @@
     "untitled_folder": "Νέος φάκελος",
     "untitled_note": "σημείωση χωρίς τίτλο",
     "upload_failed": "Η σημείωση δεν ανέβηκε",
-    "upload_success": "Οι σημειώσεις μεταφορτώθηκαν με επιτυχία"
+    "upload_files": "[to be translated]:Upload Files",
+    "upload_folder": "[to be translated]:Upload Folder",
+    "upload_success": "Οι σημειώσεις μεταφορτώθηκαν με επιτυχία",
+    "uploading_files": "[to be translated]:Uploading {{count}} files..."
   },
   "notification": {
     "assistant": "Απάντηση Βοηθού",

src/renderer/src/i18n/translate/es-es.json

@@ -2175,7 +2175,10 @@
     "untitled_folder": "Nueva carpeta",
     "untitled_note": "Nota sin título",
     "upload_failed": "Error al cargar la nota",
-    "upload_success": "Nota cargada con éxito"
+    "upload_files": "[to be translated]:Upload Files",
+    "upload_folder": "[to be translated]:Upload Folder",
+    "upload_success": "Nota cargada con éxito",
+    "uploading_files": "[to be translated]:Uploading {{count}} files..."
   },
   "notification": {
     "assistant": "Respuesta del asistente",

src/renderer/src/i18n/translate/fr-fr.json

@@ -2175,7 +2175,10 @@
     "untitled_folder": "nouveau dossier",
     "untitled_note": "Note sans titre",
     "upload_failed": "Échec du téléchargement de la note",
-    "upload_success": "Note téléchargée avec succès"
+    "upload_files": "[to be translated]:Upload Files",
+    "upload_folder": "[to be translated]:Upload Folder",
+    "upload_success": "Note téléchargée avec succès",
+    "uploading_files": "[to be translated]:Uploading {{count}} files..."
   },
   "notification": {
     "assistant": "Réponse de l'assistant",

src/renderer/src/i18n/translate/ja-jp.json

@@ -2175,7 +2175,10 @@
     "untitled_folder": "新ファイル夹",
     "untitled_note": "無題のメモ",
     "upload_failed": "ノートのアップロードに失敗しました",
-    "upload_success": "ノートのアップロードが成功しました"
+    "upload_files": "[to be translated]:Upload Files",
+    "upload_folder": "[to be translated]:Upload Folder",
+    "upload_success": "ノートのアップロードが成功しました",
+    "uploading_files": "[to be translated]:Uploading {{count}} files..."
   },
   "notification": {
     "assistant": "助手回應",

src/renderer/src/i18n/translate/pt-pt.json

@@ -2175,7 +2175,10 @@
     "untitled_folder": "Nova pasta",
     "untitled_note": "Nota sem título",
     "upload_failed": "Falha ao carregar a nota",
-    "upload_success": "Nota carregada com sucesso"
+    "upload_files": "[to be translated]:Upload Files",
+    "upload_folder": "[to be translated]:Upload Folder",
+    "upload_success": "Nota carregada com sucesso",
+    "uploading_files": "[to be translated]:Uploading {{count}} files..."
   },
   "notification": {
     "assistant": "Resposta do assistente",

src/renderer/src/i18n/translate/ru-ru.json

@@ -2175,7 +2175,10 @@
     "untitled_folder": "Новая папка",
     "untitled_note": "Незаглавленная заметка",
     "upload_failed": "Не удалось загрузить заметку",
-    "upload_success": "Заметка успешно загружена"
+    "upload_files": "[to be translated]:Upload Files",
+    "upload_folder": "[to be translated]:Upload Folder",
+    "upload_success": "Заметка успешно загружена",
+    "uploading_files": "[to be translated]:Uploading {{count}} files..."
   },
   "notification": {
     "assistant": "Ответ ассистента",

src/renderer/src/pages/home/Tabs/components/SessionItem.tsx

@@ -42,7 +42,7 @@ const SessionItem: FC<SessionItemProps> = ({ session, agentId, onDelete, onPress
   const targetSession = useDeferredValue(_targetSession)
   const dispatch = useAppDispatch()
 
-  const { isEditing, isSaving, editValue, inputRef, startEdit, handleKeyDown, handleValueChange } = useInPlaceEdit({
+  const { isEditing, isSaving, startEdit, inputProps } = useInPlaceEdit({
     onSave: async (value) => {
       if (value !== session.name) {
         await updateSession({ id: session.id, name: value })
@@ -179,14 +179,7 @@ const SessionItem: FC<SessionItemProps> = ({ session, agentId, onDelete, onPress
         {isFulfilled && !isActive && <FulfilledIndicator />}
         <SessionNameContainer>
           {isEditing ? (
-            <SessionEditInput
-              ref={inputRef}
-              value={editValue}
-              onChange={(e: React.ChangeEvent<HTMLInputElement>) => handleValueChange(e.target.value)}
-              onKeyDown={handleKeyDown}
-              onClick={(e: React.MouseEvent) => e.stopPropagation()}
-              style={{ opacity: isSaving ? 0.5 : 1 }}
-            />
+            <SessionEditInput {...inputProps} style={{ opacity: isSaving ? 0.5 : 1 }} />
           ) : (
             <>
               <SessionName>

src/renderer/src/pages/home/Tabs/components/Topics.tsx

@@ -79,7 +79,7 @@ export const Topics: React.FC<Props> = ({ assistant: _assistant, activeTopic, se
   const deleteTimerRef = useRef<NodeJS.Timeout>(null)
   const [editingTopicId, setEditingTopicId] = useState<string | null>(null)
 
-  const topicEdit = useInPlaceEdit({
+  const { startEdit, isEditing, inputProps } = useInPlaceEdit({
     onSave: (name: string) => {
       const topic = assistant.topics.find((t) => t.id === editingTopicId)
       if (topic && name !== topic.name) {
@@ -520,29 +520,23 @@ export const Topics: React.FC<Props> = ({ assistant: _assistant, activeTopic, se
             <TopicListItem
               onContextMenu={() => setTargetTopic(topic)}
               className={classNames(isActive ? 'active' : '', singlealone ? 'singlealone' : '')}
-              onClick={editingTopicId === topic.id && topicEdit.isEditing ? undefined : () => onSwitchTopic(topic)}
+              onClick={editingTopicId === topic.id && isEditing ? undefined : () => onSwitchTopic(topic)}
               style={{
                 borderRadius,
-                cursor: editingTopicId === topic.id && topicEdit.isEditing ? 'default' : 'pointer'
+                cursor: editingTopicId === topic.id && isEditing ? 'default' : 'pointer'
               }}>
               {isPending(topic.id) && !isActive && <PendingIndicator />}
               {isFulfilled(topic.id) && !isActive && <FulfilledIndicator />}
               <TopicNameContainer>
-                {editingTopicId === topic.id && topicEdit.isEditing ? (
-                  <TopicEditInput
-                    ref={topicEdit.inputRef}
-                    value={topicEdit.editValue}
-                    onChange={topicEdit.handleInputChange}
-                    onKeyDown={topicEdit.handleKeyDown}
-                    onClick={(e) => e.stopPropagation()}
-                  />
+                {editingTopicId === topic.id && isEditing ? (
+                  <TopicEditInput {...inputProps} onClick={(e) => e.stopPropagation()} />
                 ) : (
                   <TopicName
                     className={getTopicNameClassName()}
                     title={topicName}
                     onDoubleClick={() => {
                       setEditingTopicId(topic.id)
-                      topicEdit.startEdit(topic.name)
+                      startEdit(topic.name)
                     }}>
                     {topicName}
                   </TopicName>

src/renderer/src/pages/notes/NotesPage.tsx

@@ -295,6 +295,16 @@ const NotesPage: FC = () => {
               break
             }
 
+            case 'refresh': {
+              // 批量操作完成后的单次刷新
+              logger.debug('Received refresh event, triggering tree refresh')
+              const refresh = refreshTreeRef.current
+              if (refresh) {
+                await refresh()
+              }
+              break
+            }
+
             case 'add':
             case 'addDir':
             case 'unlink':
@@ -621,7 +631,27 @@ const NotesPage: FC = () => {
           throw new Error('No folder path selected')
         }
 
-        const result = await uploadNotes(files, targetFolderPath)
+        // Validate uploadNotes function is available
+        if (typeof uploadNotes !== 'function') {
+          logger.error('uploadNotes function is not available', { uploadNotes })
+          window.toast.error(t('notes.upload_failed'))
+          return
+        }
+
+        let result: Awaited<ReturnType<typeof uploadNotes>>
+        try {
+          result = await uploadNotes(files, targetFolderPath)
+        } catch (uploadError) {
+          logger.error('Upload operation failed:', uploadError as Error)
+          throw uploadError
+        }
+
+        // Validate result object
+        if (!result || typeof result !== 'object') {
+          logger.error('Invalid upload result:', { result })
+          window.toast.error(t('notes.upload_failed'))
+          return
+        }
 
         // 检查上传结果
         if (result.fileCount === 0) {

src/renderer/src/pages/notes/components/TreeNode.tsx

@@ -0,0 +1,498 @@
+import HighlightText from '@renderer/components/HighlightText'
+import {
+  useNotesActions,
+  useNotesDrag,
+  useNotesEditing,
+  useNotesSearch,
+  useNotesSelection,
+  useNotesUI
+} from '@renderer/pages/notes/context/NotesContexts'
+import { EVENT_NAMES, EventEmitter } from '@renderer/services/EventService'
+import type { SearchMatch, SearchResult } from '@renderer/services/NotesSearchService'
+import type { NotesTreeNode } from '@renderer/types/note'
+import { Dropdown } from 'antd'
+import { ChevronDown, ChevronRight, File, FilePlus, Folder, FolderOpen } from 'lucide-react'
+import { memo, useCallback, useMemo, useState } from 'react'
+import { useTranslation } from 'react-i18next'
+import styled from 'styled-components'
+
+interface TreeNodeProps {
+  node: NotesTreeNode | SearchResult
+  depth: number
+  renderChildren?: boolean
+  onHintClick?: () => void
+}
+
+const TreeNode = memo<TreeNodeProps>(({ node, depth, renderChildren = true, onHintClick }) => {
+  const { t } = useTranslation()
+
+  // Use split contexts - only subscribe to what this node needs
+  const { selectedFolderId, activeNodeId } = useNotesSelection()
+  const { editingNodeId, renamingNodeIds, newlyRenamedNodeIds, inPlaceEdit } = useNotesEditing()
+  const { draggedNodeId, dragOverNodeId, dragPosition, onDragStart, onDragOver, onDragLeave, onDrop, onDragEnd } =
+    useNotesDrag()
+  const { searchKeyword, showMatches } = useNotesSearch()
+  const { openDropdownKey } = useNotesUI()
+  const { getMenuItems, onSelectNode, onToggleExpanded, onDropdownOpenChange } = useNotesActions()
+
+  const [showAllMatches, setShowAllMatches] = useState(false)
+  const { isEditing: isInputEditing, inputProps } = inPlaceEdit
+
+  // 检查是否是 hint 节点
+  const isHintNode = node.type === 'hint'
+
+  // 检查是否是搜索结果
+  const searchResult = 'matchType' in node ? (node as SearchResult) : null
+  const hasMatches = searchResult && searchResult.matches && searchResult.matches.length > 0
+
+  // 处理匹配项点击
+  const handleMatchClick = useCallback(
+    (match: SearchMatch) => {
+      // 发送定位事件
+      EventEmitter.emit(EVENT_NAMES.LOCATE_NOTE_LINE, {
+        noteId: node.id,
+        lineNumber: match.lineNumber,
+        lineContent: match.lineContent
+      })
+    },
+    [node]
+  )
+
+  const isActive = selectedFolderId ? node.type === 'folder' && node.id === selectedFolderId : node.id === activeNodeId
+  const isEditing = editingNodeId === node.id && isInputEditing
+  const isRenaming = renamingNodeIds.has(node.id)
+  const isNewlyRenamed = newlyRenamedNodeIds.has(node.id)
+  const hasChildren = node.children && node.children.length > 0
+  const isDragging = draggedNodeId === node.id
+  const isDragOver = dragOverNodeId === node.id
+  const isDragBefore = isDragOver && dragPosition === 'before'
+  const isDragInside = isDragOver && dragPosition === 'inside'
+  const isDragAfter = isDragOver && dragPosition === 'after'
+
+  const getNodeNameClassName = () => {
+    if (isRenaming) return 'shimmer'
+    if (isNewlyRenamed) return 'typing'
+    return ''
+  }
+
+  const displayName = useMemo(() => {
+    if (!searchKeyword) {
+      return node.name
+    }
+
+    const name = node.name ?? ''
+    if (!name) {
+      return name
+    }
+
+    const keyword = searchKeyword
+    const nameLower = name.toLowerCase()
+    const keywordLower = keyword.toLowerCase()
+    const matchStart = nameLower.indexOf(keywordLower)
+
+    if (matchStart === -1) {
+      return name
+    }
+
+    const matchEnd = matchStart + keyword.length
+    const beforeMatch = Math.min(2, matchStart)
+    const contextStart = matchStart - beforeMatch
+    const contextLength = 50
+    const contextEnd = Math.min(name.length, matchEnd + contextLength)
+
+    const prefix = contextStart > 0 ? '...' : ''
+    const suffix = contextEnd < name.length ? '...' : ''
+
+    return prefix + name.substring(contextStart, contextEnd) + suffix
+  }, [node.name, searchKeyword])
+
+  // Special render for hint nodes
+  if (isHintNode) {
+    return (
+      <div key={node.id}>
+        <TreeNodeContainer active={false} depth={depth}>
+          <TreeNodeContent>
+            <NodeIcon>
+              <FilePlus size={16} />
+            </NodeIcon>
+            <DropHintText onClick={onHintClick}>{t('notes.drop_markdown_hint')}</DropHintText>
+          </TreeNodeContent>
+        </TreeNodeContainer>
+      </div>
+    )
+  }
+
+  return (
+    <div key={node.id}>
+      <Dropdown
+        menu={{ items: getMenuItems(node as NotesTreeNode) }}
+        trigger={['contextMenu']}
+        open={openDropdownKey === node.id}
+        onOpenChange={(open) => onDropdownOpenChange(open ? node.id : null)}>
+        <div onContextMenu={(e) => e.stopPropagation()}>
+          <TreeNodeContainer
+            active={isActive}
+            depth={depth}
+            isDragging={isDragging}
+            isDragOver={isDragOver}
+            isDragBefore={isDragBefore}
+            isDragInside={isDragInside}
+            isDragAfter={isDragAfter}
+            draggable={!isEditing}
+            data-node-id={node.id}
+            onDragStart={(e) => onDragStart(e, node as NotesTreeNode)}
+            onDragOver={(e) => onDragOver(e, node as NotesTreeNode)}
+            onDragLeave={onDragLeave}
+            onDrop={(e) => onDrop(e, node as NotesTreeNode)}
+            onDragEnd={onDragEnd}>
+            <TreeNodeContent onClick={() => onSelectNode(node as NotesTreeNode)}>
+              <NodeIndent depth={depth} />
+
+              {node.type === 'folder' && (
+                <ExpandIcon
+                  onClick={(e) => {
+                    e.stopPropagation()
+                    onToggleExpanded(node.id)
+                  }}
+                  title={node.expanded ? t('notes.collapse') : t('notes.expand')}>
+                  {node.expanded ? <ChevronDown size={14} /> : <ChevronRight size={14} />}
+                </ExpandIcon>
+              )}
+
+              <NodeIcon>
+                {node.type === 'folder' ? (
+                  node.expanded ? (
+                    <FolderOpen size={16} />
+                  ) : (
+                    <Folder size={16} />
+                  )
+                ) : (
+                  <File size={16} />
+                )}
+              </NodeIcon>
+
+              {isEditing ? (
+                <EditInput {...inputProps} onClick={(e) => e.stopPropagation()} autoFocus />
+              ) : (
+                <NodeNameContainer>
+                  <NodeName className={getNodeNameClassName()}>
+                    {searchKeyword ? <HighlightText text={displayName} keyword={searchKeyword} /> : node.name}
+                  </NodeName>
+                  {searchResult && searchResult.matchType && searchResult.matchType !== 'filename' && (
+                    <MatchBadge matchType={searchResult.matchType}>
+                      {searchResult.matchType === 'both' ? t('notes.search.both') : t('notes.search.content')}
+                    </MatchBadge>
+                  )}
+                </NodeNameContainer>
+              )}
+            </TreeNodeContent>
+          </TreeNodeContainer>
+        </div>
+      </Dropdown>
+
+      {showMatches && hasMatches && (
+        <SearchMatchesContainer depth={depth}>
+          {(showAllMatches ? searchResult!.matches! : searchResult!.matches!.slice(0, 3)).map((match, idx) => (
+            <MatchItem key={idx} onClick={() => handleMatchClick(match)}>
+              <MatchLineNumber>{match.lineNumber}</MatchLineNumber>
+              <MatchContext>
+                <HighlightText text={match.context} keyword={searchKeyword} />
+              </MatchContext>
+            </MatchItem>
+          ))}
+          {searchResult!.matches!.length > 3 && (
+            <MoreMatches
+              depth={depth}
+              onClick={(e) => {
+                e.stopPropagation()
+                setShowAllMatches(!showAllMatches)
+              }}>
+              {showAllMatches ? (
+                <>
+                  <ChevronDown size={12} style={{ marginRight: 4 }} />
+                  {t('notes.search.show_less')}
+                </>
+              ) : (
+                <>
+                  <ChevronRight size={12} style={{ marginRight: 4 }} />+{searchResult!.matches!.length - 3}{' '}
+                  {t('notes.search.more_matches')}
+                </>
+              )}
+            </MoreMatches>
+          )}
+        </SearchMatchesContainer>
+      )}
+
+      {renderChildren && node.type === 'folder' && node.expanded && hasChildren && (
+        <div>
+          {node.children!.map((child) => (
+            <TreeNode key={child.id} node={child} depth={depth + 1} renderChildren={renderChildren} />
+          ))}
+        </div>
+      )}
+    </div>
+  )
+})
+
+export const TreeNodeContainer = styled.div<{
+  active: boolean
+  depth: number
+  isDragging?: boolean
+  isDragOver?: boolean
+  isDragBefore?: boolean
+  isDragInside?: boolean
+  isDragAfter?: boolean
+}>`
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 4px 6px;
+  border-radius: 4px;
+  cursor: pointer;
+  margin-bottom: 2px;
+  /* CRITICAL: Must have fully opaque background for sticky to work properly */
+  /* Transparent/semi-transparent backgrounds will show content bleeding through when sticky */
+  background-color: ${(props) => {
+    if (props.isDragInside) return 'var(--color-primary-background)'
+    // Use hover color for active state - it's guaranteed to be opaque
+    if (props.active) return 'var(--color-hover, var(--color-background-mute))'
+    return 'var(--color-background)'
+  }};
+  border: 0.5px solid
+    ${(props) => {
+      if (props.isDragInside) return 'var(--color-primary)'
+      if (props.active) return 'var(--color-border)'
+      return 'transparent'
+    }};
+  opacity: ${(props) => (props.isDragging ? 0.5 : 1)};
+  transition: all 0.2s ease;
+  position: relative;
+
+  &:hover {
+    background-color: var(--color-background-soft);
+
+    .node-actions {
+      opacity: 1;
+    }
+  }
+
+  /* 添加拖拽指示线 */
+  ${(props) =>
+    props.isDragBefore &&
+    `
+    &::before {
+      content: '';
+      position: absolute;
+      top: -2px;
+      left: 0;
+      right: 0;
+      height: 2px;
+      background-color: var(--color-primary);
+      border-radius: 1px;
+    }
+  `}
+
+  ${(props) =>
+    props.isDragAfter &&
+    `
+    &::after {
+      content: '';
+      position: absolute;
+      bottom: -2px;
+      left: 0;
+      right: 0;
+      height: 2px;
+      background-color: var(--color-primary);
+      border-radius: 1px;
+    }
+  `}
+`
+
+export const TreeNodeContent = styled.div`
+  display: flex;
+  align-items: center;
+  flex: 1;
+  min-width: 0;
+`
+
+export const NodeIndent = styled.div<{ depth: number }>`
+  width: ${(props) => props.depth * 16}px;
+  flex-shrink: 0;
+`
+
+export const ExpandIcon = styled.div`
+  width: 16px;
+  height: 16px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: var(--color-text-2);
+  margin-right: 4px;
+
+  &:hover {
+    color: var(--color-text);
+  }
+`
+
+export const NodeIcon = styled.div`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-right: 8px;
+  color: var(--color-text-2);
+  flex-shrink: 0;
+`
+
+export const NodeName = styled.div`
+  flex: 1;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  font-size: 13px;
+  color: var(--color-text);
+  position: relative;
+  will-change: background-position, width;
+
+  --color-shimmer-mid: var(--color-text-1);
+  --color-shimmer-end: color-mix(in srgb, var(--color-text-1) 25%, transparent);
+
+  &.shimmer {
+    background: linear-gradient(to left, var(--color-shimmer-end), var(--color-shimmer-mid), var(--color-shimmer-end));
+    background-size: 200% 100%;
+    background-clip: text;
+    color: transparent;
+    animation: shimmer 3s linear infinite;
+  }
+
+  &.typing {
+    display: block;
+    white-space: nowrap;
+    overflow: hidden;
+    animation: typewriter 0.5s steps(40, end);
+  }
+
+  @keyframes shimmer {
+    0% {
+      background-position: 200% 0;
+    }
+    100% {
+      background-position: -200% 0;
+    }
+  }
+
+  @keyframes typewriter {
+    from {
+      width: 0;
+    }
+    to {
+      width: 100%;
+    }
+  }
+`
+
+export const SearchMatchesContainer = styled.div<{ depth: number }>`
+  margin-left: ${(props) => props.depth * 16 + 40}px;
+  margin-top: 4px;
+  margin-bottom: 8px;
+  padding: 6px 8px;
+  background-color: var(--color-background-mute);
+  border-radius: 4px;
+  border-left: 2px solid var(--color-primary-soft);
+`
+
+export const NodeNameContainer = styled.div`
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  flex: 1;
+  min-width: 0;
+`
+
+export const MatchBadge = styled.span<{ matchType: string }>`
+  display: inline-flex;
+  align-items: center;
+  padding: 0 4px;
+  height: 16px;
+  font-size: 10px;
+  line-height: 1;
+  border-radius: 2px;
+  background-color: ${(props) =>
+    props.matchType === 'both' ? 'var(--color-primary-soft)' : 'var(--color-background-mute)'};
+  color: ${(props) => (props.matchType === 'both' ? 'var(--color-primary)' : 'var(--color-text-3)')};
+  font-weight: 500;
+  flex-shrink: 0;
+`
+
+export const MatchItem = styled.div`
+  display: flex;
+  gap: 8px;
+  margin-bottom: 4px;
+  font-size: 12px;
+  padding: 4px 6px;
+  margin-left: -6px;
+  margin-right: -6px;
+  border-radius: 3px;
+  cursor: pointer;
+  transition: all 0.15s ease;
+
+  &:hover {
+    background-color: var(--color-background-soft);
+    transform: translateX(2px);
+  }
+
+  &:active {
+    background-color: var(--color-active);
+  }
+
+  &:last-child {
+    margin-bottom: 0;
+  }
+`
+
+export const MatchLineNumber = styled.span`
+  color: var(--color-text-3);
+  font-family: monospace;
+  flex-shrink: 0;
+  width: 30px;
+`
+
+export const MatchContext = styled.div`
+  color: var(--color-text-2);
+  flex: 1;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  font-family: monospace;
+`
+
+export const MoreMatches = styled.div<{ depth: number }>`
+  margin-top: 4px;
+  padding: 4px 6px;
+  margin-left: -6px;
+  margin-right: -6px;
+  font-size: 11px;
+  color: var(--color-text-3);
+  border-radius: 3px;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  transition: all 0.15s ease;
+
+  &:hover {
+    color: var(--color-text-2);
+    background-color: var(--color-background-soft);
+  }
+`
+
+const EditInput = styled.input`
+  flex: 1;
+  font-size: 13px;
+`
+
+const DropHintText = styled.div`
+  color: var(--color-text-3);
+  font-size: 12px;
+  font-style: italic;
+`
+
+export default TreeNode

src/renderer/src/pages/notes/context/NotesContexts.tsx

@@ -0,0 +1,109 @@
+import type { UseInPlaceEditReturn } from '@renderer/hooks/useInPlaceEdit'
+import type { NotesTreeNode } from '@renderer/types/note'
+import type { MenuProps } from 'antd'
+import { createContext, use } from 'react'
+
+// ==================== 1. Actions Context (Static, rarely changes) ====================
+export interface NotesActionsContextType {
+  getMenuItems: (node: NotesTreeNode) => MenuProps['items']
+  onSelectNode: (node: NotesTreeNode) => void
+  onToggleExpanded: (nodeId: string) => void
+  onDropdownOpenChange: (key: string | null) => void
+}
+
+export const NotesActionsContext = createContext<NotesActionsContextType | null>(null)
+
+export const useNotesActions = () => {
+  const context = use(NotesActionsContext)
+  if (!context) {
+    throw new Error('useNotesActions must be used within NotesActionsContext.Provider')
+  }
+  return context
+}
+
+// ==================== 2. Selection Context (Low frequency updates) ====================
+export interface NotesSelectionContextType {
+  selectedFolderId?: string | null
+  activeNodeId?: string
+}
+
+export const NotesSelectionContext = createContext<NotesSelectionContextType | null>(null)
+
+export const useNotesSelection = () => {
+  const context = use(NotesSelectionContext)
+  if (!context) {
+    throw new Error('useNotesSelection must be used within NotesSelectionContext.Provider')
+  }
+  return context
+}
+
+// ==================== 3. Editing Context (Medium frequency updates) ====================
+export interface NotesEditingContextType {
+  editingNodeId: string | null
+  renamingNodeIds: Set<string>
+  newlyRenamedNodeIds: Set<string>
+  inPlaceEdit: UseInPlaceEditReturn
+}
+
+export const NotesEditingContext = createContext<NotesEditingContextType | null>(null)
+
+export const useNotesEditing = () => {
+  const context = use(NotesEditingContext)
+  if (!context) {
+    throw new Error('useNotesEditing must be used within NotesEditingContext.Provider')
+  }
+  return context
+}
+
+// ==================== 4. Drag Context (High frequency updates) ====================
+export interface NotesDragContextType {
+  draggedNodeId: string | null
+  dragOverNodeId: string | null
+  dragPosition: 'before' | 'inside' | 'after'
+  onDragStart: (e: React.DragEvent, node: NotesTreeNode) => void
+  onDragOver: (e: React.DragEvent, node: NotesTreeNode) => void
+  onDragLeave: () => void
+  onDrop: (e: React.DragEvent, node: NotesTreeNode) => void
+  onDragEnd: () => void
+}
+
+export const NotesDragContext = createContext<NotesDragContextType | null>(null)
+
+export const useNotesDrag = () => {
+  const context = use(NotesDragContext)
+  if (!context) {
+    throw new Error('useNotesDrag must be used within NotesDragContext.Provider')
+  }
+  return context
+}
+
+// ==================== 5. Search Context (Medium frequency updates) ====================
+export interface NotesSearchContextType {
+  searchKeyword: string
+  showMatches: boolean
+}
+
+export const NotesSearchContext = createContext<NotesSearchContextType | null>(null)
+
+export const useNotesSearch = () => {
+  const context = use(NotesSearchContext)
+  if (!context) {
+    throw new Error('useNotesSearch must be used within NotesSearchContext.Provider')
+  }
+  return context
+}
+
+// ==================== 6. UI Context (Medium frequency updates) ====================
+export interface NotesUIContextType {
+  openDropdownKey: string | null
+}
+
+export const NotesUIContext = createContext<NotesUIContextType | null>(null)
+
+export const useNotesUI = () => {
+  const context = use(NotesUIContext)
+  if (!context) {
+    throw new Error('useNotesUI must be used within NotesUIContext.Provider')
+  }
+  return context
+}

src/renderer/src/pages/notes/hooks/useNotesDragAndDrop.ts

@@ -0,0 +1,101 @@
+import type { NotesTreeNode } from '@renderer/types/note'
+import { useCallback, useRef, useState } from 'react'
+
+interface UseNotesDragAndDropProps {
+  onMoveNode: (sourceNodeId: string, targetNodeId: string, position: 'before' | 'after' | 'inside') => void
+}
+
+export const useNotesDragAndDrop = ({ onMoveNode }: UseNotesDragAndDropProps) => {
+  const [draggedNodeId, setDraggedNodeId] = useState<string | null>(null)
+  const [dragOverNodeId, setDragOverNodeId] = useState<string | null>(null)
+  const [dragPosition, setDragPosition] = useState<'before' | 'inside' | 'after'>('inside')
+  const dragNodeRef = useRef<HTMLDivElement | null>(null)
+
+  const handleDragStart = useCallback((e: React.DragEvent, node: NotesTreeNode) => {
+    setDraggedNodeId(node.id)
+    e.dataTransfer.effectAllowed = 'move'
+    e.dataTransfer.setData('text/plain', node.id)
+
+    dragNodeRef.current = e.currentTarget as HTMLDivElement
+
+    // Create ghost element
+    if (e.currentTarget.parentElement) {
+      const rect = e.currentTarget.getBoundingClientRect()
+      const ghostElement = e.currentTarget.cloneNode(true) as HTMLElement
+      ghostElement.style.width = `${rect.width}px`
+      ghostElement.style.opacity = '0.7'
+      ghostElement.style.position = 'absolute'
+      ghostElement.style.top = '-1000px'
+      document.body.appendChild(ghostElement)
+      e.dataTransfer.setDragImage(ghostElement, 10, 10)
+      setTimeout(() => {
+        document.body.removeChild(ghostElement)
+      }, 0)
+    }
+  }, [])
+
+  const handleDragOver = useCallback(
+    (e: React.DragEvent, node: NotesTreeNode) => {
+      e.preventDefault()
+      e.dataTransfer.dropEffect = 'move'
+
+      if (draggedNodeId === node.id) {
+        return
+      }
+
+      setDragOverNodeId(node.id)
+
+      const rect = (e.currentTarget as HTMLElement).getBoundingClientRect()
+      const mouseY = e.clientY
+      const thresholdTop = rect.top + rect.height * 0.3
+      const thresholdBottom = rect.bottom - rect.height * 0.3
+
+      if (mouseY < thresholdTop) {
+        setDragPosition('before')
+      } else if (mouseY > thresholdBottom) {
+        setDragPosition('after')
+      } else {
+        setDragPosition(node.type === 'folder' ? 'inside' : 'after')
+      }
+    },
+    [draggedNodeId]
+  )
+
+  const handleDragLeave = useCallback(() => {
+    setDragOverNodeId(null)
+    setDragPosition('inside')
+  }, [])
+
+  const handleDrop = useCallback(
+    (e: React.DragEvent, targetNode: NotesTreeNode) => {
+      e.preventDefault()
+      const draggedId = e.dataTransfer.getData('text/plain')
+
+      if (draggedId && draggedId !== targetNode.id) {
+        onMoveNode(draggedId, targetNode.id, dragPosition)
+      }
+
+      setDraggedNodeId(null)
+      setDragOverNodeId(null)
+      setDragPosition('inside')
+    },
+    [onMoveNode, dragPosition]
+  )
+
+  const handleDragEnd = useCallback(() => {
+    setDraggedNodeId(null)
+    setDragOverNodeId(null)
+    setDragPosition('inside')
+  }, [])
+
+  return {
+    draggedNodeId,
+    dragOverNodeId,
+    dragPosition,
+    handleDragStart,
+    handleDragOver,
+    handleDragLeave,
+    handleDrop,
+    handleDragEnd
+  }
+}

src/renderer/src/pages/notes/hooks/useNotesEditing.ts

@@ -0,0 +1,94 @@
+import { loggerService } from '@logger'
+import { useInPlaceEdit } from '@renderer/hooks/useInPlaceEdit'
+import { fetchNoteSummary } from '@renderer/services/ApiService'
+import type { NotesTreeNode } from '@renderer/types/note'
+import { useCallback, useState } from 'react'
+import { useTranslation } from 'react-i18next'
+
+const logger = loggerService.withContext('UseNotesEditing')
+
+interface UseNotesEditingProps {
+  onRenameNode: (nodeId: string, newName: string) => void
+}
+
+export const useNotesEditing = ({ onRenameNode }: UseNotesEditingProps) => {
+  const { t } = useTranslation()
+  const [editingNodeId, setEditingNodeId] = useState<string | null>(null)
+  const [renamingNodeIds, setRenamingNodeIds] = useState<Set<string>>(new Set())
+  const [newlyRenamedNodeIds, setNewlyRenamedNodeIds] = useState<Set<string>>(new Set())
+
+  const inPlaceEdit = useInPlaceEdit({
+    onSave: (newName: string) => {
+      if (editingNodeId && newName) {
+        onRenameNode(editingNodeId, newName)
+        window.toast.success(t('common.saved'))
+        logger.debug(`Renamed node ${editingNodeId} to "${newName}"`)
+      }
+      setEditingNodeId(null)
+    },
+    onCancel: () => {
+      setEditingNodeId(null)
+    }
+  })
+
+  const handleStartEdit = useCallback(
+    (node: NotesTreeNode) => {
+      setEditingNodeId(node.id)
+      inPlaceEdit.startEdit(node.name)
+    },
+    [inPlaceEdit]
+  )
+
+  const handleAutoRename = useCallback(
+    async (note: NotesTreeNode) => {
+      if (note.type !== 'file') return
+
+      setRenamingNodeIds((prev) => new Set(prev).add(note.id))
+      try {
+        const content = await window.api.file.readExternal(note.externalPath)
+        if (!content || content.trim().length === 0) {
+          window.toast.warning(t('notes.auto_rename.empty_note'))
+          return
+        }
+
+        const summaryText = await fetchNoteSummary({ content })
+        if (summaryText) {
+          onRenameNode(note.id, summaryText)
+          window.toast.success(t('notes.auto_rename.success'))
+        } else {
+          window.toast.error(t('notes.auto_rename.failed'))
+        }
+      } catch (error) {
+        window.toast.error(t('notes.auto_rename.failed'))
+        logger.error(`Failed to auto-rename note: ${error}`)
+      } finally {
+        setRenamingNodeIds((prev) => {
+          const next = new Set(prev)
+          next.delete(note.id)
+          return next
+        })
+
+        setNewlyRenamedNodeIds((prev) => new Set(prev).add(note.id))
+
+        setTimeout(() => {
+          setNewlyRenamedNodeIds((prev) => {
+            const next = new Set(prev)
+            next.delete(note.id)
+            return next
+          })
+        }, 700)
+      }
+    },
+    [onRenameNode, t]
+  )
+
+  return {
+    editingNodeId,
+    renamingNodeIds,
+    newlyRenamedNodeIds,
+    inPlaceEdit,
+    handleStartEdit,
+    handleAutoRename,
+    setEditingNodeId
+  }
+}

src/renderer/src/pages/notes/hooks/useNotesFileUpload.ts

@@ -0,0 +1,112 @@
+import { useCallback } from 'react'
+
+interface UseNotesFileUploadProps {
+  onUploadFiles: (files: File[]) => void
+  setIsDragOverSidebar: (isDragOver: boolean) => void
+}
+
+export const useNotesFileUpload = ({ onUploadFiles, setIsDragOverSidebar }: UseNotesFileUploadProps) => {
+  const handleDropFiles = useCallback(
+    async (e: React.DragEvent) => {
+      e.preventDefault()
+      setIsDragOverSidebar(false)
+
+      // 处理文件夹拖拽：从 dataTransfer.items 获取完整文件路径信息
+      const items = Array.from(e.dataTransfer.items)
+      const files: File[] = []
+
+      const processEntry = async (entry: FileSystemEntry, path: string = '') => {
+        if (entry.isFile) {
+          const fileEntry = entry as FileSystemFileEntry
+          return new Promise<void>((resolve) => {
+            fileEntry.file((file) => {
+              // 手动设置 webkitRelativePath 以保持文件夹结构
+              Object.defineProperty(file, 'webkitRelativePath', {
+                value: path + file.name,
+                writable: false
+              })
+              files.push(file)
+              resolve()
+            })
+          })
+        } else if (entry.isDirectory) {
+          const dirEntry = entry as FileSystemDirectoryEntry
+          const reader = dirEntry.createReader()
+          return new Promise<void>((resolve) => {
+            reader.readEntries(async (entries) => {
+              const promises = entries.map((subEntry) => processEntry(subEntry, path + entry.name + '/'))
+              await Promise.all(promises)
+              resolve()
+            })
+          })
+        }
+      }
+
+      // 如果支持 DataTransferItem API（文件夹拖拽）
+      if (items.length > 0 && items[0].webkitGetAsEntry()) {
+        const promises = items.map((item) => {
+          const entry = item.webkitGetAsEntry()
+          return entry ? processEntry(entry) : Promise.resolve()
+        })
+
+        await Promise.all(promises)
+
+        if (files.length > 0) {
+          onUploadFiles(files)
+        }
+      } else {
+        const regularFiles = Array.from(e.dataTransfer.files)
+        if (regularFiles.length > 0) {
+          onUploadFiles(regularFiles)
+        }
+      }
+    },
+    [onUploadFiles, setIsDragOverSidebar]
+  )
+
+  const handleSelectFiles = useCallback(() => {
+    const fileInput = document.createElement('input')
+    fileInput.type = 'file'
+    fileInput.multiple = true
+    fileInput.accept = '.md,.markdown'
+    fileInput.webkitdirectory = false
+
+    fileInput.onchange = (e) => {
+      const target = e.target as HTMLInputElement
+      if (target.files && target.files.length > 0) {
+        const selectedFiles = Array.from(target.files)
+        onUploadFiles(selectedFiles)
+      }
+      fileInput.remove()
+    }
+
+    fileInput.click()
+  }, [onUploadFiles])
+
+  const handleSelectFolder = useCallback(() => {
+    const folderInput = document.createElement('input')
+    folderInput.type = 'file'
+    // @ts-ignore - webkitdirectory is a non-standard attribute
+    folderInput.webkitdirectory = true
+    // @ts-ignore - directory is a non-standard attribute
+    folderInput.directory = true
+    folderInput.multiple = true
+
+    folderInput.onchange = (e) => {
+      const target = e.target as HTMLInputElement
+      if (target.files && target.files.length > 0) {
+        const selectedFiles = Array.from(target.files)
+        onUploadFiles(selectedFiles)
+      }
+      folderInput.remove()
+    }
+
+    folderInput.click()
+  }, [onUploadFiles])
+
+  return {
+    handleDropFiles,
+    handleSelectFiles,
+    handleSelectFolder
+  }
+}

src/renderer/src/pages/notes/hooks/useNotesMenu.tsx

@@ -0,0 +1,263 @@
+import { loggerService } from '@logger'
+import { DeleteIcon } from '@renderer/components/Icons'
+import SaveToKnowledgePopup from '@renderer/components/Popups/SaveToKnowledgePopup'
+import { useKnowledgeBases } from '@renderer/hooks/useKnowledge'
+import type { RootState } from '@renderer/store'
+import type { NotesTreeNode } from '@renderer/types/note'
+import { exportNote } from '@renderer/utils/export'
+import type { MenuProps } from 'antd'
+import type { ItemType, MenuItemType } from 'antd/es/menu/interface'
+import { Edit3, FilePlus, FileSearch, Folder, FolderOpen, Sparkles, Star, StarOff, UploadIcon } from 'lucide-react'
+import { useCallback } from 'react'
+import { useTranslation } from 'react-i18next'
+import { useSelector } from 'react-redux'
+
+const logger = loggerService.withContext('UseNotesMenu')
+
+interface UseNotesMenuProps {
+  renamingNodeIds: Set<string>
+  onCreateNote: (name: string, targetFolderId?: string) => void
+  onCreateFolder: (name: string, targetFolderId?: string) => void
+  onRenameNode: (nodeId: string, newName: string) => void
+  onToggleStar: (nodeId: string) => void
+  onDeleteNode: (nodeId: string) => void
+  onSelectNode: (node: NotesTreeNode) => void
+  handleStartEdit: (node: NotesTreeNode) => void
+  handleAutoRename: (node: NotesTreeNode) => void
+  activeNode?: NotesTreeNode | null
+}
+
+export const useNotesMenu = ({
+  renamingNodeIds,
+  onCreateNote,
+  onCreateFolder,
+  onToggleStar,
+  onDeleteNode,
+  onSelectNode,
+  handleStartEdit,
+  handleAutoRename,
+  activeNode
+}: UseNotesMenuProps) => {
+  const { t } = useTranslation()
+  const { bases } = useKnowledgeBases()
+  const exportMenuOptions = useSelector((state: RootState) => state.settings.exportMenuOptions)
+
+  const handleExportKnowledge = useCallback(
+    async (note: NotesTreeNode) => {
+      try {
+        if (bases.length === 0) {
+          window.toast.warning(t('chat.save.knowledge.empty.no_knowledge_base'))
+          return
+        }
+
+        const result = await SaveToKnowledgePopup.showForNote(note)
+
+        if (result?.success) {
+          window.toast.success(t('notes.export_success', { count: result.savedCount }))
+        }
+      } catch (error) {
+        window.toast.error(t('notes.export_failed'))
+        logger.error(`Failed to export note to knowledge base: ${error}`)
+      }
+    },
+    [bases.length, t]
+  )
+
+  const handleImageAction = useCallback(
+    async (node: NotesTreeNode, platform: 'copyImage' | 'exportImage') => {
+      try {
+        if (activeNode?.id !== node.id) {
+          onSelectNode(node)
+          await new Promise((resolve) => setTimeout(resolve, 500))
+        }
+
+        await exportNote({ node, platform })
+      } catch (error) {
+        logger.error(`Failed to ${platform === 'copyImage' ? 'copy' : 'export'} as image:`, error as Error)
+        window.toast.error(t('common.copy_failed'))
+      }
+    },
+    [activeNode, onSelectNode, t]
+  )
+
+  const handleDeleteNodeWrapper = useCallback(
+    (node: NotesTreeNode) => {
+      const confirmText =
+        node.type === 'folder'
+          ? t('notes.delete_folder_confirm', { name: node.name })
+          : t('notes.delete_note_confirm', { name: node.name })
+
+      window.modal.confirm({
+        title: t('notes.delete'),
+        content: confirmText,
+        centered: true,
+        okButtonProps: { danger: true },
+        onOk: () => {
+          onDeleteNode(node.id)
+        }
+      })
+    },
+    [onDeleteNode, t]
+  )
+
+  const getMenuItems = useCallback(
+    (node: NotesTreeNode) => {
+      const baseMenuItems: MenuProps['items'] = []
+
+      // only show auto rename for file for now
+      if (node.type !== 'folder') {
+        baseMenuItems.push({
+          label: t('notes.auto_rename.label'),
+          key: 'auto-rename',
+          icon: <Sparkles size={14} />,
+          disabled: renamingNodeIds.has(node.id),
+          onClick: () => {
+            handleAutoRename(node)
+          }
+        })
+      }
+
+      if (node.type === 'folder') {
+        baseMenuItems.push(
+          {
+            label: t('notes.new_note'),
+            key: 'new_note',
+            icon: <FilePlus size={14} />,
+            onClick: () => {
+              onCreateNote(t('notes.untitled_note'), node.id)
+            }
+          },
+          {
+            label: t('notes.new_folder'),
+            key: 'new_folder',
+            icon: <Folder size={14} />,
+            onClick: () => {
+              onCreateFolder(t('notes.untitled_folder'), node.id)
+            }
+          },
+          { type: 'divider' }
+        )
+      }
+
+      baseMenuItems.push(
+        {
+          label: t('notes.rename'),
+          key: 'rename',
+          icon: <Edit3 size={14} />,
+          onClick: () => {
+            handleStartEdit(node)
+          }
+        },
+        {
+          label: t('notes.open_outside'),
+          key: 'open_outside',
+          icon: <FolderOpen size={14} />,
+          onClick: () => {
+            window.api.openPath(node.externalPath)
+          }
+        }
+      )
+      if (node.type !== 'folder') {
+        baseMenuItems.push(
+          {
+            label: node.isStarred ? t('notes.unstar') : t('notes.star'),
+            key: 'star',
+            icon: node.isStarred ? <StarOff size={14} /> : <Star size={14} />,
+            onClick: () => {
+              onToggleStar(node.id)
+            }
+          },
+          {
+            label: t('notes.export_knowledge'),
+            key: 'export_knowledge',
+            icon: <FileSearch size={14} />,
+            onClick: () => {
+              handleExportKnowledge(node)
+            }
+          },
+          {
+            label: t('chat.topics.export.title'),
+            key: 'export',
+            icon: <UploadIcon size={14} />,
+            children: [
+              exportMenuOptions.image && {
+                label: t('chat.topics.copy.image'),
+                key: 'copy-image',
+                onClick: () => handleImageAction(node, 'copyImage')
+              },
+              exportMenuOptions.image && {
+                label: t('chat.topics.export.image'),
+                key: 'export-image',
+                onClick: () => handleImageAction(node, 'exportImage')
+              },
+              exportMenuOptions.markdown && {
+                label: t('chat.topics.export.md.label'),
+                key: 'markdown',
+                onClick: () => exportNote({ node, platform: 'markdown' })
+              },
+              exportMenuOptions.docx && {
+                label: t('chat.topics.export.word'),
+                key: 'word',
+                onClick: () => exportNote({ node, platform: 'docx' })
+              },
+              exportMenuOptions.notion && {
+                label: t('chat.topics.export.notion'),
+                key: 'notion',
+                onClick: () => exportNote({ node, platform: 'notion' })
+              },
+              exportMenuOptions.yuque && {
+                label: t('chat.topics.export.yuque'),
+                key: 'yuque',
+                onClick: () => exportNote({ node, platform: 'yuque' })
+              },
+              exportMenuOptions.obsidian && {
+                label: t('chat.topics.export.obsidian'),
+                key: 'obsidian',
+                onClick: () => exportNote({ node, platform: 'obsidian' })
+              },
+              exportMenuOptions.joplin && {
+                label: t('chat.topics.export.joplin'),
+                key: 'joplin',
+                onClick: () => exportNote({ node, platform: 'joplin' })
+              },
+              exportMenuOptions.siyuan && {
+                label: t('chat.topics.export.siyuan'),
+                key: 'siyuan',
+                onClick: () => exportNote({ node, platform: 'siyuan' })
+              }
+            ].filter(Boolean) as ItemType<MenuItemType>[]
+          }
+        )
+      }
+      baseMenuItems.push(
+        { type: 'divider' },
+        {
+          label: t('notes.delete'),
+          danger: true,
+          key: 'delete',
+          icon: <DeleteIcon size={14} className="lucide-custom" />,
+          onClick: () => {
+            handleDeleteNodeWrapper(node)
+          }
+        }
+      )
+
+      return baseMenuItems
+    },
+    [
+      t,
+      handleStartEdit,
+      onToggleStar,
+      handleExportKnowledge,
+      handleImageAction,
+      handleDeleteNodeWrapper,
+      renamingNodeIds,
+      handleAutoRename,
+      exportMenuOptions,
+      onCreateNote,
+      onCreateFolder
+    ]
+  )
+
+  return { getMenuItems }
+}

src/renderer/src/services/NotesService.ts

@@ -83,6 +83,68 @@ export async function renameNode(node: NotesTreeNode, newName: string): Promise<
 }
 
 export async function uploadNotes(files: File[], targetPath: string): Promise<UploadResult> {
+  const basePath = normalizePath(targetPath)
+  const totalFiles = files.length
+
+  if (files.length === 0) {
+    return {
+      uploadedNodes: [],
+      totalFiles: 0,
+      skippedFiles: 0,
+      fileCount: 0,
+      folderCount: 0
+    }
+  }
+
+  try {
+    // Get file paths from File objects
+    // For browser File objects from drag-and-drop, we need to use FileReader to save temporarily
+    // However, for directory uploads, the files already have paths
+    const filePaths: string[] = []
+
+    for (const file of files) {
+      // @ts-ignore - webkitRelativePath exists on File objects from directory uploads
+      if (file.path) {
+        // @ts-ignore - Electron File objects have .path property
+        filePaths.push(file.path)
+      } else {
+        // For browser File API, we'd need to use FileReader and create temp files
+        // For now, fall back to the old method for these cases
+        logger.warn('File without path detected, using fallback method')
+        return uploadNotesLegacy(files, targetPath)
+      }
+    }
+
+    // Pause file watcher to prevent N refresh events
+    await window.api.file.pauseFileWatcher()
+
+    try {
+      // Use the new optimized batch upload API that runs in Main process
+      const result = await window.api.file.batchUploadMarkdown(filePaths, basePath)
+
+      return {
+        uploadedNodes: [],
+        totalFiles,
+        skippedFiles: result.skippedFiles,
+        fileCount: result.fileCount,
+        folderCount: result.folderCount
+      }
+    } finally {
+      // Resume watcher and trigger single refresh
+      await window.api.file.resumeFileWatcher()
+    }
+  } catch (error) {
+    logger.error('Batch upload failed, falling back to legacy method:', error as Error)
+    // Fall back to old method if new method fails
+    return uploadNotesLegacy(files, targetPath)
+  }
+}
+
+/**
+ * Legacy upload method using Renderer process
+ * Kept as fallback for browser File API files without paths
+ */
+async function uploadNotesLegacy(files: File[], targetPath: string): Promise<UploadResult> {
   const basePath = normalizePath(targetPath)
   const markdownFiles = filterMarkdown(files)
   const skippedFiles = files.length - markdownFiles.length
@@ -101,18 +163,37 @@ export async function uploadNotes(files: File[], targetPath: string): Promise<Up
   await createFolders(folders)
 
   let fileCount = 0
+  const BATCH_SIZE = 5 // Process 5 files concurrently to balance performance and responsiveness
 
-  for (const file of markdownFiles) {
-    const { dir, name } = resolveFileTarget(file, basePath)
-    const { safeName } = await window.api.file.checkFileName(dir, name, true)
-    const finalPath = `${dir}/${safeName}${MARKDOWN_EXT}`
+  // Process files in batches to avoid blocking the UI thread
+  for (let i = 0; i < markdownFiles.length; i += BATCH_SIZE) {
+    const batch = markdownFiles.slice(i, i + BATCH_SIZE)
 
-    try {
-      const content = await file.text()
-      await window.api.file.write(finalPath, content)
-      fileCount += 1
-    } catch (error) {
-      logger.error('Failed to write uploaded file:', error as Error)
+    // Process current batch in parallel
+    const results = await Promise.allSettled(
+      batch.map(async (file) => {
+        const { dir, name } = resolveFileTarget(file, basePath)
+        const { safeName } = await window.api.file.checkFileName(dir, name, true)
+        const finalPath = `${dir}/${safeName}${MARKDOWN_EXT}`
+
+        const content = await file.text()
+        await window.api.file.write(finalPath, content)
+        return true
+      })
+    )
+
+    // Count successful uploads
+    results.forEach((result) => {
+      if (result.status === 'fulfilled') {
+        fileCount += 1
+      } else {
+        logger.error('Failed to write uploaded file:', result.reason)
+      }
+    })
+
+    // Yield to the event loop between batches to keep UI responsive
+    if (i + BATCH_SIZE < markdownFiles.length) {
+      await new Promise((resolve) => setTimeout(resolve, 0))
     }
   }
 

src/renderer/src/types/note.ts

@@ -13,7 +13,7 @@ export type NotesSortType =
 export interface NotesTreeNode {
   id: string
   name: string // 不包含扩展名
-  type: 'folder' | 'file'
+  type: 'folder' | 'file' | 'hint'
   treePath: string // 相对路径
   externalPath: string // 绝对路径
   children?: NotesTreeNode[]

yarn.lock

@@ -8744,12 +8744,12 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/react-dom@npm:^19.0.4":
-  version: 19.1.2
-  resolution: "@types/react-dom@npm:19.1.2"
+"@types/react-dom@npm:^19.2.3":
+  version: 19.2.3
+  resolution: "@types/react-dom@npm:19.2.3"
   peerDependencies:
-    "@types/react": ^19.0.0
-  checksum: 10c0/100c341cacba9ec8ae1d47ee051072a3450e9573bf8eeb7262490e341cb246ea0f95a07a1f2077e61cf92648f812a0324c602fcd811bd87b7ce41db2811510cd
+    "@types/react": ^19.2.0
+  checksum: 10c0/b486ebe0f4e2fb35e2e108df1d8fc0927ca5d6002d5771e8a739de11239fe62d0e207c50886185253c99eb9dedfeeb956ea7429e5ba17f6693c7acb4c02f8cd1
   languageName: node
   linkType: hard
 
@@ -8789,12 +8789,12 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/react@npm:^19.0.12":
-  version: 19.1.2
-  resolution: "@types/react@npm:19.1.2"
+"@types/react@npm:^19.2.6":
+  version: 19.2.6
+  resolution: "@types/react@npm:19.2.6"
   dependencies:
-    csstype: "npm:^3.0.2"
-  checksum: 10c0/76ffe71395c713d4adc3c759465012d3c956db00af35ab7c6d0d91bd07b274b7ce69caa0478c0760311587bd1e38c78ffc9688ebc629f2b266682a19d8750947
+    csstype: "npm:^3.2.2"
+  checksum: 10c0/23b1100f88662ce9f9e4fcca3a2b4ef9fff1ecde24ede2b2dcbd07731e48d6946fd7fd156cd133f5b25321694b0569cd9b8dd30b22c4e076d1cf4c8cdd9a75cb
   languageName: node
   linkType: hard
 
@@ -10015,8 +10015,8 @@ __metadata:
     "@types/mime-types": "npm:^3"
     "@types/node": "npm:^22.17.1"
     "@types/pako": "npm:^1.0.2"
-    "@types/react": "npm:^19.0.12"
-    "@types/react-dom": "npm:^19.0.4"
+    "@types/react": "npm:^19.2.6"
+    "@types/react-dom": "npm:^19.2.3"
     "@types/react-infinite-scroll-component": "npm:^5.0.0"
     "@types/react-transition-group": "npm:^4.4.12"
     "@types/react-window": "npm:^1"
@@ -12283,6 +12283,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"csstype@npm:^3.2.2":
+  version: 3.2.3
+  resolution: "csstype@npm:3.2.3"
+  checksum: 10c0/cd29c51e70fa822f1cecd8641a1445bed7063697469d35633b516e60fe8c1bde04b08f6c5b6022136bb669b64c63d4173af54864510fbb4ee23281801841a3ce
+  languageName: node
+  linkType: hard
+
 "csv-parse@npm:^5.6.0":
   version: 5.6.0
   resolution: "csv-parse@npm:5.6.0"