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> }>;