Translate admin panel to all 6 languages

src/app/admin/radio/moderation/page.tsx

@@ -3,6 +3,7 @@ import { prisma } from '@/lib/prisma';
 import { deleteShout } from '@/actions/admin-radio-moderation';
 import { StatusCard } from '@/components/admin/dashboard';
 import { Shield } from 'lucide-react';
+import { getTranslations } from "next-intl/server";
 
 export const dynamic = 'force-dynamic';
 
@@ -15,10 +16,12 @@ type Shout = {
 };
 
 function formatDate(d: Date | null): string {
-  return d ? d.toISOString().slice(0, 16).replace('T', ' ') : '—';
+  return d ? d.toISOString().slice(0, 16).replace('T', ' ') : '\u2014';
 }
 
 export default async function AdminRadioModerationPage() {
+  const t = await getTranslations("pages.admin.radio");
+
   let shouts: Shout[] = [];
   try {
     shouts = await prisma.radioShouts.findMany({
@@ -39,12 +42,12 @@ export default async function AdminRadioModerationPage() {
   return (
     <main>
       <nav className="text-xs text-gray-500 dark:text-gray-400 mb-2">
-        <Link href="/admin/radio">Radio</Link> ·{' '}
-        <Link href="/admin/radio/moderation">Moderation</Link> ·{' '}
-        <Link href="/admin/radio/settings">Settings</Link> ·{' '}
-        <Link href="/admin/radio/banners">Banners</Link> ·{' '}
-        <Link href="/admin/radio/ranks">Ranks</Link> ·{' '}
-        <Link href="/admin/radio/history">History</Link>
+        <Link href="/admin/radio">{t("title")}</Link> ·{' '}
+        <Link href="/admin/radio/moderation">{t("moderation")}</Link> ·{' '}
+        <Link href="/admin/radio/settings">{t("settings")}</Link> ·{' '}
+        <Link href="/admin/radio/banners">{t("banners.title")}</Link> ·{' '}
+        <Link href="/admin/radio/ranks">{t("ranks")}</Link> ·{' '}
+        <Link href="/admin/radio/history">{t("history")}</Link>
       </nav>
 
       <div className="flex items-center gap-3 mb-6">
@@ -52,27 +55,27 @@ export default async function AdminRadioModerationPage() {
           <Shield size={20} className="text-[var(--color-primary)]" />
         </div>
         <div>
-          <h1 className="m-0 text-xl font-extrabold text-[var(--color-text)]">DJ Moderation</h1>
-          <p className="m-0 text-xs text-[var(--color-text-muted)] mt-0.5">Review and remove radio shouts (50 most recent).</p>
+          <h1 className="m-0 text-xl font-extrabold text-[var(--color-text)]">{t("moderationPage.title")}</h1>
+          <p className="m-0 text-xs text-[var(--color-text-muted)] mt-0.5">{t("moderationPage.subtitle")}</p>
         </div>
       </div>
 
       <div className="grid grid-cols-[repeat(auto-fit,minmax(180px,1fr))] gap-3.5 mb-6">
-        <StatusCard label="Recent shouts" value={shouts.length} icon="📣" />
+        <StatusCard label={t("shouts")} value={shouts.length} icon="\u{1F4E3}" />
       </div>
 
       <section className="mt-6">
-        <h2 className="admin-section-title">Recent Shouts ({shouts.length})</h2>
+        <h2 className="admin-section-title">{t("moderationPage.recentShouts", { count: shouts.length })}</h2>
         {shouts.length === 0 ? (
-          <div className="admin-empty">No shouts to moderate.</div>
+          <div className="admin-empty">{t("noShouts")}</div>
         ) : (
           <table>
             <thead>
               <tr>
                 <th>ID</th>
-                <th>User</th>
-                <th>Message</th>
-                <th>Posted</th>
+                <th>{t("user")}</th>
+                <th>{t("message")}</th>
+                <th>{t("posted")}</th>
                 <th />
               </tr>
             </thead>
@@ -87,7 +90,7 @@ export default async function AdminRadioModerationPage() {
                     <form action={deleteShout}>
                       <input type="hidden" name="id" value={String(s.id)} />
                       <button type="submit" className="btn btn-danger">
-                        Delete
+                        {t("deleteShout")}
                       </button>
                     </form>
                   </td>