Skip to content

[8.5] [Dashboard] Change panel filters action visibility (#146335)#147135

Merged
Heenawter merged 5 commits intoelastic:8.5from
Heenawter:backport/8.5/pr-146335
Dec 7, 2022
Merged

[8.5] [Dashboard] Change panel filters action visibility (#146335)#147135
Heenawter merged 5 commits intoelastic:8.5from
Heenawter:backport/8.5/pr-146335

Conversation

@Heenawter
Copy link
Contributor

Backport

This will backport the following commits from main to 8.5:

Questions ?

Please refer to the Backport tool documentation

Closes elastic#141536
Closes elastic#143386

elastic#136655 introduced a panel level
filters badge that would notify users when a visualization was being
filtered/queried on an individual panel level. While this exposed
important information about how the panels were being generated and made
it so that users no longer had to navigate to Lens/Visualize/etc. to see
this information, it introduced a lot of undesired clutter to
dashboards. This was especially annoying for dashboards in **view**
mode, since panel level filter/query information is primarily useful for
dashboard authors and thus this badge had minimal benefit despite its
large visual impact.

To fix this, this PR does three things:
1. Converts the panel filters badge to a single notification icon

![BeforeAndAfterFilterBadge](https://user-images.githubusercontent.com/8698078/205696453-c8a7bc85-46bf-4a0c-b206-bbb690577d9a.png)

2. Displays the filters in a popover rather than a modal

![BeforeAndAfterModal](https://user-images.githubusercontent.com/8698078/205758567-314e841d-646e-4cb6-973d-0fde79c2b9df.png)

3. Makes this notification icon only visible in **edit** mode - it no
longer shows up in view or print mode.

1. Create a visualization with panel level filters and/or queries.
- Note that the sample `[Flights] Global Flight Dashboard` dashboard
already has some visualizations with panel level filters, so you could
also use that instead.
3. Ensure that the panel level filters action icon **only** shows up in
edit mode
    - Swap to view mode and make sure there is no icon
    - Print a PDF or PNG report and make sure there is no icon
4. Ensure that the `"Edit filters"` button in the popover keeps context
when clicked, including allowing you to `"Save and return"` after being
taken to Lens/Visualize/etc.
5. Ensure that the contents of the popover react to changes to panel
level filters/queries

- [x] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios
- [x] Any UI touched in this PR is usable by keyboard only (learn more
about [keyboard accessibility](https://webaim.org/techniques/keyboard/))
- [x] Any UI touched in this PR does not create any new axe failures
(run axe in browser:
[FF](https://addons.mozilla.org/en-US/firefox/addon/axe-devtools/),
[Chrome](https://chrome.google.com/webstore/detail/axe-web-accessibility-tes/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US))
- [x] This renders correctly on smaller devices using a responsive
layout. (You can test this [in your
browser](https://www.browserstack.com/guide/responsive-testing-on-local-server))
- [x] This was checked for [cross-browser
compatibility](https://www.elastic.co/support/matrix#matrix_browsers)

- [ ] This was checked for breaking API changes and was [labeled
appropriately](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process)

(cherry picked from commit a5d7818)
@Heenawter Heenawter added the backport This PR is a backport of another PR label Dec 6, 2022
@Heenawter Heenawter enabled auto-merge (squash) December 6, 2022 18:22
@Heenawter Heenawter force-pushed the backport/8.5/pr-146335 branch from 7ae1ab0 to 1488c10 Compare December 6, 2022 20:40
@Heenawter Heenawter merged commit a609ab0 into elastic:8.5 Dec 7, 2022
@kibana-ci
Copy link

💚 Build Succeeded

Metrics [docs]

Module Count

Fewer modules leads to a faster build time

id before after diff
dashboard 404 405 +1

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id before after diff
dashboard 388.2KB 385.5KB -2.7KB

Page load bundle

Size of the bundles that are downloaded on every page load. Target size is below 100kb

id before after diff
dashboard 72.5KB 74.6KB +2.2KB
Unknown metric groups

async chunk count

id before after diff
dashboard 5 4 -1

History

To update your PR or re-run it, just comment with:
@elasticmachine merge upstream

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

Labels

backport This PR is a backport of another PR

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants