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.

Sign up for GitHub

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

Jump to bottom

Filter Bar: Selected items not cleared after change in Adapt Filters dialog #5652

Closed
1 task done
marekviskup opened this issue Apr 2, 2024 · 5 comments · Fixed by #6214
Closed
1 task done

Filter Bar: Selected items not cleared after change in Adapt Filters dialog #5652

marekviskup opened this issue Apr 2, 2024 · 5 comments · Fixed by #6214
Assignees
@Lukas742
Labels
released

Comments

@marekviskup
Copy link

Describe the bug

After a change of a filter value in the Adapt Filters dialog, clearing the filter bar doesn't result in previously selected filter items being removed.

Clear works fine unless the filter values are changed via Adapt Filters dialog.

Isolated Example

https://stackblitz.com/edit/github-rc93m5-rtmizd?file=src%2FFilterBarView.tsx

Reproduction steps

  1. Click on Adapt Filters button
  2. Click on Show Values button
  3. Select Option 1 for Filter 1
  4. Select Option 1 for Filter 2
  5. Click on OK button
  6. Click on Clear button

Expected Behaviour

Both filters are cleared -> all selected options are removed from the filter components.

Screenshots or Videos

No response

UI5 Web Components for React Version

1.26.1

UI5 Web Components Version

1.23.1

Browser

Chrome

Operating System

No response

Additional Context

No response

Relevant log output

No response

Organization

No response

Declaration

  • I’m not disclosing any internal or sensitive information.
@marekviskup marekviskup added the bug label Apr 2, 2024
@marekviskup
Copy link
Author

Hello,

Is there any plan to investigate this issue or are there any updates when this will be worked on?

Thank you.

@Lukas742
Copy link
Contributor

Lukas742 commented Jun 6, 2024

Hi @marekviskup

I investigated this issue already and unfortunately it turned out to be more complex than anticipated. We'll probably need a new concept for the FilterBar in general as our current approach isn't really how one would implement this component in React. We'll probably discuss the possible options next week and I'll let you know when there's an update.

@Lukas742
Copy link
Contributor

Hi @marekviskup

quick update:
Internally we're currently copying properties of the input elements, which is leading to this error you're describing. Unfortunately, this is not only leading to problems, but is also hard to maintain, since we have to adjust this implementation every time the (internal) implementation of a UI5 web component changes.
Because of this, we've decided to drop this functionality with our v2.0 release, but we will also add a prop that makes it possible to disable this behavior for our 1.x version.

@Lukas742 Lukas742 self-assigned this Jun 19, 2024
@Lukas742 Lukas742 mentioned this issue Aug 16, 2024
Merged
@Lukas742
Copy link
Contributor

Hi @marekviskup

the linked PR will fix this issue, but only for v2. We're planning to release a stable v2 version later this month. Do you also need this fix for v1? If so, we'll need to create a dedicated fix for the v1 version of this component, as we had to completely overhaul it for v2 to implement the new concept, which unfortunately can't be downported to v1.

Lukas742 added a commit that referenced this issue Aug 21, 2024
@Lukas742
refactor(FilterBar): remove reference copying of filter/input elements (
4473118 
#6214)

BREAKING CHANGE: The `FilterBar` component was completely overhauled and references of input elements aren’t copied to the filters dialog anymore, also internal logic for reordering and selection has been removed, meaning it’s necessary to control their values manually (e.g. via React state).

BREAKING CHANGE: `onToggleFilters`: The `detail` property of the event now only includes `visible` and `nativeDetail` properties. `filters` and `search` have been removed.

BREAKING CHANGE: `onFiltersDialogSave`: The `detail` property of the event now only includes `selectedFilterKeys`, `reorderedFilterKeys` and `nativeDetail` properties. `elements`, `toggledElements`, `filters`, `search`, `orderIds` have been removed.

BREAKING CHANGE: `onFiltersDialogCancel`: The event is now a callback instead of a `Ui5CustomEvent`. It implements the `escPressed` parameter.

BREAKING CHANGE: `onFiltersDialogClose`: The event is now a callback instead of a `Ui5CustomEvent`. It implements the `closeTrigger` parameter.

BREAKING CHANGE: `onFiltersDialogSelectionChange`: The event is now a callback instead of a `Ui5CustomEvent`. It implements a payload object as parameter.

BREAKING CHANGE: `onFiltersDialogSearch`: The event is now a standard `Input` `onInput` event. The `detail` properties `value` and `element` have been removed.

BREAKING CHANGE: `onClear`: The event is now a standard `ToolbarButton` `onClick` event. The `detail` properties `filters` and `search` have been removed.

BREAKING CHANGE: `onGo`: The event is now a standard `ToolbarButton` `onClick` event. The `detail` properties `elements`, `filters`, `search`, `nativeDetail` have been removed.


BREAKING CHANGE: `onRestore`: The event is now a callback instead of a `CustomEvent`. It implements a payload object as parameter.

BREAKING CHANGE: `onFiltersDialogOpen (TypeScript)`: The target of the event is now a `ToolbarButton`.

BREAKING CHANGE: `portalContainer` has been removed as it's no longer needed due to the [Popover API](https://developer.mozilla.org/en-US/docs/Web/API/Popover_API) used in the `Popover` ui5 web component.

BREAKING CHANGE: `FilterGroupItem`: `orderId` has been removed. Please use `filterKey` instead.

Fixes #5652
@ui5-webcomponents-react-bot
Copy link
Contributor

🎉 This issue has been resolved in version v2.0.0-rc.3 🎉

The release is available on v2.0.0-rc.3

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@Lukas742 Lukas742

Labels
released
Projects
ui5-webcomponents-react Roadmap
Status: 🆕 New
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

refactor(FilterBar): remove reference copying of filter/input elements SAP/ui5-webcomponents-react
3 participants
@Lukas742 @marekviskup @ui5-webcomponents-react-bot