[SecuritySolution] Update severity colors for Borealis theme #206276
Merged
Conversation
This file contains 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
angorayc
added
release_note:skip
angorayc
changed the title
angorayc
force-pushed
the
severity-colors
branch
from
52b9eb1 to
56c6463
Compare
Merged
nikitaindik
reviewed
Jan 10, 2025
x-pack/solutions/security/plugins/security_solution/public/common/utils/risk_color_palette.tsx
Outdated
Show resolved
Hide resolved
maxcold
approved these changes
Jan 10, 2025
nikitaindik
reviewed
Jan 10, 2025
...ecurity/plugins/security_solution/public/detections/pages/detection_engine/rules/helpers.tsx
Outdated
Show resolved
Hide resolved
nikitaindik
reviewed
Jan 10, 2025
...ugins/security_solution/public/detection_engine/rule_details_ui/pages/rule_details/index.tsx
Outdated
Show resolved
Hide resolved
nikitaindik
reviewed
Jan 10, 2025
...gins/security_solution/public/detection_engine/rule_creation_ui/pages/rule_editing/index.tsx
Outdated
Show resolved
Hide resolved
nikitaindik
reviewed
Jan 10, 2025
...solution/public/detection_engine/rule_creation_ui/components/description_step/index.test.tsx
Outdated
Show resolved
Hide resolved
nikitaindik
reviewed
Jan 10, 2025
...ty/plugins/security_solution/public/detections/pages/detection_engine/rules/helpers.test.tsx
Outdated
Show resolved
Hide resolved
nikitaindik
reviewed
Jan 10, 2025
There was a problem hiding this comment.
Thanks so much for this PR, @angorayc! I was planning to make similar changes, but only for the Rule Management and Detection Engine teams. You’ve gone above and beyond by covering even more areas — great work!
I’ve reviewed the Rule Management-owned code and left a few comments for your consideration. When you have a moment, please take a look.
Additionally, I tested the Rule Management-owned pages and didn’t encounter any issues. Everything looks good! 👍
Please address my comments and I'll give this PR another look. 🙏
nikitaindik
approved these changes
Jan 14, 2025
There was a problem hiding this comment.
Thanks for addressing my feedback, @angorayc! I've re-tested the Rule Management-owned pages, as well as the rule creation and editing forms, across both themes in both dark and light modes, and found no issues. This is good to go! 👍
nikitaindik
added a commit
that referenced
this pull request
Jan 14, 2025
…206122) **Resolves: #204737** **Related PR (fixes severity indicator colors): #206276** ## Summary This PR introduces some of the necessary changes to support the Borealis UI theme on Rule Management team-owned pages. You can find a list of what needs to be done in this [issue](#199715) description under "Requested Code Changes". ## Changes in this PR - Replaced deprecated `euiThemeVars` with `useEuiTheme`. - Fixed incorrect "disabled" button color for the rule delete bulk action. ## Changes that are needed, but are outside of this PR's scope - Fix incorrect severity colors in Borealis. Will be resolved by this Threat Hunting [PR](#206276). <img width="93" alt="Schermafbeelding 2025-01-13 om 13 46 26" src="https://github.com/user-attachments/assets/d35407d7-77f9-4d7d-a6b8-3dfe4f8a0e9e" /> - Fix rule execution status indicator appearing too dark in the Borealis theme. This issue will be addressed in EUI, but there is no draft PR yet, as discussions are still ongoing between the design team and EUI folks to determine the best approach. <img width="326" alt="borealis" src="https://github.com/user-attachments/assets/3324448c-be13-4074-bfdc-c6837fb2bc6c" /> ## Testing You can find the theme switcher in "Stack Management" -> "Advanced Settings". Then you can test if everything looks correct in: - Amsterdam theme, light mode - Amsterdam theme, dark mode - Borealis theme, light mode - Borealis theme, dark mode Work started on: 08-01-2025
There was a problem hiding this comment.
could be worth writing some uni tests, even though this is basic, it is used in a few places. As least if someone makes a change by mistake, they will be reminded...
There was a problem hiding this comment.
add some unit tests for this new getSeverityColor function?
|
Would it be possible to hold off on updating the Borealis severity colors for now? They are expected to change soon. |
Yup, I'll wait for your decision. Please keep @PhilippeOberti @CAWilson94 in the loop when you have the update. Thanks! |
|
@r4zr32d3k1l feature freeze is on the 29th, will new severity colors come into effect before then? |
christineweng
approved these changes
Jan 21, 2025
viduni94
pushed a commit
to viduni94/kibana
that referenced
this pull request
Jan 23, 2025
…lastic#206122) **Resolves: elastic#204737** **Related PR (fixes severity indicator colors): elastic#206276** ## Summary This PR introduces some of the necessary changes to support the Borealis UI theme on Rule Management team-owned pages. You can find a list of what needs to be done in this [issue](elastic#199715) description under "Requested Code Changes". ## Changes in this PR - Replaced deprecated `euiThemeVars` with `useEuiTheme`. - Fixed incorrect "disabled" button color for the rule delete bulk action. ## Changes that are needed, but are outside of this PR's scope - Fix incorrect severity colors in Borealis. Will be resolved by this Threat Hunting [PR](elastic#206276). <img width="93" alt="Schermafbeelding 2025-01-13 om 13 46 26" src="https://github.com/user-attachments/assets/d35407d7-77f9-4d7d-a6b8-3dfe4f8a0e9e" /> - Fix rule execution status indicator appearing too dark in the Borealis theme. This issue will be addressed in EUI, but there is no draft PR yet, as discussions are still ongoing between the design team and EUI folks to determine the best approach. <img width="326" alt="borealis" src="https://github.com/user-attachments/assets/3324448c-be13-4074-bfdc-c6837fb2bc6c" /> ## Testing You can find the theme switcher in "Stack Management" -> "Advanced Settings". Then you can test if everything looks correct in: - Amsterdam theme, light mode - Amsterdam theme, dark mode - Borealis theme, light mode - Borealis theme, dark mode Work started on: 08-01-2025
|
Hey folks! 👋 Any updates on this? Are we going to use severity colors from Amsterdam in Borealis? |
Update:
Relevant implementation: |
⏳ Build in-progress, with failures
Failed CI StepsTest Failures
History
|
💚 Build Succeeded
Metrics [docs]Module Count
Async chunks
History
|
CAWilson94
added a commit
that referenced
this pull request
Jan 27, 2025
## Summary This PR covers required updates for EUI refresh: [#11228](elastic/security-team#11228) The updates should only cover Entity Owned components. ### Severity Colors Blocked Severity colors are on hold until the security severity color palette is finalised. Once agreed, a shared hook will be updated across all of security, replacing the current RISK_SEVERITY_COLOUR mapping. The previous severity colors hook was reverted in preparation for this change. Updates for EA will be tracked accordingly. See https://elastic.slack.com/archives/C0851RDCWPP/p1736954935896329 for more details elastic/security-team#11516 #206276 --- ### Testing Running Kibana with the Borealis theme In order to run Kibana with Borealis, you'll need to do the following: 1. Set the following in kibana.dev.yml: u`iSettings.experimental.themeSwitcherEnabled: true` 2. Run Kibana with the following environment variable set: `KBN_OPTIMIZER_THEMES="borealislight,borealisdark,v8light,v8dark" yarn start` 3. This will expose a toggle under **Stack Management > Advanced Settings > Theme version**, which you can use to toggle between Amsterdam and Borealis. --- More details about each section #199715 #### Borealis Updates Light & Dark Theme ### Screenshots Google Docs for easy read - same screenshots below https://docs.google.com/document/d/1tKPoqCPbccX94cqgPyHKBdr9_K3kmqveQGkcGo_Q8k4/edit?usp=sharing --- ## Light Theme ### Entity Store   ### Risk Score  ### Dashboard and Flyout     ## Dark Theme ### Entity Store   ### Risk Score  ### Dashboard and Flyout     --------- Co-authored-by: kibanamachine <[email protected]> Co-authored-by: Mark Hopkin <[email protected]>
JoseLuisGJ
pushed a commit
to JoseLuisGJ/kibana
that referenced
this pull request
Jan 27, 2025
…#206276) ## Summary Apply severity colors for Borealis theme. elastic#204007 (comment) Update:⚠️ As the final decision for severity color is still pending, the temporary colors are the hard coded color hex: elastic#203387 `TODO` Borealis migration - move from hardcoded values to severity palette elastic/security-team#11606 | Color token | Amsterdam|Borealis| |-------------|------------|------------| | Critical | euiThemeVars.euiColorDanger |```#E7664C```| | High | euiThemeVars.euiColorVis9_behindText |```#DA8B45``` | | Meduiml |euiThemeVars.euiColorVis5_behindText|```#D6BF57``` | | Low | euiThemeVars.euiColorVis0| ```#54B399``` | ### Running Kibana with the Borealis theme In order to run Kibana with Borealis, you'll need to do the following: Set the following in kibana.dev.yml: uiSettings.experimental.themeSwitcherEnabled: true Run Kibana with the following environment variable set: KBN_OPTIMIZER_THEMES="borealislight,borealisdark,v8light,v8dark" yarn start This will expose a toggle under Stack Management > Advanced Settings > Theme version, which you can use to toggle between Amsterdam and Borealis.  ### 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 --------- Co-authored-by: kibanamachine <[email protected]>
JoseLuisGJ
pushed a commit
to JoseLuisGJ/kibana
that referenced
this pull request
Jan 27, 2025
## Summary This PR covers required updates for EUI refresh: [elastic#11228](elastic/security-team#11228) The updates should only cover Entity Owned components. ### Severity Colors Blocked Severity colors are on hold until the security severity color palette is finalised. Once agreed, a shared hook will be updated across all of security, replacing the current RISK_SEVERITY_COLOUR mapping. The previous severity colors hook was reverted in preparation for this change. Updates for EA will be tracked accordingly. See https://elastic.slack.com/archives/C0851RDCWPP/p1736954935896329 for more details elastic/security-team#11516 elastic#206276 --- ### Testing Running Kibana with the Borealis theme In order to run Kibana with Borealis, you'll need to do the following: 1. Set the following in kibana.dev.yml: u`iSettings.experimental.themeSwitcherEnabled: true` 2. Run Kibana with the following environment variable set: `KBN_OPTIMIZER_THEMES="borealislight,borealisdark,v8light,v8dark" yarn start` 3. This will expose a toggle under **Stack Management > Advanced Settings > Theme version**, which you can use to toggle between Amsterdam and Borealis. --- More details about each section elastic#199715 #### Borealis Updates Light & Dark Theme ### Screenshots Google Docs for easy read - same screenshots below https://docs.google.com/document/d/1tKPoqCPbccX94cqgPyHKBdr9_K3kmqveQGkcGo_Q8k4/edit?usp=sharing --- ## Light Theme ### Entity Store   ### Risk Score  ### Dashboard and Flyout     ## Dark Theme ### Entity Store   ### Risk Score  ### Dashboard and Flyout     --------- Co-authored-by: kibanamachine <[email protected]> Co-authored-by: Mark Hopkin <[email protected]>
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.
Summary
Apply severity colors for Borealis theme.
#204007 (comment)
Update:⚠️ As the final decision for severity color is still pending, the temporary colors are the hard coded color hex:
#203387
TODOBorealis migration - move from hardcoded values to severity palette https://github.com/elastic/security-team/issues/11606#E7664C#DA8B45#D6BF57#54B399Running Kibana with the Borealis theme
In order to run Kibana with Borealis, you'll need to do the following:
Set the following in kibana.dev.yml: uiSettings.experimental.themeSwitcherEnabled: true
Run Kibana with the following environment variable set:
KBN_OPTIMIZER_THEMES="borealislight,borealisdark,v8light,v8dark" yarn start
This will expose a toggle under Stack Management > Advanced Settings > Theme version, which you can use to toggle between Amsterdam and Borealis.
Checklist