From 93ea24762ca5f0be5733d7403c0391aba677da15 Mon Sep 17 00:00:00 2001 From: Liam Date: Fri, 19 Apr 2024 18:50:12 +0100 Subject: [PATCH] new mojang status page, and add color to the embed based on if there was any offline or degraded --- package.json | 2 +- pnpm-lock.yaml | 8 +-- src/app/(pages)/mojang/status/page.tsx | 89 +++++++++++++++----------- src/app/globals.css | 2 +- src/common/colors.ts | 1 + 5 files changed, 58 insertions(+), 44 deletions(-) diff --git a/package.json b/package.json index b2b0a4c..4e0157a 100644 --- a/package.json +++ b/package.json @@ -24,7 +24,7 @@ "clipboard-copy": "^4.0.1", "clsx": "^2.1.0", "lucide-react": "^0.372.0", - "mcutils-library": "^1.2.2", + "mcutils-library": "^1.2.4", "moment": "^2.30.1", "next": "14.2.2", "next-themes": "^0.3.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index a255682..3a320ae 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -51,8 +51,8 @@ dependencies: specifier: ^0.372.0 version: 0.372.0(react@18.2.0) mcutils-library: - specifier: ^1.2.2 - version: 1.2.2(@babel/core@7.24.4)(@types/node@20.12.7) + specifier: ^1.2.4 + version: 1.2.4(@babel/core@7.24.4)(@types/node@20.12.7) moment: specifier: ^2.30.1 version: 2.30.1 @@ -4360,8 +4360,8 @@ packages: tmpl: 1.0.5 dev: false - /mcutils-library@1.2.2(@babel/core@7.24.4)(@types/node@20.12.7): - resolution: {integrity: sha512-OlzntolwWxkhdYUGbgHEK0ZbFFtqwUE/wbh+hTPtExLguebv3pCjPr0dBecVjOvtCs2mIyTA7u1rQOsEUh4CVg==} + /mcutils-library@1.2.4(@babel/core@7.24.4)(@types/node@20.12.7): + resolution: {integrity: sha512-CO5jEYAWgnTyJt5G9/bB4/rhSs9W5Ll2hxAOP+sIy9JVGhzkZQnet1kxD9oVwu75hEOmlOxNWt1IiUhYMmqN1A==} dependencies: jest: 29.7.0(@types/node@20.12.7)(ts-node@10.9.2) ts-jest: 29.1.2(@babel/core@7.24.4)(jest@29.7.0)(typescript@5.4.5) diff --git a/src/app/(pages)/mojang/status/page.tsx b/src/app/(pages)/mojang/status/page.tsx index cabef4d..0243165 100644 --- a/src/app/(pages)/mojang/status/page.tsx +++ b/src/app/(pages)/mojang/status/page.tsx @@ -4,10 +4,11 @@ import { generateEmbed } from "@/common/embed"; import { capitalizeFirstLetter } from "@/common/string-utils"; import { formatTime } from "@/common/time-utils"; import { cn } from "@/common/utils"; -import { getMojangEndpointStatus } from "mcutils-library"; -import { Metadata } from "next"; +import { CachedEndpointStatus, getMojangEndpointStatus, Status } from "mcutils-library"; +import { Metadata, Viewport } from "next"; import Link from "next/link"; import { ReactElement } from "react"; +import { Colors } from "@/common/colors"; /** * Force the page to be dynamic, so it will be regenerated on every request @@ -43,15 +44,31 @@ function formatStatus(status: any): string { return capitalizeFirstLetter(status.toLowerCase()); } +export async function generateViewport(): Promise { + const { endpoints } = await getMojangEndpointStatus(); + + let warning = false; + for (const endpoint of endpoints) { + if (endpoint.status != Status.ONLINE) { + warning = true; + break; + } + } + + return { + themeColor: warning ? Colors.yellow : Colors.green, + }; +} + export async function generateMetadata(): Promise { const { endpoints } = await getMojangEndpointStatus(); - let description = Object.entries(endpoints) - .map(([url, status]) => { - return `${url}: ${formatStatus(status)}`; - }) - .join("\n"); - description += `\n\nEmbed Cache: ${formatTime(new Date())}`; + let description = "Current Mojang API Status:\n"; + for (const endpoint of endpoints) { + const { name, hostname, status } = endpoint; + + description += `${name} (${hostname}): ${status}\n`; + } return generateEmbed({ title: "Mojang Status", @@ -61,7 +78,6 @@ export async function generateMetadata(): Promise { export default async function Page(): Promise { const { endpoints } = await getMojangEndpointStatus(); - const endpointsSize = Object.entries(endpoints).length; return (
@@ -69,35 +85,32 @@ export default async function Page(): Promise {

Mojang Status

The current status of Mojang Services

- -
- {endpointsSize === 0 &&

Unable to fetch endpoint statuses

} - {endpointsSize > 0 && ( - - - - Service - Status - - - - {Object.entries(endpoints).map(([url, status]) => { - return ( - - - - {url} - - - - {formatStatus(status)} - - - ); - })} - -
- )} + +
+ {endpoints.length == 0 &&

Unable to fetch endpoint statuses

} + {endpoints.length > 0 && + endpoints.map((endpoint: CachedEndpointStatus) => { + const { name, hostname, status } = endpoint; + + const url = `https://${hostname}`; + return ( +
+
+

{name}

+ +

{url}

+ +
+
+

{formatStatus(status)}

+
+
+ ); + })}
diff --git a/src/app/globals.css b/src/app/globals.css index 97a407e..99825d5 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -40,7 +40,7 @@ --secondary-foreground: 0 0% 98%; --muted: 0 0% 15%; --muted-foreground: 240 5% 64.9%; - --accent: 12 6.5% 15.1%; + --accent: 12 6.5% 75%; --accent-foreground: 0 0% 98%; --destructive: 0 62.8% 30.6%; --destructive-foreground: 0 85.7% 97.3%; diff --git a/src/common/colors.ts b/src/common/colors.ts index 4c1f761..dfca2ae 100644 --- a/src/common/colors.ts +++ b/src/common/colors.ts @@ -4,4 +4,5 @@ export const Colors = { green: "#0FFF50", red: "#8B0000", + yellow: "#FFD700", };