-
Notifications
You must be signed in to change notification settings - Fork 3k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feat(frontend): Add animated three dots indicator for agent response #1821
Conversation
Updates the ChatInterface to render the ChatMessage component when the AgentState is RUNNING and adds custom spacing to the ChatMessage component. - Changes the condition in `ChatInterface.tsx` to render `ChatMessage` when `AgentState` is `RUNNING` instead of `LOADING`. - Adds a `className` prop to `ChatMessage` in `ChatInterface.tsx` to apply custom spacing, specifically a margin-top, ensuring consistent spacing with other messages. - Modifies `ChatMessage.tsx` to accept an optional `className` prop for custom styling, allowing for more flexible styling adjustments in the future. --- For more details, open the [Copilot Workspace session](https://copilot-workspace.githubnext.com/OpenDevin/OpenDevin/pull/1821?shareId=07dabb40-1549-491b-ac63-8aa890321e02).
Updates the ChatInterface to render the ChatMessage component when the AgentState is RUNNING and adds custom spacing to the ChatMessage component.
For more details, open the Copilot Workspace session. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM, but plz fix the lint problem before merge.
@yufansong Sorry I forgot to set this as a draft. Was using this issue to use the Copilot Workspace. I've updated the description to include the Slack message that briefly discusses possible alternatives to this issue. I don't think the 3-dots is one that will stick around |
Looking forward to this feature! Hoping to enhance the user experience with the 3 dots indicator until we have a better option. |
Stale |
Need suggestions: https://opendevin.slack.com/archives/C06TL7AJMK2/p1715848998465029
[Created with Copilot Workspace]
Related to #1787
Implements an animated three dots indicator in the chat UI to signal when the agent is generating a response.
ChatInterface.tsx
to display the animated three dots indicator using theChatMessage
component when thecurAgentState
is set toAgentState.LOADING
.For more details, open the Copilot Workspace session.