Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx agentmods add skills/jgamaraalv/ts-dev-kit/tanstack-querynpx skills add jgamaraalv/ts-dev-kit --skill tanstack-querygit clone --depth 1 https://github.com/jgamaraalv/ts-dev-kitWhat it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5 | $0.00120 | $0.02908 |
| Opus 5 | $0.00060 | $0.01454 |
| Sonnet 5 | $0.00024 | $0.00582 |
| Haiku 4.5 | $0.00012 | $0.00291 |
Grade A, and why
tanstack-query scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 2d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 365 lines — stays where its author put it; the contents beside it link to each section on GitHub.
TanStack Query v5 (React)
<quick_reference>
Setup
import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
const queryClient = new QueryClient({
defaultOptions: {
queries: {
staleTime: 60 * 1000, // 1 min (default is 0)
gcTime: 5 * 60 * 1000, // 5 min (default)
retry: 3, // 3 retries with exponential backoff (default)
refetchOnWindowFocus: true, // default
},
},
})
function App() {
return (
<QueryClientProvider client={queryClient}>
<YourApp />
</QueryClientProvider>
)
}
Important Defaults
| Default | Value | Notes |
|---|---|---|
staleTime |
0 |
Cached data is immediately stale; triggers background refetch on mount/focus/reconnect |
gcTime |
5 min |
Inactive queries garbage collected after 5 minutes |
retry |
3 (queries) / 0 (mutations) |
Queries retry 3x with exponential backoff; mutations do NOT retry |
refetchOnWindowFocus |
true |
Stale queries refetch when tab regains focus |
refetchOnReconnect |
true |
Stale queries refetch when network reconnects |
refetchOnMount |
true |
Stale queries refetch when new instance mounts |
structuralSharing |
true |
Preserves referential identity if data is structurally equal |
Key recommendation: Set staleTime above 0 to control refetch frequency rather than disabling individual refetch triggers.
</quick_reference>
queryOptions — co-locate key + fn
Always use queryOptions to define query configurations. It enables type inference across useQuery, prefetchQuery, getQueryData, and setQueryData.
import { queryOptions, infiniteQueryOptions } from '@tanstack/react-query'
export function todosOptions(filters: TodoFilters) {
return queryOptions({
queryKey: ['todos', filters],
queryFn: () => fetchTodos(filters),
staleTime: 5 * 1000,
})
}
// Works everywhere with full type inference:
useQuery(todosOptions({ status: 'done' }))
useSuspenseQuery(todosOptions({ status: 'done' }))
queryClient.prefetchQuery(todosOptions({ status: 'done' }))
queryClient.setQueryData(todosOptions({ status: 'done' }).queryKey, newData)
const cached = queryClient.getQueryData(todosOptions({ status: 'done' }).queryKey)
// ^? TodoItem[] | undefined
What ships with it
4 files beside SKILL.md in the same directory: the scripts, references and assets a skill reads on demand. Not counted in the per-session cost; read them before you install if any of them is executable.
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 2d ago First seen · 365 lines · 120 tokens per session scan A d95431c663b5
tanstack-query is a skill published in the GitHub repository jgamaraalv/ts-dev-kit (15 stars, last pushed 6mo ago), licensed MIT. It adds 120 tokens to every session and 2,908 once invoked, about $0.0006 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.
Other skills, from other repositories
systematic-debugging
Use when encountering any bug, test failure, or unexpected behavior, before proposing fixes.
next-cache-components-adoption
Turn on Cache Components in a Next.js app and resolve the blocking routes it surfaces. Use when the user wants to enable, adopt, or migrate to Cache Components, flip the cacheComponents flag, work through a flood of blocking-prerender / instant validation errors, run the cache-components-instant-false codemod, or…
babysit-pr
Babysit a GitHub pull request after creation by continuously polling review comments, CI checks/workflow runs, and mergeability state until the PR is merged/closed or user help is required. Diagnose failures, retry likely flaky failures up to 3 times, auto-fix/push branch-related issues when appropriate, and keep…
imagegen
Generate or edit raster images when the task benefits from AI-created bitmap visuals such as photos, illustrations, textures, sprites, mockups, or transparent-background cutouts. Use when Codex should create a brand-new image, transform an existing image, or derive visual variants from references, and the output…
cpu-profile-analysis
Analyze V8/Chrome CPU profiles (.cpuprofile) and DevTools trace files (Trace-.json). Use when: profiling performance, investigating slow functions, comparing code paths, finding bottlenecks, analyzing timeToRequest, understanding call trees from sampling profiler data, analyzing layout/paint/rendering, investigating…
next-cache-components-optimizer
Drive a Next.js route to instant navigation by setting up an agentic loop, under Cache Components / PPR, on initial load (hard navigation) and client-side navigation (soft navigation). Encode the goal as a failing @next/playwright instant() e2e and work it to green, one verified route at a time; the shipped test then…