address review feedback

Author: alisonelizabeth

x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/common_fields/properties_field.tsx

@@ -7,6 +7,7 @@
 import React, { FunctionComponent } from 'react';
 import { i18n } from '@kbn/i18n';
 
+import { EuiComboBoxOptionOption } from '@elastic/eui';
 import { ComboBoxField, FIELD_TYPES, UseField } from '../../../../../../../shared_imports';
 
 import { FieldsConfig, to } from '../shared';
@@ -27,9 +28,10 @@ const fieldsConfig: FieldsConfig = {
 
 interface Props {
   helpText?: React.ReactNode;
+  propertyOptions?: EuiComboBoxOptionOption[];
 }
 
-export const PropertiesField: FunctionComponent<Props> = ({ helpText }) => {
+export const PropertiesField: FunctionComponent<Props> = ({ helpText, propertyOptions }) => {
   return (
     <UseField
       config={{
@@ -38,6 +40,12 @@ export const PropertiesField: FunctionComponent<Props> = ({ helpText }) => {
       }}
       component={ComboBoxField}
       path="fields.properties"
+      componentProps={{
+        euiFieldProps: {
+          options: propertyOptions || [],
+          noSuggestions: !propertyOptions,
+        },
+      }}
     />
   );
 };

x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/user_agent.tsx

@@ -7,6 +7,7 @@
 import React, { FunctionComponent } from 'react';
 import { i18n } from '@kbn/i18n';
 
+import { EuiComboBoxOptionOption } from '@elastic/eui';
 import { FIELD_TYPES, UseField, Field } from '../../../../../../shared_imports';
 
 import { FieldsConfig } from './shared';
@@ -15,7 +16,16 @@ import { FieldNameField } from './common_fields/field_name_field';
 import { TargetField } from './common_fields/target_field';
 import { PropertiesField } from './common_fields/properties_field';
 
+const propertyOptions: EuiComboBoxOptionOption[] = [
+  { label: 'name' },
+  { label: 'os' },
+  { label: 'device' },
+  { label: 'original' },
+  { label: 'version' },
+];
+
 const fieldsConfig: FieldsConfig = {
+  /* Optional fields config */
   regex_file: {
     type: FIELD_TYPES.TEXT,
     deserializer: String,
@@ -54,6 +64,7 @@ export const UserAgent: FunctionComponent = () => {
           'xpack.ingestPipelines.pipelineEditor.userAgentForm.propertiesFieldHelpText',
           { defaultMessage: 'Properties added to the target field.' }
         )}
+        propertyOptions={propertyOptions}
       />
 
       <IgnoreMissingField />