import { useDebounceValue } from "@/hooks/use-debounce-value"
import { useState } from "react"

function App() {
  const [searchTerm, setSearchTerm] = useState("")
  const debouncedSearchTerm = useDebounceValue(searchTerm, 500)

  return (
    <div>
      <input
        type="text"
        placeholder="Search..."
        value={searchTerm}
        onChange={(e) => setSearchTerm(e.target.value)}
      />
      <p>Current: {searchTerm}</p>
      <p>Debounced: {debouncedSearchTerm}</p>
    </div>
  )
}