Studio: fix duplicate response model labels and hover#7049
Conversation
for more information, see https://pre-commit.ci
There was a problem hiding this comment.
Code Review
This pull request simplifies the rendering of the MessageResponseModelBadge component by removing it from the reasoning group and rendering it unconditionally once per assistant message instead of conditionally based on hasReasoningParts. Additionally, the badge's styling was updated to support text selection and hover effects, and the corresponding UI contract tests were updated to reflect these changes. I have no feedback to provide.
Important
The consumer version of Gemini Code Assist on GitHub is being sunset. Starting June 18, 2026, new organization installations will be blocked, and all code review activity will officially cease on July 17, 2026.
For more details on the timeline and next steps, please review the Help Documentation.
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 69f0f85e72
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| <span | ||
| className={cn( | ||
| "aui-response-model-badge inline-flex min-h-5 max-w-full items-center text-muted-foreground/80 text-xs font-medium leading-5 opacity-0 transition-opacity duration-150 group-hover/assistant-message:opacity-100 group-focus-within/assistant-message:opacity-100", | ||
| "aui-response-model-badge pointer-events-auto relative inline-flex min-h-5 max-w-full cursor-text select-text items-center text-muted-foreground/80 text-xs font-medium leading-5 opacity-0 transition-opacity duration-150 after:absolute after:inset-x-0 after:top-full after:h-1 after:content-[''] hover:opacity-100 group-hover/assistant-message:opacity-100 group-focus-within/assistant-message:opacity-100", |
There was a problem hiding this comment.
Gate badge pointer events behind message hover
When Show response model is enabled, this makes the absolutely positioned badge hit-testable even while it is still at opacity-0. Because thread.tsx positions the badge -top-6 above each assistant message, the invisible box can intercept hover/click/selection in the gap or over adjacent message UI before the assistant message itself is hovered, and hover:opacity-100 can reveal the label from that hidden hit area. Keep the base state pointer-inert and only enable pointer events once the assistant message is hovered/focused so nearby UI remains reachable.
Useful? React with 👍 / 👎.


Summary
Show the response model once at the assistant-message level, including replies with multiple thinking and tool phases. Keep the revealed model label visible and selectable while the pointer moves onto it.
Motivation
Thinking and tool calls can split a reply into multiple reasoning groups. Rendering the model badge inside each group repeated the same model name, sometimes three times.
The badge also ignored pointer events, so it disappeared before users could select and copy the name.
Changes
MessageResponseModelBadgeto the shared assistant-message header so each response renders one label (studio/frontend/src/components/assistant-ui/thread.tsx:3655).ReasoningGroupand restore the reasoning trigger's flex layout (studio/frontend/src/components/assistant-ui/reasoning.tsx:388).studio/frontend/src/components/assistant-ui/message-response-details-sheet.tsx:276).tests/studio/test_chat_response_details_ui_contract.py:47).