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

View File

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