@johnhenry/mcp-query-tanstack
npm install @johnhenry/mcp-query-tanstack<!-- In <head>, before any <script type="module"> or modulepreload. --><script type="importmap"> { "imports": { "@johnhenry/agent-query-core": "https://cdn.jsdelivr.net/npm/@johnhenry/[email protected]/dist/index.js", "@johnhenry/mcp-query": "https://cdn.jsdelivr.net/npm/@johnhenry/[email protected]/dist/index.js", "@johnhenry/mcp-query-tanstack": "https://cdn.jsdelivr.net/npm/@johnhenry/[email protected]/dist/index.js", "@modelcontextprotocol/client": "https://cdn.jsdelivr.net/npm/@modelcontextprotocol/[email protected]/dist/index.mjs", "@modelcontextprotocol/client/_shims": "https://cdn.jsdelivr.net/npm/@modelcontextprotocol/[email protected]/dist/shimsBrowser.mjs", "@modelcontextprotocol/core/internal": "https://cdn.jsdelivr.net/npm/@modelcontextprotocol/[email protected]/dist/internal.mjs", "@tanstack/query-core": "https://cdn.jsdelivr.net/npm/@tanstack/[email protected]/build/modern/index.js", "@tanstack/react-query": "https://cdn.jsdelivr.net/npm/@tanstack/[email protected]/build/modern/index.js", "eventsource": "https://cdn.jsdelivr.net/npm/[email protected]/dist/index.js", "eventsource-parser": "https://cdn.jsdelivr.net/npm/[email protected]/dist/index.js", "eventsource-parser/stream": "https://cdn.jsdelivr.net/npm/[email protected]/dist/stream.js", "jose": "https://cdn.jsdelivr.net/npm/[email protected]/dist/webapi/index.js", "pkce-challenge": "https://cdn.jsdelivr.net/npm/[email protected]/dist/index.browser.js", "react": "https://cdn.jsdelivr.net/npm/[email protected]/+esm", "react/jsx-runtime": "https://cdn.jsdelivr.net/npm/[email protected]/jsx-runtime/+esm", "zod": "https://cdn.jsdelivr.net/npm/[email protected]/index.js", "zod/v4": "https://cdn.jsdelivr.net/npm/[email protected]/v4/index.js" } }</script><script type="module"> import * as mcpQueryTanstack from "@johnhenry/mcp-query-tanstack";</script>Peer-depends on @johnhenry/mcp-query and @tanstack/react-query.
Version pinning. [email protected] peer-depends on exactly @johnhenry/[email protected] — under npm’s pre-1.0 caret rules a ^0.0.0 range matches only that one version. mcp-query is now at 0.2.1, so installing the bridge next to the current client produces a peer-dependency conflict until the bridge publishes a release that tracks it. Pin the pair to versions that agree, or install with --legacy-peer-deps knowing the bridge was built against 0.0.0.
What it does
Section titled “What it does”mcp-query already maintains its own reactive cache. If you also use TanStack Query, you don’t want two caches disagreeing, and you don’t want TanStack refetching data the MCP client already has fresh.
This package bridges them: queryOptions and mutationOptions factories that read through to mcp-query’s cache, including protocol push and optimistic updates, without triggering extra network round-trips. TanStack becomes a view over the MCP client’s state rather than a second source of truth.
import { queryOptions, mutationOptions } from '@johnhenry/mcp-query-tanstack';Invalidation
Section titled “Invalidation”Cache keys derive from mcp-query’s own key scheme, so tag-based invalidation on the MCP side propagates into TanStack. Server-initiated listChanged notifications invalidate the right keys without a poll.
One known gap: tag-wide invalidateQueries needs a post-construction cache-listener hook that isn’t in place yet — tracked at mcp-query#24.
Sibling
Section titled “Sibling”@johnhenry/a2a-query-tanstack is the same bridge for the A2A client, published from its own repository at johnhenry/a2a-query-tanstack.