fix: incident header margin, run prettier

README.md

@@ -57,7 +57,7 @@ Please refer to [Wiki](https://github.com/lyc8503/UptimeFlare/wiki)
 - [x] Remove old incidents
 - [x] ~~Known issue~~: `fetch` doesn't support non-standard port (resolved after CF update)
 - [x] Compatibility date update
-- [x] Scheduled Maintenance 
+- [x] Scheduled Maintenance
 - [ ] Update wiki/README and add docs for dev
 - [ ] Migration to Terraform Cloudflare provider version 5.x
 - [ ] Cloudflare D1 database

components/Header.tsx

@@ -3,7 +3,7 @@ import classes from '@/styles/Header.module.css'
 import { pageConfig } from '@/uptime.config'
 import { PageConfigLink } from '@/types/config'
 
-export default function Header() {
+export default function Header({ style }: { style?: React.CSSProperties }) {
   const linkToElement = (link: PageConfigLink, i: number) => {
     return (
       <a
@@ -21,7 +21,7 @@ export default function Header() {
   const links = [{ label: 'Incident History', link: '/incidents' }, ...(pageConfig.links || [])]
 
   return (
-    <header className={classes.header}>
+    <header className={classes.header} style={style}>
       <Container size="md" className={classes.inner}>
         <div>
           <a
@@ -48,7 +48,7 @@ export default function Header() {
         </Group>
 
         <Group gap={5} hiddenFrom="sm">
-          {links?.filter((link) => (link.highlight || link.link.startsWith('/'))).map(linkToElement)}
+          {links?.filter((link) => link.highlight || link.link.startsWith('/')).map(linkToElement)}
         </Group>
       </Container>
     </header>

components/MonitorList.tsx

@@ -42,7 +42,9 @@ export default function MonitorList({
 
   // Load expanded groups from localStorage
   const savedExpandedGroups = localStorage.getItem('expandedGroups')
-  const expandedInitial = savedExpandedGroups ? JSON.parse(savedExpandedGroups) : Object.keys(group || {})
+  const expandedInitial = savedExpandedGroups
+    ? JSON.parse(savedExpandedGroups)
+    : Object.keys(group || {})
   const [expandedGroups, setExpandedGroups] = useState<string[]>(expandedInitial)
   useEffect(() => {
     localStorage.setItem('expandedGroups', JSON.stringify(expandedGroups))

components/OverallStatus.tsx

@@ -58,15 +58,16 @@ export default function OverallStatus({
   })
 
   const now = new Date()
-  let filteredMaintenances: (Omit<MaintenanceConfig, 'monitors'> & { monitors?: MonitorTarget[] })[] =
+  let filteredMaintenances: (Omit<MaintenanceConfig, 'monitors'> & {
-    maintenances
+    monitors?: MonitorTarget[]
-      .filter((m) => now >= new Date(m.start) && (!m.end || now <= new Date(m.end)))
+  })[] = maintenances
-      .map((maintenance) => ({
+    .filter((m) => now >= new Date(m.start) && (!m.end || now <= new Date(m.end)))
-        ...maintenance,
+    .map((maintenance) => ({
-        monitors: maintenance.monitors?.map(
+      ...maintenance,
-          (monitorId) => monitors.find((mon) => monitorId === mon.id)!
+      monitors: maintenance.monitors?.map(
-        ),
+        (monitorId) => monitors.find((mon) => monitorId === mon.id)!
-      }))
+      ),
+    }))
 
   return (
     <Container size="md" mt="xl">

pages/incidents.tsx

@@ -85,7 +85,11 @@ export default function IncidentsPage() {
       </Head>
 
       <main className={inter.className}>
-        <Header />
+        <Header
+          style={{
+            marginBottom: '40px',
+          }}
+        />
         <Center>
           <Container size="md" style={{ width: '100%' }}>
             <Group justify="end" mb="md">
@@ -103,10 +107,7 @@ export default function IncidentsPage() {
                 <NoIncidentsAlert />
               ) : (
                 monitorFilteredIncidents.map((incident, i) => (
-                  <MaintenanceAlert
+                  <MaintenanceAlert key={i} maintenance={incident} />
-                    key={i}
-                    maintenance={incident}
-                  />
                 ))
               )}
             </Box>

worker/src/index.ts

@@ -38,7 +38,7 @@ const Worker = {
             new Date(timeNow * 1000) >= new Date(m.start) &&
             (!m.end || new Date(timeNow * 1000) <= new Date(m.end))
         )
-        .map((e) => (e.monitors || []))
+        .map((e) => e.monitors || [])
         .flat()
 
       if (maintenanceList.includes(monitor.id)) {