[Obs Logs UX][EUI Visual Refresh] Update All usage of color palette tokens and functions

[tonyghiani]

📓 Summary

All usage of color palette tokens and functions now pull from the theme, and correctly update to use new colors when the theme changes from Borealis to Amsterdam and vice versa.

The described visual changes should be applied to the following plugins/packages UI elements:

• Dataset Quality
• Infra (logs features)
• Logs Data Access
• Logs Explorer
• Logs Shared
• Observability Logs Explorer
• Observability onboarding
• Unified Doc Viewer (Logs overview tab)
• packages/kbn-custom-integrations
• packages/kbn-saved-search-component
• x-pack/packages/observability/logs_overview

Color palettes should now be theme aware

[!IMPORTANT] Key point: Make sure that if you are using colors from our color palette options, that your UI correctly updates to use the correct colors whenever you change themes.

https://eui.elastic.co/#/utilities/color-palettes

euiColorVis0
euiColorVis1
euiColorVis2
euiColorVis3
euiColorVis4
euiColorVis5
euiColorVis6
euiColorVis7
euiColorVis8
euiColorVis9

Vis color tokens are now available through the EUI theme: euiTheme.colors.vis:

These were not previously part of the theme. This means that they would not change when the theme was changed. They are now part of the theme and should change when the theme is changed.

If you were using any of the above tokens directly, please change your code to pull them directly from euiTheme.colors.vis.

If you were using any of our color palette functions:

• either ensure the color palette function is called inside a React component under the EuiProvider context and is hence connected to rerender (called on rerender or connected to a state)
• otherwise if it’s used outside of the EuiProvider context you can use the new EUI_VIS_COLOR_STORE.subscribe() function to listen to changes and update usages manually

const storeId = EUI_VIS_COLOR_STORE.subscribe(
  VIS_COLOR_STORE_EVENTS.UPDATE,
  () => {
    setPalette(euiPaletteColorBlind());
  }
);

[elasticmachine]

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