QueryClientProvider là gì? Tại sao cần wrap app bằng nó?

QueryClientProvider là Context Provider bắt buộc — tạo QueryClient BÊN NGOÀI component, wrap app để mọi useQuery/useMutation đều access được cache.

• QueryClientProvider là React Context Provider cung cấp QueryClient instance cho toàn bộ component tree.
• QueryClient là 'bộ não' quản lý cache, chứa tất cả cached data, query states, và config.
• Mọi useQuery/useMutation bên trong đều cần access QueryClient.
• Setup: tạo const queryClient = new QueryClient() BÊN NGOÀI component (tránh re-create mỗi render), wrap app bằng <QueryClientProvider client={queryClient}>.
• Có thể cấu hình defaultOptions cho tất cả queries: new QueryClient({ defaultOptions: { queries: { staleTime: 60_000, retry: 2 } } }).
• Trong Next.js App Router, đặt ở root layout nhưng cần 'use client' wrapper.