diff --git a/x-pack/plugins/infra/common/formatters/snapshot_metric_formats.ts b/x-pack/plugins/infra/common/formatters/snapshot_metric_formats.ts index 8b4ae27cb3061..841528d3910b2 100644 --- a/x-pack/plugins/infra/common/formatters/snapshot_metric_formats.ts +++ b/x-pack/plugins/infra/common/formatters/snapshot_metric_formats.ts @@ -70,4 +70,8 @@ export const METRIC_FORMATTERS: MetricFormatters = { formatter: InfraFormatterType.number, template: '{{value}} seconds', }, + ['rdsLatency']: { + formatter: InfraFormatterType.number, + template: '{{value}} ms', + }, }; diff --git a/x-pack/plugins/infra/public/alerting/metric_threshold/components/expression.tsx b/x-pack/plugins/infra/public/alerting/metric_threshold/components/expression.tsx index 8fdba86f233d4..a176ba756652a 100644 --- a/x-pack/plugins/infra/public/alerting/metric_threshold/components/expression.tsx +++ b/x-pack/plugins/infra/public/alerting/metric_threshold/components/expression.tsx @@ -103,9 +103,13 @@ export const Expressions: React.FC = props => { const addExpression = useCallback(() => { const exp = alertParams.criteria?.slice() || []; - exp.push(defaultExpression); + exp.push({ + ...defaultExpression, + timeSize: timeSize ?? defaultExpression.timeSize, + timeUnit: timeUnit ?? defaultExpression.timeUnit, + }); setAlertParams('criteria', exp); - }, [setAlertParams, alertParams.criteria]); + }, [setAlertParams, alertParams.criteria, timeSize, timeUnit]); const removeExpression = useCallback( (id: number) => { diff --git a/x-pack/plugins/infra/public/components/alerting/inventory/expression.tsx b/x-pack/plugins/infra/public/components/alerting/inventory/expression.tsx index c2ee552e31553..97c0bb98962d4 100644 --- a/x-pack/plugins/infra/public/components/alerting/inventory/expression.tsx +++ b/x-pack/plugins/infra/public/components/alerting/inventory/expression.tsx @@ -110,10 +110,14 @@ export const Expressions: React.FC = props => { ); const addExpression = useCallback(() => { - const exp = alertParams.criteria.slice(); - exp.push(defaultExpression); + const exp = alertParams.criteria?.slice() || []; + exp.push({ + ...defaultExpression, + timeSize: timeSize ?? defaultExpression.timeSize, + timeUnit: timeUnit ?? defaultExpression.timeUnit, + }); setAlertParams('criteria', exp); - }, [setAlertParams, alertParams.criteria]); + }, [setAlertParams, alertParams.criteria, timeSize, timeUnit]); const removeExpression = useCallback( (id: number) => { @@ -185,6 +189,31 @@ export const Expressions: React.FC = props => { [onFilterChange] ); + const preFillAlertCriteria = useCallback(() => { + const md = alertsContext.metadata; + if (md && md.options) { + setAlertParams('criteria', [ + { + ...defaultExpression, + metric: md.options.metric!.type, + } as InventoryMetricConditions, + ]); + } else { + setAlertParams('criteria', [defaultExpression]); + } + }, [alertsContext.metadata, setAlertParams]); + + const preFillAlertFilter = useCallback(() => { + const md = alertsContext.metadata; + if (md && md.filter) { + setAlertParams('filterQueryText', md.filter); + setAlertParams( + 'filterQuery', + convertKueryToElasticSearchQuery(md.filter, derivedIndexPattern) || '' + ); + } + }, [alertsContext.metadata, derivedIndexPattern, setAlertParams]); + useEffect(() => { const md = alertsContext.metadata; if (!alertParams.nodeType) { @@ -195,31 +224,19 @@ export const Expressions: React.FC = props => { } } - if (!alertParams.criteria) { - if (md && md.options) { - setAlertParams('criteria', [ - { - ...defaultExpression, - metric: md.options.metric!.type, - } as InventoryMetricConditions, - ]); - } else { - setAlertParams('criteria', [defaultExpression]); - } + if (alertParams.criteria && alertParams.criteria.length) { + setTimeSize(alertParams.criteria[0].timeSize); + setTimeUnit(alertParams.criteria[0].timeUnit); + } else { + preFillAlertCriteria(); } if (!alertParams.filterQuery) { - if (md && md.filter) { - setAlertParams('filterQueryText', md.filter); - setAlertParams( - 'filterQuery', - convertKueryToElasticSearchQuery(md.filter, derivedIndexPattern) || '' - ); - } + preFillAlertFilter(); } if (!alertParams.sourceId) { - setAlertParams('sourceId', source?.id); + setAlertParams('sourceId', source?.id || 'default'); } }, [alertsContext.metadata, derivedIndexPattern, defaultExpression, source]); // eslint-disable-line react-hooks/exhaustive-deps @@ -235,11 +252,13 @@ export const Expressions: React.FC = props => { - + + + {alertParams.criteria && @@ -425,11 +444,13 @@ export const ExpressionRow: React.FC = props => { /> {metric && ( - -
-
{metricUnit[metric]?.label || ''}
-
-
+
+ {metricUnit[metric]?.label || ''} +
)} @@ -502,4 +523,5 @@ const metricUnit: Record = { s3UploadBytes: { label: 'bytes' }, s3DownloadBytes: { label: 'bytes' }, sqsOldestMessage: { label: 'seconds' }, + rdsLatency: { label: 'ms' }, }; diff --git a/x-pack/plugins/infra/public/components/alerting/inventory/metric.tsx b/x-pack/plugins/infra/public/components/alerting/inventory/metric.tsx index faafdf1b81eed..2c72c658ce093 100644 --- a/x-pack/plugins/infra/public/components/alerting/inventory/metric.tsx +++ b/x-pack/plugins/infra/public/components/alerting/inventory/metric.tsx @@ -24,7 +24,7 @@ interface Props { metric?: { value: SnapshotMetricType; text: string }; metrics: Array<{ value: string; text: string }>; errors: IErrorObject; - onChange: (metric: SnapshotMetricType) => void; + onChange: (metric?: SnapshotMetricType) => void; popupPosition?: | 'upCenter' | 'upLeft' @@ -65,11 +65,11 @@ export const MetricExpression = ({ metric, metrics, errors, onChange, popupPosit } )} value={metric?.text || firstFieldOption.text} - isActive={aggFieldPopoverOpen || !metric} + isActive={Boolean(aggFieldPopoverOpen || (errors.metric && errors.metric.length > 0))} onClick={() => { setAggFieldPopoverOpen(true); }} - color={metric ? 'secondary' : 'danger'} + color={errors.metric?.length ? 'danger' : 'secondary'} /> } isOpen={aggFieldPopoverOpen} @@ -89,16 +89,12 @@ export const MetricExpression = ({ metric, metrics, errors, onChange, popupPosit - 0 && metric !== undefined} - error={errors.metric} - > + 0} error={errors.metric}> 0 && metric !== undefined} + isInvalid={errors.metric.length > 0} placeholder={firstFieldOption.text} options={availablefieldsOptions} noSuggestions={!availablefieldsOptions.length} @@ -110,6 +106,8 @@ export const MetricExpression = ({ metric, metrics, errors, onChange, popupPosit if (selectedOptions.length > 0) { onChange(selectedOptions[0].value as SnapshotMetricType); setAggFieldPopoverOpen(false); + } else { + onChange(); } }} /> diff --git a/x-pack/plugins/infra/public/pages/metrics/inventory_view/lib/create_inventory_metric_formatter.ts b/x-pack/plugins/infra/public/pages/metrics/inventory_view/lib/create_inventory_metric_formatter.ts index f8c7a10f12831..479c292035ae5 100644 --- a/x-pack/plugins/infra/public/pages/metrics/inventory_view/lib/create_inventory_metric_formatter.ts +++ b/x-pack/plugins/infra/public/pages/metrics/inventory_view/lib/create_inventory_metric_formatter.ts @@ -71,6 +71,10 @@ const METRIC_FORMATTERS: MetricFormatters = { formatter: InfraFormatterType.number, template: '{{value}} seconds', }, + ['rdsLatency']: { + formatter: InfraFormatterType.number, + template: '{{value}} ms', + }, }; export const createInventoryMetricFormatter = (metric: SnapshotMetricInput) => ( diff --git a/x-pack/plugins/ingest_manager/public/applications/ingest_manager/sections/agent_config/create_datasource_page/index.tsx b/x-pack/plugins/ingest_manager/public/applications/ingest_manager/sections/agent_config/create_datasource_page/index.tsx index fd5c4238f3466..577f08cdc3313 100644 --- a/x-pack/plugins/ingest_manager/public/applications/ingest_manager/sections/agent_config/create_datasource_page/index.tsx +++ b/x-pack/plugins/ingest_manager/public/applications/ingest_manager/sections/agent_config/create_datasource_page/index.tsx @@ -3,7 +3,7 @@ * or more contributor license agreements. Licensed under the Elastic License; * you may not use this file except in compliance with the Elastic License. */ -import React, { useState, useEffect } from 'react'; +import React, { useState, useEffect, useMemo, useCallback } from 'react'; import { useRouteMatch, useHistory } from 'react-router-dom'; import { i18n } from '@kbn/i18n'; import { FormattedMessage } from '@kbn/i18n/react'; @@ -95,32 +95,46 @@ export const CreateDatasourcePage: React.FunctionComponent = () => { // Datasource validation state const [validationResults, setValidationResults] = useState(); + // Form state + const [formState, setFormState] = useState('INVALID'); + // Update package info method - const updatePackageInfo = (updatedPackageInfo: PackageInfo | undefined) => { - if (updatedPackageInfo) { - setPackageInfo(updatedPackageInfo); - setFormState('VALID'); - } else { - setFormState('INVALID'); - setPackageInfo(undefined); - } + const updatePackageInfo = useCallback( + (updatedPackageInfo: PackageInfo | undefined) => { + if (updatedPackageInfo) { + setPackageInfo(updatedPackageInfo); + if (agentConfig) { + setFormState('VALID'); + } + } else { + setFormState('INVALID'); + setPackageInfo(undefined); + } - // eslint-disable-next-line no-console - console.debug('Package info updated', updatedPackageInfo); - }; + // eslint-disable-next-line no-console + console.debug('Package info updated', updatedPackageInfo); + }, + [agentConfig, setPackageInfo, setFormState] + ); // Update agent config method - const updateAgentConfig = (updatedAgentConfig: AgentConfig | undefined) => { - if (updatedAgentConfig) { - setAgentConfig(updatedAgentConfig); - } else { - setFormState('INVALID'); - setAgentConfig(undefined); - } + const updateAgentConfig = useCallback( + (updatedAgentConfig: AgentConfig | undefined) => { + if (updatedAgentConfig) { + setAgentConfig(updatedAgentConfig); + if (packageInfo) { + setFormState('VALID'); + } + } else { + setFormState('INVALID'); + setAgentConfig(undefined); + } - // eslint-disable-next-line no-console - console.debug('Agent config updated', updatedAgentConfig); - }; + // eslint-disable-next-line no-console + console.debug('Agent config updated', updatedAgentConfig); + }, + [packageInfo, setAgentConfig, setFormState] + ); const hasErrors = validationResults ? validationHasErrors(validationResults) : false; @@ -163,7 +177,6 @@ export const CreateDatasourcePage: React.FunctionComponent = () => { : getHref('integration_details', { pkgkey }); // Save datasource - const [formState, setFormState] = useState('INVALID'); const saveDatasource = async () => { setFormState('LOADING'); const result = await sendCreateDatasource(datasource); @@ -215,33 +228,43 @@ export const CreateDatasourcePage: React.FunctionComponent = () => { packageInfo, }; + const stepSelectConfig = useMemo( + () => ( + + ), + [pkgkey, updatePackageInfo, agentConfig, updateAgentConfig] + ); + + const stepSelectPackage = useMemo( + () => ( + + ), + [configId, updateAgentConfig, packageInfo, updatePackageInfo] + ); + const steps: EuiStepProps[] = [ from === 'package' ? { title: i18n.translate('xpack.ingestManager.createDatasource.stepSelectAgentConfigTitle', { defaultMessage: 'Select an agent configuration', }), - children: ( - - ), + children: stepSelectConfig, } : { title: i18n.translate('xpack.ingestManager.createDatasource.stepSelectPackageTitle', { defaultMessage: 'Select an integration', }), - children: ( - - ), + children: stepSelectPackage, }, { title: i18n.translate('xpack.ingestManager.createDatasource.stepDefineDatasourceTitle', { diff --git a/x-pack/plugins/ingest_manager/public/applications/ingest_manager/sections/agent_config/details_page/components/datasources/datasources_table.tsx b/x-pack/plugins/ingest_manager/public/applications/ingest_manager/sections/agent_config/details_page/components/datasources/datasources_table.tsx index f93c49ec8c5af..3ad862c5e43fd 100644 --- a/x-pack/plugins/ingest_manager/public/applications/ingest_manager/sections/agent_config/details_page/components/datasources/datasources_table.tsx +++ b/x-pack/plugins/ingest_manager/public/applications/ingest_manager/sections/agent_config/details_page/components/datasources/datasources_table.tsx @@ -275,6 +275,7 @@ export const DatasourcesTable: React.FunctionComponent = ({ search={{ toolsRight: [ = () => { sorting={true} search={{ toolsRight: [ - sendRequest()}> + sendRequest()} + >