Improve MineGeo interface and functionality

app/servers/[id]/page.tsx

@@ -1,3 +1,4 @@
+import { getI18n } from "@/lib/i18n";
 import { notFound } from "next/navigation";
 import Image from "next/image";
 import { Header, Footer } from "@/components/Shell";
@@ -10,6 +11,7 @@ export default async function ServerPage({
 }: {
   params: Promise<{ id: string }>;
 }) {
+  const { t } = await getI18n();
   const { id } = await params;
   const map = await getMap(id);
   if (!map) notFound();
@@ -18,15 +20,19 @@ export default async function ServerPage({
       <Header />
       <main className="section page-content">
         <span className="eyebrow">
-          {map.source === "plugin" ? "SERVER EXPORT" : "PLAYER CONTRIBUTION"} ·
-          MINECRAFT 1.21.11
+          {map.source === "plugin"
+            ? t("SERVER EXPORT")
+            : t("PLAYER CONTRIBUTION")}{" "}
+          {t("· MINECRAFT 1.21.11")}
         </span>
         <h1>{map.name}</h1>
         <p className="lead">{map.description}</p>
-        <p className="map-credit">Created by {map.credit}</p>
+        <p className="map-credit">
+          {t("Created by")} {map.credit}
+        </p>
         <ReportContent datasetId={id} />
         <p className="muted">
-          Map ID: <code>{map.id}</code>
+          {t("Map ID:")} <code>{map.id}</code>
         </p>
         <div className="detail-grid">
           <div>
@@ -41,11 +47,13 @@ export default async function ServerPage({
               />
             </div>
             <div className="card-meta">
-              <span>{map.panorama_count} panoramas</span>
-              <span>Overworld surface</span>
+              <span>
+                {map.panorama_count} {t("panoramas")}
+              </span>
+              <span>{t("Overworld surface")}</span>
               <span>
                 {map.bounds.maxX - map.bounds.minX} ×{" "}
-                {map.bounds.maxZ - map.bounds.minZ} blocks
+                {map.bounds.maxZ - map.bounds.minZ} {t("blocks")}
               </span>
             </div>
           </div>

app/servers/page.tsx

@@ -1,24 +1,31 @@
+import { getI18n } from "@/lib/i18n";
 import { Header, Footer, EmptyState } from "@/components/Shell";
 import { catalog } from "@/lib/catalog";
 import { CatalogBrowser } from "@/components/CatalogBrowser";
 export const dynamic = "force-dynamic";
 export default async function Servers() {
+  const { t } = await getI18n();
   const maps = await catalog();
   return (
     <>
       <Header />
       <main className="section page-content">
-        <span className="eyebrow">THE COMMUNITY AT YOUR COORDINATES</span>
-        <h1>Explore the worlds.</h1>
+        <span className="eyebrow">
+          {t("THE COMMUNITY AT YOUR COORDINATES")}
+        </span>
+        <h1>{t("Explore the worlds.")}</h1>
         <p className="lead">
-          From familiar spawn towns to places nobody’s quite sure about. Pick
-          your next expedition.
+          {t(
+            "From familiar spawn towns to places nobody’s quite sure about. Pick your next expedition.",
+          )}
         </p>
         {maps.length ? (
           <CatalogBrowser maps={maps} />
         ) : (
-          <EmptyState title="Fresh chunks, fresh start">
-            No maps have been approved yet. Your server could be the first.
+          <EmptyState title={t("Fresh chunks, fresh start")}>
+            {t(
+              "No maps have been approved yet. Your server could be the first.",
+            )}
           </EmptyState>
         )}
       </main>