move stats to the main page

src/app/(pages)/page.tsx

@@ -1,7 +1,9 @@
 import Link from "next/link";
 import { Button } from "../components/ui/button";
 import { Tooltip, TooltipContent, TooltipTrigger } from "../components/ui/tooltip";
+import { Separator } from "../components/ui/separator";
 import { ReactElement } from "react";
+import { Stats } from "@/app/components/stats";
 
 type Button = {
   title: string;
@@ -27,14 +29,16 @@ const buttons: Button[] = [
 
 export default function Home(): ReactElement {
   return (
-    <div className="text-center flex flex-col justify-center">
-      <h1 className="text-4xl mb-2">Minecraft Utilities</h1>
-      <div className="text-lg">
-        <p>Minecraft Utilities offers you many endpoints to get information about a minecraft server or a player.</p>
-        <p>We offer you a simple and easy to use API.</p>
+    <div className="text-center flex flex-col gap-4">
+      <div>
+        <h1 className="text-4xl mb-2">Minecraft Utilities</h1>
+        <div className="text-lg">
+          <p>Minecraft Utilities offers you many endpoints to get information about a minecraft server or a player.</p>
+          <p>We offer you a simple and easy to use API.</p>
+        </div>
       </div>
 
-      <div className="mt-6 flex flex-row gap-2 justify-center">
+      <div className="flex flex-row gap-2 justify-center">
         {buttons.map((button, index) => {
           return (
             <Tooltip key={index}>
@@ -52,6 +56,16 @@ export default function Home(): ReactElement {
           );
         })}
       </div>
+
+      <Separator className="mt-6 mb-6" />
+
+      <div className="flex flex-col gap-4 items-center">
+        <div className="text-center">
+          <p className="font-semibold text-xl">API Statistics</p>
+          <p>View the statistics for the API in real-time!</p>
+        </div>
+        <Stats />
+      </div>
     </div>
   );
 }

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

@@ -1,21 +0,0 @@
-import { ReactElement } from "react";
-import { Stats } from "@/app/components/stats";
-import { Metadata } from "next";
-
-export const metadata: Metadata = {
-  openGraph: {
-    description: "Click to view the API statistics",
-  },
-};
-
-export default async function Page(): Promise<ReactElement> {
-  return (
-    <div className="flex flex-col gap-4 items-center">
-      <div className="text-center">
-        <p className="font-semibold text-xl">API Statistics</p>
-        <p>View the statistics for the API in real-time!</p>
-      </div>
-      <Stats />
-    </div>
-  );
-}

src/app/components/container.tsx

@@ -8,7 +8,7 @@ export default function Container({
   return (
     <div className="z-[9999] m-auto flex h-screen min-h-full flex-col items-center opacity-90 w-full xs:max-w-[1200px]">
       <NavBar />
-      <div className="w-full h-full flex m-4 justify-center">{children}</div>
+      <div className="w-full flex m-4 justify-center">{children}</div>
     </div>
   );
 }