[FEATURE] Beautiful format of PPL JSON result page

[zane-neo]

Is your feature request related to a problem?
Current PPL query results display JSON results in raw string format which is not consistent to how it's been displayed in discovery page like below:
PPL query result:

Discovery page result:

It would be great that PPL page display json result in a better approach like in discovery page, this can reduce the misunderstanding on the field type and give customer better user experience.

What solution would you like?
A clear and concise description of what you want to happen.

What alternatives have you considered?
A clear and concise description of any alternative solutions or features you've considered.

Do you have any additional context?
Add any other context or screenshots about the feature request here.

[Swiddis]

Thanks for the issue!

Looks like the relevant part is the JsonCodeBlock referenced in the doc viewer, the rendering logic is here.

return (
  <EuiCodeBlock aria-label={label} language="json" isCopyable paddingSize="s">
    {JSON.stringify(hit, null, 2)}
  </EuiCodeBlock>
);

We could probably find a way to hack this to render nested objects correctly, but I wonder why the underlying API is returning strings instead of objects? Is there some difference in how the documents are being processed under the hood here?

Marking as a good first issue and leaving open for now. In the spirit of making the issue approachable for newcomers, it would be nice to get some more detailed reproduction steps. I can work them out later if needed.