← ClaudeAtlas

tanstack-querylisted

TanStack Query v5 policy for a client-rendered SPA — what the shared QueryClient already decides, what belongs in a query key, when to use enabled/select/useQueries/placeholderData, and how a mutation touches the cache. Use when writing or reviewing queries, mutations, cache invalidation, pagination, prefetching, or a data-fetching effect.
vadimgaidai/react-feature-kit · ★ 0 · Code & Development · score 72
Install: claude install-skill vadimgaidai/react-feature-kit
# TanStack Query v5 Client-rendered SPA only. Nothing here is about SSR — no `dehydrate`/`hydrate`, no `HydrationBoundary`, no per-request client. If a snippet from the internet has those, it is answering a different question. **This skill owns what goes inside a query or mutation.** Where the file lives and what it is called is owned by the project's structure skill — in FSD projects, `structure` → `references/queries.md` and `references/mutations.md`. Read that one for the shape, this one for the policy. ## Read the shared client once, then stop repeating it The project builds one `QueryClient` (FSD: `src/shared/lib/react-query/client.ts`). Open it before writing your first query. It typically already sets `staleTime`, `gcTime`, `refetchOnWindowFocus`, `refetchOnReconnect`, a `retry` predicate that gives up on 4xx, and `QueryCache`/`MutationCache` `onError` handlers. - **Do not restate a default per query.** `staleTime: 1000 * 60 * 5` on a query when the client already says that is noise the next reader has to diff. - Override a default only when this query's data really is more or less volatile than the rest, and say why in a short comment on that line. - **Auth belongs to the cache handlers, not to your hook.** If the client's `QueryCache`/`MutationCache` `onError` handles 401 and token refresh, never add a local `onError` that re-handles it — you get two refresh flows racing. - `mutations: { retry: false }` is deliberate. A retried POST is a duplicate write. ## Que