-
-
-
- MHSF
- v{version}
+
+
+
+ MHSF
+
+ v{version}
+
-
+
);
}
diff --git a/apps/www/src/components/feat/server-list/server-card.tsx b/apps/www/src/components/feat/server-list/server-card.tsx
new file mode 100644
index 0000000..12d27d4
--- /dev/null
+++ b/apps/www/src/components/feat/server-list/server-card.tsx
@@ -0,0 +1,14 @@
+import type { OnlineServer } from "@/lib/types/mh-server";
+import IconDisplay from "../icons/minecraft-icon-display";
+import { Material } from "@/components/ui/material";
+
+export default function ServerCard({ server }: { server: OnlineServer }) {
+ return (
+
+
+
+ {server.name}
+
+
+ );
+}
diff --git a/apps/www/src/components/feat/server-list/server-list.tsx b/apps/www/src/components/feat/server-list/server-list.tsx
index e2bbb25..79cdee3 100644
--- a/apps/www/src/components/feat/server-list/server-list.tsx
+++ b/apps/www/src/components/feat/server-list/server-list.tsx
@@ -1,4 +1,39 @@
"use client";
+import { Spinner } from "@/components/ui/spinner";
+import { useServers } from "@/lib/hooks/use-servers";
+import ServerCard from "./server-card";
+import { Separator } from "@/components/ui/separator";
+import { Statistics } from "./statistics";
+
export function ServerList() {
- return Server List ;
+ const { servers, loading, serverCount, playerCount } = useServers();
+
+ if (loading)
+ return (
+
+
+
+ );
+
+ return (
+
+
+ Statistics
+
+
+
+
+ Servers
+
+
+ {servers.map((c) => (
+
+ ))}
+
+
+ );
}
diff --git a/apps/www/src/components/feat/server-list/statistics.tsx b/apps/www/src/components/feat/server-list/statistics.tsx
new file mode 100644
index 0000000..481397b
--- /dev/null
+++ b/apps/www/src/components/feat/server-list/statistics.tsx
@@ -0,0 +1,29 @@
+import { Material } from "@/components/ui/material";
+import type { OnlineServer } from "@/lib/types/mh-server";
+
+export function Statistics({
+ totalPlayers,
+ totalServers,
+ topServer,
+}: {
+ totalPlayers: number;
+ totalServers: number;
+ topServer: OnlineServer;
+}) {
+ return (
+
+
+ Total Players
+ {totalPlayers}
+
+
+ Total Servers
+ {totalServers}
+
+
+ Top Server
+ {topServer.name}
+
+
+ );
+}
diff --git a/apps/www/src/components/icon.tsx b/apps/www/src/components/icon.tsx
index fc93891..597911f 100644
--- a/apps/www/src/components/icon.tsx
+++ b/apps/www/src/components/icon.tsx
@@ -189,7 +189,7 @@ export function BrandingPrideIcon(props: SVGProps) {
export function BrandingGenericIcon(props: SVGProps) {
const { resolvedTheme } = useTheme();
- if (resolvedTheme == "dark") {
+ if (resolvedTheme === "dark") {
return (