useTimeoutEffect

1'use client'
2 
3import * as React from 'react'
4 
5export function useTimeoutEffect(effect: React.EffectCallback, timeout: number, deps: React.DependencyList) {
6  const effectEvent = React.useEffectEvent(effect)
7 
8  React.useEffect(() => {
9    let destroy: ReturnType<React.EffectCallback> | undefined
10    const timer = setTimeout(() => {
11      destroy = effectEvent()
12    }, timeout)
13 
14    return () => {
15      clearTimeout(timer)
16      if (destroy) {
17        destroy()
18      }
19    }
20  }, [
21    timeout,
22    // eslint-disable-next-line react-hooks/exhaustive-deps
23    ...deps,
24  ])
25}