Prometheus: Add a limit for the series resource api in metrics browser (#91555)

* add a limit for the series resource api in metrics browser

* decouple serieslimit from options and only use in metrics browser

* add series limit input to metrics browser

* add warning

* add and fix tests

* add new param to jsdoc

* do not use the limit in other calls outside metrics browser

* update test

* trim limit

* fix tests, remove limit from non labels calls
This commit is contained in:
Brendan O'Handley
2024-08-15 15:39:42 -05:00
committed by GitHub
parent de0e6d0fce
commit f01263803a
4 changed files with 89 additions and 6 deletions

View File

@ -45,8 +45,12 @@ interface BrowserState {
error: string;
validationStatus: string;
valueSearchTerm: string;
seriesLimit?: string;
}
export const DEFAULT_SERIES_LIMIT = '40000';
export const REMOVE_SERIES_LIMIT = 'none';
interface FacettableValue {
name: string;
selected?: boolean;
@ -214,6 +218,10 @@ export class UnthemedPrometheusMetricsBrowser extends React.Component<BrowserPro
this.setState({ metricSearchTerm: event.target.value });
};
onChangeSeriesLimit = (event: ChangeEvent<HTMLInputElement>) => {
this.setState({ seriesLimit: event.target.value.trim() });
};
onChangeValueSearch = (event: ChangeEvent<HTMLInputElement>) => {
this.setState({ valueSearchTerm: event.target.value });
};
@ -419,7 +427,7 @@ export class UnthemedPrometheusMetricsBrowser extends React.Component<BrowserPro
this.updateLabelState(lastFacetted, { loading: true }, `Facetting labels for ${selector}`);
}
try {
const possibleLabels = await languageProvider.fetchSeriesLabels(selector, true);
const possibleLabels = await languageProvider.fetchSeriesLabels(selector, true, this.state.seriesLimit);
// If selector changed, clear loading state and discard result by returning early
if (selector !== buildSelector(this.state.labels)) {
if (lastFacetted) {
@ -492,7 +500,9 @@ export class UnthemedPrometheusMetricsBrowser extends React.Component<BrowserPro
<Stack gap={3}>
<div>
<div className={styles.section}>
<Label description="Once a metric is selected only possible labels are shown.">1. Select a metric</Label>
<Label description="Once a metric is selected only possible labels are shown. Labels are limited by the series limit below.">
1. Select a metric
</Label>
<div>
<Input
onChange={this.onChangeMetricSearch}
@ -501,6 +511,17 @@ export class UnthemedPrometheusMetricsBrowser extends React.Component<BrowserPro
data-testid={selectors.components.DataSource.Prometheus.queryEditor.code.metricsBrowser.selectMetric}
/>
</div>
<Label description="Set to 'none' to remove limit and show all labels for a selected metric. Removing the limit may cause performance issues.">
Series limit
</Label>
<div>
<Input
onChange={this.onChangeSeriesLimit}
aria-label="Limit results from series endpoint"
value={this.state.seriesLimit ?? DEFAULT_SERIES_LIMIT}
data-testid={selectors.components.DataSource.Prometheus.queryEditor.code.metricsBrowser.seriesLimit}
/>
</div>
<div
role="list"
className={styles.valueListWrapper}