diff --git a/packages/kbn-search-connectors/types/native_connectors.ts b/packages/kbn-search-connectors/types/native_connectors.ts index 0e767b4bdd345..1c4b0bb7e1694 100644 --- a/packages/kbn-search-connectors/types/native_connectors.ts +++ b/packages/kbn-search-connectors/types/native_connectors.ts @@ -50,6 +50,22 @@ const MAX_CONCURRENT_DOWNLOADS_LABEL = i18n.translate( } ); +const USE_TEXT_EXTRACTION_SERVICE_LABEL = i18n.translate( + 'searchConnectors.nativeConnectors.textExtractionService.label', + { + defaultMessage: 'Use text extraction service', + } +); + +const USE_TEXT_EXTRACTION_SERVICE_TOOLTIP = i18n.translate( + 'searchConnectors.nativeConnectors.textExtractionService.tooltip', + { + defaultMessage: + 'Requires a separate deployment of the Elastic Data Extraction Service. ' + + 'Also requires that pipeline settings disable text extraction.', + } +); + const DATABASE_LABEL = i18n.translate('searchConnectors.nativeConnectors.databaseLabel', { defaultMessage: 'Database', }); @@ -157,6 +173,21 @@ export const NATIVE_CONNECTOR_DEFINITIONS: Record { diff --git a/x-pack/plugins/observability/public/pages/slo_edit/components/custom_metric/custom_metric_type_form.tsx b/x-pack/plugins/observability/public/pages/slo_edit/components/custom_metric/custom_metric_type_form.tsx index c7fe7999f9be4..45870dcd68bd0 100644 --- a/x-pack/plugins/observability/public/pages/slo_edit/components/custom_metric/custom_metric_type_form.tsx +++ b/x-pack/plugins/observability/public/pages/slo_edit/components/custom_metric/custom_metric_type_form.tsx @@ -27,6 +27,8 @@ import { MetricIndicator } from './metric_indicator'; export { NEW_CUSTOM_METRIC } from './metric_indicator'; +const SUPPORTED_METRIC_FIELD_TYPES = ['number', 'histogram']; + export function CustomMetricIndicatorTypeForm() { const { watch } = useFormContext(); const index = watch('indicator.params.index'); @@ -34,6 +36,9 @@ export function CustomMetricIndicatorTypeForm() { useFetchIndexPatternFields(index); const timestampFields = indexFields.filter((field) => field.type === 'date'); const partitionByFields = indexFields.filter((field) => field.aggregatable); + const metricFields = indexFields.filter((field) => + SUPPORTED_METRIC_FIELD_TYPES.includes(field.type) + ); return ( <> @@ -115,7 +120,7 @@ export function CustomMetricIndicatorTypeForm() { @@ -136,7 +141,7 @@ export function CustomMetricIndicatorTypeForm() { diff --git a/x-pack/plugins/observability/public/pages/slo_edit/components/custom_metric/metric_indicator.tsx b/x-pack/plugins/observability/public/pages/slo_edit/components/custom_metric/metric_indicator.tsx index a333a353f97d9..0c1fbce49d64e 100644 --- a/x-pack/plugins/observability/public/pages/slo_edit/components/custom_metric/metric_indicator.tsx +++ b/x-pack/plugins/observability/public/pages/slo_edit/components/custom_metric/metric_indicator.tsx @@ -19,16 +19,16 @@ import { import { i18n } from '@kbn/i18n'; import { FormattedMessage } from '@kbn/i18n-react'; import { first, range, xor } from 'lodash'; -import React from 'react'; +import React, { useEffect, useState } from 'react'; import { Controller, useFieldArray, useFormContext } from 'react-hook-form'; import { Field } from '../../../../hooks/slo/use_fetch_index_pattern_fields'; -import { createOptionsFromFields } from '../../helpers/create_options'; +import { createOptionsFromFields, Option } from '../../helpers/create_options'; import { CreateSLOForm } from '../../types'; import { QueryBuilder } from '../common/query_builder'; interface MetricIndicatorProps { type: 'good' | 'total'; - indexFields: Field[]; + metricFields: Field[]; isLoadingIndex: boolean; } @@ -47,51 +47,52 @@ function createEquationFromMetric(names: string[]) { return names.join(' + '); } -const SUPPORTED_FIELD_TYPES = ['number', 'histogram']; +const metricLabel = i18n.translate( + 'xpack.observability.slo.sloEdit.sliType.customMetric.metricLabel', + { defaultMessage: 'Metric' } +); -export function MetricIndicator({ type, indexFields, isLoadingIndex }: MetricIndicatorProps) { - const metricLabel = i18n.translate( - 'xpack.observability.slo.sloEdit.sliType.customMetric.metricLabel', - { defaultMessage: 'Metric' } - ); +const filterLabel = i18n.translate( + 'xpack.observability.slo.sloEdit.sliType.customMetric.filterLabel', + { defaultMessage: 'Filter' } +); - const filterLabel = i18n.translate( - 'xpack.observability.slo.sloEdit.sliType.customMetric.filterLabel', - { defaultMessage: 'Filter' } - ); +const metricTooltip = ( + +); - const metricTooltip = ( - - ); +const equationLabel = i18n.translate( + 'xpack.observability.slo.sloEdit.sliType.customMetric.equationLabel', + { defaultMessage: 'Equation' } +); - const equationLabel = i18n.translate( - 'xpack.observability.slo.sloEdit.sliType.customMetric.equationLabel', - { defaultMessage: 'Equation' } - ); +const equationTooltip = ( + +); - const equationTooltip = ( - - ); +export function MetricIndicator({ type, metricFields, isLoadingIndex }: MetricIndicatorProps) { + const { control, watch, setValue, register, getFieldState } = useFormContext(); + const [options, setOptions] = useState(createOptionsFromFields(metricFields)); - const { control, watch, setValue, register } = useFormContext(); - const metricFields = indexFields.filter((field) => SUPPORTED_FIELD_TYPES.includes(field.type)); + useEffect(() => { + setOptions(createOptionsFromFields(metricFields)); + }, [metricFields]); const { fields, append, remove } = useFieldArray({ control, @@ -134,6 +135,7 @@ export function MetricIndicator({ type, indexFields, isLoadingIndex }: MetricInd {metricLabel} {metric.name} {metricTooltip} @@ -163,8 +165,9 @@ export function MetricIndicator({ type, indexFields, isLoadingIndex }: MetricInd 'xpack.observability.slo.sloEdit.sliType.customMetric.metricField.placeholder', { defaultMessage: 'Select a metric field' } )} + isClearable isInvalid={fieldState.invalid} - isDisabled={!indexPattern} + isDisabled={isLoadingIndex || !indexPattern} isLoading={!!indexPattern && isLoadingIndex} onChange={(selected: EuiComboBoxOptionOption[]) => { if (selected.length) { @@ -184,7 +187,14 @@ export function MetricIndicator({ type, indexFields, isLoadingIndex }: MetricInd ] : [] } - options={createOptionsFromFields(metricFields)} + onSearchChange={(searchValue: string) => { + setOptions( + createOptionsFromFields(metricFields, ({ value }) => + value.includes(searchValue) + ) + ); + }} + options={options} /> )} /> diff --git a/x-pack/plugins/observability/public/pages/slo_edit/components/histogram/histogram_indicator.tsx b/x-pack/plugins/observability/public/pages/slo_edit/components/histogram/histogram_indicator.tsx index 2b6f983470f82..1362674828d74 100644 --- a/x-pack/plugins/observability/public/pages/slo_edit/components/histogram/histogram_indicator.tsx +++ b/x-pack/plugins/observability/public/pages/slo_edit/components/histogram/histogram_indicator.tsx @@ -5,9 +5,6 @@ * 2.0. */ -import React, { Fragment } from 'react'; -import { Controller, useFormContext } from 'react-hook-form'; -import { i18n } from '@kbn/i18n'; import { EuiComboBox, EuiComboBoxOptionOption, @@ -18,14 +15,17 @@ import { EuiIconTip, EuiSpacer, } from '@elastic/eui'; +import { i18n } from '@kbn/i18n'; +import React, { Fragment, useEffect, useState } from 'react'; +import { Controller, useFormContext } from 'react-hook-form'; +import { Field } from '../../../../hooks/slo/use_fetch_index_pattern_fields'; +import { createOptionsFromFields, Option } from '../../helpers/create_options'; import { CreateSLOForm } from '../../types'; import { QueryBuilder } from '../common/query_builder'; -import { Field } from '../../../../hooks/slo/use_fetch_index_pattern_fields'; -import { createOptionsFromFields } from '../../helpers/create_options'; interface HistogramIndicatorProps { type: 'good' | 'total'; - indexFields: Field[]; + histogramFields: Field[]; isLoadingIndex: boolean; } @@ -46,61 +46,69 @@ const AGGREGATIONS = { const AGGREGATION_OPTIONS = Object.values(AGGREGATIONS); -export function HistogramIndicator({ type, indexFields, isLoadingIndex }: HistogramIndicatorProps) { - const { control, watch } = useFormContext(); +const aggregationTooltip = ( + +); - const histogramFields = indexFields.filter((field) => field.type === 'histogram'); - const indexPattern = watch('indicator.params.index'); - const aggregation = watch(`indicator.params.${type}.aggregation`); +const fromTooltip = ( + +); - const aggregationTooltip = ( - - ); +const toTooltip = ( + +); - const fromTooltip = ( - - ); +const aggregationLabel = i18n.translate( + 'xpack.observability.slo.sloEdit.sliType.histogram.aggregationLabel', + { defaultMessage: 'Aggregation' } +); - const toTooltip = ( - - ); +const metricLabel = i18n.translate( + 'xpack.observability.slo.sloEdit.sliType.histogram.metricLabel', + { defaultMessage: 'Field' } +); - const aggregationLabel = i18n.translate( - 'xpack.observability.slo.sloEdit.sliType.histogram.aggregationLabel', - { defaultMessage: 'Aggregation' } - ); +const toLabel = i18n.translate('xpack.observability.slo.sloEdit.sliType.histogram.toLabel', { + defaultMessage: 'To', +}); - const metricLabel = i18n.translate( - 'xpack.observability.slo.sloEdit.sliType.histogram.metricLabel', - { defaultMessage: 'Field' } - ); +const fromLabel = i18n.translate('xpack.observability.slo.sloEdit.sliType.histogram.fromLabel', { + defaultMessage: 'From', +}); + +export function HistogramIndicator({ + type, + histogramFields, + isLoadingIndex, +}: HistogramIndicatorProps) { + const { control, watch, getFieldState } = useFormContext(); + const [options, setOptions] = useState(createOptionsFromFields(histogramFields)); - const toLabel = i18n.translate('xpack.observability.slo.sloEdit.sliType.histogram.toLabel', { - defaultMessage: 'To', - }); + useEffect(() => { + setOptions(createOptionsFromFields(histogramFields)); + }, [histogramFields]); - const fromLabel = i18n.translate('xpack.observability.slo.sloEdit.sliType.histogram.fromLabel', { - defaultMessage: 'From', - }); + const indexPattern = watch('indicator.params.index'); + const aggregation = watch(`indicator.params.${type}.aggregation`); return ( @@ -149,7 +157,11 @@ export function HistogramIndicator({ type, indexFields, isLoadingIndex }: Histog - {metricLabel}}> + {metricLabel}} + > { if (selected.length) { @@ -190,7 +202,14 @@ export function HistogramIndicator({ type, indexFields, isLoadingIndex }: Histog ] : [] } - options={createOptionsFromFields(histogramFields)} + onSearchChange={(searchValue: string) => { + setOptions( + createOptionsFromFields(histogramFields, ({ value }) => + value.includes(searchValue) + ) + ); + }} + options={options} /> )} /> diff --git a/x-pack/plugins/observability/public/pages/slo_edit/components/histogram/histogram_indicator_type_form.tsx b/x-pack/plugins/observability/public/pages/slo_edit/components/histogram/histogram_indicator_type_form.tsx index dfbf305235b41..eb18e0a363628 100644 --- a/x-pack/plugins/observability/public/pages/slo_edit/components/histogram/histogram_indicator_type_form.tsx +++ b/x-pack/plugins/observability/public/pages/slo_edit/components/histogram/histogram_indicator_type_form.tsx @@ -31,6 +31,7 @@ export function HistogramIndicatorTypeForm() { const { isLoading: isIndexFieldsLoading, data: indexFields = [] } = useFetchIndexPatternFields(index); + const histogramFields = indexFields.filter((field) => field.type === 'histogram'); const timestampFields = indexFields.filter((field) => field.type === 'date'); const partitionByFields = indexFields.filter((field) => field.aggregatable); @@ -109,7 +110,7 @@ export function HistogramIndicatorTypeForm() { @@ -128,7 +129,7 @@ export function HistogramIndicatorTypeForm() {