mirror of
https://github.com/RooVetGit/Roo-Code.git
synced 2026-09-05 08:10:14 +00:00
42 lines
1 KiB
TypeScript
42 lines
1 KiB
TypeScript
import { useEffect, useRef } from "react"
|
||
|
||
type VoidFn = () => void
|
||
|
||
/**
|
||
* Runs `effectRef.current()` after `delay` ms whenever any of the `deps` change,
|
||
* but cancels/re-schedules if they change again before the delay.
|
||
*/
|
||
export function useDebounceEffect(effect: VoidFn, delay: number, deps: any[]) {
|
||
const callbackRef = useRef<VoidFn>(effect)
|
||
const timeoutRef = useRef<NodeJS.Timeout | null>(null)
|
||
|
||
// Keep callbackRef current
|
||
useEffect(() => {
|
||
callbackRef.current = effect
|
||
}, [effect])
|
||
|
||
useEffect(() => {
|
||
// Clear any queued call
|
||
if (timeoutRef.current) {
|
||
clearTimeout(timeoutRef.current)
|
||
}
|
||
|
||
// Schedule a new call
|
||
timeoutRef.current = setTimeout(() => {
|
||
// always call the *latest* version of effect
|
||
callbackRef.current()
|
||
}, delay)
|
||
|
||
// Cleanup on unmount or next effect
|
||
return () => {
|
||
if (timeoutRef.current) {
|
||
clearTimeout(timeoutRef.current)
|
||
}
|
||
}
|
||
|
||
// We want to re‐schedule if any item in `deps` changed,
|
||
// or if `delay` changed.
|
||
|
||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||
}, [delay, ...deps])
|
||
}
|