73 lines
2.4 KiB
TypeScript
73 lines
2.4 KiB
TypeScript
|
import { Card } from "@/app/components/card";
|
||
|
|
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/app/components/ui/table";
|
||
|
|
import { cn } from "@/common/utils";
|
||
|
|
import { getMojangEndpointStatus } from "mcutils-library";
|
||
|
|
import { CachedEndpointStatus } from "mcutils-library/dist/types/cache/cachedEndpointStatus";
|
||
|
|
import Link from "next/link";
|
||
|
|
|
||
|
|
async function getData(): Promise<CachedEndpointStatus> {
|
||
|
|
const status = await getMojangEndpointStatus();
|
||
|
|
return status;
|
||
|
|
}
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Gets the color of the status
|
||
|
|
*
|
||
|
|
* @param status the status of the endpoint
|
||
|
|
* @returns the color of the status
|
||
|
|
*/
|
||
|
|
function getColor(status: any): string {
|
||
|
|
switch (status) {
|
||
|
|
case "ONLINE":
|
||
|
|
return "text-green-500";
|
||
|
|
case "DEGRADED":
|
||
|
|
return "text-yellow-500";
|
||
|
|
case "OFFLINE":
|
||
|
|
return "text-red-500";
|
||
|
|
default:
|
||
|
|
return "text-gray-500";
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
export default async function Page(): Promise<JSX.Element> {
|
||
|
|
const { endpoints } = await getData();
|
||
|
|
const endpointsSize = Object.entries(endpoints).length;
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className="flex justify-center text-center">
|
||
|
|
<Card className="w-max xs:w-fit">
|
||
|
|
<h1 className="text-xl">Mojang Status</h1>
|
||
|
|
<p>The current status of Mojang Services</p>
|
||
|
|
|
||
|
|
<div>
|
||
|
|
{endpointsSize === 0 && <p>Unable to fetch endpoint statuses</p>}
|
||
|
|
{endpointsSize > 0 && (
|
||
|
|
<Table className="mt-4 md:w-[500px] text-start">
|
||
|
|
<TableHeader>
|
||
|
|
<TableRow>
|
||
|
|
<TableHead className="pl-1">Service</TableHead>
|
||
|
|
<TableHead className="pl-1 text-center">Status</TableHead>
|
||
|
|
</TableRow>
|
||
|
|
</TableHeader>
|
||
|
|
<TableBody>
|
||
|
|
{Object.entries(endpoints).map(([url, status]) => {
|
||
|
|
return (
|
||
|
|
<TableRow key={url}>
|
||
|
|
<TableCell className="p-[0.3rem]">
|
||
|
|
<Link className="hover:text-primary transition-all" href={url} target="_blank">
|
||
|
|
{url}
|
||
|
|
</Link>
|
||
|
|
</TableCell>
|
||
|
|
<TableCell className={cn(getColor(status), "p-[0.3rem] text-center")}>{status}</TableCell>
|
||
|
|
</TableRow>
|
||
|
|
);
|
||
|
|
})}
|
||
|
|
</TableBody>
|
||
|
|
</Table>
|
||
|
|
)}
|
||
|
|
</div>
|
||
|
|
</Card>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|