use new api format

package.json

@@ -14,7 +14,7 @@
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.1.0",
     "lucide-react": "^0.368.0",
-    "mcutils-library": "^1.1.5",
+    "mcutils-library": "^1.2.1",
     "next": "14.2.1",
     "next-themes": "^0.3.0",
     "react": "^18",

pnpm-lock.yaml

@@ -21,8 +21,8 @@ dependencies:
     specifier: ^0.368.0
     version: 0.368.0(react@18.2.0)
   mcutils-library:
-    specifier: ^1.1.5
-    version: 1.1.5(@babel/core@7.24.4)(@types/node@20.12.7)
+    specifier: ^1.2.1
+    version: 1.2.1(@babel/core@7.24.4)(@types/node@20.12.7)
   next:
     specifier: 14.2.1
     version: 14.2.1(@babel/core@7.24.4)(react-dom@18.2.0)(react@18.2.0)
@@ -3516,8 +3516,8 @@ packages:
       tmpl: 1.0.5
     dev: false
 
-  /mcutils-library@1.1.5(@babel/core@7.24.4)(@types/node@20.12.7):
-    resolution: {integrity: sha512-aQCn4YLvmkoqc+yClLiiiNkPJ+02iSOxzZ5X+Tr0SPPNhNzHn6IAP71ZS3SGQlLeRkfIqXynjbhrEplmW+CBzw==}
+  /mcutils-library@1.2.1(@babel/core@7.24.4)(@types/node@20.12.7):
+    resolution: {integrity: sha512-5OZP5MfZnVg/72gPvH88Fg45KQKe0z2S/1sGBOi3Tv9CxYDJJIYE7FWjHLgiRPFm2keY0P+RZlcZ2Zs3OvOpGQ==}
     dependencies:
       axios: 1.6.8
       jest: 29.7.0(@types/node@20.12.7)(ts-node@10.9.2)

src/app/(pages)/mojang/page.tsx

@@ -3,8 +3,7 @@ import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@
 import { generateEmbed } from "@/common/embed";
 import { capitalizeFirstLetter } from "@/common/string-utils";
 import { cn } from "@/common/utils";
-import { getMojangEndpointStatus } from "mcutils-library";
-import { CachedEndpointStatus } from "mcutils-library/dist/types/cache/cachedEndpointStatus";
+import { CachedEndpointStatus, getMojangEndpointStatus } from "mcutils-library";
 import { Metadata } from "next";
 import Link from "next/link";
 

src/app/(pages)/page.tsx

@@ -6,7 +6,7 @@ type Button = {
 };
 
 const buttons: Button[] = [
-  { title: "Get Started", url: "/player/Notch" },
+  { title: "Get Started", url: "/player" },
   { title: "Documentation", url: "https://api.mcutils.xyz/swagger-ui.html" },
 ];
 

src/app/(pages)/player/[[...id]]/page.tsx

@@ -1,12 +1,9 @@
 /* eslint-disable @next/next/no-img-element */
 import { Card } from "@/app/components/card";
-import { NotFound } from "@/app/components/not-found";
+import { ErrorCard } from "@/app/components/error-card";
 import { LookupPlayer } from "@/app/components/player/lookup-player";
 import { generateEmbed } from "@/common/embed";
-import { getPlayer } from "mcutils-library";
-import { CachedPlayer } from "mcutils-library/dist/types/cache/cachedPlayer";
-import { McUtilsAPIError } from "mcutils-library/dist/types/error";
-import { Player, SkinPart } from "mcutils-library/dist/types/player/player";
+import { CachedPlayer, McUtilsAPIError, SkinPart, getPlayer } from "mcutils-library";
 import { Metadata } from "next";
 import Image from "next/image";
 import Link from "next/link";
@@ -18,13 +15,10 @@ type Params = {
 };
 
 export async function generateMetadata({ params: { id } }: Params): Promise<Metadata> {
-  const { error, player } = await fetchPlayer(id);
+  try {
+    const player = await getPlayer(id);
 
-  if (error && player == undefined) {
-    return generateEmbed({ title: "Unknown Player", description: error });
-  }
-
-  const { username, uniqueId, skin } = player as Player;
+    const { username, uniqueId, skin } = player;
     const headPartUrl = skin.parts.head;
 
     const description = `
@@ -36,39 +30,24 @@ export async function generateMetadata({ params: { id } }: Params): Promise<Meta
       description: description,
       image: headPartUrl,
     });
-}
-
-/**
- * Gets the player's data from the uuid or username
- *
- * @param id the player's uuid or username
- * @returns the player's data or an error message
- */
-async function getData(id: string): Promise<CachedPlayer | null> {
-  return await getPlayer(id);
-}
-
-/**
- * Fetches the player's data from the uuid or username
- *
- * @param id the player's uuid or username
- * @returns the player's data or an error message
- */
-async function fetchPlayer(id: string): Promise<{ error: string | undefined; player: Player | undefined }> {
-  let error: string | undefined = undefined;
-  let player: Player | undefined = undefined;
-
-  try {
-    player = (await getData(id))?.player;
   } catch (err) {
-    error = (err as McUtilsAPIError).message;
+    return generateEmbed({
+      title: "Player Not Found",
+      description: (err as McUtilsAPIError).message,
+    });
   }
-
-  return { error, player };
 }
 
 export default async function Page({ params: { id } }: Params): Promise<JSX.Element> {
-  const { error, player } = await fetchPlayer(id);
+  let error: string | undefined = undefined; // The error to display
+  let player: CachedPlayer | undefined = undefined; // The player to display
+
+  // Try and get the player to display
+  try {
+    player = id ? await getPlayer(id) : undefined;
+  } catch (err) {
+    error = (err as McUtilsAPIError).message; // Set the error message
+  }
 
   return (
     <div className="h-full flex flex-col items-center">
@@ -79,9 +58,9 @@ export default async function Page({ params: { id } }: Params): Promise<JSX.Elem
         <LookupPlayer />
       </div>
 
+      {error && <ErrorCard message={error} />}
+      {player != undefined && (
         <Card className="w-max xs:w-fit">
-        {error && <NotFound message={error} />}
-        {player != null && (
           <div className="flex gap-4 flex-col xs:flex-row">
             <div className="flex justify-center xs:justify-start">
               <Image
@@ -116,8 +95,8 @@ export default async function Page({ params: { id } }: Params): Promise<JSX.Elem
               </div>
             </div>
           </div>
-        )}
         </Card>
+      )}
     </div>
   );
 }

src/app/(pages)/server/[platform]/[[...hostname]]/page.tsx

@@ -0,0 +1,149 @@
+import { Card } from "@/app/components/card";
+import { ErrorCard } from "@/app/components/error-card";
+import { LookupServer } from "@/app/components/server/lookup-server";
+import { generateEmbed } from "@/common/embed";
+import { formatNumber } from "@/common/number-utils";
+import { capitalizeFirstLetter } from "@/common/string-utils";
+import {
+  CachedBedrockMinecraftServer,
+  CachedJavaMinecraftServer,
+  McUtilsAPIError,
+  ServerPlatform,
+  getServer,
+} from "mcutils-library";
+import { Metadata } from "next";
+import Image from "next/image";
+
+type Params = {
+  params: {
+    platform: ServerPlatform;
+    hostname: string;
+  };
+};
+
+/**
+ * Gets the favicon for a server
+ *
+ * @param platform the platform of the server
+ * @param server the server to get the favicon from
+ * @returns the favicon url or null if there is no favicon
+ */
+function getFavicon(
+  platform: ServerPlatform,
+  server: CachedJavaMinecraftServer | CachedBedrockMinecraftServer
+): string | undefined {
+  if (platform === ServerPlatform.Bedrock) {
+    return undefined;
+  }
+  server = server as CachedJavaMinecraftServer;
+  return server.favicon && server.favicon.url;
+}
+
+/**
+ * Checks if a platform is valid
+ *
+ * @param platform the platform to check
+ * @returns true if the platform is valid, false otherwise
+ */
+function checkPlatform(platform: ServerPlatform): boolean {
+  return platform === ServerPlatform.Java || platform === ServerPlatform.Bedrock;
+}
+
+export async function generateMetadata({ params: { platform, hostname } }: Params): Promise<Metadata> {
+  try {
+    if (checkPlatform(platform) === false) {
+      return generateEmbed({
+        title: "Server Not Found",
+        description: "Invalid platform",
+      });
+    }
+    const server = await getServer(platform, hostname);
+    const { hostname: serverHostname, players } = server as CachedJavaMinecraftServer | CachedBedrockMinecraftServer;
+
+    const favicon = server ? getFavicon(platform, server) : undefined;
+
+    const description = `
+    ${capitalizeFirstLetter(platform)} Server
+    Hostname: ${serverHostname}
+    ${players.online}/${players.max} players online`;
+
+    return generateEmbed({
+      title: `${serverHostname}`,
+      description: description,
+      image: favicon,
+    });
+  } catch (err) {
+    return generateEmbed({
+      title: "Server Not Found",
+      description: (err as McUtilsAPIError).message,
+    });
+  }
+}
+
+export default async function Page({ params: { platform, hostname } }: Params): Promise<JSX.Element> {
+  let error: string | undefined = undefined; // The error to display
+  let server: CachedJavaMinecraftServer | CachedBedrockMinecraftServer | undefined = undefined; // The server to display
+  let invalidPlatform = checkPlatform(platform) === false;
+
+  // Try and get the player to display
+  try {
+    console.log(platform);
+    if (invalidPlatform) {
+      error = "Invalid platform"; // Set the error message
+    } else {
+      server = platform && hostname ? await getServer(platform, hostname) : undefined;
+    }
+  } catch (err) {
+    error = (err as McUtilsAPIError).message; // Set the error message
+  }
+
+  const favicon = server ? getFavicon(platform, server) : undefined;
+
+  return (
+    <div className="h-full flex flex-col items-center">
+      <div className="mb-4 text-center">
+        <h1 className="text-xl">Lookup a {invalidPlatform ? "" : capitalizeFirstLetter(platform)} Server</h1>
+        <p>You can enter a server hostname to get information about the server.</p>
+
+        <LookupServer />
+      </div>
+
+      {error && <ErrorCard message={error} />}
+      {server != null && (
+        <Card className="w-max xs:w-fit">
+          <div className="flex gap-4 flex-col">
+            <div className="flex gap-4 flex-col xs:flex-row">
+              {favicon && (
+                <div className="flex justify-center xs:justify-start">
+                  <Image
+                    className="w-[64px] h-[64px]"
+                    src={favicon}
+                    width={64}
+                    height={64}
+                    quality={100}
+                    alt="The server's favicon"
+                  />
+                </div>
+              )}
+
+              <div className="flex flex-col">
+                <h2 className="text-xl text-primary">{server.hostname}</h2>
+                <div>
+                  <p>
+                    Players online: {formatNumber(server.players.online)}/{formatNumber(server.players.max)}
+                  </p>
+                </div>
+              </div>
+            </div>
+
+            <div className="bg-background rounded-lg p-2 text-sm xs:text-lg">
+              {server.motd.html.map((line, index) => {
+                return <p key={index} dangerouslySetInnerHTML={{ __html: line }}></p>;
+              })}
+            </div>
+          </div>
+        </Card>
+      )}
+    </div>
+  );
+}

src/app/(pages)/server/[platform]/[hostname]/page.tsx

@@ -1,146 +0,0 @@
-import { Card } from "@/app/components/card";
-import { NotFound } from "@/app/components/not-found";
-import { LookupServer } from "@/app/components/server/lookup-server";
-import { generateEmbed } from "@/common/embed";
-import { formatNumber } from "@/common/number-utils";
-import { capitalizeFirstLetter } from "@/common/string-utils";
-import { getServer } from "mcutils-library";
-import { McUtilsAPIError } from "mcutils-library/dist/types/error";
-import BedrockMinecraftServer from "mcutils-library/dist/types/server/bedrockServer";
-import JavaMinecraftServer from "mcutils-library/dist/types/server/javaServer";
-import { ServerPlatform } from "mcutils-library/dist/types/server/platform";
-import { Metadata } from "next";
-import Image from "next/image";
-
-type Params = {
-  params: {
-    platform: ServerPlatform;
-    hostname: string;
-  };
-};
-
-export async function generateMetadata({ params: { platform, hostname } }: Params): Promise<Metadata> {
-  const { error, server } = await fetchServer(platform, hostname);
-
-  if (error && server == undefined) {
-    return generateEmbed({ title: "Unknown Server", description: error });
-  }
-
-  const { hostname: serverHostname, players } = server as JavaMinecraftServer | BedrockMinecraftServer;
-
-  let favicon = null; // Server favicon
-
-  // Java specific
-  if (platform === ServerPlatform.Java) {
-    const javaServer = server as JavaMinecraftServer;
-    favicon = javaServer.favicon && javaServer.favicon.url;
-  }
-
-  const description = `
-    ${capitalizeFirstLetter(platform)} Server
-    Hostname: ${serverHostname}
-    ${players.online}/${players.max} players online`;
-
-  return generateEmbed({
-    title: `${serverHostname}`,
-    description: description,
-    image: favicon,
-  });
-}
-
-/**
- * Gets the server's data from the hostname
- *
- * @param platform the server's platform
- * @param hostnamt the server's hostname
- * @returns the server's data or an error message
- */
-async function getData(
-  platform: ServerPlatform,
-  hostname: string
-): Promise<JavaMinecraftServer | BedrockMinecraftServer | null> {
-  return (await getServer(platform, hostname)).server;
-}
-
-/**
- * Fetches the server's data from the hostname
- *
- * @param platform the server's platform
- * @param hostname the server's hostname
- * @returns the server's data or an error message
- */
-async function fetchServer(
-  platform: ServerPlatform,
-  hostname: string
-): Promise<{ error: string | undefined; server: JavaMinecraftServer | BedrockMinecraftServer | undefined }> {
-  let error: string | undefined = undefined;
-  let server: JavaMinecraftServer | BedrockMinecraftServer | undefined = undefined;
-
-  try {
-    server = (await getData(platform, hostname)) as JavaMinecraftServer | BedrockMinecraftServer;
-  } catch (err) {
-    error = (err as McUtilsAPIError).message;
-  }
-
-  return { error, server };
-}
-
-export default async function Page({ params: { platform, hostname } }: Params): Promise<JSX.Element> {
-  const { error, server } = await fetchServer(platform, hostname);
-
-  let favicon = null; // Server favicon
-
-  // Java specific
-  if (server && platform === ServerPlatform.Java) {
-    const javaServer = server as JavaMinecraftServer;
-    favicon = javaServer.favicon && javaServer.favicon.url;
-  }
-
-  return (
-    <div className="h-full flex flex-col items-center">
-      <div className="mb-4 text-center">
-        <h1 className="text-xl">Lookup a {capitalizeFirstLetter(platform)} Server</h1>
-        <p>You can enter a server hostname to get information about the server.</p>
-
-        <LookupServer />
-      </div>
-
-      <Card className="w-max xs:w-fit">
-        {error && <NotFound message={error} />}
-        {server != null && (
-          <div className="flex gap-4 flex-col">
-            <div className="flex gap-4 flex-col xs:flex-row">
-              {favicon && (
-                <div className="flex justify-center xs:justify-start">
-                  <Image
-                    className="w-[64px] h-[64px]"
-                    src={favicon}
-                    width={64}
-                    height={64}
-                    quality={100}
-                    alt="The server's favicon"
-                  />
-                </div>
-              )}
-
-              <div className="flex flex-col">
-                <h2 className="text-xl text-primary">{server.hostname}</h2>
-                <div>
-                  <p>
-                    Players online: {formatNumber(server.players.online)}/{formatNumber(server.players.max)}
-                  </p>
-                </div>
-              </div>
-            </div>
-
-            <div className="bg-background rounded-lg p-2 text-sm xs:text-lg">
-              {server.motd.html.map((line, index) => {
-                return <p key={index} dangerouslySetInnerHTML={{ __html: line }}></p>;
-              })}
-            </div>
-          </div>
-        )}
-      </Card>
-    </div>
-  );
-}

src/app/components/error-card.tsx

@@ -0,0 +1,16 @@
+import { Card } from "./card";
+
+type ErrorProps = {
+  message: string;
+};
+
+export function ErrorCard({ message }: ErrorProps): JSX.Element {
+  return (
+    <Card>
+      <div className="flex flex-col justify-center text-center">
+        <h1 className="text-xl text-red-400">Error</h1>
+        <p>{message}</p>
+      </div>
+    </Card>
+  );
+}

src/app/components/navbar.tsx

@@ -9,8 +9,8 @@ type Page = {
 };
 
 const pages: Page[] = [
-  { title: "Player", url: "/player/Notch" },
-  { title: "Server", url: "/server/java/hypixel.net" },
+  { title: "Player", url: "/player" },
+  { title: "Server", url: "/server/java" },
   { title: "Mojang", url: "/mojang" },
 ];
 

src/app/components/not-found.tsx

@@ -1,12 +0,0 @@
-type NotFoundProps = {
-  message: string;
-};
-
-export function NotFound({ message }: NotFoundProps): JSX.Element {
-  return (
-    <div className="flex flex-col justify-center text-center">
-      <h1 className="text-xl text-red-400">Not Found</h1>
-      <p>{message}</p>
-    </div>
-  );
-}

src/app/components/server/lookup-server.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { ServerPlatform } from "mcutils-library/dist/types/server/platform";
+import { ServerPlatform } from "mcutils-library";
 import { useRouter } from "next/navigation";
 import { useState } from "react";
 import { Button } from "../ui/button";

src/app/globals.css

@@ -12,7 +12,7 @@
     --popover-foreground: 240 10% 3.9%;
     --primary: 142.1 76.2% 36.3%;
     --primary-foreground: 355.7 100% 97.3%;
-    --secondary: 0 0% 100%;
+    --secondary: 5 5% 95%;
     --secondary-foreground: 240 5.9% 10%;
     --muted: 240 4.8% 95.9%;
     --muted-foreground: 240 3.8% 46.1%;
@@ -43,7 +43,7 @@
     --accent-foreground: 0 0% 98%;
     --destructive: 0 62.8% 30.6%;
     --destructive-foreground: 0 85.7% 97.3%;
-    --border: 240 3.7% 15.9%;
+    --border: 240 5.9% 30%;
     --input: 240 3.7% 15.9%;
     --ring: 142.4 71.8% 29.2%;
   }