Improve MineGeo interface and functionality

components/Pairing.tsx

@@ -1,7 +1,10 @@
 "use client";
+import { useI18n } from "@/components/I18nProvider";
+
 import { useState } from "react";
 import { api } from "./StartGame";
 export function Pairing({ code }: { code: string }) {
+  const { t } = useI18n();
   const [message, setMessage] = useState(""),
     [busy, setBusy] = useState(false);
   async function approve() {
@@ -17,22 +20,23 @@ export function Pairing({ code }: { code: string }) {
   }
   return (
     <div className="auth-card">
-      <span className="eyebrow">LINK YOUR CAPTURE CLIENT</span>
+      <span className="eyebrow">{t("LINK YOUR CAPTURE CLIENT")}</span>
       <h2>{code}</h2>
       <p className="muted">
-        Approve only if this code is displayed by your MineGeo Fabric mod.
-        Linking lets that client upload private map drafts to your account.
+        {t(
+          "Approve only if this code is displayed by your MineGeo Fabric mod. Linking lets that client upload private map drafts to your account.",
+        )}
       </p>
       <button
         className="button primary full"
         disabled={busy || !!message}
         onClick={approve}
       >
-        Link my Minecraft client
+        {t("Link my Minecraft client")}
       </button>
       {message && (
         <p role="status" className="success-message">
-          {message}
+          {t(message)}
         </p>
       )}
     </div>