Create a debounce hook to wait a textfield change and dispatch an event after specific milliseconds

useDebounce.ts

export function useDebounce(handler: (value: string) => void, millisec: number = 500) {
  const [value, setValue] = useState('');

  useEffect(() => {
    const timeoutId = setTimeout(() => handler(value), millisec);
    return () => clearTimeout(timeoutId);
  }, [value, handler, millisec]);

  return setValue;
}