diff --git a/AppImage/components/health-status-modal.tsx b/AppImage/components/health-status-modal.tsx index a55cef58..e9f36f66 100644 --- a/AppImage/components/health-status-modal.tsx +++ b/AppImage/components/health-status-modal.tsx @@ -147,9 +147,26 @@ export function HealthStatusModal({ open, onOpenChange, getApiUrl }: HealthStatu newOverallStatus = fullData.health?.overall || "OK" } + // Calculate infoCount: categories with INFO status + dismissed items + let infoCount = 0 + if (response.ok) { + const fullData: FullHealthData = await response.clone().json() + // Count INFO categories + if (fullData.health?.details) { + CATEGORIES.forEach(({ key }) => { + const cat = fullData.health.details[key as keyof typeof fullData.health.details] + if (cat && cat.status?.toUpperCase() === "INFO") { + infoCount++ + } + }) + } + // Add dismissed items count + infoCount += (fullData.dismissed || []).length + } + // Emit event with the FRESH data from the response, not the stale state const event = new CustomEvent("healthStatusUpdated", { - detail: { status: newOverallStatus }, + detail: { status: newOverallStatus, infoCount }, }) window.dispatchEvent(event) } catch (err) { diff --git a/AppImage/components/proxmox-dashboard.tsx b/AppImage/components/proxmox-dashboard.tsx index 8c342c2b..fc0aea33 100644 --- a/AppImage/components/proxmox-dashboard.tsx +++ b/AppImage/components/proxmox-dashboard.tsx @@ -33,6 +33,7 @@ import { SettingsIcon, Terminal, ShieldCheck, + Info, } from "lucide-react" import Image from "next/image" import { ThemeToggle } from "./theme-toggle" @@ -78,6 +79,7 @@ export function ProxmoxDashboard() { const [componentKey, setComponentKey] = useState(0) const [mobileMenuOpen, setMobileMenuOpen] = useState(false) const [activeTab, setActiveTab] = useState("overview") + const [infoCount, setInfoCount] = useState(0) const [showNavigation, setShowNavigation] = useState(true) const [lastScrollY, setLastScrollY] = useState(0) const [showHealthModal, setShowHealthModal] = useState(false) @@ -158,7 +160,7 @@ export function ProxmoxDashboard() { useEffect(() => { const handleHealthStatusUpdate = (event: CustomEvent) => { - const { status } = event.detail + const { status, infoCount: newInfoCount } = event.detail let healthStatus: "healthy" | "warning" | "critical" if (status === "CRITICAL") { @@ -173,6 +175,11 @@ export function ProxmoxDashboard() { ...prev, status: healthStatus, })) + + // Update info count (INFO categories + dismissed items) + if (typeof newInfoCount === "number") { + setInfoCount(newInfoCount) + } } window.addEventListener("healthStatusUpdated", handleHealthStatusUpdate as EventListener) @@ -350,10 +357,17 @@ export function ProxmoxDashboard() { - - {statusIcon} - {systemStatus.status} - + {systemStatus.status === "healthy" && infoCount > 0 ? ( + + + {infoCount} info + + ) : ( + + {statusIcon} + {systemStatus.status} + + )}
Uptime: {systemStatus.uptime || "N/A"} @@ -380,10 +394,17 @@ export function ProxmoxDashboard() { {/* Mobile Actions */}
- - {statusIcon} - {systemStatus.status} - + {systemStatus.status === "healthy" && infoCount > 0 ? ( + + + {infoCount} + + ) : ( + + {statusIcon} + {systemStatus.status} + + )}