feat(ai-client): pass abort signal to fetcher in generation clients#354
Merged
AlemTuzlak merged 3 commits intofeat/generation-hooks-and-streamingfrom Mar 9, 2026
Merged
Conversation
The fetcher function in GenerationClient and VideoGenerationClient now receives the AbortSignal as an optional second parameter, allowing long-running fetcher calls to be cancelled mid-flight when stop() is called. Updated fetcher type signature across all framework integrations (React, Solid, Vue, Svelte) — backwards-compatible since the options parameter is optional.
Contributor
|
Important Review skippedAuto reviews are disabled on base/target branches other than the default branch. Please check the settings in the CodeRabbit UI or the ⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Run ID: You can disable this status message by setting the Use the checkbox below for a quick retry:
✨ 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 |
|
View your CI Pipeline Execution ↗ for commit b53d530
☁️ Nx Cloud last updated this comment at |
@tanstack/ai
@tanstack/ai-anthropic
@tanstack/ai-client
@tanstack/ai-devtools-core
@tanstack/ai-fal
@tanstack/ai-gemini
@tanstack/ai-grok
@tanstack/ai-groq
@tanstack/ai-ollama
@tanstack/ai-openai
@tanstack/ai-openrouter
@tanstack/ai-preact
@tanstack/ai-react
@tanstack/ai-react-ui
@tanstack/ai-solid
@tanstack/ai-solid-ui
@tanstack/ai-svelte
@tanstack/ai-vue
@tanstack/ai-vue-ui
@tanstack/preact-ai-devtools
@tanstack/react-ai-devtools
@tanstack/solid-ai-devtools
commit: |
…r signature Replace inline fetcher type definitions across all framework hooks (React, Solid, Vue, Svelte) with a shared GenerationFetcher<TInput, TResult> type from ai-client. Future changes to the fetcher signature only need to update generation-types.ts instead of ~28 files.
AlemTuzlak
merged commit e4288b2
into
feat/generation-hooks-and-streaming
5 checks passed
AlemTuzlak
added a commit
that referenced
this pull request
Mar 10, 2026
* feat: add generation hooks and streaming for image, speech, video, transcription, and summarize Adds a complete client-side generation layer across all framework integrations (React, Solid, Svelte, Vue) for one-shot generation tasks: image generation, text-to-speech, audio transcription, text summarization, and video generation. Core changes: - `streamGenerationResult()` and `streamVideoGeneration()` server helpers in `@tanstack/ai` - `GenerationClient` and `VideoGenerationClient` state machines in `@tanstack/ai-client` - Framework hooks: `useGenerateImage`, `useGenerateSpeech`, `useGenerateVideo`, `useTranscription`, `useSummarize` (and Svelte `create*` equivalents) - `InferGenerationOutput` type for type-safe `onResult` transforms - New "Generations" overview doc with Mermaid architecture diagram - Full-stack usage sections added to all 4 generation guide docs - React example app with 5 demo pages and server API routes * ci: apply automated fixes * feat: add unified `stream` flag to all generation activities Move streaming logic from standalone `streamGenerationResult()` and `streamVideoGeneration()` utilities into the activity functions behind a `stream: true/false` flag. When `stream: true`, each function returns `AsyncIterable<StreamChunk>` instead of `Promise<Result>`, with TypeScript narrowing the return type via conditional types. - generateImage, generateSpeech, generateTranscription, summarize: use shared internal `streamGenerationResult` helper - generateVideo: inline streaming with job creation + polling - Delete `stream-generation.ts` and remove public exports - Update all examples, docs, and tests * feat(examples): add streaming/direct tab toggle to generation showcases Add a tab UI to each generation showcase page (image, speech, summarize, transcription, video) allowing users to switch between streaming (SSE connection) and direct (server function fetcher) transport modes. - Create server-fns.ts with createServerFn + zod validators for each generation type - Use library-exported hook return types (UseGenerateImageReturn, etc.) for component props - React key-based remounting ensures clean hook state on tab switch * ci: apply automated fixes * feat: update request handling in generation endpoints to use body.data * ci: apply automated fixes * feat(ai-client): pass abort signal to fetcher in generation clients (#354) * feat(ai-client): pass abort signal to fetcher in generation clients The fetcher function in GenerationClient and VideoGenerationClient now receives the AbortSignal as an optional second parameter, allowing long-running fetcher calls to be cancelled mid-flight when stop() is called. Updated fetcher type signature across all framework integrations (React, Solid, Vue, Svelte) — backwards-compatible since the options parameter is optional. * ci: apply automated fixes * refactor: extract GenerationFetcher utility type to centralize fetcher signature Replace inline fetcher type definitions across all framework hooks (React, Solid, Vue, Svelte) with a shared GenerationFetcher<TInput, TResult> type from ai-client. Future changes to the fetcher signature only need to update generation-types.ts instead of ~28 files. --------- Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com> * chore: add changeset for fetcher abort signal and GenerationFetcher type * chore: add @tanstack/ai to changeset * feat: add server-sent events support for streaming functions - Updated server functions to support streaming responses using `toServerSentEventsResponse`. - Introduced new streaming functions for image generation, speech generation, transcription, summarization, and video generation. - Enhanced UI components to handle new server function modes for image, speech, summarization, and video generation. - Modified the GenerationClient to parse SSE responses and handle streaming data. - Added tests for SSE response handling in GenerationClient and connection adapters. - Updated configuration files and ignored paths for better project structure. * ci: apply automated fixes * docs: add server function streaming examples and changeset --------- Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
GenerationClient,VideoGenerationClient) now pass theAbortSignalto the fetcher function as an optional second parameter(input) => Promise<Result>to(input, options?: { signal: AbortSignal }) => Promise<Result>across all framework integrations (React, Solid, Vue, Svelte)GenerationClientandVideoGenerationClientTest plan
generation-client.test.ts— new test verifies signal is passed to fetchervideo-generation-client.test.ts— new test verifies signal is passed to fetcherai-client,ai-react,ai-solid,ai-vue,ai-svelte)