fix: resolve unnecessary refetching of graphs on service details page

This commit is contained in:
Amlan Kumar Nandy 2024-12-10 12:00:55 +05:30 committed by GitHub
commit 81775c7d55
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 61 additions and 49 deletions

View File

@ -145,7 +145,9 @@ function Application(): JSX.Element {
[servicename, topLevelOperations],
);
const operationPerSecWidget = getWidgetQueryBuilder({
const operationPerSecWidget = useMemo(
() =>
getWidgetQueryBuilder({
query: {
queryType: EQueryType.QUERY_BUILDER,
promql: [],
@ -161,9 +163,13 @@ function Application(): JSX.Element {
panelTypes: PANEL_TYPES.TIME_SERIES,
yAxisUnit: 'ops',
id: SERVICE_CHART_ID.rps,
});
}),
[servicename, tagFilterItems, topLevelOperationsRoute],
);
const errorPercentageWidget = getWidgetQueryBuilder({
const errorPercentageWidget = useMemo(
() =>
getWidgetQueryBuilder({
query: {
queryType: EQueryType.QUERY_BUILDER,
promql: [],
@ -179,7 +185,9 @@ function Application(): JSX.Element {
panelTypes: PANEL_TYPES.TIME_SERIES,
yAxisUnit: '%',
id: SERVICE_CHART_ID.errorPercentage,
});
}),
[servicename, tagFilterItems, topLevelOperationsRoute],
);
const stepInterval = useMemo(
() =>

View File

@ -53,7 +53,9 @@ function ServiceOverview({
[isSpanMetricEnable, queries],
);
const latencyWidget = getWidgetQueryBuilder({
const latencyWidget = useMemo(
() =>
getWidgetQueryBuilder({
query: {
queryType: EQueryType.QUERY_BUILDER,
promql: [],
@ -70,7 +72,9 @@ function ServiceOverview({
panelTypes: PANEL_TYPES.TIME_SERIES,
yAxisUnit: 'ns',
id: SERVICE_CHART_ID.latency,
});
}),
[isSpanMetricEnable, servicename, tagFilterItems, topLevelOperationsRoute],
);
const isQueryEnabled =
!topLevelOperationsIsLoading && topLevelOperationsRoute.length > 0;