feat: use CodeMirror for displaying raw result

[jstucke]

[codecov-commenter]

Codecov Report

All modified and coverable lines are covered by tests :white_check_mark:

Project coverage is 91.62%. Comparing base (5c24429) to head (304c578). Report is 2 commits behind head on master.

Additional details and impacted files

@@            Coverage Diff             @@
##           master    #1337      +/-   ##
==========================================
- Coverage   91.66%   91.62%   -0.05%     
==========================================
  Files         374      374              
  Lines       21052    21109      +57     
==========================================
+ Hits        19298    19341      +43     
- Misses       1754     1768      +14     

:umbrella: View full report in Codecov by Sentry.
:loudspeaker: Have feedback on the report? Share it here.

:rocket: New features to boost your workflow:

• :snowflake: Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• :package: JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[dorpvom]

I was curious what PR #1337 would be out of principal.. Now. I don't get it. What does this do @jstucke?

[jstucke]

I was curious what PR #1337 would be out of principal.. Now. I don't get it. What does this do @jstucke?

Seems I forgot to include a description, sorry. The raw JSON result preview currently works with syntax highlighting (the same as the file preview). That isn't bad, but large results can get kinda unwieldy fast and it would be nice if it was possible to fold in some parts of it. This isn't really possible with simple highlighted code. But there is an alternative: on the GraphQL Search page we use CodeMirror to display code. CodeMirror does have an option to enable folding in parts of the code. Thus, I simply replaced the raw result element with CodeMirror.