From 969813caae6ca093b7518c8876d246a2b0d81451 Mon Sep 17 00:00:00 2001
From: Uladzislau Lasitsa <Uladzislau_Lasitsa@epam.com>
Date: Wed, 3 Feb 2021 14:51:22 +0300
Subject: [PATCH] Add folding in kb-monaco and update some viewers

---
 packages/kbn-monaco/src/monaco_imports.ts                     | 2 +-
 .../views/requests/components/details/req_code_viewer.tsx     | 4 +++-
 .../public/vega_inspector/components/spec_viewer.tsx          | 4 +++-
 3 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/packages/kbn-monaco/src/monaco_imports.ts b/packages/kbn-monaco/src/monaco_imports.ts
index 9d59fb0923d7e..704957c51770c 100644
--- a/packages/kbn-monaco/src/monaco_imports.ts
+++ b/packages/kbn-monaco/src/monaco_imports.ts
@@ -17,7 +17,7 @@ import 'monaco-editor/esm/vs/editor/browser/controller/coreCommands.js';
 import 'monaco-editor/esm/vs/editor/browser/widget/codeEditorWidget.js';
 
 import 'monaco-editor/esm/vs/editor/contrib/wordOperations/wordOperations.js'; // Needed for word-wise char navigation
-
+import 'monaco-editor/esm/vs/editor/contrib/folding/folding.js'; // Needed for folding
 import 'monaco-editor/esm/vs/editor/contrib/suggest/suggestController.js'; // Needed for suggestions
 import 'monaco-editor/esm/vs/editor/contrib/hover/hover.js'; // Needed for hover
 import 'monaco-editor/esm/vs/editor/contrib/parameterHints/parameterHints.js'; // Needed for signature
diff --git a/src/plugins/inspector/public/views/requests/components/details/req_code_viewer.tsx b/src/plugins/inspector/public/views/requests/components/details/req_code_viewer.tsx
index 0e97f8157227c..97fd592c42037 100644
--- a/src/plugins/inspector/public/views/requests/components/details/req_code_viewer.tsx
+++ b/src/plugins/inspector/public/views/requests/components/details/req_code_viewer.tsx
@@ -8,6 +8,7 @@
 
 import React from 'react';
 import { i18n } from '@kbn/i18n';
+import { XJsonLang } from '@kbn/monaco';
 import { EuiFlexItem, EuiFlexGroup, EuiCopy, EuiButtonEmpty, EuiSpacer } from '@elastic/eui';
 
 import { CodeEditor } from '../../../../../../kibana_react/public';
@@ -51,7 +52,7 @@ export const RequestCodeViewer = ({ json }: RequestCodeViewerProps) => (
     </EuiFlexItem>
     <EuiFlexItem grow={true}>
       <CodeEditor
-        languageId="json"
+        languageId={XJsonLang.ID}
         value={json}
         onChange={() => {}}
         options={{
@@ -61,6 +62,7 @@ export const RequestCodeViewer = ({ json }: RequestCodeViewerProps) => (
           minimap: {
             enabled: false,
           },
+          folding: true,
           scrollBeyondLastLine: false,
           wordWrap: 'on',
           wrappingIndent: 'indent',
diff --git a/src/plugins/vis_type_vega/public/vega_inspector/components/spec_viewer.tsx b/src/plugins/vis_type_vega/public/vega_inspector/components/spec_viewer.tsx
index 54469d78fb91c..4104740869bac 100644
--- a/src/plugins/vis_type_vega/public/vega_inspector/components/spec_viewer.tsx
+++ b/src/plugins/vis_type_vega/public/vega_inspector/components/spec_viewer.tsx
@@ -8,6 +8,7 @@
 
 import React, { useEffect, useState } from 'react';
 import { i18n } from '@kbn/i18n';
+import { XJsonLang } from '@kbn/monaco';
 
 import {
   EuiFlexItem,
@@ -71,7 +72,7 @@ export const SpecViewer = ({ vegaAdapter, ...rest }: SpecViewerProps) => {
       </EuiFlexItem>
       <EuiFlexItem grow={true}>
         <CodeEditor
-          languageId="json"
+          languageId={XJsonLang.ID}
           value={spec}
           onChange={() => {}}
           options={{
@@ -82,6 +83,7 @@ export const SpecViewer = ({ vegaAdapter, ...rest }: SpecViewerProps) => {
               enabled: false,
             },
             scrollBeyondLastLine: false,
+            folding: true,
             wordWrap: 'on',
             wrappingIndent: 'indent',
             automaticLayout: true,