[ResponseOps] [UI] Color palette tokens and functions dynamically update with theme changes#203448
Conversation
| }, | ||
| }; | ||
|
|
||
| // eslint-disable-next-line react/display-name |
There was a problem hiding this comment.
please don't forget to add the display name and remove this warning
There was a problem hiding this comment.
Done, thanks!
| import { CRITICAL, HIGH, LOW, MEDIUM } from './translations'; | ||
|
|
||
| interface Props { | ||
| severity: 'low' | 'medium' | 'high' | 'critical'; |
There was a problem hiding this comment.
should this be an enum? Ideally we would use the enum defined in x-pack/plugins/cases/common/types/domain/case/v1.ts
There was a problem hiding this comment.
changed to be CaseSeverity from /types/domain
| } | ||
|
|
||
| export const SeverityFilter: React.FC<Props> = ({ selectedSeverity, onSeverityChange }) => { | ||
| const { euiTheme } = useEuiTheme(); |
There was a problem hiding this comment.
I guess this will be removed in favour of the SeverityHealth component?
There was a problem hiding this comment.
removed it and used the new SeverityHealth component
| }; | ||
|
|
||
| // eslint-disable-next-line react/display-name | ||
| export const SeverityHealth: React.FC<Props> = ({ severity, label }) => { |
There was a problem hiding this comment.
I think the label is also something that is known best here internally. This component should know what color-label combination should be shown depending on the severity
There was a problem hiding this comment.
Done, the label is now internally.
|
Pinging @elastic/response-ops (Team:ResponseOps) |
💔 Build Failed
Failed CI StepsHistory
|
Closes #202551
Summary
JSON tokens are anything from:
@elastic/eui/dist/eui_theme_light.json
@elastic/eui/dist/eui_theme_dark.json
import { euiThemeVars } from '@kbn/ui-theme'