[WIKI-705] regression: mentions dropdown selection across editors by aaryan610 · Pull Request #7901 · makeplane/plane

aaryan610 · 2025-10-03T10:07:54Z

Description

This PR fixes the following bugs-

Mentions dropdown not visible in peek overviews.
Mentions command not working.

Type of Change

Bug fix (non-breaking change which fixes an issue)

Summary by CodeRabbit

Bug Fixes
- Mentions dropdown now reliably appears above content and positions correctly.
- Escape key consistently closes the mentions dropdown with proper cleanup.
- More predictable keyboard navigation within dropdowns.
Refactor
- Standardized dropdown keyboard navigation using a shared key set across components.
- Streamlined mentions dropdown event handling for more consistent behavior.
- Reduced coupling and improved consistency in how editor context is passed and used.

coderabbitai · 2025-10-03T10:08:02Z

Note

Other AI code review bot(s) detected

CodeRabbit has detected other AI code review bot(s) in this pull request and will avoid duplicating their findings in the review comments. This may lead to a less comprehensive review.

Walkthrough

Refactors the mentions dropdown renderer to accept a single args object, route interactions via props.editor, and simplify key handling and cleanup, including z-index styling and Floating UI updates. Separately, the slash command menu now uses a shared DROPDOWN_NAVIGATION_KEYS constant for key filtering.

Changes

Cohort / File(s)	Summary
Mentions dropdown render flow refactor `packages/editor/src/core/extensions/mentions/utils.ts`	Updated renderMentionsDropdown signature to take args; standardized usage of props.editor and props.clientRect; added z-index on mount; updated Floating UI positioning calls; simplified onKeyDown to delegate to component ref and handle Escape; ensured cleanup via active extension removal and component destroy.
Slash command key handling constant `packages/editor/src/core/extensions/slash-commands/command-menu.tsx`	Replaced local navigationKeys with shared DROPDOWN_NAVIGATION_KEYS in keyboard handler; no behavioral changes beyond centralizing the constant.

Sequence Diagram(s)

sequenceDiagram
  autonumber
  participant U as User
  participant E as Editor
  participant M as Mentions Extension
  participant D as Dropdown Component
  participant F as Floating UI

  U->>E: Type '@' + query
  E->>M: trigger render({ editor, clientRect, query })
  M->>D: create/mount component (z-index 100)
  D->>F: position via updateFloatingUI(editor, clientRect)
  Note over D,F: Positions update on start/update

  U->>E: Keydown (Arrow/Enter)
  E->>D: onKeyDown({ event })
  D-->>E: handled? (true/false)

  U->>E: Keydown (Escape)
  E->>D: onKeyDown({ event: Escape })
  D->>M: destroy component, remove active extension
  M-->>E: cleanup complete

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Possibly related PRs

regression: slash commands render logic #7882: Similar dropdown lifecycle changes using addActiveDropbarExtension/removeActiveDropbarExtension and mount/position adjustments, aligning with this mentions dropdown refactor.

Suggested reviewers

Palanikannan1437
sriramveeraghanta

Poem

I twitch my ears at dropdowns new,
A hop, a pop—mentions in view!
Keys now shared, the flow made neat,
Escape to vanish—swift retreat.
On Floating winds, the menu flies,
A rabbit ships with bright replies. 🐇✨

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Description Check	⚠️ Warning	The description field clearly outlines the bugs fixed and the type of change, but it omits the Test Scenarios section required by the repository template and also lacks References and any optional screenshots or media.	Please add a “Test Scenarios” section describing how these fixes were verified and include any relevant References or Screenshots sections to fully adhere to the repository’s pull request template.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Docstring Coverage	✅ Passed	No functions found in the changes. Docstring coverage check skipped.
Title Check	✅ Passed	The title includes the issue identifier and highlights the mentions dropdown regression across editors, which aligns with a key bug fix in the PR even though it does not capture every detail such as the mentions command repair. It refers to a genuine aspect of the changeset rather than being generic or off-topic. Therefore it is a valid, partially related summary of the main change.

✨ Finishing touches

📝 Generate docstrings

🧪 Generate unit tests (beta)

Create PR with unit tests
Post copyable unit tests in a comment
Commit unit tests in branch fix/editor-mentions

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

Copilot

Pull Request Overview

This PR fixes two bugs related to the mentions dropdown: visibility issues in peek overviews and non-functioning mentions commands. The changes refactor parameter naming for clarity and remove redundant keyboard navigation logic to improve dropdown behavior consistency across different editor contexts.

Simplified mentions dropdown keyboard navigation handling
Improved parameter destructuring and naming in mentions utilities
Added proper z-index styling for dropdown visibility

Reviewed Changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated 2 comments.

File	Description
packages/editor/src/core/extensions/slash-commands/command-menu.tsx	Replaced hardcoded navigation keys array with shared constant
packages/editor/src/core/extensions/mentions/utils.ts	Refactored parameter handling and simplified keyboard navigation logic

_{Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.}

packages/editor/src/core/extensions/slash-commands/command-menu.tsx

Copilot · 2025-10-03T10:08:21Z

packages/editor/src/core/extensions/mentions/utils.ts

        if (event.key === "Escape") {
          component?.destroy();
+          component = null;
          return true;
        }

-        const navigationKeys = ["ArrowUp", "ArrowDown", "Enter"];
-
-        if (navigationKeys.includes(event.key)) {
-          event?.stopPropagation();
-          return component?.ref?.onKeyDown({ event });
-        }
-        return component?.ref?.onKeyDown({ event });
+        return component?.ref?.onKeyDown({ event }) ?? false;


The simplified keyboard handling removes the specific navigation key filtering and event propagation control that was present in the original code. This could lead to unintended behavior where all keyboard events are passed to the component regardless of their type.

makeplane · 2025-10-03T10:15:45Z

Linked to Plane Work Item(s)

[WIKI-705] UI Issue When Mentioning Users in Comment Box.

This comment was auto-generated by Plane

fix: editor mentions selection

14a8851

aaryan610 requested review from Palanikannan1437 and Copilot October 3, 2025 10:07

aaryan610 added 🐛bug Something isn't working 🌐frontend ✍️editor requires approval labels Oct 3, 2025

Copilot AI reviewed Oct 3, 2025

View reviewed changes

pushya22 approved these changes Oct 3, 2025

View reviewed changes

Palanikannan1437 approved these changes Oct 3, 2025

View reviewed changes

pushya22 changed the title ~~regression: mentions dropdown selection across editors~~ [WIKI-705] regression: mentions dropdown selection across editors Oct 3, 2025

pushya22 merged commit 269fc0d into preview Oct 3, 2025
7 checks passed

pushya22 deleted the fix/editor-mentions branch October 3, 2025 10:23

This was referenced Oct 6, 2025

[WIKI-707] [WIKI-708] fix: editor floating ui modal #7909

Merged

[WIKI-713] fix: extra line created on enter key #7913

Merged

[WIKI-710] [WIKI-717] fix: slash commands and mentions in comments #7919

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[WIKI-705] regression: mentions dropdown selection across editors#7901

[WIKI-705] regression: mentions dropdown selection across editors#7901
pushya22 merged 1 commit intopreviewfrom
fix/editor-mentions

aaryan610 commented Oct 3, 2025 •

edited by coderabbitai bot

Loading

Uh oh!

coderabbitai bot commented Oct 3, 2025 •

edited

Loading

Other AI code review bot(s) detected

Uh oh!

Copilot AI left a comment

Uh oh!

Uh oh!

Copilot AI Oct 3, 2025

Uh oh!

makeplane bot commented Oct 3, 2025

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

Conversation

aaryan610 commented Oct 3, 2025 • edited by coderabbitai bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Type of Change

Summary by CodeRabbit

Uh oh!

coderabbitai bot commented Oct 3, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Other AI code review bot(s) detected

Walkthrough

Changes

Sequence Diagram(s)

Estimated code review effort

Possibly related PRs

Suggested reviewers

Poem

Pre-merge checks and finishing touches

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Reviewed Changes

Uh oh!

Uh oh!

Copilot AI Oct 3, 2025

Choose a reason for hiding this comment

Uh oh!

makeplane bot commented Oct 3, 2025

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

aaryan610 commented Oct 3, 2025 •

edited by coderabbitai bot

Loading

coderabbitai bot commented Oct 3, 2025 •

edited

Loading