"use client"
 
import { usePageLoadTime } from "@/hooks/use-page-load-time"
 
export function Component() {
  const { timings, getLoadTime, loadTime, isLoaded } = usePageLoadTime()
 
  return (
    <div style={{ padding: "20px", maxWidth: "600px", margin: "0 auto" }}>
      <p>Page load time: {loadTime ? `${loadTime} ms` : "Calculating..."}</p>
      <button onClick={getLoadTime} disabled={isLoaded}>
        {isLoaded ? "Load Time Calculated" : "Calculate Load Time"}
      </button>
      <pre>{JSON.stringify(timings, null, 2)}</pre>
    </div>
  )
}