feat: add auto-refresh toggle wired to all polling queries
Some checks failed
CI / build (push) Failing after 51s
CI / cleanup-branch (push) Has been skipped
CI / docker (push) Has been skipped
CI / deploy (push) Has been skipped
CI / deploy-feature (push) Has been skipped

Upgrade @cameleer/design-system to ^0.1.3 which adds LIVE/PAUSED
toggle to TopBar backed by autoRefresh state in GlobalFilterProvider.

Add useRefreshInterval() hook that returns the polling interval when
auto-refresh is on, or false when paused. Wire it into all query
hooks that use refetchInterval (executions, catalog, agents, metrics,
admin database/opensearch).

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
hsiegeln
2026-03-24 18:10:32 +01:00
parent 6fea5f2c5b
commit 4ac11551c9
10 changed files with 81 additions and 47 deletions

View File

@@ -1,6 +1,7 @@
import { useQuery } from '@tanstack/react-query';
import { api } from '../client';
import type { SearchRequest } from '../types';
import { useRefreshInterval } from './use-refresh-interval';
export function useExecutionStats(
timeFrom: string | undefined,
@@ -8,6 +9,7 @@ export function useExecutionStats(
routeId?: string,
application?: string,
) {
const refetchInterval = useRefreshInterval(10_000);
return useQuery({
queryKey: ['executions', 'stats', timeFrom, timeTo, routeId, application],
queryFn: async () => {
@@ -26,11 +28,12 @@ export function useExecutionStats(
},
enabled: !!timeFrom,
placeholderData: (prev) => prev,
refetchInterval: 10_000,
refetchInterval,
});
}
export function useSearchExecutions(filters: SearchRequest, live = false) {
const refetchInterval = useRefreshInterval(5_000);
return useQuery({
queryKey: ['executions', 'search', filters],
queryFn: async () => {
@@ -41,7 +44,7 @@ export function useSearchExecutions(filters: SearchRequest, live = false) {
return data!;
},
placeholderData: (prev) => prev,
refetchInterval: live ? 5_000 : false,
refetchInterval: live ? refetchInterval : false,
});
}
@@ -51,6 +54,7 @@ export function useStatsTimeseries(
routeId?: string,
application?: string,
) {
const refetchInterval = useRefreshInterval(30_000);
return useQuery({
queryKey: ['executions', 'timeseries', timeFrom, timeTo, routeId, application],
queryFn: async () => {
@@ -70,7 +74,7 @@ export function useStatsTimeseries(
},
enabled: !!timeFrom,
placeholderData: (prev) => prev,
refetchInterval: 30_000,
refetchInterval,
});
}