import { useEffect, useState } from "react";

// Returns `value` after it has stopped changing for `delay` ms. Lets a text input stay
// responsive (it owns the immediate value) while the query it drives only re-runs once the
// user pauses — so we don't refetch the feed on every keystroke.
//
// `settle`: a change of it takes `value` at once. A value that did not come from typing (Back
// restoring a search, a pivot clearing one) has no keystrokes to wait out, and the lag only ran a
// query mixing the new filters with the old text (deep-review 2026-09-19).
export function useDebounced<T>(value: T, delay = 300, settle?: unknown): T {
  const [debounced, setDebounced] = useState(value);
  const [settled, setSettled] = useState(settle);
  useEffect(() => {
    const id = window.setTimeout(() => setDebounced(value), delay);
    return () => window.clearTimeout(id);
  }, [value, delay]);
  if (settle !== settled) {
    setSettled(settle);
    setDebounced(value);
    return value;
  }
  return debounced;
}