import { Store } from 'laco' import { useStore } from 'laco-react' import Head from 'flareact/head' import { getKVMonitors, useKeyPress } from '../src/functions/helpers' import config from '../config.yaml' import MonitorCard from '../src/components/monitorCard' import MonitorFilter from '../src/components/monitorFilter' import MonitorStatusHeader from '../src/components/monitorStatusHeader' import ThemeSwitcher from '../src/components/themeSwitcher' const MonitorStore = new Store({ monitors: config.monitors, visible: config.monitors, activeFilter: false, }) const filterByTerm = (term) => MonitorStore.set((state) => ({ visible: state.monitors.filter((monitor) => monitor.name.toLowerCase().includes(term), ), })) export async function getEdgeProps() { // get KV data const kvMonitors = await getKVMonitors() return { props: { config, kvMonitors: kvMonitors ? kvMonitors.monitors : {}, kvMonitorsLastUpdate: kvMonitors ? kvMonitors.lastUpdate : {}, }, // Revalidate these props once every x seconds revalidate: 5, } } export default function Index({ config, kvMonitors, kvMonitorsLastUpdate }) { const state = useStore(MonitorStore) const slash = useKeyPress('/') return (
{config.settings.title}

{config.settings.title}

{typeof window !== 'undefined' && }
{state.visible.map((monitor, key) => { return ( ) })}
) }