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.

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

[8.x] [Security Solution][Alert Details] - fix some UI issues related to emotion/css vs emotion/react (#205664) #205928

Merged
merged 1 commit into from
Jan 8, 2025

Conversation

kibanamachine
Copy link
Contributor

Backport

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

Questions ?

Please refer to the Backport tool documentation

…otion/css vs emotion/react (elastic#205664)

## Summary

This recent [PR](elastic#205011) slightly
broke the UI in a couple of small places in the alert details flyout.
Strangely, I did review the PR by pulling down the branch, but only
looked at the places that were impacted by the files modified. The
couple of places where the UI broke were completely different...
My guess it is is related to the fact that in those place we were still
using `@emotion/css` and this might not play nice with some
`styled_components`...

Updating those places to use `@emotion/react` fixed the issues!

| Before fix  | After fix |
| ------------- | ------------- |
|
![broken-1](https://github.com/user-attachments/assets/839760db-da3c-4031-b4be-18645b37c089)
|
![fix-1](https://github.com/user-attachments/assets/cdfae85c-0e63-45be-94dd-5e0f9a698d8a)
|

| Before fix  | After fix |
| ------------- | ------------- |
|
![broken-2](https://github.com/user-attachments/assets/22588529-5afd-491d-ab00-6e07593fb6f7)
|
![fix-2](https://github.com/user-attachments/assets/c078d814-1a33-49dc-aa0d-25dcff555de2)
|

| Before fix  | After fix |
| ------------- | ------------- |
|
![broken-3](https://github.com/user-attachments/assets/082d306c-8866-4e4f-ab18-db7c649101fe)
|
![fix-3](https://github.com/user-attachments/assets/5da76c44-934b-4a2a-a98e-2de34973d02e)
|

In a follow work, we need to remove completely all the
`styled_components` we have.

(cherry picked from commit a8e1bf4)
@kibanamachine kibanamachine merged commit 233da45 into elastic:8.x Jan 8, 2025
11 checks passed
@elasticmachine
Copy link
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 19.2MB 19.2MB +457.0B

cc @PhilippeOberti

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants