[Demo] Add an example with streaming #118
Open
Conversation
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
|
INstead of an image, could you paste the mermaid code for the diagram to the PR header? |
|
This looks great - even tho I'm not sure I get it all - but will give it a try 👍 Thanks already! |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.
I'm proposing to add an example which uses streaming via Turbo Streams / SSE since
symfony/ux-turbois already included, yet no demo app is using streaming.This demo does not use a custom Stimulus controller at all, but solely relies on vendor-provided
live&turbo_streamcontrollers, making it ideal for those afraid of JS :)sequenceDiagram participant frontend participant backend participant platform frontend->>backend: Live action: submit with message activate backend backend-->>backend: Store the message<br>but do nothing else backend-->>frontend: Response with placeholder message element + <turbo-stream-source id="stream" src="https://github.com/stream/assistant-reply"> deactivate backend frontend->>backend: turbo_stream_controller.js starts consuming /stream/assistant-reply as SSE source activate backend backend->>platform: Make platform call with stream: true activate platform platform-->>backend: first chunk received Note over backend,frontend: Clear out "Thinking..." after receiving the first chunk backend-->>frontend: data: <turbo-stream action="update" target="placeholder"></turbo-stream> backend-->>frontend: data: <turbo-stream action="append" target="placeholder">{{ chunk }}</turbo-stream> loop until end of stream platform-->>backend: nth chunk received backend-->>frontend: data: <turbo-stream action="append" target="placeholder">{{ chunk }}</turbo-stream> end deactivate platform backend-->>frontend: data: <turbo-stream action="remove" target="stream"></turbo-stream> frontend-->>backend: turbo_stream_controller.js closes the stream since the <turbo-stream-source> was removed deactivate backendA couple of observations made while doing this:
Symfony\AI\Agent\Chatis not compatible at all with async/streaming flow.AssistantMessage. Or alternatively,AssistantMessagewould need to be non-readonly (or havewithContent) so that the message object could be created earlier and appended with content later. At the end, I didn't end up needing the IDs here since they didn't solve the "duplicate messages" (one from turbo, another from live component) problem I had at some point.