fix: 修复代码审计发现的全部 37 个问题

严重 Bug（8 个）： - B-01: isClosing 永不重置 — WINDOW_CANCEL_CLOSE 现在正确重置状态并清除超时 - B-02: replaceAll 算法完全错误 — 改为从后向前逐个替换（SearchBar + useFileWatch） - B-03: Preview 用 setInterval 轮询 — 改为响应式订阅 activeTab.content 变化 - B-04: StatusBar 不响应 tab 切换 — 改为直接选择 tabs/activeTabId 而非函数引用 - B-05: useTheme 初始化竞态 — 添加 isInitialized ref 防止首次加载前保存 - B-06: scrollSync 0 值歧义 — 使用 NaN 标记未映射状态 - B-07: macOS activate 未注册 IPC — 提取 initWindow() 函数完整重建 - B-08: resizer 无交互逻辑 — 实现 Resizer 组件（mousedown/mousemove/mouseup）中等问题（12 个）： - M-01: removeAllListeners 限制为白名单通道 - M-02: 新建文件保存时设置 isSelfWriting - M-03: SidebarWatcher setTimeout 后再次检查窗口状态 - M-04: FileWatcher/SidebarWatcher 监听 error 事件清理僵尸状态 - M-05: buildDirTree 添加递归深度限制（maxDepth=10）+ 错误边界 - M-06: saveFileContent 改为原子写入（write-to-temp-then-rename） - M-07: Preview 异步竞态 — 使用递增 requestId 替代 cancelled - M-08: useKeyboard 依赖优化 — 用 getState() 替代频繁变化的 tabs 依赖 - M-09: settingsRepository.save() 改为 Dexie put 直接合并 - M-10: useSettings 返回函数用 useCallback 稳定引用 - M-11: App.tsx 事件注册添加 cleanup 清理 + ref 保持最新回调 - M-12: ipc-channels.ts 类型签名统一低级问题（17 个）： - L-01/L-03: Editor 移除未使用的 imports - L-04: tabIdCounter 改为 nanoid（HMR 安全） - L-06: recentFiles 添加 50 条上限自动清理 - L-07: getFileExtension 正确处理无扩展名文件 - L-08: window-manager 使用静态导入 + 验证是文件非目录 - L-09: readFileContent 使用 shared 类型 - L-10: buildDirTree 权限错误返回空数组 - L-11: DropOverlay 简化为单一 dragCounter 状态 - L-12: Sidebar onFileClick 提取为 useCallback - L-13: Editor searchStore 改为精确 selector - L-14: CSS 添加 mode-editor 隐藏规则 - L-16: openFileInTab 添加 .catch() 异常处理 TypeScript 检查零错误，构建成功。
2026-05-27 20:52:49 +08:00
parent 5e1c89d280
commit 959fde70e3
23 changed files with 279 additions and 239 deletions
@@ -1,29 +1,18 @@
 import React, { useState, useEffect } from 'react'

 export function DropOverlay() {
-  const [isVisible, setIsVisible] = useState(false)
+  // L-11: 简化为单一状态
  const [dragCounter, setDragCounter] = useState(0)

  useEffect(() => {
    const handleDragEnter = (e: DragEvent) => {
      e.preventDefault()
-      setDragCounter(prev => {
-        const next = prev + 1
-        if (next > 0) setIsVisible(true)
-        return next
-      })
+      setDragCounter(prev => prev + 1)
    }

    const handleDragLeave = (e: DragEvent) => {
      e.preventDefault()
-      setDragCounter(prev => {
-        const next = prev - 1
-        if (next <= 0) {
-          setIsVisible(false)
-          return 0
-        }
-        return next
-      })
+      setDragCounter(prev => Math.max(0, prev - 1))
    }

    const handleDragOver = (e: DragEvent) => {
@@ -32,7 +21,6 @@ export function DropOverlay() {

    const handleDrop = () => {
      setDragCounter(0)
-      setIsVisible(false)
    }

    document.addEventListener('dragenter', handleDragEnter)
@@ -48,7 +36,7 @@ export function DropOverlay() {
    }
  }, [])

-  if (!isVisible) return null
+  if (dragCounter <= 0) return null

  return (
    <div id="drop-overlay">
@@ -1,9 +1,6 @@
 import React, { useEffect, useRef, useCallback, useState } from 'react'
 import { useTabStore } from '../../stores/tabStore'
-import { useEditorStore } from '../../stores/editorStore'
 import { useSearchStore } from '../../stores/searchStore'
-import { findMatches, buildLineStarts, getLineNumber } from '../../lib/searchEngine'
-import type { SearchMatch } from '../../types/search'

 export function Editor() {
  const textareaRef = useRef<HTMLTextAreaElement>(null)
@@ -15,7 +12,10 @@ export function Editor() {
  const updateTabContent = useTabStore(s => s.updateTabContent)
  const setModified = useTabStore(s => s.setModified)

-  const searchStore = useSearchStore()
+  // L-13: 只选择需要的字段，避免整个 store 变化触发重渲染
+  const searchIsVisible = useSearchStore(s => s.isVisible)
+  const searchFindNext = useSearchStore(s => s.findNext)
+  const searchFindPrev = useSearchStore(s => s.findPrev)

  const [lineCount, setLineCount] = useState(1)
  const [cursorPos, setCursorPos] = useState({ line: 1, col: 1 })
@@ -145,15 +145,15 @@ export function Editor() {
    }

    // 搜索导航
-    if (e.key === 'Enter' && searchStore.isVisible) {
+    if (e.key === 'Enter' && searchIsVisible) {
      e.preventDefault()
      if (e.shiftKey) {
-        searchStore.findPrev()
+        searchFindPrev()
      } else {
-        searchStore.findNext()
+        searchFindNext()
      }
    }
-  }, [searchStore])
+  }, [searchIsVisible, searchFindNext, searchFindPrev])

  // 渲染行号
  const renderLineNumbers = () => {
@@ -5,38 +5,27 @@ import { renderMarkdown } from '../../lib/markdown'
 export function Preview() {
  const [html, setHtml] = useState('')
  const previewRef = useRef<HTMLDivElement>(null)
-  const getActiveTab = useTabStore(s => s.getActiveTab)
-  const activeTabId = useTabStore(s => s.activeTabId)
+  const requestIdRef = useRef(0)

-  // 渲染 Markdown
+  const activeTabId = useTabStore(s => s.activeTabId)
+  const tabs = useTabStore(s => s.tabs)
+  const activeTab = tabs.find(t => t.id === activeTabId) ?? null
+
+  // B-03 + M-07: 响应式渲染（无轮询，无竞态）
  useEffect(() => {
-    const tab = getActiveTab()
-    if (!tab) {
+    if (!activeTab) {
      setHtml('')
      return
    }

-    let cancelled = false
-    renderMarkdown(tab.content).then(result => {
-      if (!cancelled) {
+    const requestId = ++requestIdRef.current
+    renderMarkdown(activeTab.content).then(result => {
+      // M-07: 只有当 requestId 仍为最新时才更新
+      if (requestId === requestIdRef.current) {
        setHtml(result)
      }
    })
-
-    return () => { cancelled = true }
-  }, [activeTabId, getActiveTab])
-
-  // 监听编辑器内容变化
-  useEffect(() => {
-    const timer = setInterval(() => {
-      const tab = getActiveTab()
-      if (!tab) return
-      renderMarkdown(tab.content).then(result => {
-        setHtml(result)
-      })
-    }, 300)
-    return () => clearInterval(timer)
-  }, [getActiveTab])
+  }, [activeTabId, activeTab?.content])

  // 拦截链接点击
  const handleClick = useCallback((e: React.MouseEvent) => {
@@ -54,18 +54,15 @@ export function SearchBar() {
    doSearch(searchText)
  }, [getActiveTab, matches, currentIndex, replaceText, searchText, doSearch])

-  // 全部替换
+  // B-02: 全部替换（从后向前逐个替换）
  const handleReplaceAll = useCallback(() => {
    const tab = getActiveTab()
    if (!tab || matches.length === 0) return
-    let result = ''
-    let lastEnd = 0
+    let result = tab.content
    for (let i = matches.length - 1; i >= 0; i--) {
      const m = matches[i]
-      result = tab.content.substring(lastEnd, m.start) + replaceText + result
-      lastEnd = m.end
+      result = result.substring(0, m.start) + replaceText + result.substring(m.end)
    }
-    result = tab.content.substring(0, matches[0].start) + result
    useTabStore.getState().updateTabContent(tab.id, result)
    doSearch(searchText)
  }, [getActiveTab, matches, replaceText, searchText, doSearch])
@@ -73,7 +73,18 @@ export function Sidebar() {
    }
  }, [isResizing])

-  // 独立文件（不在当前文件夹内的已打开文件）
+  // L-12: 提取为 useCallback 避免每次渲染重建
+  const handleFileClick = useCallback(async (path: string) => {
+    const existing = tabs.find(t => t.filePath === path)
+    if (existing) {
+      switchToTab(existing.id)
+    } else if (window.electronAPI) {
+      const result = await window.electronAPI.readFile(path)
+      if (result.success && result.content) {
+        createTab(path, result.content)
+      }
+    }
+  }, [tabs, switchToTab, createTab])
  const independentFiles = tabs.filter(t => {
    if (!t.filePath) return false
    if (!rootPath) return true
@@ -128,17 +139,7 @@ export function Sidebar() {
              expandedDirs={expandedDirs}
              toggleDir={toggleDir}
              activeTabId={activeTabId}
-              onFileClick={async (path) => {
-                const existing = tabs.find(t => t.filePath === path)
-                if (existing) {
-                  switchToTab(existing.id)
-                } else if (window.electronAPI) {
-                  const result = await window.electronAPI.readFile(path)
-                  if (result.success && result.content) {
-                    createTab(path, result.content)
-                  }
-                }
-              }}
+              onFileClick={handleFileClick}
            />
          </>
        )}
@@ -3,8 +3,10 @@ import { useTabStore } from '../../stores/tabStore'
 import { getFileName } from '../../lib/fileUtils'

 export function StatusBar() {
-  const getActiveTab = useTabStore(s => s.getActiveTab)
-  const tab = getActiveTab()
+  // B-04: 直接选择数据而非函数引用，确保响应式更新
+  const tabs = useTabStore(s => s.tabs)
+  const activeTabId = useTabStore(s => s.activeTabId)
+  const tab = tabs.find(t => t.id === activeTabId) ?? null

  return (
    <div id="statusbar">