diff --git a/src/features/version-control/git/components/inline-git-blame.tsx b/src/features/version-control/git/components/inline-git-blame.tsx index 1ad58de2..0177ad41 100644 --- a/src/features/version-control/git/components/inline-git-blame.tsx +++ b/src/features/version-control/git/components/inline-git-blame.tsx @@ -27,6 +27,7 @@ export const InlineGitBlame = ({ blameLine, className }: InlineGitBlameProps) => const triggerRef = useRef(null); const popoverRef = useRef(null); const hideTimeoutRef = useRef(null); + const showTimeoutRef = useRef(null); const documentRef = useRef(document); const { settings } = useSettingsStore(); const [isCopied, setIsCopied] = useState(false); @@ -41,6 +42,13 @@ export const InlineGitBlame = ({ blameLine, className }: InlineGitBlameProps) => } }, []); + const clearShowTimeout = useCallback(() => { + if (showTimeoutRef.current) { + clearTimeout(showTimeoutRef.current); + showTimeoutRef.current = null; + } + }, []); + const scheduleHide = useCallback(() => { clearHideTimeout(); hideTimeoutRef.current = setTimeout(() => { @@ -81,17 +89,21 @@ export const InlineGitBlame = ({ blameLine, className }: InlineGitBlameProps) => const showPopover = useCallback(() => { clearHideTimeout(); - if (!showCard) { - updatePosition(); - setShowCard(true); - showOverlay("git-blame"); + if (!showCard && !showTimeoutRef.current) { + showTimeoutRef.current = setTimeout(() => { + updatePosition(); + setShowCard(true); + showOverlay("git-blame"); + showTimeoutRef.current = null; + }, 1000); } }, [clearHideTimeout, showCard, updatePosition, showOverlay]); const hidePopover = useCallback(() => { + clearShowTimeout(); scheduleHide(); hideOverlay("git-blame"); - }, [scheduleHide, hideOverlay]); + }, [clearShowTimeout, scheduleHide, hideOverlay]); const handleCopyCommitHash = useCallback( async (e: React.MouseEvent) => { @@ -244,12 +256,13 @@ export const InlineGitBlame = ({ blameLine, className }: InlineGitBlameProps) => }; }, [showCard]); - // Clean up timeout on unmount + // Clean up timeouts on unmount useEffect(() => { return () => { clearHideTimeout(); + clearShowTimeout(); }; - }, [clearHideTimeout]); + }, [clearHideTimeout, clearShowTimeout]); return (