Skip to content
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

PaginatedMultiSelectFiltered: Issue with closing the dropdown menu by clicking outside the anchor but within the box. #1261

Open
Spiral-Memory opened this issue Jan 10, 2024 · 3 comments

Comments

@Spiral-Memory
Copy link

Spiral-Memory commented Jan 10, 2024

Description

In the PaginatedMultiSelectFiltered component, an unexpected behavior occurs when closing the dropdown menu. It behaves as expected when clicking outside the component or inside the anchor (placeholder input text field). However, clicking inside the box anywhere except the anchor causes the dropdown to close and reopen, resulting in a jump. This issue is present in the component itself and is also observed in the Rocket Chat web application when creating channels.

Steps to reproduce

  1. Clone the fuselage repository.
  2. Navigate to the fuselage monorepo responsible for components.
  3. Execute yarn install to install dependencies, followed by yarn build for the build process.
  4. Execute yarn lint and yarn test to verify everything.
  5. Change directory to packages/fuselage.
  6. Run yarn storybook.
  7. In the Storybook interface, select the PaginatedMultiSelectFiltered from the list of components.
  8. Test the issue as demonstrated in the attached video.

You can also verify this within the Add Member multiselect box when creating channels in the Rocket Chat web application.

Expected behavior

The dropdown should close when clicking anywhere on the component.

Actual behavior

2024-01-11.11-36-07.mp4

Setup Information

OS: Ubuntu 22.04.3 LTS
Storybook: 6.5.16
Node JS Version: v14.21.3

@Spiral-Memory
Copy link
Author

Maintainers, I've submitted a PR. Please review it. I'm unsure about the config error displayed under "kodiakhq: status." and merging is blocked. This is my first contribution, so I would appreciate guidance if possible.

@umangutkarsh
Copy link

umangutkarsh commented Jan 14, 2024

@ggazzo @hugocostadev . What do you think?

Should the Issue of dropdown toggling in RocketChat be dealt with in the fuselage repository? What are your thought on this? Please let us know
Thanks

@Spiral-Memory
Copy link
Author

@dougfabris @ggazzo @hugocostadev , What are your opinions on this? Does the approach seem right, or is there anything that needs correction?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants