Blog: TanStack AI Beta launch#975
Conversation
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
|
Note Reviews pausedIt looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the Use the following commands to manage reviews:
Use the checkboxes below for quick actions:
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (1)
✅ Files skipped from review due to trivial changes (1)
📝 WalkthroughWalkthroughRevises the TanStack AI Beta blog post: updates front matter and Beta framing, expands modality coverage and examples (server SSE + React useChat), preserves per-model typing and composition notes, adds pluggable debug tooling, and updates tested claim to 265 deterministic E2E tests across 10 providers; ends with install snippet and CTA. ChangesTanStack AI Beta Announcement Blog Post
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes Suggested reviewers
Poem
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
- Add server/client chat snippets, provider-swap diff, audio example, and install command, all verified against the latest example apps - Reframe protocol section as TypeScript-first, drop Python/PHP mentions Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@src/blog/tanstack-ai-beta.md`:
- Around line 1-8: Add the missing headerImage field to the YAML front matter of
this Markdown post so the blog metadata contract in blog.functions.ts can
associate the image; update the front matter block (the top --- section) to
include headerImage: with the correct image path or filename referenced by the
content (the image used on line 10), ensuring the key name is exactly
"headerImage" to match the metadata schema.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: 88f602b7-1dd0-496a-ba7b-447d4d76a69d
⛔ Files ignored due to path filters (1)
public/blog-assets/tanstack-ai-beta/header.pngis excluded by!**/*.png
📒 Files selected for processing (1)
src/blog/tanstack-ai-beta.md
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
| - **Built on AG-UI.** AG-UI is at the core of the protocol, not bolted on. TanStack AI speaks AG-UI events end to end, so it drops into the broader agent-UI ecosystem instead of inventing its own dialect. | ||
| - **A hardened, published protocol.** The server↔client contract is documented and stable, over any transport. | ||
| - **Adapters split by capability.** Smaller, composable adapters instead of one monolith, with per-model type safety that catches incompatible pairings at compile time. | ||
| - **First-class middleware.** Logging, filtering, caching, and rate limiting compose cleanly instead of bloating your endpoint. |
There was a problem hiding this comment.
I would reframe this to be you can plug into X,Y,Z and achieve logging...
|
|
||
| ## Per-Model Type Safety That Actually Matters | ||
|
|
||
| Every provider has different options. Every model supports different modalities and different native tools. TanStack AI types `providerOptions` on a per-model basis, so your IDE knows exactly what each model can do. |
There was a problem hiding this comment.
Thanks. Had a long day yesterday. Claude helped with this. Going through it properly again now
|
|
||
| TanStack AI is TypeScript-first. The toolkit, the per-model type safety, and everything you've seen in this post is built for TypeScript end to end. But the thing that makes it all portable is the protocol: we've documented exactly how the server and client communicate, and in Beta it's stable. Speak it over any transport (HTTP, WebSockets, RPC) through a connection adapter, and our clients work with your backend. | ||
|
|
||
| **AG-UI is at its core.** The events flowing across that connection are AG-UI events, not a bespoke format with a compatibility shim on top. Because the standard is built in from the ground up, TanStack AI interoperates with the wider agent-UI ecosystem out of the box. It's the same no-lock-in principle, applied to the wire. |
There was a problem hiding this comment.
Can we write out a list of ag-ui compliant agent frameworks here, like maf, agno, etc, and also explain it allows for people to use servers written in kotlin, rust, .net, whatever
- Remove embeddings (not supported) from TL;DR and modality list - Reframe middleware bullet as plugging into the pipeline - Fix providerOptions -> modelOptions - List AG-UI-compliant agent frameworks and cross-language servers Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
- Rewrite middleware copy to match actual lifecycle-hook behavior and built-ins (tool caching, content guarding, OTel tracing) - Fix stale test numbers: 265 E2E tests across 10 providers - Fix model id in provider-swap example (claude-opus-4-6) - Expand client framework list (Vue, Svelte, Preact are ready) - Remove TL;DR (duplicated body sections nearly 1:1) - Add hook family and capability-split adapters to modality section - Add debug-mode snippet and devtools panel screenshot - Link modality bullets to their blog posts and docs pages Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
There was a problem hiding this comment.
♻️ Duplicate comments (1)
src/blog/tanstack-ai-beta.md (1)
1-8:⚠️ Potential issue | 🟡 Minor | ⚡ Quick winAdd
headerImageto YAML front matter.The header image is referenced on line 10, but the
headerImagefield is missing from the YAML front matter. This field should be declared for proper blog metadata association.📝 Proposed fix
--- title: 'TanStack AI Beta: The Switzerland of AI Tooling Grows Up' published: 2026-06-09 excerpt: Six months ago we shipped the alpha with a promise - a framework-agnostic, provider-agnostic AI toolkit with no lock-in, ever. Today TanStack AI hits Beta with every modality, a hardened protocol, middleware, orchestration, host-side MCP, and 265 E2E tests running across 10 providers on every PR. library: ai +headerImage: /blog-assets/tanstack-ai-beta/header.png authors: - Tom Beckenham ---🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/blog/tanstack-ai-beta.md` around lines 1 - 8, The YAML front matter is missing the headerImage field referenced later; add a headerImage entry to the front matter (e.g., headerImage: "/path/to/header-image.jpg" or the correct asset path) so the blog metadata includes the image; locate the YAML block that contains title: 'TanStack AI Beta: The Switzerland of AI Tooling Grows Up' and add the headerImage key alongside title, published, excerpt, library, and authors.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Duplicate comments:
In `@src/blog/tanstack-ai-beta.md`:
- Around line 1-8: The YAML front matter is missing the headerImage field
referenced later; add a headerImage entry to the front matter (e.g.,
headerImage: "/path/to/header-image.jpg" or the correct asset path) so the blog
metadata includes the image; locate the YAML block that contains title:
'TanStack AI Beta: The Switzerland of AI Tooling Grows Up' and add the
headerImage key alongside title, published, excerpt, library, and authors.
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: 500fc12b-1ac1-4c5d-8553-be75c2fd4888
⛔ Files ignored due to path filters (1)
public/blog-assets/tanstack-ai-beta/devtools.pngis excluded by!**/*.png
📒 Files selected for processing (1)
src/blog/tanstack-ai-beta.md
Summary
Adds the TanStack AI Beta launch blog post (
src/blog/tanstack-ai-beta.md), publishing 2026-06-09.What's in the post
ts-react-chat/ts-react-mediaexample apps anddocs/adapters/fal.mdin the AI repo: a server chat endpoint (chat+toServerSentEventsResponse), the React client (useChat+fetchServerSentEvents), a one-line provider swap (OpenAI → Anthropicclaude-fable-5), andgenerateAudiowith Gemini Lyria.public/blog-assets/tanstack-ai-beta/.Notes for reviewers
claude-fable-5, which lands in the Anthropic adapter's typed model union separately — that adapter support should ship before or with this post.src/blog/.🤖 Generated with Claude Code
Summary by CodeRabbit