diff --git a/frontend/src/components/dashboard/HealthStatusBar.tsx b/frontend/src/components/dashboard/HealthStatusBar.tsx index 91402ea2..5c7f20a5 100644 --- a/frontend/src/components/dashboard/HealthStatusBar.tsx +++ b/frontend/src/components/dashboard/HealthStatusBar.tsx @@ -1,5 +1,6 @@ import { useEffect, useMemo, useState } from 'react'; import { Bell } from 'lucide-react'; +import { MastheadRail } from '@/components/ui/MastheadRail'; import type { Stats, SystemStats, NotificationItem, HealthLevel } from './types'; import { deriveHealth } from './deriveHealth'; import { countVisibleUnread } from '@/lib/notificationVisibility'; @@ -15,24 +16,21 @@ interface HealthStatusBarProps { metricsStale?: boolean; } -const healthConfig: Record = { +const healthConfig: Record = { healthy: { label: 'Healthy', - dotClass: 'bg-success shadow-[0_0_0_3px_color-mix(in_oklch,var(--success)_20%,transparent)]', textClass: 'text-stat-value', railClass: 'bg-brand', tintClass: 'from-brand/[0.06] via-transparent to-transparent', }, degraded: { label: 'Degraded', - dotClass: 'bg-warning shadow-[0_0_0_3px_color-mix(in_oklch,var(--warning)_22%,transparent)]', textClass: 'text-warning', railClass: 'bg-warning', tintClass: 'from-warning/[0.06] via-transparent to-transparent', }, critical: { label: 'Critical', - dotClass: 'bg-destructive shadow-[0_0_0_3px_color-mix(in_oklch,var(--destructive)_24%,transparent)]', textClass: 'text-destructive', railClass: 'bg-destructive', tintClass: 'from-destructive/[0.06] via-transparent to-transparent', @@ -92,14 +90,10 @@ export function HealthStatusBar({ className={`relative overflow-hidden rounded-lg border border-card-border border-t-card-border-top bg-card shadow-card-bevel transition-colors`} >
-
+
{/* State column */}
-