# All files / src useDebounced.ts

0% Statements 0/35
0% Branches 0/1
0% Functions 0/1
0% Lines 0/35

Press n or j to go to the next uncovered block, b, p or k for the previous block.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36

     import { useCallback, useEffect, useRef } from "react";
    import { AnyFunction } from "./types";
    import { useIsomorphicLayoutEffect } from "./useIsomorphicLayoutEffect";

    export type DebouncedFunction<F extends AnyFunction> = (
      ...args: Parameters<F>
    ) => void;

    export function useDebounced<F extends AnyFunction>(
      func: F,
      wait: number
    ): DebouncedFunction<F> {
      const timeout = useRef<number | undefined>();
      const funcRef = useRef(func);
      useIsomorphicLayoutEffect(() => {
        funcRef.current = func;
      });

      useEffect(() => {
        return () => {
          window.clearTimeout(timeout.current);
        };
      }, []);

      return useCallback(
        (...args) => {
          window.clearTimeout(timeout.current);
          timeout.current = window.setTimeout(() => {
            funcRef.current(...args);
          }, wait);
          //
        },
        [wait]
      );
    }