react-native-flexible-grid/src/hooks/use-throttle.ts

React Native Flexible Grid is an advanced grid layout system inspired by CSS Grid, designed to facilitate responsive, customizable, and dynamic grid layouts in React Native applications. It supports both responsive and fixed layouts, enabling the creation

import { useCallback, useRef } from 'react';

/**
 * A hook to throttle function calls.
 * @param callback The function to throttle.
 * @param delay The throttle delay in milliseconds.
 * @returns A throttled version of the provided function.
 */
const useThrottle = <T extends (...args: any[]) => any>(
  callback: T,
  delay: number
): ((...args: Parameters<T>) => void) => {
  const throttleTimeout = useRef<ReturnType<typeof setTimeout> | null>(null);

  const throttledFunction = useCallback(
    (...args: Parameters<T>) => {
      if (throttleTimeout.current === null) {
        callback(...args);
        throttleTimeout.current = setTimeout(() => {
          throttleTimeout.current = null;
        }, delay);
      }
    },

    [callback, delay]
  );

  return throttledFunction;
};

export default useThrottle;