feat: add auto-refresh toggle wired to all polling queries

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>

ui/src/api/queries/agents.ts

@@ -2,8 +2,10 @@ import { useQuery } from '@tanstack/react-query';
 import { api } from '../client';
 import { config } from '../../config';
 import { useAuthStore } from '../../auth/auth-store';
+import { useRefreshInterval } from './use-refresh-interval';
 
 export function useAgents(status?: string, application?: string) {
+  const refetchInterval = useRefreshInterval(10_000);
   return useQuery({
     queryKey: ['agents', status, application],
     queryFn: async () => {
@@ -13,11 +15,12 @@ export function useAgents(status?: string, application?: string) {
       if (error) throw new Error('Failed to load agents');
       return data!;
     },
-    refetchInterval: 10_000,
+    refetchInterval,
   });
 }
 
 export function useAgentEvents(appId?: string, agentId?: string, limit = 50) {
+  const refetchInterval = useRefreshInterval(15_000);
   return useQuery({
     queryKey: ['agents', 'events', appId, agentId, limit],
     queryFn: async () => {
@@ -35,6 +38,6 @@ export function useAgentEvents(appId?: string, agentId?: string, limit = 50) {
       if (!res.ok) throw new Error('Failed to load agent events');
       return res.json();
     },
-    refetchInterval: 15_000,
+    refetchInterval,
   });
 }