Update server page embed color

Frontend/package.json

@@ -29,6 +29,7 @@
     "class-variance-authority": "^0.7.0",
     "clipboard-copy": "^4.0.1",
     "clsx": "^2.1.0",
+    "fast-average-color": "^9.4.0",
     "lucide-react": "^0.372.0",
     "next": "14.2.2",
     "next-plausible": "^3.12.0",

Frontend/src/app/(pages)/server/[[...slug]]/page.tsx

@@ -16,6 +16,7 @@ import {
     type RestfulMCAPIError,
     ServerPlatform,
 } from "restfulmc-lib";
+import { FastAverageColor, FastAverageColorResult } from "fast-average-color";
 
 /**
  * The page to lookup a server.
@@ -143,8 +144,25 @@ export const generateViewport = async ({
     const hostname: string | undefined = params.slug?.[1]; // The hostname of the server to search for
     if (platform && hostname) {
         try {
-            await getMinecraftServer(platform as ServerPlatform, hostname); // Get the server embed
-            return { themeColor: "#55FF55" }; // Online
+            const server:
+                | CachedJavaMinecraftServer
+                | CachedBedrockMinecraftServer = await getMinecraftServer(
+                platform as ServerPlatform,
+                hostname
+            ); // Get the server to embed
+
+            let color: string = "#55FF55";
+
+            // Get the average color of the server favicon
+            if (platform == ServerPlatform.JAVA) {
+                const averageColor: FastAverageColorResult =
+                    await new FastAverageColor().getColorAsync(
+                        (server as CachedJavaMinecraftServer).favicon?.url || ""
+                    );
+                color = averageColor.hex;
+            }
+
+            return { themeColor: color }; // Online
         } catch (err) {
             return { themeColor: "#AA0000" }; // Error
         }