fix: cancel file explorer reveal scroll frame (#3450)

src/renderer/src/components/right-sidebar/useFileExplorerReveal.ts

@@ -1,4 +1,4 @@
-import { useEffect, useMemo } from 'react'
+import { useCallback, useEffect, useMemo, useRef } from 'react'
 import type { Dispatch, RefObject, SetStateAction } from 'react'
 import type { Virtualizer } from '@tanstack/react-virtual'
 import { useAppStore } from '@/store'
@@ -43,6 +43,22 @@ export function useFileExplorerReveal({
   flashTimeoutRef,
   virtualizer
 }: UseFileExplorerRevealParams): void {
+  const revealScrollFrameRef = useRef<number | null>(null)
+  const revealScrollTimeoutRef = useRef<number | null>(null)
+
+  const cancelRevealScroll = useCallback((): void => {
+    if (revealScrollFrameRef.current !== null) {
+      cancelAnimationFrame(revealScrollFrameRef.current)
+      revealScrollFrameRef.current = null
+    }
+    if (revealScrollTimeoutRef.current !== null) {
+      window.clearTimeout(revealScrollTimeoutRef.current)
+      revealScrollTimeoutRef.current = null
+    }
+  }, [])
+
+  useEffect(() => cancelRevealScroll, [cancelRevealScroll])
+
   const pendingRevealAncestorDirs = useMemo(() => {
     if (
       !pendingExplorerReveal ||
@@ -170,8 +186,11 @@ export function useFileExplorerReveal({
       }, 2000)
     }
 
-    requestAnimationFrame(() => {
-      window.setTimeout(() => {
+    cancelRevealScroll()
+    revealScrollFrameRef.current = requestAnimationFrame(() => {
+      revealScrollFrameRef.current = null
+      revealScrollTimeoutRef.current = window.setTimeout(() => {
+        revealScrollTimeoutRef.current = null
         const targetIndex = flatRows.findIndex((row) => row.path === revealPath)
         if (targetIndex !== -1) {
           virtualizer.scrollToIndex(targetIndex, { align: 'center' })
@@ -180,6 +199,7 @@ export function useFileExplorerReveal({
     })
   }, [
     activeWorktreeId,
+    cancelRevealScroll,
     clearPendingExplorerReveal,
     dirCache,
     expanded,