github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-24 09:48:58 -04:00
Code Issues Projects Releases Packages Wiki Activity

Improve alert summary data fetching in Alerts and Overview pages (#150298)

Browse source 
## Summary

Use useMemo to avoid extra fetching of alert summary data.

|Before|After|
|---|---|

|![image](216947089-ef669157-70aa-4ef0-800b-c3f659055fdd.png)|
This commit is contained in:
Maryam Saeidi 2023-02-06 12:33:49 +01:00 • committed by GitHub
parent 1b8960bee6
commit edc8265de8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 22 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

23
x-pack/plugins/observability/public/pages/alerts/containers/alerts_page/alerts_page.tsx
View file

@ -5,15 +5,12 @@
* 2.0.
*/
import React, { useEffect, useState } from 'react';
import React, { useEffect, useMemo, useState } from 'react';
import { EuiFlexGroup, EuiFlexItem } from '@elastic/eui';
import { BoolQuery } from '@kbn/es-query';
import { i18n } from '@kbn/i18n';
import { useKibana } from '@kbn/kibana-react-plugin/public';
import {
loadRuleAggregations,
AlertSummaryTimeRange,
} from '@kbn/triggers-actions-ui-plugin/public';
import { loadRuleAggregations } from '@kbn/triggers-actions-ui-plugin/public';
import { AlertConsumers } from '@kbn/rule-data-utils';
import { useToasts } from '../../../../hooks/use_toast';
import {
@ -80,12 +77,16 @@ function InternalAlertsPage() {
const { hasAnyData, isAllRequestsComplete } = useHasData();
const [esQuery, setEsQuery] = useState<{ bool: BoolQuery }>();
const timeBuckets = useTimeBuckets();
const alertSummaryTimeRange: AlertSummaryTimeRange = getAlertSummaryTimeRange(
{
from: alertSearchBarStateProps.rangeFrom,
to: alertSearchBarStateProps.rangeTo,
},
timeBuckets
const alertSummaryTimeRange = useMemo(
() =>
getAlertSummaryTimeRange(
{
from: alertSearchBarStateProps.rangeFrom,
to: alertSearchBarStateProps.rangeTo,
},
timeBuckets
),
[alertSearchBarStateProps.rangeFrom, alertSearchBarStateProps.rangeTo, timeBuckets]
);
useBreadcrumbs([

16
x-pack/plugins/observability/public/pages/overview/containers/overview_page/overview_page.tsx
View file

@ -92,12 +92,16 @@ export function OverviewPage() {
})
);
const timeBuckets = useTimeBuckets();
const alertSummaryTimeRange = getAlertSummaryTimeRange(
{
from: relativeStart,
to: relativeEnd,
},
timeBuckets
const alertSummaryTimeRange = useMemo(
() =>
getAlertSummaryTimeRange(
{
from: relativeStart,
to: relativeEnd,
},
timeBuckets
),
[relativeEnd, relativeStart, timeBuckets]
);
const chartThemes = {