"use client"; import { useEffect, useState } from "react"; export function useDebounceValue(value: T, delay = 300): T { // State and setters for debounced value const [debouncedValue, setDebouncedValue] = useState(value); useEffect( () => { const handler = setTimeout(() => { setDebouncedValue(value); }, delay); return () => { clearTimeout(handler); }; }, [value, delay] // Only re-call effect if value or delay changes ); return debouncedValue; }