CONFIG: React Query Global Client and Error Boundary

[nayan458]

Task: Setup React Query Global Client and Error Boundary

Type: Infrastructure
Milestone: M0-Project - Foundation
Estimate: M

What This Enables

All server-state data fetching (API hooks, mutations, caching, refetch). Without this, feature teams can't fetch data. Blocks all feature API work.

Deliverables

• src/lib/query-client.ts: QueryClient with global defaults (staleTime, retry, refetchOnWindowFocus)
• src/app/providers.tsx: QueryClientProvider wrapping the app; includes ReactQueryDevtools (dev only)
• src/components/QueryErrorBoundary.tsx: catches query errors, renders fallback UI, includes retry action
• Global onError handler wired to query client: logs errors, triggers toast notifications

Default Config

new QueryClient({
  defaultOptions: {
    queries: {
      staleTime: 1000 * 60 * 5,   // 5 min
      retry: 1,
      refetchOnWindowFocus: false,
    },
  },
})

Acceptance Criteria

• All queries use the shared client; no standalone new QueryClient() elsewhere
• Failed queries surface user-friendly error UI via the error boundary
• The retry button in error boundary re-triggers the failed query
• React Query Devtools visible in dev and absent in production build