fuselage icon indicating copy to clipboard operation
fuselage copied to clipboard

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

Open Spiral-Memory opened this issue 2 years ago • 3 comments

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

https://github.com/RocketChat/fuselage/assets/78961432/77889b34-849b-4392-a839-82575ffeb730

Setup Information

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

Spiral-Memory avatar Jan 10 '24 19:01 Spiral-Memory

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.

Spiral-Memory avatar Jan 10 '24 20:01 Spiral-Memory

@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

umangutkarsh avatar Jan 14 '24 18:01 umangutkarsh

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

Spiral-Memory avatar Jan 16 '24 19:01 Spiral-Memory