From 8fe4137faa546d54b9e488a402d752a981f88e1c Mon Sep 17 00:00:00 2001
From: Jen Huang <its.jenetic@gmail.com>
Date: Thu, 12 Jul 2018 12:12:26 -0700
Subject: [PATCH 1/2] Use EuiCodeBlock for JSON settings, and overflow if long
 value

---
 .../field/__snapshots__/field.test.js.snap    | 98 ++++++++++++-------
 .../settings/components/field/field.js        | 18 +++-
 2 files changed, 79 insertions(+), 37 deletions(-)

diff --git a/src/core_plugins/kibana/public/management/sections/settings/components/field/__snapshots__/field.test.js.snap b/src/core_plugins/kibana/public/management/sections/settings/components/field/__snapshots__/field.test.js.snap
index ea478bac32a953..d74ec3d99a0ca9 100644
--- a/src/core_plugins/kibana/public/management/sections/settings/components/field/__snapshots__/field.test.js.snap
+++ b/src/core_plugins/kibana/public/management/sections/settings/components/field/__snapshots__/field.test.js.snap
@@ -195,10 +195,12 @@ exports[`Field for array setting should render user value if there is user value
               grow={true}
               size="xs"
             >
-              Default: 
-              <EuiCode>
-                default_value
-              </EuiCode>
+              <UNDEFINED>
+                Default: 
+                <EuiCode>
+                  default_value
+                </EuiCode>
+              </UNDEFINED>
             </EuiText>
           </UNDEFINED>
         </UNDEFINED>
@@ -459,10 +461,12 @@ exports[`Field for boolean setting should render user value if there is user val
               grow={true}
               size="xs"
             >
-              Default: 
-              <EuiCode>
-                true
-              </EuiCode>
+              <UNDEFINED>
+                Default: 
+                <EuiCode>
+                  true
+                </EuiCode>
+              </UNDEFINED>
             </EuiText>
           </UNDEFINED>
         </UNDEFINED>
@@ -723,10 +727,12 @@ exports[`Field for image setting should render user value if there is user value
               grow={true}
               size="xs"
             >
-              Default: 
-              <EuiCode>
-                null
-              </EuiCode>
+              <UNDEFINED>
+                Default: 
+                <EuiCode>
+                  null
+                </EuiCode>
+              </UNDEFINED>
             </EuiText>
           </UNDEFINED>
         </UNDEFINED>
@@ -936,10 +942,16 @@ exports[`Field for json setting should render default value if there is no user
               grow={true}
               size="xs"
             >
-              Default: 
-              <EuiCode>
-                {}
-              </EuiCode>
+              <UNDEFINED>
+                Default:
+                <EuiCodeBlock
+                  language="js"
+                  overflowHeight={null}
+                  paddingSize="s"
+                >
+                  {}
+                </EuiCodeBlock>
+              </UNDEFINED>
             </EuiText>
           </UNDEFINED>
         </UNDEFINED>
@@ -1058,10 +1070,16 @@ exports[`Field for json setting should render user value if there is user value
               grow={true}
               size="xs"
             >
-              Default: 
-              <EuiCode>
-                {}
-              </EuiCode>
+              <UNDEFINED>
+                Default:
+                <EuiCodeBlock
+                  language="js"
+                  overflowHeight={null}
+                  paddingSize="s"
+                >
+                  {}
+                </EuiCodeBlock>
+              </UNDEFINED>
             </EuiText>
           </UNDEFINED>
         </UNDEFINED>
@@ -1371,10 +1389,12 @@ exports[`Field for markdown setting should render user value if there is user va
               grow={true}
               size="xs"
             >
-              Default: 
-              <EuiCode>
-                null
-              </EuiCode>
+              <UNDEFINED>
+                Default: 
+                <EuiCode>
+                  null
+                </EuiCode>
+              </UNDEFINED>
             </EuiText>
           </UNDEFINED>
         </UNDEFINED>
@@ -1654,10 +1674,12 @@ exports[`Field for number setting should render user value if there is user valu
               grow={true}
               size="xs"
             >
-              Default: 
-              <EuiCode>
-                5
-              </EuiCode>
+              <UNDEFINED>
+                Default: 
+                <EuiCode>
+                  5
+                </EuiCode>
+              </UNDEFINED>
             </EuiText>
           </UNDEFINED>
         </UNDEFINED>
@@ -1956,10 +1978,12 @@ exports[`Field for select setting should render user value if there is user valu
               grow={true}
               size="xs"
             >
-              Default: 
-              <EuiCode>
-                orange
-              </EuiCode>
+              <UNDEFINED>
+                Default: 
+                <EuiCode>
+                  orange
+                </EuiCode>
+              </UNDEFINED>
             </EuiText>
           </UNDEFINED>
         </UNDEFINED>
@@ -2241,10 +2265,12 @@ exports[`Field for string setting should render user value if there is user valu
               grow={true}
               size="xs"
             >
-              Default: 
-              <EuiCode>
-                null
-              </EuiCode>
+              <UNDEFINED>
+                Default: 
+                <EuiCode>
+                  null
+                </EuiCode>
+              </UNDEFINED>
             </EuiText>
           </UNDEFINED>
         </UNDEFINED>
diff --git a/src/core_plugins/kibana/public/management/sections/settings/components/field/field.js b/src/core_plugins/kibana/public/management/sections/settings/components/field/field.js
index 7336a4fa0d509d..ca55ba8ed825b7 100644
--- a/src/core_plugins/kibana/public/management/sections/settings/components/field/field.js
+++ b/src/core_plugins/kibana/public/management/sections/settings/components/field/field.js
@@ -28,6 +28,7 @@ import {
   EuiButton,
   EuiButtonEmpty,
   EuiCode,
+  EuiCodeBlock,
   EuiCodeEditor,
   EuiDescribedFormGroup,
   EuiFieldNumber,
@@ -475,7 +476,22 @@ export class Field extends PureComponent {
       <Fragment>
         <EuiSpacer size="s" />
         <EuiText size="xs">
-          Default: <EuiCode>{this.getDisplayedDefaultValue(type, defVal)}</EuiCode>
+          { type === 'json' ? (
+            <Fragment>
+              Default:
+              <EuiCodeBlock
+                language="js"
+                paddingSize="s"
+                overflowHeight={defVal.length >= 500 ? 300 : null}
+              >
+                {this.getDisplayedDefaultValue(type, defVal)}
+              </EuiCodeBlock>
+            </Fragment>
+          ) : (
+            <Fragment>
+              Default: <EuiCode>{this.getDisplayedDefaultValue(type, defVal)}</EuiCode>
+            </Fragment>
+          ) }
         </EuiText>
       </Fragment>
     );

From 3c0322999ab0e4147d0e4f064e71fe29d5d093fd Mon Sep 17 00:00:00 2001
From: Jen Huang <its.jenetic@gmail.com>
Date: Fri, 13 Jul 2018 09:22:12 -0700
Subject: [PATCH 2/2] Change language to json

---
 .../components/field/__snapshots__/field.test.js.snap         | 4 ++--
 .../management/sections/settings/components/field/field.js    | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/core_plugins/kibana/public/management/sections/settings/components/field/__snapshots__/field.test.js.snap b/src/core_plugins/kibana/public/management/sections/settings/components/field/__snapshots__/field.test.js.snap
index d74ec3d99a0ca9..7f3a8dd7f82420 100644
--- a/src/core_plugins/kibana/public/management/sections/settings/components/field/__snapshots__/field.test.js.snap
+++ b/src/core_plugins/kibana/public/management/sections/settings/components/field/__snapshots__/field.test.js.snap
@@ -945,7 +945,7 @@ exports[`Field for json setting should render default value if there is no user
               <UNDEFINED>
                 Default:
                 <EuiCodeBlock
-                  language="js"
+                  language="json"
                   overflowHeight={null}
                   paddingSize="s"
                 >
@@ -1073,7 +1073,7 @@ exports[`Field for json setting should render user value if there is user value
               <UNDEFINED>
                 Default:
                 <EuiCodeBlock
-                  language="js"
+                  language="json"
                   overflowHeight={null}
                   paddingSize="s"
                 >
diff --git a/src/core_plugins/kibana/public/management/sections/settings/components/field/field.js b/src/core_plugins/kibana/public/management/sections/settings/components/field/field.js
index ca55ba8ed825b7..44ed2ff9ef7ac9 100644
--- a/src/core_plugins/kibana/public/management/sections/settings/components/field/field.js
+++ b/src/core_plugins/kibana/public/management/sections/settings/components/field/field.js
@@ -480,7 +480,7 @@ export class Field extends PureComponent {
             <Fragment>
               Default:
               <EuiCodeBlock
-                language="js"
+                language="json"
                 paddingSize="s"
                 overflowHeight={defVal.length >= 500 ? 300 : null}
               >