- Add api:types script (openapi-typescript against live FastAPI) - Generate src/lib/api/types.ts (2972 lines, 55 paths, 16 schemas) - lib/api/client.ts: typed apiRequest + ApiError + makeQueryClient (staleTime 5s, no refetchOnWindowFocus to preserve editor state) - lib/providers.tsx: QueryClientProvider client component, useState singleton so App Router re-renders don't dump the cache - lib/api/cases.ts: Case type + casesKeys + useCases hook (pragmatic hand-typed Case pending backend response-model annotations) - layout.tsx: wrap children with <Providers> - Smoke test: CasesLiveProbe component on home page hitting live FastAPI via /api/cases rewrite proxy Phase 2 deliverable check: useCases() returns typed Case[] from the production FastAPI through the Next.js proxy. End-to-end wiring proven. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
18 lines
649 B
TypeScript
18 lines
649 B
TypeScript
"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>
|
|
);
|
|
}
|