7778793e7b
Backend: Add group filtering to agent list, search, stats, and timeseries
endpoints. Add diagram lookup by group+routeId. Resolve application group
to agent IDs server-side for ClickHouse IN-clause queries.
Frontend: New route detail page at /apps/{group}/routes/{routeId} with
three tabs (Diagram, Performance, Processor Tree). SVG diagram rendering
with panzoom, execution overlay (glow effects, duration/sequence badges,
flow particles, minimap), and processor detail panel. uPlot charts for
performance tab replacing old SVG sparklines. Ctrl+Click from
ExecutionExplorer navigates to route diagram with overlay.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
32 lines
1.0 KiB
TypeScript
32 lines
1.0 KiB
TypeScript
import { useQuery } from '@tanstack/react-query';
|
|
import { api } from '../client';
|
|
|
|
export function useDiagramLayout(contentHash: string | null) {
|
|
return useQuery({
|
|
queryKey: ['diagrams', 'layout', contentHash],
|
|
queryFn: async () => {
|
|
const { data, error } = await api.GET('/diagrams/{contentHash}/render', {
|
|
params: { path: { contentHash: contentHash! } },
|
|
headers: { Accept: 'application/json' },
|
|
});
|
|
if (error) throw new Error('Failed to load diagram layout');
|
|
return data!;
|
|
},
|
|
enabled: !!contentHash,
|
|
});
|
|
}
|
|
|
|
export function useDiagramByRoute(group: string | undefined, routeId: string | undefined) {
|
|
return useQuery({
|
|
queryKey: ['diagrams', 'byRoute', group, routeId],
|
|
queryFn: async () => {
|
|
const { data, error } = await api.GET('/diagrams', {
|
|
params: { query: { group: group!, routeId: routeId! } },
|
|
});
|
|
if (error) throw new Error('Failed to load diagram for route');
|
|
return data!;
|
|
},
|
|
enabled: !!group && !!routeId,
|
|
});
|
|
}
|