diff --git a/src/plugins/es_ui_shared/static/forms/hook_form_lib/components/use_array.ts b/src/plugins/es_ui_shared/static/forms/hook_form_lib/components/use_array.ts index 1152290f7d553c..0a6f2cc2c2b181 100644 --- a/src/plugins/es_ui_shared/static/forms/hook_form_lib/components/use_array.ts +++ b/src/plugins/es_ui_shared/static/forms/hook_form_lib/components/use_array.ts @@ -62,7 +62,7 @@ export const UseArray = ({ const uniqueId = useRef(0); const form = useFormContext(); - const { __getFieldDefaultValue } = form; + const { getFieldDefaultValue } = form; const getNewItemAtIndex = useCallback( (index: number): ArrayItem => ({ @@ -75,7 +75,7 @@ export const UseArray = ({ const fieldDefaultValue = useMemo(() => { const defaultValues = readDefaultValueOnForm - ? (__getFieldDefaultValue(path) as any[]) + ? (getFieldDefaultValue(path) as any[]) : undefined; const getInitialItemsFromValues = (values: any[]): ArrayItem[] => @@ -88,13 +88,7 @@ export const UseArray = ({ return defaultValues ? getInitialItemsFromValues(defaultValues) : new Array(initialNumberOfItems).fill('').map((_, i) => getNewItemAtIndex(i)); - }, [ - path, - initialNumberOfItems, - readDefaultValueOnForm, - __getFieldDefaultValue, - getNewItemAtIndex, - ]); + }, [path, initialNumberOfItems, readDefaultValueOnForm, getFieldDefaultValue, getNewItemAtIndex]); // Create a new hook field with the "isIncludedInOutput" set to false so we don't use its value to build the final form data. // Apart from that the field behaves like a normal field and is hooked into the form validation lifecycle. diff --git a/src/plugins/es_ui_shared/static/forms/hook_form_lib/components/use_field.tsx b/src/plugins/es_ui_shared/static/forms/hook_form_lib/components/use_field.tsx index 3a5fbaba8f3b88..45fa2e977a6c7f 100644 --- a/src/plugins/es_ui_shared/static/forms/hook_form_lib/components/use_field.tsx +++ b/src/plugins/es_ui_shared/static/forms/hook_form_lib/components/use_field.tsx @@ -59,8 +59,7 @@ function UseFieldComp(props: Props( [getFormData$, updateFormData$, fieldsToArray] ); - const getFieldDefaultValue: FormHook['__getFieldDefaultValue'] = useCallback( - (fieldName) => get(defaultValueDeserialized.current, fieldName), - [] - ); - const readFieldConfigFromSchema: FormHook['__readFieldConfigFromSchema'] = useCallback( (fieldName) => { const config = (get(schema ?? {}, fieldName) as FieldConfig) || {}; @@ -339,6 +334,11 @@ export function useForm( const getFields: FormHook['getFields'] = useCallback(() => fieldsRefs.current, []); + const getFieldDefaultValue: FormHook['getFieldDefaultValue'] = useCallback( + (fieldName) => get(defaultValueDeserialized.current, fieldName), + [] + ); + const submit: FormHook['submit'] = useCallback( async (e) => { if (e) { @@ -431,6 +431,7 @@ export function useForm( setFieldValue, setFieldErrors, getFields, + getFieldDefaultValue, getFormData, getErrors, reset, @@ -439,7 +440,6 @@ export function useForm( __updateFormDataAt: updateFormDataAt, __updateDefaultValueAt: updateDefaultValueAt, __readFieldConfigFromSchema: readFieldConfigFromSchema, - __getFieldDefaultValue: getFieldDefaultValue, __addField: addField, __removeField: removeField, __validateFields: validateFields, diff --git a/src/plugins/es_ui_shared/static/forms/hook_form_lib/types.ts b/src/plugins/es_ui_shared/static/forms/hook_form_lib/types.ts index 61b3bd63fb2233..4e9ff29f0cdd36 100644 --- a/src/plugins/es_ui_shared/static/forms/hook_form_lib/types.ts +++ b/src/plugins/es_ui_shared/static/forms/hook_form_lib/types.ts @@ -36,6 +36,8 @@ export interface FormHook setFieldErrors: (fieldName: string, errors: ValidationError[]) => void; /** Access the fields on the form. */ getFields: () => FieldsMap; + /** Access the defaultValue for a specific field */ + getFieldDefaultValue: (path: string) => unknown; /** * Return the form data. It accepts an optional options object with an `unflatten` parameter (defaults to `true`). * If you are only interested in the raw form data, pass `unflatten: false` to the handler @@ -60,7 +62,6 @@ export interface FormHook __updateFormDataAt: (field: string, value: unknown) => void; __updateDefaultValueAt: (field: string, value: unknown) => void; __readFieldConfigFromSchema: (field: string) => FieldConfig; - __getFieldDefaultValue: (path: string) => unknown; } export type FormSchema = { diff --git a/x-pack/plugins/cases/public/components/__mock__/form.ts b/x-pack/plugins/cases/public/components/__mock__/form.ts index 6d3e8353e630ae..aa40ea0421b4c3 100644 --- a/x-pack/plugins/cases/public/components/__mock__/form.ts +++ b/x-pack/plugins/cases/public/components/__mock__/form.ts @@ -23,6 +23,7 @@ export const mockFormHook = { setFieldErrors: jest.fn(), getFields: jest.fn(), getFormData: jest.fn(), + getFieldDefaultValue: jest.fn(), /* Returns a list of all errors in the form */ getErrors: jest.fn(), reset: jest.fn(), @@ -33,7 +34,6 @@ export const mockFormHook = { __validateFields: jest.fn(), __updateFormDataAt: jest.fn(), __readFieldConfigFromSchema: jest.fn(), - __getFieldDefaultValue: jest.fn(), }; export const getFormMock = (sampleData: any) => ({ diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_editor/__jest__/processors/network_direction.test.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_editor/__jest__/processors/network_direction.test.tsx new file mode 100644 index 00000000000000..7a4c55d6f5e027 --- /dev/null +++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_editor/__jest__/processors/network_direction.test.tsx @@ -0,0 +1,180 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License + * 2.0; you may not use this file except in compliance with the Elastic License + * 2.0. + */ + +import { act } from 'react-dom/test-utils'; +import { setup, SetupResult, getProcessorValue } from './processor.helpers'; + +// Default parameter values automatically added to the network direction processor when saved +const defaultNetworkDirectionParameters = { + if: undefined, + tag: undefined, + source_ip: undefined, + description: undefined, + target_field: undefined, + ignore_missing: undefined, + ignore_failure: undefined, + destination_ip: undefined, + internal_networks: undefined, + internal_networks_field: undefined, +}; + +const NETWORK_DIRECTION_TYPE = 'network_direction'; + +describe('Processor: Network Direction', () => { + let onUpdate: jest.Mock; + let testBed: SetupResult; + + beforeAll(() => { + jest.useFakeTimers(); + }); + + afterAll(() => { + jest.useRealTimers(); + }); + + beforeEach(async () => { + onUpdate = jest.fn(); + + await act(async () => { + testBed = await setup({ + value: { + processors: [], + }, + onFlyoutOpen: jest.fn(), + onUpdate, + }); + }); + + testBed.component.update(); + + // Open flyout to add new processor + testBed.actions.addProcessor(); + // Add type (the other fields are not visible until a type is selected) + await testBed.actions.addProcessorType(NETWORK_DIRECTION_TYPE); + }); + + test('prevents form submission if internal_network field is not provided', async () => { + const { + actions: { saveNewProcessor }, + form, + } = testBed; + + // Click submit button with only the type defined + await saveNewProcessor(); + + // Expect form error as "field" is required parameter + expect(form.getErrorsMessages()).toEqual(['A field value is required.']); + }); + + test('saves with default parameter values', async () => { + const { + actions: { saveNewProcessor }, + find, + component, + } = testBed; + + // Add "networkDirectionField" value (required) + await act(async () => { + find('networkDirectionField.input').simulate('change', [{ label: 'loopback' }]); + }); + component.update(); + + // Save the field + await saveNewProcessor(); + + const processors = getProcessorValue(onUpdate, NETWORK_DIRECTION_TYPE); + expect(processors[0][NETWORK_DIRECTION_TYPE]).toEqual({ + ...defaultNetworkDirectionParameters, + internal_networks: ['loopback'], + }); + }); + + test('allows to set internal_networks_field', async () => { + const { + actions: { saveNewProcessor }, + form, + find, + } = testBed; + + find('toggleCustomField').simulate('click'); + + form.setInputValue('networkDirectionField.input', 'internal_networks_field'); + + // Save the field with new changes + await saveNewProcessor(); + + const processors = getProcessorValue(onUpdate, NETWORK_DIRECTION_TYPE); + expect(processors[0][NETWORK_DIRECTION_TYPE]).toEqual({ + ...defaultNetworkDirectionParameters, + internal_networks_field: 'internal_networks_field', + }); + }); + + test('allows to set just internal_networks_field or internal_networks', async () => { + const { + actions: { saveNewProcessor }, + form, + find, + component, + } = testBed; + + // Set internal_networks field + await act(async () => { + find('networkDirectionField.input').simulate('change', [{ label: 'loopback' }]); + }); + component.update(); + + // Toggle to internal_networks_field and set a random value + find('toggleCustomField').simulate('click'); + form.setInputValue('networkDirectionField.input', 'internal_networks_field'); + + // Save the field with new changes + await saveNewProcessor(); + + const processors = getProcessorValue(onUpdate, NETWORK_DIRECTION_TYPE); + expect(processors[0][NETWORK_DIRECTION_TYPE]).toEqual({ + ...defaultNetworkDirectionParameters, + internal_networks_field: 'internal_networks_field', + }); + }); + + test('allows optional parameters to be set', async () => { + const { + actions: { saveNewProcessor }, + form, + find, + component, + } = testBed; + + // Add "networkDirectionField" value (required) + await act(async () => { + find('networkDirectionField.input').simulate('change', [{ label: 'loopback' }]); + }); + component.update(); + + // Set optional parameteres + form.toggleEuiSwitch('ignoreMissingSwitch.input'); + form.toggleEuiSwitch('ignoreFailureSwitch.input'); + form.setInputValue('sourceIpField.input', 'source.ip'); + form.setInputValue('targetField.input', 'target_field'); + form.setInputValue('destinationIpField.input', 'destination.ip'); + + // Save the field with new changes + await saveNewProcessor(); + + const processors = getProcessorValue(onUpdate, NETWORK_DIRECTION_TYPE); + expect(processors[0][NETWORK_DIRECTION_TYPE]).toEqual({ + ...defaultNetworkDirectionParameters, + ignore_failure: true, + ignore_missing: false, + source_ip: 'source.ip', + target_field: 'target_field', + destination_ip: 'destination.ip', + internal_networks: ['loopback'], + }); + }); +}); diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_editor/__jest__/processors/processor.helpers.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_editor/__jest__/processors/processor.helpers.tsx index 24e1ddce008ea6..e4024e4ec67f46 100644 --- a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_editor/__jest__/processors/processor.helpers.tsx +++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_editor/__jest__/processors/processor.helpers.tsx @@ -171,6 +171,10 @@ type TestSubject = | 'regexFileField.input' | 'valueFieldInput' | 'mediaTypeSelectorField' + | 'networkDirectionField.input' + | 'sourceIpField.input' + | 'destinationIpField.input' + | 'toggleCustomField' | 'ignoreEmptyField.input' | 'overrideField.input' | 'fieldsValueField.input' diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_editor/components/processor_form/processors/index.ts b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_editor/components/processor_form/processors/index.ts index 5e3e5f82478bd6..f5eb1ab3ec59be 100644 --- a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_editor/components/processor_form/processors/index.ts +++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_editor/components/processor_form/processors/index.ts @@ -28,6 +28,7 @@ export { Join } from './join'; export { Json } from './json'; export { Kv } from './kv'; export { Lowercase } from './lowercase'; +export { NetworkDirection } from './network_direction'; export { Pipeline } from './pipeline'; export { RegisteredDomain } from './registered_domain'; export { Remove } from './remove'; diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_editor/components/processor_form/processors/network_direction.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_editor/components/processor_form/processors/network_direction.tsx new file mode 100644 index 00000000000000..2026a77bc6566e --- /dev/null +++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_editor/components/processor_form/processors/network_direction.tsx @@ -0,0 +1,242 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License + * 2.0; you may not use this file except in compliance with the Elastic License + * 2.0. + */ + +import React, { FunctionComponent, useState, useCallback, useMemo } from 'react'; +import { i18n } from '@kbn/i18n'; +import { isEmpty } from 'lodash'; +import { FormattedMessage } from '@kbn/i18n/react'; +import { EuiButtonEmpty, EuiCode } from '@elastic/eui'; + +import { + FIELD_TYPES, + UseField, + useFormContext, + Field, + FieldHook, + FieldConfig, + SerializerFunc, +} from '../../../../../../shared_imports'; +import { FieldsConfig, from, to } from './shared'; +import { TargetField } from './common_fields/target_field'; +import { IgnoreMissingField } from './common_fields/ignore_missing_field'; + +interface InternalNetworkTypes { + internal_networks: string[]; + internal_networks_field: string; +} + +type InternalNetworkFields = { + [K in keyof InternalNetworkTypes]: FieldHook; +}; + +const internalNetworkValues: string[] = [ + 'loopback', + 'unicast', + 'global_unicast', + 'multicast', + 'interface_local_multicast', + 'link_local_unicast', + 'link_local_multicast', + 'link_local_multicast', + 'private', + 'public', + 'unspecified', +]; + +const fieldsConfig: FieldsConfig = { + /* Optional fields config */ + source_ip: { + type: FIELD_TYPES.TEXT, + serializer: from.emptyStringToUndefined, + label: i18n.translate('xpack.ingestPipelines.pipelineEditor.networkDirection.sourceIpLabel', { + defaultMessage: 'Source IP (optional)', + }), + helpText: ( + {'source.ip'}, + }} + /> + ), + }, + destination_ip: { + type: FIELD_TYPES.TEXT, + serializer: from.emptyStringToUndefined, + label: i18n.translate( + 'xpack.ingestPipelines.pipelineEditor.networkDirection.destinationIpLabel', + { + defaultMessage: 'Destination IP (optional)', + } + ), + helpText: ( + {'destination.ip'}, + }} + /> + ), + }, +}; + +const getInternalNetworkConfig: ( + toggleCustom: () => void +) => Record< + keyof InternalNetworkFields, + { + path: string; + config?: FieldConfig; + euiFieldProps?: Record; + labelAppend: JSX.Element; + } +> = (toggleCustom: () => void) => ({ + internal_networks: { + path: 'fields.internal_networks', + euiFieldProps: { + noSuggestions: false, + options: internalNetworkValues.map((label) => ({ label })), + }, + config: { + type: FIELD_TYPES.COMBO_BOX, + deserializer: to.arrayOfStrings, + serializer: from.optionalArrayOfStrings, + fieldsToValidateOnChange: ['fields.internal_networks', 'fields.internal_networks_field'], + validations: [ + { + validator: ({ value, path, formData }) => { + if (isEmpty(value) && isEmpty(formData['fields.internal_networks_field'])) { + return { path, message: 'A field value is required.' }; + } + }, + }, + ], + label: i18n.translate( + 'xpack.ingestPipelines.pipelineEditor.networkDirection.internalNetworksLabel', + { + defaultMessage: 'Internal networks', + } + ), + helpText: ( + + ), + }, + labelAppend: ( + + {i18n.translate('xpack.ingestPipelines.pipelineEditor.internalNetworkCustomLabel', { + defaultMessage: 'Use custom field', + })} + + ), + key: 'preset', + }, + internal_networks_field: { + path: 'fields.internal_networks_field', + config: { + type: FIELD_TYPES.TEXT, + serializer: from.emptyStringToUndefined, + fieldsToValidateOnChange: ['fields.internal_networks', 'fields.internal_networks_field'], + validations: [ + { + validator: ({ value, path, formData }) => { + if (isEmpty(value) && isEmpty(formData['fields.internal_networks'])) { + return { path, message: 'A field value is required.' }; + } + }, + }, + ], + label: i18n.translate( + 'xpack.ingestPipelines.pipelineEditor.networkDirection.internalNetworksFieldLabel', + { + defaultMessage: 'Internal networks field', + } + ), + helpText: ( + {'internal_networks'}, + }} + /> + ), + }, + labelAppend: ( + + {i18n.translate('xpack.ingestPipelines.pipelineEditor.internalNetworkPredefinedLabel', { + defaultMessage: 'Use preset field', + })} + + ), + key: 'custom', + }, +}); + +export const NetworkDirection: FunctionComponent = () => { + const { getFieldDefaultValue } = useFormContext(); + const isInternalNetowrksFieldDefined = + getFieldDefaultValue('fields.internal_networks_field') !== undefined; + const [isCustom, setIsCustom] = useState(isInternalNetowrksFieldDefined); + + const toggleCustom = useCallback(() => { + setIsCustom((prev) => !prev); + }, []); + + const internalNetworkFieldProps = useMemo( + () => + isCustom + ? getInternalNetworkConfig(toggleCustom).internal_networks_field + : getInternalNetworkConfig(toggleCustom).internal_networks, + [isCustom, toggleCustom] + ); + + return ( + <> + + + + + {'network.direction'}, + }} + /> + } + /> + + + + } + /> + + ); +}; diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_editor/components/shared/map_processor_type_to_form.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_editor/components/shared/map_processor_type_to_form.tsx index 983fb0ea67bb0f..e6ca465bf1a022 100644 --- a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_editor/components/shared/map_processor_type_to_form.tsx +++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_editor/components/shared/map_processor_type_to_form.tsx @@ -34,6 +34,7 @@ import { Json, Kv, Lowercase, + NetworkDirection, Pipeline, RegisteredDomain, Remove, @@ -517,6 +518,23 @@ export const mapProcessorTypeToDescriptor: MapProcessorTypeToDescriptor = { }, }), }, + network_direction: { + FieldsComponent: NetworkDirection, + docLinkPath: '/network-direction-processor.html', + label: i18n.translate('xpack.ingestPipelines.processors.label.networkDirection', { + defaultMessage: 'Network Direction', + }), + typeDescription: i18n.translate( + 'xpack.ingestPipelines.processors.description.networkDirection', + { + defaultMessage: 'Calculates the network direction given a source IP address.', + } + ), + getDefaultDescription: () => + i18n.translate('xpack.ingestPipelines.processors.defaultDescription.networkDirection', { + defaultMessage: 'Calculates the network direction given a source IP address.', + }), + }, pipeline: { FieldsComponent: Pipeline, docLinkPath: '/pipeline-processor.html', diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_editor/context/processors_context.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_editor/context/processors_context.tsx index 0c43297e811d3c..ddf996de7805c4 100644 --- a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_editor/context/processors_context.tsx +++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_editor/context/processors_context.tsx @@ -151,7 +151,13 @@ export const PipelineProcessorsContextProvider: FunctionComponent = ({ break; case 'managingProcessor': // These are the option names we get back from our UI - const knownOptionNames = Object.keys(processorTypeAndOptions.options); + const knownOptionNames = [ + ...Object.keys(processorTypeAndOptions.options), + // We manually add fields that we **don't** want to be treated as "unknownOptions" + 'internal_networks', + 'internal_networks_field', + ]; + // The processor that we are updating may have options configured the UI does not know about const unknownOptions = omit(mode.arg.processor.options, knownOptionNames); // In order to keep the options we don't get back from our UI, we merge the known and unknown options diff --git a/x-pack/plugins/ingest_pipelines/public/shared_imports.ts b/x-pack/plugins/ingest_pipelines/public/shared_imports.ts index 8ed57221a13956..29be11430bf646 100644 --- a/x-pack/plugins/ingest_pipelines/public/shared_imports.ts +++ b/x-pack/plugins/ingest_pipelines/public/shared_imports.ts @@ -43,6 +43,7 @@ export { ArrayItem, FormHook, useFormContext, + UseMultiFields, FormDataProvider, OnFormUpdateArg, FieldConfig, diff --git a/x-pack/plugins/security_solution/public/cases/components/__mock__/form.ts b/x-pack/plugins/security_solution/public/cases/components/__mock__/form.ts index 9ec356f70f9a41..3ba7aa616f1c11 100644 --- a/x-pack/plugins/security_solution/public/cases/components/__mock__/form.ts +++ b/x-pack/plugins/security_solution/public/cases/components/__mock__/form.ts @@ -25,6 +25,7 @@ export const mockFormHook = { setFieldErrors: jest.fn(), getFields: jest.fn(), getFormData: jest.fn(), + getFieldDefaultValue: jest.fn(), /* Returns a list of all errors in the form */ getErrors: jest.fn(), reset: jest.fn(), @@ -35,7 +36,6 @@ export const mockFormHook = { __validateFields: jest.fn(), __updateFormDataAt: jest.fn(), __readFieldConfigFromSchema: jest.fn(), - __getFieldDefaultValue: jest.fn(), }; // eslint-disable-next-line @typescript-eslint/no-explicit-any export const getFormMock = (sampleData: any) => ({