replaced all editor heights with a clearer indication of the source o…

…f common heights
jloleysens · Aug 25, 2020 · a30dfc8 · a30dfc8
1 parent 91d5f8b
commit a30dfc8
Show file tree

Hide file tree

Showing 9 changed files with 25 additions and 16 deletions.
diff --git a/...tor/components/manage_processor_form/processors/common_fields/common_processor_fields.tsx b/...tor/components/manage_processor_form/processors/common_fields/common_processor_fields.tsx
@@ -16,7 +16,7 @@ import {
 } from '../../../../../../../shared_imports';
 
 import { TextEditor } from '../../field_components';
-import { to, from } from '../shared';
+import { to, from, EDITOR_PX_HEIGHT } from '../shared';
 
 const ignoreFailureConfig: FieldConfig = {
   defaultValue: false,
@@ -64,7 +64,7 @@ export const CommonProcessorFields: FunctionComponent = () => {
         componentProps={{
           editorProps: {
             languageId: 'painless',
-            height: 75,
+            height: EDITOR_PX_HEIGHT.extraSmall,
             options: {
               lineNumbers: 'off',
               minimap: { enabled: false },

diff --git a/...ponents/pipeline_processors_editor/components/manage_processor_form/processors/custom.tsx b/...ponents/pipeline_processors_editor/components/manage_processor_form/processors/custom.tsx
@@ -17,6 +17,7 @@ import {
 const { emptyField, isJsonField } = fieldValidators;
 
 import { XJsonEditor } from '../field_components';
+import { EDITOR_PX_HEIGHT } from './shared';
 
 const customConfig: FieldConfig = {
   type: FIELD_TYPES.TEXT,
@@ -78,7 +79,7 @@ export const Custom: FunctionComponent<Props> = ({ defaultOptions }) => {
       componentProps={{
         editorProps: {
           'data-test-subj': 'processorOptionsEditor',
-          height: 300,
+          height: EDITOR_PX_HEIGHT.large,
           'aria-label': i18n.translate(
             'xpack.ingestPipelines.pipelineEditor.customForm.optionsFieldAriaLabel',
             {

diff --git a/...onents/pipeline_processors_editor/components/manage_processor_form/processors/dissect.tsx b/...onents/pipeline_processors_editor/components/manage_processor_form/processors/dissect.tsx
@@ -20,6 +20,7 @@ import {
 
 import { FieldNameField } from './common_fields/field_name_field';
 import { IgnoreMissingField } from './common_fields/ignore_missing_field';
+import { EDITOR_PX_HEIGHT } from './shared';
 
 const { emptyField } = fieldValidators;
 
@@ -80,7 +81,7 @@ export const Dissect: FunctionComponent = () => {
         component={TextEditor}
         componentProps={{
           editorProps: {
-            height: 75,
+            height: EDITOR_PX_HEIGHT.extraSmall,
             options: { minimap: { enabled: false } },
           },
         }}

diff --git a/...onents/pipeline_processors_editor/components/manage_processor_form/processors/foreach.tsx b/...onents/pipeline_processors_editor/components/manage_processor_form/processors/foreach.tsx
@@ -12,7 +12,7 @@ import { FIELD_TYPES, fieldValidators, UseField } from '../../../../../../shared
 import { XJsonEditor } from '../field_components';
 
 import { FieldNameField } from './common_fields/field_name_field';
-import { FieldsConfig, to } from './shared';
+import { FieldsConfig, to, EDITOR_PX_HEIGHT } from './shared';
 
 const { emptyField, isJsonField } = fieldValidators;
 
@@ -67,7 +67,7 @@ export const Foreach: FunctionComponent = () => {
         component={XJsonEditor}
         componentProps={{
           editorProps: {
-            height: 200,
+            height: EDITOR_PX_HEIGHT.medium,
             'aria-label': i18n.translate(
               'xpack.ingestPipelines.pipelineEditor.foreachForm.optionsFieldAriaLabel',
               {

diff --git a/...omponents/pipeline_processors_editor/components/manage_processor_form/processors/grok.tsx b/...omponents/pipeline_processors_editor/components/manage_processor_form/processors/grok.tsx
@@ -19,7 +19,7 @@ import { XJsonEditor } from '../field_components';
 
 import { FieldNameField } from './common_fields/field_name_field';
 import { IgnoreMissingField } from './common_fields/ignore_missing_field';
-import { FieldsConfig, to, from } from './shared';
+import { FieldsConfig, to, from, EDITOR_PX_HEIGHT } from './shared';
 
 const { emptyField, isJsonField } = fieldValidators;
 
@@ -110,7 +110,7 @@ export const Grok: FunctionComponent = () => {
         config={fieldsConfig.pattern_definitions}
         componentProps={{
           editorProps: {
-            height: 200,
+            height: EDITOR_PX_HEIGHT.medium,
             'aria-label': i18n.translate(
               'xpack.ingestPipelines.pipelineEditor.grokForm.patternDefinitionsAriaLabel',
               {

diff --git a/...omponents/pipeline_processors_editor/components/manage_processor_form/processors/gsub.tsx b/...omponents/pipeline_processors_editor/components/manage_processor_form/processors/gsub.tsx
@@ -13,7 +13,7 @@ import { FIELD_TYPES, fieldValidators, UseField, Field } from '../../../../../..
 
 import { TextEditor } from '../field_components';
 
-import { FieldsConfig } from './shared';
+import { EDITOR_PX_HEIGHT, FieldsConfig } from './shared';
 import { FieldNameField } from './common_fields/field_name_field';
 import { IgnoreMissingField } from './common_fields/ignore_missing_field';
 import { TargetField } from './common_fields/target_field';
@@ -78,7 +78,7 @@ export const Gsub: FunctionComponent = () => {
         component={TextEditor}
         componentProps={{
           editorProps: {
-            height: 75,
+            height: EDITOR_PX_HEIGHT.extraSmall,
             options: { minimap: { enabled: false } },
           },
         }}

diff --git a/...ents/pipeline_processors_editor/components/manage_processor_form/processors/inference.tsx b/...ents/pipeline_processors_editor/components/manage_processor_form/processors/inference.tsx
@@ -21,7 +21,7 @@ import { XJsonEditor } from '../field_components';
 
 import { TargetField } from './common_fields/target_field';
 
-import { FieldsConfig, to, from } from './shared';
+import { FieldsConfig, to, from, EDITOR_PX_HEIGHT } from './shared';
 
 const { emptyField, isJsonField } = fieldValidators;
 
@@ -177,7 +177,7 @@ export const Inference: FunctionComponent = () => {
         component={XJsonEditor}
         componentProps={{
           editorProps: {
-            height: 200,
+            height: EDITOR_PX_HEIGHT.medium,
             options: { minimap: { enabled: false } },
           },
         }}
@@ -192,7 +192,7 @@ export const Inference: FunctionComponent = () => {
         component={XJsonEditor}
         componentProps={{
           editorProps: {
-            height: 200,
+            height: EDITOR_PX_HEIGHT.medium,
             options: { minimap: { enabled: false } },
           },
         }}

diff --git a/...ponents/pipeline_processors_editor/components/manage_processor_form/processors/script.tsx b/...ponents/pipeline_processors_editor/components/manage_processor_form/processors/script.tsx
@@ -13,7 +13,7 @@ import { FIELD_TYPES, fieldValidators, UseField, Field } from '../../../../../..
 
 import { XJsonEditor, TextEditor } from '../field_components';
 
-import { FieldsConfig, to, from, FormFieldsComponent } from './shared';
+import { FieldsConfig, to, from, FormFieldsComponent, EDITOR_PX_HEIGHT } from './shared';
 
 const { isJsonField, emptyField } = fieldValidators;
 
@@ -147,7 +147,7 @@ export const Script: FormFieldsComponent = ({ initialFieldValues }) => {
             component={TextEditor}
             componentProps={{
               editorProps: {
-                height: 100,
+                height: EDITOR_PX_HEIGHT.medium,
                 'aria-label': i18n.translate(
                   'xpack.ingestPipelines.pipelineEditor.scriptForm.sourceFieldAriaLabel',
                   {
@@ -169,7 +169,7 @@ export const Script: FormFieldsComponent = ({ initialFieldValues }) => {
         component={XJsonEditor}
         componentProps={{
           editorProps: {
-            height: 150,
+            height: EDITOR_PX_HEIGHT.medium,
             'aria-label': i18n.translate(
               'xpack.ingestPipelines.pipelineEditor.scriptForm.paramsFieldAriaLabel',
               {

diff --git a/...mponents/pipeline_processors_editor/components/manage_processor_form/processors/shared.ts b/...mponents/pipeline_processors_editor/components/manage_processor_form/processors/shared.ts
@@ -67,6 +67,13 @@ export const from = {
   undefinedIfValue: (value: any) => (v: boolean) => (v === value ? undefined : v),
 };
 
+export const EDITOR_PX_HEIGHT = {
+  extraSmall: 75,
+  small: 100,
+  medium: 200,
+  large: 300,
+};
+
 export type FieldsConfig = Record<string, FieldConfig>;
 
 export type FormFieldsComponent = FunctionComponent<{ initialFieldValues?: Record<string, any> }>;