Clean up error state of Ingest Pipelines drag and drop list items.

elastic · Jul 27, 2022 · a8f8755 · a8f8755
1 parent cc634ed
commit a8f8755
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 28 deletions.
diff --git a/...s/pipeline_editor/components/processor_form/field_components/drag_and_drop_text_list.scss b/...s/pipeline_editor/components/processor_form/field_components/drag_and_drop_text_list.scss
@@ -12,10 +12,6 @@
     margin-left: $euiSizeS;
   }
 
-  &__errorIcon {
-    margin-left: -$euiSizeXL;
-  }
-
   &__item {
     background-color: $euiColorLightestShade;
     padding-top: $euiSizeS;
@@ -25,4 +21,4 @@
   &__labelContainer {
     margin-bottom: $euiSizeXS;
   }
-}
+}
diff --git a/...ts/pipeline_editor/components/processor_form/field_components/drag_and_drop_text_list.tsx b/...ts/pipeline_editor/components/processor_form/field_components/drag_and_drop_text_list.tsx
@@ -18,7 +18,6 @@ import {
   EuiFlexItem,
   EuiIcon,
   EuiFieldText,
-  EuiIconTip,
   EuiFormRow,
   EuiText,
 } from '@elastic/eui';
@@ -162,31 +161,22 @@ function DragAndDropTextListComponent({
                                 return (
                                   <EuiFlexGroup gutterSize="none" alignItems="center">
                                     <EuiFlexItem>
-                                      <EuiFieldText
-                                        data-test-subj={`input-${idx}`}
-                                        id={idx === 0 ? firstItemId : undefined}
+                                      <EuiFormRow
                                         isInvalid={isInvalid}
-                                        value={field.value}
-                                        onChange={field.onChange}
-                                        compressed
+                                        error={errorMessage}
                                         fullWidth
-                                      />
+                                      >
+                                        <EuiFieldText
+                                          data-test-subj={`input-${idx}`}
+                                          id={idx === 0 ? firstItemId : undefined}
+                                          isInvalid={isInvalid}
+                                          value={field.value}
+                                          onChange={field.onChange}
+                                          compressed
+                                          fullWidth
+                                        />
+                                      </EuiFormRow>
                                     </EuiFlexItem>
-                                    {typeof errorMessage === 'string' && (
-                                      <EuiFlexItem grow={false}>
-                                        <div
-                                          className="pipelineProcessorsEditor__form__dragAndDropList__errorIcon"
-                                          data-test-subj="errorIcon"
-                                        >
-                                          <EuiIconTip
-                                            aria-label={errorMessage}
-                                            content={errorMessage}
-                                            type="alert"
-                                            color="danger"
-                                          />
-                                        </div>
-                                      </EuiFlexItem>
-                                    )}
                                   </EuiFlexGroup>
                                 );
                               }}