mirror of
https://github.com/pacnpal/thrilltrack-explorer.git
synced 2025-12-25 09:51:12 -05:00
Add comprehensive monitoring dashboard scaffolding: - Extend queryKeys with monitoring keys - Create hooks: useCombinedAlerts, useRecentActivity, useDatabaseHealth, useModerationHealth - Build UI components: SystemHealthStatus, CriticalAlertsPanel, MonitoringQuickStats, RecentActivityTimeline, MonitoringNavCards - Create MonitoringOverview page and integrate routing (MonitoringOverview route) - Wire AdminSidebar to include Monitoring navigation - Introduce supporting routing and admin layout hooks/utilities - Align with TanStack Query patterns and plan for auto-refresh and optimistic updates
50 lines
1.7 KiB
TypeScript
50 lines
1.7 KiB
TypeScript
import { useQuery } from '@tanstack/react-query';
|
|
import { useSystemAlerts } from '@/hooks/useSystemHealth';
|
|
import { useUnresolvedAlerts } from '@/hooks/useRateLimitAlerts';
|
|
import { queryKeys } from '@/lib/queryKeys';
|
|
|
|
export interface CombinedAlert {
|
|
id: string;
|
|
created_at: string;
|
|
severity: 'critical' | 'high' | 'medium' | 'low';
|
|
message: string;
|
|
alert_type?: string;
|
|
source: 'system' | 'rate_limit';
|
|
resolved_at?: string | null;
|
|
metric_type?: string;
|
|
function_name?: string;
|
|
}
|
|
|
|
export function useCombinedAlerts() {
|
|
const systemCritical = useSystemAlerts('critical');
|
|
const systemHigh = useSystemAlerts('high');
|
|
const rateLimitAlerts = useUnresolvedAlerts();
|
|
|
|
return useQuery({
|
|
queryKey: queryKeys.monitoring.combinedAlerts(),
|
|
queryFn: () => {
|
|
const combined: CombinedAlert[] = [
|
|
...(systemCritical.data || []).map(a => ({ ...a, source: 'system' as const })),
|
|
...(systemHigh.data || []).map(a => ({ ...a, source: 'system' as const })),
|
|
...(rateLimitAlerts.data || []).map(a => ({
|
|
id: a.id,
|
|
created_at: a.created_at,
|
|
severity: 'high' as const, // Rate limit alerts are considered high severity
|
|
message: a.alert_message,
|
|
alert_type: a.metric_type,
|
|
source: 'rate_limit' as const,
|
|
resolved_at: a.resolved_at,
|
|
metric_type: a.metric_type,
|
|
function_name: a.function_name,
|
|
})),
|
|
];
|
|
return combined
|
|
.sort((a, b) => new Date(b.created_at).getTime() - new Date(a.created_at).getTime())
|
|
.slice(0, 10);
|
|
},
|
|
enabled: !systemCritical.isLoading && !systemHigh.isLoading && !rateLimitAlerts.isLoading,
|
|
staleTime: 15000,
|
|
refetchInterval: 30000,
|
|
});
|
|
}
|