Add stat card sparkline graphs with timeseries backend endpoint
New /search/stats/timeseries endpoint returns bucketed counts/metrics over a time window using ClickHouse toStartOfInterval(). Frontend Sparkline component renders SVG polyline + gradient fill on each stat card, driven by a useStatsTimeseries query hook. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -28,6 +28,27 @@ export function useSearchExecutions(filters: SearchRequest) {
|
||||
});
|
||||
}
|
||||
|
||||
export function useStatsTimeseries(timeFrom: string | undefined, timeTo: string | undefined) {
|
||||
return useQuery({
|
||||
queryKey: ['executions', 'timeseries', timeFrom, timeTo],
|
||||
queryFn: async () => {
|
||||
const { data, error } = await api.GET('/search/stats/timeseries', {
|
||||
params: {
|
||||
query: {
|
||||
from: timeFrom!,
|
||||
to: timeTo || undefined,
|
||||
buckets: 24,
|
||||
},
|
||||
},
|
||||
});
|
||||
if (error) throw new Error('Failed to load timeseries');
|
||||
return data!;
|
||||
},
|
||||
enabled: !!timeFrom,
|
||||
refetchInterval: 30_000,
|
||||
});
|
||||
}
|
||||
|
||||
export function useExecutionDetail(executionId: string | null) {
|
||||
return useQuery({
|
||||
queryKey: ['executions', 'detail', executionId],
|
||||
|
||||
Reference in New Issue
Block a user