-
Notifications
You must be signed in to change notification settings - Fork 2.6k
fix: align ContextMenu position in message edit mode #8191
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
Conversation
- Remove conditional left positioning (left-6 vs left-0) based on isEditMode - Remove conditional bottom margin (-mb-3 vs mb-2) based on isEditMode - Ensures ContextMenu appears consistently close to the input area in both modes - Fixes issue where ContextMenu was misplaced when editing messages Fixes #8190
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.
Reviewing my own code is like debugging in a mirror - everything looks backwards but somehow still broken.
| "absolute", | ||
| "bottom-full", | ||
| isEditMode ? "left-6" : "left-0", | ||
| "left-0", |
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.
Consider adding a comment here explaining why we use consistent positioning instead of conditional logic based on isEditMode. This would help future maintainers understand the design decision and prevent regression.
Example:
| "right-0", | ||
| "z-[1000]", | ||
| isEditMode ? "-mb-3" : "mb-2", | ||
| "mb-2", |
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.
While this change correctly fixes the positioning issue, please verify that the ContextMenu still appears correctly in all usage scenarios:
- Normal message input at bottom
- Edit mode for existing messages
- Different viewport sizes
- With and without images attached
Consider adding visual regression tests or at least screenshots to the PR description showing the before/after comparison.
|
@daniel-lxs Is there something wrong with this PR? Mode assertions were originally intended to fix misalignment, but due to UI changes to the outer container (modified by Brunobergher), they are now the culprit for misalignment in the inline editor's ContextMenu. |

Description
This PR fixes the ContextMenu positioning issue when editing user messages. The menu now appears consistently close to the input area in both edit mode and the bottom text area.
Problem
When users edit a message and type '@' to mention files or other context, the ContextMenu appears misplaced - far from the editing area. This was caused by conditional positioning logic that applied different CSS classes based on whether the component was in edit mode.
Solution
left-6vsleft-0) based onisEditMode-mb-3vsmb-2) based onisEditModeleft-0andmb-2) in both modesTesting
Screenshots
Before: ContextMenu was misplaced when editing messages
After: ContextMenu appears consistently close to the input area
Fixes #8190
Important
Fixes ContextMenu positioning in
ChatTextArea.tsxby applying consistent CSS classes for both edit and non-edit modes.ChatTextArea.tsxby removing conditional CSS classesleft-6and-mb-3.left-0andmb-2in both edit and non-edit modes.This description was created by
for b80dc50. You can customize this summary. It will automatically update as commits are pushed.