feat(ui): implement message queuing during streaming responses#6049
Conversation
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Summary of Changes
Hello @akhil29, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!
This pull request introduces a new message queuing feature to the UI. This allows users to continue typing and queueing messages even while the AI is actively streaming its responses. The queued messages are displayed visually and are automatically sent for processing once the AI's streaming response concludes, improving the user experience by enabling continuous interaction.
Highlights
- Message Queuing Implementation: Users can now type and queue messages even when the AI is actively streaming responses.
- Queued Message Display: Queued messages are visually presented below the loading indicator, dimmed and prefixed with '▸'.
- Automatic Sending: Messages in the queue are automatically sent for processing once the AI completes its streaming response.
- Cancel Behavior Integration: If a user cancels during streaming, any queued messages are appended to the current input buffer, allowing for easy editing or resubmission.
- Unified Input Flow: The handleFinalSubmit function now consistently queues messages, simplifying the input handling logic.
Using Gemini Code Assist
The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.
Invoking Gemini
You can request assistance from Gemini at any point in your pull request via creating an issue comment (i.e. comment on the pull request page) using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands.
| Feature | Command | Description |
|---|---|---|
| Code Review | /gemini review |
Performs a code review for the current pull request in its current state. |
| Pull Request Summary | /gemini summary |
Provides a summary of the current pull request in its current state. |
| Comment | @gemini-code-assist | Responds in comments when explicitly tagged, both in issue comments and review comments. |
| Help | /gemini help |
Displays a list of available commands. |
Customization
To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.
Limitations & Feedback
Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.
You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.
Footnotes
-
Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩
There was a problem hiding this comment.
Code Review
This pull request introduces a message queuing system, allowing users to input messages while the AI is generating a response. The implementation is mostly solid, but I have two high-severity concerns. First, the new feature lacks automated tests, which is a significant risk for future maintenance. Second, the use of setTimeout to manage state updates is fragile and should be refactored to a more robust pattern using effects to avoid potential race conditions.
|
Testing: |
|
Thank you for the PR. I think this is a good idea but I would like to see it implemented in core rather than in the TUI package. That way, we can build upon this concept for sub-agents. Sub-agents will be able to enqueue messages to the main agent, even if it's processing a user message or a message from another agent. |
|
There was a previous PR, #3712, that does something similar, that PR was closed due to inactivity. We can continue this in this PR. A few things:
Also going to add @miguelsolorio here who is the expert in UI/UX for some thoughts! |
3. Each additional message is added to the queue but while sending to the prompt, they are all merged with double new line "\n\n". This is the standard behavior across other more mature cli coding agents.
|
|
What is the state here? @abhipatel12 |
abhipatel12
left a comment
abhipatel12
left a comment
There was a problem hiding this comment.
Thanks for the contribution! Took a look at this and pulled it locally to test it out. Overall, this is great.
I made a couple of comments for some concerns that I had. Let me know what you think!
|
Testing multi line: |
abhipatel12
left a comment
abhipatel12
left a comment
There was a problem hiding this comment.
This looks great! Thanks for making all of the changes.
Just a few cleanup comments! I'll pass this along to our ask reviewers now!
There was a problem hiding this comment.
I think this got added by accident.
There was a problem hiding this comment.
We can delete this comment
There was a problem hiding this comment.
This looks great, would you be able to create a follow-up task that extracts the UI component into its own file? Something like QueuedMessageDisplay.tsx or something?
akhil29
force-pushed
the
q-cmd
branch
2 times, most recently
from
b96f58c to
ec55d44
Compare
Allow users to see and type their next message while the AI is responding. This improves UX by providing visual feedback that input is being captured even during streaming. Changes: - Modified isInputActive to include StreamingState.Responding - Input box now stays visible during both idle and responding states
- Add message queue state to track pending messages - Show queued messages greyed out below loading animation - Messages queue when submitted during streaming response - Visual feedback shows messages waiting to be processed
- All messages now flow through queue for consistent processing - Messages queue automatically during active streaming - Queued messages display below loading indicator (greyed out) - Auto-send all queued messages when streaming completes - On cancel, queued messages append to cancelled message in input - Simplified architecture with single message flow path
- Add message queue state to buffer user input during AI responses - Display queued messages below loading indicator with dimmed color - Auto-send all queued messages when streaming completes - Integrate queued messages with cancel behavior - Implement unified queue architecture where all messages flow through queue - Add tests and update snapshots for UI components
- Add test to verify messages are queued during streaming state - Add test for auto-send when transitioning from Responding to Idle - Add test for visual display of queued messages with dimmed color - Add test to verify message queue is cleared after sending - Add test for filtering empty/whitespace messages - Add test for combining multiple messages with double newlines - Fix lastFrame extraction from render result in all tests
- Replace fragile setTimeout approach with direct submission - Remove intermediate state as it's not needed - Simplify useEffect to directly clear queue and submit - Fix linting errors in tests (remove unused variables) - Address code review feedback about race conditions
- Remove comment about InputPrompt mocking as it's no longer used - Clean up test file documentation
- Create useMessageQueue hook with clean interface for queue operations - Move queue state and processing logic out of App.tsx - Use useRef pattern to resolve circular dependency with cancel handler - Fix deprecated MutableRefObject type warning - Improve code organization and testability per code review feedback
- Add MAX_DISPLAYED_QUEUED_MESSAGES constant to limit display count - Truncate long messages to single line with whitespace collapsed - Add overflow indicator showing count of additional messages - Use wrap="truncate" and full-width boxes for proper display - Add comprehensive tests for useMessageQueue hook - Prevent UI flickering and scroll issues with large inputs Addresses performance concerns raised in code review feedback
|
Addressed all comments. |
…e-gemini#6049) Co-authored-by: Jacob Richman <jacob314@gmail.com>
…e-gemini#6049) Co-authored-by: Jacob Richman <jacob314@gmail.com>
…e-gemini#6049) Co-authored-by: Jacob Richman <jacob314@gmail.com>
…e-gemini#6049) Co-authored-by: Jacob Richman <jacob314@gmail.com>
6 participants
Summary
▸prefix)Fixes #3594
Changes
messageQueuestate to buffer user input during streaminghandleFinalSubmitto always queue messages for unified flowuseEffectwhen streaming transitions to idlesetTimeoutapproach based on code review feedbackTest Plan