Translate admin panel to all 6 languages

src/app/admin/users/page.tsx

@@ -2,6 +2,7 @@ import Link from "next/link";
 import { StatusCard } from "@/components/admin/dashboard";
 import { ConfirmAction } from "@/components/admin/confirm-action";
 import { prisma } from "@/lib/prisma";
+import { getTranslations } from "next-intl/server";
 
 export const dynamic = "force-dynamic";
 
@@ -13,6 +14,7 @@ export default async function AdminUsers({
   searchParams: Promise<{ q?: string; page?: string; form?: string }>;
 }) {
   const sp = await searchParams;
+  const t = await getTranslations("pages.admin.users");
   const q = (sp.q ?? "").trim();
   const page = Math.max(1, Number(sp.page ?? "1") || 1);
   const where = q ? { username: { contains: q } } : {};
@@ -33,16 +35,16 @@ export default async function AdminUsers({
 
   return (
     <main>
-      <h1>Users</h1>
+      <h1>{t("title")}</h1>
       <p className="muted" style={{ marginTop: "-0.4rem" }}>
-        {q ? `Search results for “${q}”.` : "Most recent accounts first."}
+        {q ? t("searchResults", { count: total, query: q }) : t("subtitle")}
       </p>
 
       <div className="grid grid-cols-[repeat(auto-fit,minmax(180px,1fr))] gap-3.5 mb-6">
-        <StatusCard label="Total users" value={total} icon="👥" />
-        <StatusCard label="On this page" value={users.length} icon="📄" />
+        <StatusCard label={t("title")} value={total} icon="👥" />
+        <StatusCard label={t("onThisPage")} value={users.length} icon="📄" />
         <StatusCard
-          label="Online (page)"
+          label={t("colOnline")}
           value={onlineOnPage}
           state={onlineOnPage > 0 ? "ok" : "neutral"}
           icon="🟢"
@@ -56,29 +58,29 @@ export default async function AdminUsers({
          <input
            name="q"
            defaultValue={q}
-           placeholder="Search username"
+           placeholder={t("searchPlaceholder")}
            style={{ flex: 1, minWidth: 200 }}
          />
          <button type="submit" className="btn btn-primary">
-           Search
+           {t("search")}
          </button>
        </form>
 
       <section className="mt-6">
-        <h2>Accounts ({total})</h2>
+        <h2>{t("title")} ({total})</h2>
         {users.length === 0 ? (
-          <p className="muted">No users match this search.</p>
+          <p className="muted">{t("noResults")}</p>
         ) : (
           <div style={{ overflowX: "auto" }}>
             <table className="w-full">
               <thead>
                 <tr>
-                  <th>ID</th>
-                  <th>Username</th>
-                  <th>Rank</th>
-                  <th>Credits</th>
-                  <th>Status</th>
-                  <th style={{ width: "200px" }}>Actions</th>
+                  <th>{t("colId")}</th>
+                  <th>{t("colUsername")}</th>
+                  <th>{t("colRank")}</th>
+                  <th>{t("detail.credits")}</th>
+                  <th>{t("colOnline")}</th>
+                  <th style={{ width: "200px" }}>{t("colActions")}</th>
                 </tr>
               </thead>
               <tbody>
@@ -92,15 +94,15 @@ export default async function AdminUsers({
                     <td>{u.credits}</td>
                     <td>
                       <span className={`inline-block text-[0.72rem] font-bold px-2 py-0.5 rounded-full ${u.online === "1" ? "bg-green-600/20 text-[var(--color-text)]" : "bg-[var(--color-primary)]/18 text-[var(--color-text)]"}`}>
-                        {u.online === "1" ? "online" : "offline"}
+                        {u.online === "1" ? t("colOnline") : t("offline")}
                       </span>
                     </td>
                     <td>
                       <div style={{ display: "flex", gap: "0.25rem", flexWrap: "wrap", justifyContent: "flex-start" }}>
-                        <Link href={`/admin/users/${u.id}/edit`} className="btn btn-outline" style={{ fontSize: "0.75rem", padding: "0.25rem 0.5rem" }}>Edit</Link>
-                        <ConfirmAction message={`Set rank for ${u.username}?`} action="set_rank" userId={u.id} className="btn btn-outline" style={{ fontSize: "0.75rem", padding: "0.25rem 0.5rem" }}>Set Rank</ConfirmAction>
-                        <ConfirmAction message={`Disconnect ${u.username}?`} action="disconnect" userId={u.id} className="btn btn-danger" style={{ fontSize: "0.75rem", padding: "0.25rem 0.5rem" }}>Disconnect</ConfirmAction>
-                        <ConfirmAction message={`Send alert to ${u.username}?`} action="alert" userId={u.id} className="btn btn-primary" style={{ fontSize: "0.75rem", padding: "0.25rem 0.5rem" }}>Alert</ConfirmAction>
+                        <Link href={`/admin/users/${u.id}/edit`} className="btn btn-outline" style={{ fontSize: "0.75rem", padding: "0.25rem 0.5rem" }}>{t("edit")}</Link>
+                        <ConfirmAction message={t("confirmSetRank", { username: u.username })} action="set_rank" userId={u.id} className="btn btn-outline" style={{ fontSize: "0.75rem", padding: "0.25rem 0.5rem" }}>{t("setRank")}</ConfirmAction>
+                        <ConfirmAction message={t("confirmDisconnect", { username: u.username })} action="disconnect" userId={u.id} className="btn btn-danger" style={{ fontSize: "0.75rem", padding: "0.25rem 0.5rem" }}>{t("disconnect")}</ConfirmAction>
+                        <ConfirmAction message={t("confirmAlert", { username: u.username })} action="alert" userId={u.id} className="btn btn-primary" style={{ fontSize: "0.75rem", padding: "0.25rem 0.5rem" }}>{t("alert")}</ConfirmAction>
                       </div>
                     </td>
                   </tr>
@@ -112,11 +114,11 @@ export default async function AdminUsers({
       </section>
 
       <p className="muted">
-        Page {page} / {pages} · {total} users
+        {t("pagination", { page, pages, total })}
         {page < pages ? (
           <>
             {" · "}
-            <Link href={`/admin/users?q=${encodeURIComponent(q)}&page=${page + 1}`}>Next →</Link>
+            <Link href={`/admin/users?q=${encodeURIComponent(q)}&page=${page + 1}`}>{t("next")} →</Link>
           </>
         ) : null}
       </p>