Agent skill · software engineering · aiskillstore

tanstack-query

Manage server state in React with TanStack Query v5. Covers useMutationState, simplified optimistic updates, throwOnError, network mode (offline/PWA), and infiniteQueryOptions. Use when setting up data fetching, fixing v4→v5 migration errors (object syntax, gcTime, isPending, keepPreviousData), or debugging SSR/hydration issues with streaming server components.

Why this skill is useful

Provides specific patterns and commands for managing server state in React with TanStack Query v5 that the AI wouldn't reliably generate on its own.

What it needs

Requires @tanstack/react-query installed locally. About 10k tokens when loaded. Last updated 2026-08-07. 405 stars on the source repository.

What this skill does

TanStack Query (React Query) v5 Last Updated: 2026-01-20 Versions: @tanstack/react-query@5.90.19, @tanstack/react-query-devtools@5.91.2 Requires: React 18.0+ (useSyncExternalStore), TypeScript 4.7+ (recommended) --- v5 New Features useMutationState - Cross-Component Mutation Tracking Access mutation state from anywhere without prop drilling: Simplified Optimistic Updates New pattern using variables - no cache manipulation, no rollback needed: throwOnError - Error Boundaries Renamed from useErrorBoundary (breaking change): Network Mode (Offline/PWA Support) Control behavior when offline: Mode Behavior ------ ---------- online (default) Only fetch when online always Always try (useful for local/service worker APIs) offlineFirst Use cache first, fetch when online Detecting paused state: useQueries with Combine Combine results from parallel queries: infiniteQueryOptions Helper Type-safe factory for infinite queries (parallel to queryOptions): maxPages - Memory Optimization Limit pages stored in cache for infinite queries: Note: maxPages requires bi-directional pagination (getNextPageParam AND getPreviousPageParam). --- Quick Setup Step 2: Provider + Config Step 3: Query + Mutation Hooks --- Critical Rules Always Do ✅ Use object syntax for all hooks ✅ Use array query keys ✅ Configure staleTime appropriately ✅ Use isPending for initial loading state ✅ Throw errors in queryFn ✅ Invalidate queries after mutations ✅ Use queryOptions factory for reusable patterns ✅ Use gcTime (not cacheTime) Never Do ❌ Never use v4 array/function syntax ❌ Never use query callbacks (onSuccess, onError, onSettled in queries) ❌ Never use deprecated options ❌ Never assume isLoading means "no data yet" ❌ Never forget initialPageParam for infinite queries ❌ Never use enabled with useSuspenseQuery ❌ Never rely on refetchOnMount: false for errored queries --- Known Issues Prevention This skill prevents 16 documented issues from v5 migration, SSR/hydration bugs, and common mistakes: Issue #1: Object S …

How to use it

Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:

@skills aiskillstore/tanstack-query

View the source on GitHub

Browse the @skills marketplace