use-debounce-effect

1import { useEffect, useState } from 'react'
2import { useDebounceFn } from '@/registry/hooks/use-debounce-fn'
3import { useUpdateEffect } from '@/registry/hooks/use-update-effect'
4import type { DependencyList, EffectCallback } from 'react'
5import type { DebounceOptions } from '@/registry/hooks/use-debounce-fn'
6 
7export function useDebounceEffect(
8  effect: EffectCallback,
9  deps: DependencyList,
10  debounceMs?: number,
11  options?: DebounceOptions,
12) {
13  const [flag, setFlag] = useState({})
14  const { run } = useDebounceFn(
15    () => {
16      setFlag({})
17    },
18    debounceMs,
19    options,
20  )
21 
22  useEffect(() => {
23    return run()
24  }, deps)
25 
26  useUpdateEffect(() => {
27    return effect()
28  }, [flag])
29}