[Infra Alerting UI] Audit new EUI Borealis theme

[fkanout]

Summary

It fixes #205052 by

• Remapping the vis color for the Infra rule preview chart. This is a temporary solution because the current is not visible, so we are waiting for @maciejforcone inputs.
• Deleting the unused Expression chart

[elasticmachine]

Pinging @elastic/obs-ux-management-team (Team:obs-ux-management)

[MiriamAparicio]

LGTM

[mgadewoll]

euiPaletteColorBlind used to be static in Amsterdam as we only had a single set of visualization colors but it was changed to ensure support for Borealis and Amsterdam.

The default palette is currently Amsterdam (until EUI switches default theme) and on EuiProvider theme update (this is within React) this palette updates.
I don't know how this is actually used, but the code here looks static, so it would likely use the initial value (Amsterdam).
If you're finding that you have unwanted static values (meaning Amsterdam colors in Borealis) the suggested usage for this is to either declare the variable inside a component that uses it if you're in React land (to ensure it can be recalled on rerenders based on EuiProvider) or you can manually listen to the store updates that the palettes are feeding from.

// simplified code 
import { EUI_VIS_COLOR_STORE } from '@elastic/eui;

// colors from default EUI theme
let visColors = euiPaletteColorBlind();

// subscribe to the store for changes (changes happen based on EuiProvider updates)
const storeId = EUI_VIS_COLOR_STORE.subscribe(
  VIS_COLOR_STORE_EVENTS.UPDATE,
  (updatedColors) => {
    // update your colors here
    visColors = updatedColors; // or call euiPaletteColorBlind() again
  }
);

// unsubscribe
EUI_VIS_COLOR_STORE.unsubscribe(VIS_COLOR_STORE_EVENTS.UPDATE, storeId);

[fkanout]

@mgadewoll I tested the chart that uses this mapping/helpers (which is in the shared folder where the backend and frontend could use it --No React).

And the colors followed the theme selection. Does that cover your concerns?

[mgadewoll]

Yes, thanks for checking an clarifying! 🙏
As long as the expected colors are propagated for all use cases, it's fine to keep as is!

[patpscal]

Hi @fkanout! For some reason, trying to run yarn es snapshot returns an error if switched to this PR. Could you share some screenshots with me, or perhaps we could do a pair review? Thank you!

[fkanout]

Hi @fkanout! For some reason, trying to run yarn es snapshot returns an error if switched to this PR. Could you share some screenshots with me, or perhaps we could do a pair review? Thank you!

Hi @patpscal , I was out sick, hence the delayed reply! Thanks for checking the PR. It was outdated and had some merge conflicts, which could explain the error you had. I tried yarn es snapshot, and it works as expected.

[fkanout]

@patpscal if the error you are referring to is related to the ml, you need to run es with yarn es snapshot --license trial -E xpack.ml.enabled=false. But that should not be related to my PR.

[elasticmachine]

💛 Build succeeded, but was flaky

• Buildkite Build
• Commit: 2b26a6f

Failed CI Steps

• Jest Tests #9
• FTR Configs #93

Test Failures

• [job] [logs] Jest Tests #9 / CasesWebhookActionConnectorFields renders Validation validates correctly "viewIncidentUrlInput"
• [job] [logs] FTR Configs #93 / visualize app visual builder Time Series Elastic charts should display correct chart data, label names and area colors for sum aggregation when split by terms

Metrics [docs]

✅ unchanged

History

• 💚 Build #263005 succeeded 5cb6ed2
• 💔 Build #262960 failed d674444
• 💔 Build #262936 failed 7aadccc

cc @fkanout

[mgadewoll]

✅ Changes LGTM from EUI side.

[patpscal]

Looks good to me