[8.x] [Dashboard] Presentation panel refactor (#207275)#210030
Merged
Heenawter merged 2 commits intoelastic:8.xfrom Feb 6, 2025
Merged
[8.x] [Dashboard] Presentation panel refactor (#207275)#210030Heenawter merged 2 commits intoelastic:8.xfrom
Heenawter merged 2 commits intoelastic:8.xfrom
Conversation
Closes elastic#206686 Closes elastic#197897 Part of elastic#207852 ## Summary This PR is a major refactor of the `PresentationPanel` component, including an overhaul of the hover action and panel title components. Some notable highlights include: - All styles in the `PresentationPanel` component were moved from SASS to Emotion - The over-complicated logic to combine hover actions when the panel shrinks was removed in favour of CSS, driven by a [container query](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_containment/Container_queries) Removing the `updateCombineHoverActions` function (which was defined in a React component and not memoized) also made a difference in performance when dragging: | Before | After | |--------|--------| |  |  | - The over-complicated logic defined in `usePresentationPanelTitleClickHandle`, which was meant to ignore the `onClick` that would trigger after a panel was dragged, was converted to 2 lines of CSS ### Small usability improvements This PR also includes a few small usability improvements, such as: - Ensuring that only the **first** row of hover actions overlaps with the Dashboard's sticky top navigation bar, and this only happens when the dashboard has no controls. This results in much better behaviour in most scenarios: | Before | After | |--------|--------| |  |  | - Adding a small delay for hiding the hover actions on mouse leave, which makes it a lot easier to grab the drag handle: | Before | After | |--------|--------| |  |  | - Preventing the resize handle from overlapping Dashboard's stick top navigation: | Before | After | |--------|--------| |  |  | ### Checklist - [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] The PR description includes the appropriate Release Notes section, and the correct `release_note:*` label is applied per the [guidelines](https://www.elastic.co/guide/en/kibana/master/contributing.html#kibana-release-notes-process) --------- Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com> (cherry picked from commit c35698b) # Conflicts: # src/platform/plugins/private/presentation_panel/public/panel_component/_presentation_panel.scss # src/platform/plugins/shared/dashboard/public/dashboard_container/component/grid/use_layout_styles.tsx
2 tasks
Contributor
💛 Build succeeded, but was flaky
Failed CI StepsTest FailuresMetrics [docs]Module Count
Async chunks
Page load bundle
Unknown metric groupsESLint disabled line counts
Total ESLint disabled count
History
|
nreese
approved these changes
Feb 6, 2025
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Backport
This will backport the following commits from
mainto8.x:Questions ?
Please refer to the Backport tool documentation