"use client";

import { useState, type ReactNode } from "react";
import { QueryClientProvider } from "@tanstack/react-query";
import { makeQueryClient } from "@/lib/api/client";

/**
 * Client-side providers. Creates ONE QueryClient instance per browser session
 * via useState — Next.js App Router recreates the function on every render,
 * so a naive `const client = makeQueryClient()` would dump the cache each time.
 */
export function Providers({ children }: { children: ReactNode }) {
  const [queryClient] = useState(() => makeQueryClient());
  return (
    <QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
  );
}