[ML] Increase limit of anomaly charts embeddables to max of 50 (#159816)

This commit is contained in:
Quynh Nguyen (Quinn) 2023-06-20 10:55:21 -05:00 committed by GitHub
parent ae5ccb9066
commit 9366d1b0b3
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 28 additions and 6 deletions

View file

@ -104,8 +104,19 @@ export const AddAnomalyChartsToDashboardControl: FC<AddToDashboardControlProps>
/>
);
const isMaxSeriesToPlotValid =
maxSeriesToPlot >= 1 && maxSeriesToPlot <= MAX_ANOMALY_CHARTS_ALLOWED;
const extraControls = (
<EuiFormRow
isInvalid={!isMaxSeriesToPlotValid}
error={
!isMaxSeriesToPlotValid ? (
<FormattedMessage
id="xpack.ml.anomalyChartsEmbeddable.maxSeriesToPlotError"
defaultMessage="Maximum number of series to plot must be between 1 and 50."
/>
) : undefined
}
label={
<FormattedMessage
id="xpack.ml.explorer.addToDashboard.anomalyCharts.maxSeriesToPlotLabel"
@ -119,7 +130,7 @@ export const AddAnomalyChartsToDashboardControl: FC<AddToDashboardControlProps>
name="selectMaxSeriesToPlot"
value={maxSeriesToPlot}
onChange={(e) => setMaxSeriesToPlot(parseInt(e.target.value, 10))}
min={0}
min={1}
max={MAX_ANOMALY_CHARTS_ALLOWED}
/>
</EuiFormRow>
@ -132,7 +143,7 @@ export const AddAnomalyChartsToDashboardControl: FC<AddToDashboardControlProps>
isLoading={isLoading}
search={search}
addToDashboardAndEditCallback={addToDashboardAndEditCallback}
disabled={false}
disabled={!isMaxSeriesToPlotValid}
title={title}
>
{extraControls}

View file

@ -23,7 +23,7 @@ import { FormattedMessage } from '@kbn/i18n-react';
import { AnomalyChartsEmbeddableInput } from '..';
import { DEFAULT_MAX_SERIES_TO_PLOT } from '../../application/services/anomaly_explorer_charts_service';
export const MAX_ANOMALY_CHARTS_ALLOWED = 48;
export const MAX_ANOMALY_CHARTS_ALLOWED = 50;
export interface AnomalyChartsInitializerProps {
defaultTitle: string;
initialInput?: Partial<Pick<AnomalyChartsEmbeddableInput, 'jobIds' | 'maxSeriesToPlot'>>;
@ -43,8 +43,10 @@ export const AnomalyChartsInitializer: FC<AnomalyChartsInitializerProps> = ({
);
const isPanelTitleValid = panelTitle.length > 0;
const isMaxSeriesToPlotValid =
maxSeriesToPlot >= 1 && maxSeriesToPlot <= MAX_ANOMALY_CHARTS_ALLOWED;
const isFormValid = isPanelTitleValid && isMaxSeriesToPlotValid;
const isFormValid = isPanelTitleValid && maxSeriesToPlot > 0;
return (
<EuiModal
initialFocus="[name=panelTitle]"
@ -82,6 +84,15 @@ export const AnomalyChartsInitializer: FC<AnomalyChartsInitializerProps> = ({
</EuiFormRow>
<EuiFormRow
isInvalid={!isMaxSeriesToPlotValid}
error={
!isMaxSeriesToPlotValid ? (
<FormattedMessage
id="xpack.ml.anomalyChartsEmbeddable.maxSeriesToPlotError"
defaultMessage="Maximum number of series to plot must be between 1 and 50."
/>
) : undefined
}
label={
<FormattedMessage
id="xpack.ml.anomalyChartsEmbeddable.maxSeriesToPlotLabel"
@ -95,7 +106,7 @@ export const AnomalyChartsInitializer: FC<AnomalyChartsInitializerProps> = ({
name="selectMaxSeriesToPlot"
value={maxSeriesToPlot}
onChange={(e) => setMaxSeriesToPlot(parseInt(e.target.value, 10))}
min={0}
min={1}
max={MAX_ANOMALY_CHARTS_ALLOWED}
/>
</EuiFormRow>

View file

@ -125,7 +125,7 @@ export const getAnomalyChartsSchema = schema.object({
/**
* Maximum amount of series data.
*/
maxResults: schema.number({ defaultValue: 6, min: 1, max: 10 }),
maxResults: schema.number({ defaultValue: 6, min: 1, max: 50 }),
influencersFilterQuery: schema.maybe(schema.any()),
/**
* Optimal number of data points per chart