diff --git a/components/OverallStatus.tsx b/components/OverallStatus.tsx index c81aee9..3d91d2d 100644 --- a/components/OverallStatus.tsx +++ b/components/OverallStatus.tsx @@ -1,4 +1,4 @@ -import { Maintenances } from '@/types/config' +import { Maintenances, Monitor } from '@/types/config' import { Alert, Card, Center, Container, List, ListItem, Text, Title } from '@mantine/core' import { IconCircleCheck, IconAlertCircle, IconInfoCircle } from '@tabler/icons-react' import { useEffect, useState } from 'react' @@ -25,9 +25,11 @@ function useWindowVisibility() { export default function OverallStatus({ state, maintenances, + monitors, }: { state: { overallUp: number; overallDown: number; lastUpdate: number } - maintenances?: Maintenances[] + maintenances: Maintenances[] + monitors: Monitor[] }) { let statusString = '' let icon = @@ -63,8 +65,20 @@ export default function OverallStatus({ return () => clearInterval(interval) }) - // @TODO make dynamic - const showMaintenance = maintenances + const now = new Date() + let filteredMaintenances: (Omit & { + monitors: Monitor[] | undefined + })[] = (maintenances || []) + .filter((m) => (!m.start && !m.end) || (m.start && m.end && now >= m.start && now <= m.end)) + .map((maintenance) => { + // enrich maintenace with monitor + return { + ...maintenance, + monitors: maintenance.monitors?.map( + (monitorId) => monitors.find((mon) => monitorId === mon.id)! + ), + } + }) return ( <> @@ -79,8 +93,8 @@ export default function OverallStatus({ currentTime - state.lastUpdate } sec ago)`} - {showMaintenance && - maintenances.map((maintenance, idx) => ( + {filteredMaintenances && + filteredMaintenances.map((maintenance, idx) => ( } @@ -110,7 +124,7 @@ export default function OverallStatus({ {maintenance.monitors.map((comp, compIdx) => ( - {comp} + {comp.name} ))}