import { useState , useEffect , useRef } from "react" ; import shallowEqual from "../utils/shallowEqual" ; export function useDebounce < T > ( value , delay ) { const prevValue = useRef ( value ) ; const [ debouncedValue , setDebouncedValue ] = useState ( value ) ; useEffect ( ( ) => { const handler = setTimeout ( ( ) => { if ( ! shallowEqual ( value , prevValue . current ) ) { prevValue . current = value ; setDebouncedValue ( value ) ; } } , delay ) ; return ( ) => { clearTimeout ( handler ) ; } ; } , [ value , delay ] ) ; return debouncedValue ; }