import { useCallback, useRef, useState } from 'react';

export function useDebouncedToggle<T>(
  value: T,
  timeout = 1000,
): [T, (data: T) => void] {
  const [state, setState] = useState(value);
  const timeoutIdRef = useRef<NodeJS.Timeout>();

  const update = useCallback(
    (data: T) => {
      setState(data);
      const timeoutId = timeoutIdRef.current;
      if (timeoutId) {
        timeoutIdRef.current = undefined;
        clearTimeout(timeoutId);
      }
      timeoutIdRef.current = setTimeout(() => {
        setState(value);
      }, timeout);
    },
    [timeout, value],
  );

  return [state, update];
}
