Translate admin panel to all 6 languages
This commit is contained in:
openhands committed
1 parent
f381aa987f
commit
befa4ec282
63 files changed
+9353
-1443
No files matched your search
@@ -7,6 +7,7 @@ import {
|
||||
import { prisma } from '@/lib/prisma';
|
||||
import { StatusCard } from '@/components/admin/dashboard';
|
||||
import { Image } from 'lucide-react';
|
||||
import { getTranslations } from "next-intl/server";
|
||||
|
||||
export const dynamic = 'force-dynamic';
|
||||
|
||||
@@ -22,10 +23,12 @@ type Banner = {
|
||||
};
|
||||
|
||||
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 AdminRadioBannersPage() {
|
||||
const t = await getTranslations("pages.admin.radio");
|
||||
|
||||
let banners: Banner[] = [];
|
||||
let dbError = false;
|
||||
|
||||
@@ -54,11 +57,11 @@ export default async function AdminRadioBannersPage() {
|
||||
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/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/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">
|
||||
@@ -66,60 +69,60 @@ export default async function AdminRadioBannersPage() {
|
||||
<Image size={20} className="text-[var(--color-primary)]" />
|
||||
</div>
|
||||
<div>
|
||||
<h1 className="m-0 text-xl font-extrabold text-[var(--color-text)]">Radio Banners</h1>
|
||||
<p className="m-0 text-xs text-[var(--color-text-muted)] mt-0.5">Promotional banners shown on the radio page, ordered by sort order.</p>
|
||||
<h1 className="m-0 text-xl font-extrabold text-[var(--color-text)]">{t("banners.heading")}</h1>
|
||||
<p className="m-0 text-xs text-[var(--color-text-muted)] mt-0.5">{t("banners.description")}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{dbError ? (
|
||||
<div className="admin-card mb-6">
|
||||
<p className="text-xs text-gray-500 dark:text-gray-400 m-0">
|
||||
Could not load banners (database unavailable).
|
||||
{t("banners.dbError")}
|
||||
</p>
|
||||
</div>
|
||||
) : (
|
||||
<div className="grid grid-cols-[repeat(auto-fit,minmax(180px,1fr))] gap-3.5 mb-6">
|
||||
<StatusCard label="Banners" value={banners.length} icon="🖼️" />
|
||||
<StatusCard label={t("banners.title")} value={banners.length} icon="\u{1F5BC}\uFE0F" />
|
||||
<StatusCard
|
||||
label="Active"
|
||||
label={t("banners.statusActive")}
|
||||
value={activeCount}
|
||||
state={activeCount > 0 ? 'ok' : 'neutral'}
|
||||
icon="✅"
|
||||
icon="\u{2705}"
|
||||
/>
|
||||
<StatusCard
|
||||
label="Hidden"
|
||||
label={t("banners.statusHidden")}
|
||||
value={hiddenCount}
|
||||
state={hiddenCount > 0 ? 'warn' : 'neutral'}
|
||||
icon="🚫"
|
||||
icon="\u{1F6AB}"
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<section className="mt-6">
|
||||
<h2 className="admin-section-title">Add banner</h2>
|
||||
<h2 className="admin-section-title">{t("banners.addBanner")}</h2>
|
||||
<form action={createRadioBanner} className="admin-card">
|
||||
<div className="grid cols-2">
|
||||
<div>
|
||||
<label htmlFor="new_imagePath" style={{ display: 'block', fontWeight: 700 }}>
|
||||
Image path / URL
|
||||
{t("banners.form.imagePath")}
|
||||
</label>
|
||||
<input
|
||||
id="new_imagePath"
|
||||
name="imagePath"
|
||||
placeholder="/storage/radio/banner.png"
|
||||
placeholder={t("banners.form.imagePathPlaceholder")}
|
||||
required
|
||||
style={{ width: '100%' }}
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label htmlFor="new_title" style={{ display: 'block', fontWeight: 700 }}>
|
||||
Title
|
||||
{t("banners.form.title")}
|
||||
</label>
|
||||
<input id="new_title" name="title" style={{ width: '100%' }} />
|
||||
</div>
|
||||
<div style={{ gridColumn: '1 / -1' }}>
|
||||
<label htmlFor="new_description" style={{ display: 'block', fontWeight: 700 }}>
|
||||
Description
|
||||
{t("banners.form.description")}
|
||||
</label>
|
||||
<textarea
|
||||
id="new_description"
|
||||
@@ -130,7 +133,7 @@ export default async function AdminRadioBannersPage() {
|
||||
</div>
|
||||
<div>
|
||||
<label htmlFor="new_sortOrder" style={{ display: 'block', fontWeight: 700 }}>
|
||||
Sort order
|
||||
{t("banners.form.sortOrder")}
|
||||
</label>
|
||||
<input
|
||||
id="new_sortOrder"
|
||||
@@ -142,22 +145,22 @@ export default async function AdminRadioBannersPage() {
|
||||
</div>
|
||||
<div style={{ display: 'flex', alignItems: 'flex-end' }}>
|
||||
<label style={{ display: 'inline-flex', gap: '0.4rem', alignItems: 'center' }}>
|
||||
<input type="checkbox" name="isActive" value="1" defaultChecked /> Active
|
||||
<input type="checkbox" name="isActive" value="1" defaultChecked /> {t("banners.form.active")}
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div style={{ marginTop: '0.75rem' }}>
|
||||
<button type="submit" className="btn btn-primary">
|
||||
Create banner
|
||||
{t("banners.createBanner")}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</section>
|
||||
|
||||
<section className="mt-6">
|
||||
<h2 className="admin-section-title">Existing banners ({banners.length})</h2>
|
||||
<h2 className="admin-section-title">{t("banners.existing", { count: banners.length })}</h2>
|
||||
{banners.length === 0 ? (
|
||||
<div className="admin-empty">No banners yet — add one above.</div>
|
||||
<div className="admin-empty">{t("banners.noBanners")}</div>
|
||||
) : (
|
||||
<div className="grid">
|
||||
{banners.map((b) => (
|
||||
@@ -165,9 +168,9 @@ export default async function AdminRadioBannersPage() {
|
||||
<div className="flex justify-between items-baseline gap-3">
|
||||
<strong>#{String(b.id)}</strong>
|
||||
<span className="text-sm text-gray-500 dark:text-gray-400 inline-flex gap-2 items-center">
|
||||
by user {String(b.userId)} · {formatDate(b.createdAt)} ·{' '}
|
||||
{t("banners.byUser", { id: String(b.userId) })} · {formatDate(b.createdAt)} ·{' '}
|
||||
<span className={`inline-block text-[0.72rem] font-bold px-2 py-0.5 rounded-full ${b.isActive ? 'bg-green-600/20 text-[var(--color-text)]' : 'bg-red-500/22 text-[var(--color-text)]'}`}>
|
||||
{b.isActive ? 'active' : 'hidden'}
|
||||
{b.isActive ? t("banners.active") : t("banners.hidden")}
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
@@ -175,7 +178,7 @@ export default async function AdminRadioBannersPage() {
|
||||
{b.imagePath ? (
|
||||
<img
|
||||
src={b.imagePath}
|
||||
alt={b.title ?? 'Radio banner'}
|
||||
alt={b.title ?? t("banners.bannerAlt")}
|
||||
className="article-img my-2"
|
||||
/>
|
||||
) : null}
|
||||
@@ -188,7 +191,7 @@ export default async function AdminRadioBannersPage() {
|
||||
htmlFor={`img_${b.id}`}
|
||||
style={{ display: 'block', fontWeight: 700 }}
|
||||
>
|
||||
Image path / URL
|
||||
{t("banners.form.imagePath")}
|
||||
</label>
|
||||
<input
|
||||
id={`img_${b.id}`}
|
||||
@@ -203,7 +206,7 @@ export default async function AdminRadioBannersPage() {
|
||||
htmlFor={`title_${b.id}`}
|
||||
style={{ display: 'block', fontWeight: 700 }}
|
||||
>
|
||||
Title
|
||||
{t("banners.form.title")}
|
||||
</label>
|
||||
<input
|
||||
id={`title_${b.id}`}
|
||||
@@ -217,7 +220,7 @@ export default async function AdminRadioBannersPage() {
|
||||
htmlFor={`desc_${b.id}`}
|
||||
style={{ display: 'block', fontWeight: 700 }}
|
||||
>
|
||||
Description
|
||||
{t("banners.form.description")}
|
||||
</label>
|
||||
<textarea
|
||||
id={`desc_${b.id}`}
|
||||
@@ -232,7 +235,7 @@ export default async function AdminRadioBannersPage() {
|
||||
htmlFor={`sort_${b.id}`}
|
||||
style={{ display: 'block', fontWeight: 700 }}
|
||||
>
|
||||
Sort order
|
||||
{t("banners.form.sortOrder")}
|
||||
</label>
|
||||
<input
|
||||
id={`sort_${b.id}`}
|
||||
@@ -252,13 +255,13 @@ export default async function AdminRadioBannersPage() {
|
||||
value="1"
|
||||
defaultChecked={b.isActive}
|
||||
/>{' '}
|
||||
Active
|
||||
{t("banners.form.active")}
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div style={{ marginTop: '0.6rem' }}>
|
||||
<button type="submit" className="btn btn-primary">
|
||||
Save
|
||||
{t("banners.save")}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
@@ -266,7 +269,7 @@ export default async function AdminRadioBannersPage() {
|
||||
<form action={deleteRadioBanner} style={{ marginTop: '0.5rem' }}>
|
||||
<input type="hidden" name="id" value={String(b.id)} />
|
||||
<button type="submit" className="btn btn-danger">
|
||||
Delete
|
||||
{t("banners.delete")}
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
Reference in new issue
Block a user