import React , { useContext , useMemo } from 'react' ; import { EuiFormRow , EuiIcon , EuiSelect , EuiToolTip } from '@elastic/eui' ; import { FormattedMessage } from '@kbn/i18n-react' ; import useUpdateEffect from 'react-use/lib/useUpdateEffect' ; import { CreateTransformWizardContext } from '../../../../wizard/wizard' ; import { commonFilterAggs , filterAggsFieldSupport } from '../constants' ; import { IndexPattern } from '../../../../../../../../../../../../src/plugins/data/public' ; import { getFilterAggTypeConfig } from '../config' ; import type { FilterAggType , PivotAggsConfigFilter } from '../types' ; import type { RuntimeMappings } from '../../types' ; import { getKibanaFieldTypeFromEsType } from '../../get_pivot_dropdown_options' ; import { isPopulatedObject } from '../../../../../../../../../common/shared_imports' ; /**
 * Resolves supported filters for provided field.
 */ export function getSupportedFilterAggs ( fieldName , indexPattern , runtimeMappings ? ) { const indexPatternField = indexPattern . fields . getByName ( fieldName ) ; if ( indexPatternField !== undefined ) { return [ ... commonFilterAggs , ... filterAggsFieldSupport [ indexPatternField . type ] ] ; } if ( isPopulatedObject ( runtimeMappings ) && runtimeMappings . hasOwnProperty ( fieldName ) ) { const runtimeField = runtimeMappings [ fieldName ] ; return [ ... commonFilterAggs , ... filterAggsFieldSupport [ getKibanaFieldTypeFromEsType ( runtimeField . type ) ] , ] ; } throw new Error ( `The field ${ fieldName } does not exist in the index or runtime fields` ) ; } /**
 * Component for filter aggregation related controls.
 *
 * Responsible for the filter agg type selection and rendering of
 * the corresponded field set.
 */ export const FilterAggForm = ( { aggConfig , onChange , selectedField , } ) => { const { indexPattern , runtimeMappings } = useContext ( CreateTransformWizardContext ) ; const filterAggsOptions = useMemo ( ( ) => getSupportedFilterAggs ( selectedField , indexPattern ! , runtimeMappings ) , [ indexPattern , selectedField , runtimeMappings ] ) ; useUpdateEffect ( ( ) => { onChange ( { } ) ; } , [ selectedField ] ) ; const filterAggTypeConfig = aggConfig ?. aggTypeConfig ; const filterAgg = aggConfig ?. filterAgg ?? '' ; return ( < > < EuiFormRow label = { < > < FormattedMessage id = "xpack.transform.agg.popoverForm.filerAggLabel" defaultMessage = "Filter query" / > < EuiToolTip content = { < FormattedMessage id = "xpack.transform.agg.popoverForm.filerQueryAdvancedSuggestionTooltip" defaultMessage = "To add other filter query aggregations, edit the JSON config." / > } > < EuiIcon size = "s" color = "subdued" type = "questionInCircle" className = "eui-alignTop" / > < /EuiToolTip> < />}> < EuiSelect options = { [ { text : '' , value : '' } ] . concat ( filterAggsOptions . map ( ( v ) => ( { text : v , value : v } ) ) ) } value = { filterAgg } onChange = { ( e ) => { const filterAggUpdate = e . target . value as FilterAggType ; onChange ( { filterAgg : filterAggUpdate , aggTypeConfig : getFilterAggTypeConfig ( filterAggUpdate ) , } ) ; } } data - test - subj = "transformFilterAggTypeSelector" / > < /EuiFormRow> { filterAgg !== '' && filterAggTypeConfig ?. FilterAggFormComponent && ( < filterAggTypeConfig . FilterAggFormComponent config = { filterAggTypeConfig ?. filterAggConfig } onChange = { ( update ) => { onChange ( { ... aggConfig , aggTypeConfig : { ... filterAggTypeConfig , filterAggConfig : update . config , } , } ) ; } } selectedField = { selectedField } / > ) } < />); } ;