import Head from "next/head" import useSWR from "swr" import {useRouter} from "next/router" type LeaderboardEntry = { name: string, score: number, } // @ts-ignore const fetcher = (...args) => fetch(...args).then(res => res.json()) export default function Home() { const location = useRouter() const hostHeader = location?.query?.["host"] const boardHeader = location?.query?.["board"] const decimalsHeader = location?.query?.["decimals"] const suffixHeader = location?.query?.["suffix"] let host = typeof hostHeader == "string" ? hostHeader : process.env.NEXT_PUBLIC_DEFAULT_HOST let board = typeof boardHeader == "string" ? boardHeader : process.env.NEXT_PUBLIC_DEFAULT_BOARD let decimals = typeof decimalsHeader == "string" ? parseInt(decimalsHeader) || 0 : 0 let suffix = typeof suffixHeader == "string" ? suffixHeader : "" const swr = useSWR(`${host}/board/?board=${board}&offset=0&size=500`, fetcher, {refreshInterval: 30000}) let content if(swr.isLoading || swr.data === undefined) { content = (

Loading

Please wait...

) } else if(swr.error) { content = (

Error

{swr.error}

) } else { const rows = swr.data.map((entry, rank) => { let className = "" rank += 1 if(rank == 1) { className += "gold" } else if(rank == 2) { className += "silver" } else if(rank == 3) { className += "bronze" } return ( {rank} {entry.name} {entry.score.toFixed(decimals)}{suffix && ` ${suffix}`} ) }) content = ( {rows}

{host}
{board}

Rank Player Score
) } return ( <> {board} - Steffo's Arcade Scores
{content}
) }