Skip to content

[8.x] [Security Solution][Expandable flyout] fix flyout flickering when opening/closing left panel (#210225)#210292

Merged
PhilippeOberti merged 1 commit intoelastic:8.xfrom
PhilippeOberti:backport/8.x/pr-210225
Feb 8, 2025
Merged

[8.x] [Security Solution][Expandable flyout] fix flyout flickering when opening/closing left panel (#210225)#210292
PhilippeOberti merged 1 commit intoelastic:8.xfrom
PhilippeOberti:backport/8.x/pr-210225

Conversation

@PhilippeOberti
Copy link
Copy Markdown
Contributor

Backport

This will backport the following commits from main to 8.x:

Questions ?

Please refer to the Backport tool documentation

…ning/closing left panel (elastic#210225)

## Summary

We recently improved the expandable flyout by adding support for a
[fully resizable flyout](elastic#192906).
This work introduce a minor inconvenience, where the right panel gets
re-rendered every time the user expands or collapses the flyout.

This PR fixes this issue by better using the EUI resizable container
(see how to externally control a resizable container
[here](https://eui.elastic.co/#/layout/resizable-container#collapsible-panels-with-external-control)).
The flyout is now always showing a resizable container (even in
collapsed mode) but EUI manages internally hiding the left section and
the resize button.

#### Old behavior

https://github.com/user-attachments/assets/4d7589ec-0edf-4690-9ce4-7b969ae0bb44

#### New behavior

https://github.com/user-attachments/assets/7cf720b8-5b31-4cc9-b213-21472ea880d6

The rest of the flyout's behavior remains untouched:
- identical default widths
- user selected widths are still applied
- no changes to the preview behavior

### Checklist

- [ ] [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

(cherry picked from commit 7a9bf13)
@elasticmachine
Copy link
Copy Markdown
Contributor

💚 Build Succeeded

Metrics [docs]

Async chunks

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

id before after diff
securitySolution 18.7MB 18.7MB -10.0B

@PhilippeOberti PhilippeOberti merged commit b73a2ce into elastic:8.x Feb 8, 2025
@PhilippeOberti PhilippeOberti deleted the backport/8.x/pr-210225 branch February 10, 2025 15:28
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