diff --git a/components/Header.tsx b/components/Header.tsx index 2e6a149..acdc51a 100644 --- a/components/Header.tsx +++ b/components/Header.tsx @@ -2,6 +2,7 @@ import { Container, Group, Text } from '@mantine/core' import classes from '@/styles/Header.module.css' import { pageConfig } from '@/uptime.config' import { PageConfigLink } from '@/types/config' +import Link from 'next/link' export default function Header() { const linkToElement = (link: PageConfigLink) => { @@ -22,20 +23,16 @@ export default function Header() {
- - - 🕒 - + - UptimeFlare + {pageConfig.title || 'UptimeFlare'} - +
diff --git a/components/Layout.tsx b/components/Layout.tsx new file mode 100644 index 0000000..3577fd6 --- /dev/null +++ b/components/Layout.tsx @@ -0,0 +1,49 @@ +import Head from 'next/head' +import { Inter } from 'next/font/google' +import Header from './Header' +import { Container, Divider, Text } from '@mantine/core' +import { pageConfig } from '@/uptime.config' + +const inter = Inter({ subsets: ['latin'] }) + +export default function Layout({ children }: { children: React.ReactNode }) { + return ( + <> + + {pageConfig.title} + + +
+
+ + {children} + + + + + Open-source monitoring and status page powered by{' '} + + Uptimeflare + {' '} + and{' '} + + Cloudflare + + , made with ❤ by{' '} + + lyc8503 + + . + +
+ + ) +} diff --git a/components/OverallStatus.tsx b/components/OverallStatus.tsx index 3c42ed5..d8a6537 100644 --- a/components/OverallStatus.tsx +++ b/components/OverallStatus.tsx @@ -58,18 +58,19 @@ export default function OverallStatus({ }) const now = new Date() - let filteredMaintenances: (Omit & { monitors?: MonitorTarget[] })[] = - maintenances - .filter((m) => now >= new Date(m.start) && (!m.end || now <= new Date(m.end))) - .map((maintenance) => ({ - ...maintenance, - monitors: maintenance.monitors?.map( - (monitorId) => monitors.find((mon) => monitorId === mon.id)! - ), - })) + let filteredMaintenances: (Omit & { + monitors?: MonitorTarget[] + })[] = maintenances + .filter((m) => now >= new Date(m.start) && (!m.end || now <= new Date(m.end))) + .map((maintenance) => ({ + ...maintenance, + monitors: maintenance.monitors?.map( + (monitorId) => monitors.find((mon) => monitorId === mon.id)! + ), + })) return ( - + <>
{icon}
{statusString} @@ -88,6 +89,6 @@ export default function OverallStatus({ style={{ maxWidth: groupedMonitor ? '897px' : '865px' }} /> ))} - </Container> + </> ) }