HEX
Server: LiteSpeed
System: Linux premium263.web-hosting.com 4.18.0-553.50.1.lve.el8.x86_64 #1 SMP Thu Apr 17 19:10:24 UTC 2025 x86_64
User: eastcjee (525)
PHP: 8.2.31
Disabled: NONE
Upload Files
File: /home/eastcjee/public_html/wp-content/themes/astra/admin/assets/hooks/useDebounceEffect.js
import { useEffect } from 'react';
import { debounce } from '@astra-utils/helpers';

/**
 * A hook that wraps a callback function with a debounce effect.
 *
 * This hook is designed to delay the execution of a function until after a specified delay.
 * It's particularly useful for handling events that occur rapidly, such as typing in a text input.
 *
 * @param {Function} callback - The function to debounce.
 * @param {number} delay - The delay in milliseconds before the function is executed.
 * @param {Array} dependencies - An array of dependencies that trigger the effect.
 */
function useDebounceEffect( callback, delay, dependencies ) {
	useEffect( () => {
		const debouncedCallback = debounce( callback, delay );

		debouncedCallback();

		// Cleanup on unmount or when dependencies change.
		return () => debouncedCallback.cancel && debouncedCallback.cancel();
	}, [ callback, delay, ...dependencies ] );
}

export default useDebounceEffect;