[Discover] Format JSON messages in Observability Logs profile

[davismcphee]

Summary

This PR updates the Observability Logs profile to detect and auto format JSON message values within both the Log overview doc viewer tab and the Summary cell popover. Additionally, it enables CTRL/CMD + F find functionality within the doc viewer JSON tab for all contexts to make it easier for users to search the JSON output.

JSON message formatting:

JSON tab find functionality:

Checklist

• Any text added follows EUI's writing guidelines, uses sentence case text and includes i18n support
• Documentation was added for features that require explanation or tutorials
• Unit or functional tests were updated or added to match the most common scenarios
• If a plugin configuration key changed, check if it needs to be allowlisted in the cloud and added to the docker list
• This was checked for breaking HTTP API changes, and any breaking changes have been approved by the breaking-change committee. The release_note:breaking label should be applied in these situations.
• Flaky Test Runner was used on any tests changed
• The PR description includes the appropriate Release Notes section, and the correct release_note:* label is applied per the guidelines

[elasticmachine]

💛 Build succeeded, but was flaky

• Buildkite Build
• Commit: 25e559b

Failed CI Steps

• Jest Tests #18
• FTR Configs #101

Test Failures

• [job] [logs] FTR Configs #101 / serverless observability UI Dataset Quality Dataset quality summary shows poor, degraded and good count as 0 and all dataset as healthy
• [job] [logs] Jest Tests #18 / useOnSubmit default API response should set index 1 name to package policy on init if no package policies exist for this package

Metrics [docs]

Public APIs missing comments

Total count of every public API that lacks a comment. Target amount is 0. Run node scripts/build_api_docs --plugin [yourplugin] --stats comments for more detailed information.

id	before	after	diff
@kbn/discover-contextual-components	34	36	+2
@kbn/discover-utils	226	228	+2
total			+4

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id	before	after	diff
discover	778.0KB	778.3KB	+305.0B
unifiedDocViewer	115.8KB	116.2KB	+400.0B
total			+705.0B

Page load bundle

Size of the bundles that are downloaded on every page load. Target size is below 100kb

id	before	after	diff
unifiedDocViewer	11.3KB	11.3KB	-18.0B

Unknown metric groups

API count

id	before	after	diff
@kbn/discover-contextual-components	37	39	+2
@kbn/discover-utils	276	278	+2
total			+4

cc @davismcphee

[elasticmachine]

Pinging @elastic/kibana-data-discovery (Team:DataDiscovery)

[elasticmachine]

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

[tonyghiani]

Tip

Since the EuiCodeBlock component might receive conditionally the children props, what about pre-computing the props early and passing them into the component to prevent overlaps?

const messageCodeBlockProps = formattedValue 
  ? { language: 'json', dangerouslySetInnerHTML: { __html: value ?? '' } }
  : { language: 'txt', children: formattedValue }

<EuiCodeBlock
  overflowHeight={100}
  paddingSize="s"
  isCopyable
  fontSize="s"
  {...messageCodeBlockProps}
/>

Same could be applied to the other usage in the flyout.

[tonyghiani]

LGTM, I left a suggestion to avoid props overlapping but nothing blocking this to get merged