remco/EpicNext-Cms
1
1 Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Revert "Add missing admin action files and navigation links"

Browse Source 
This reverts commit 41be6835bf.
This commit is contained in:
Simo committed 2026-07-11 20:37:56 +02:00
1 parent 4a1e1115b3
commit 4d515bc400
338 files changed
+5949 -28144
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/app/admin/radio/api-keys/page.tsx
+12 -20
View File
@@ -90,7 +90,9 @@ export default async function AdminRadioApiKeysPage() {
{dbError ? (
<div className="admin-card" style={{ marginTop: "1rem" }}>
<p className="text-xs text-gray-500 dark:text-gray-400 m-0">{t("apiKeysForm.dbError")}</p>
<p className="text-xs text-gray-500 dark:text-gray-400 m-0">
{t("apiKeysForm.dbError")}
</p>
</div>
) : (
<div className="grid grid-cols-[repeat(auto-fit,minmax(180px,1fr))] gap-3.5 mb-6">
@@ -113,7 +115,9 @@ export default async function AdminRadioApiKeysPage() {
<section className="mt-6">
<h2>{t("apiKeysForm.generateKey")}</h2>
<p className="text-xs text-gray-500 dark:text-gray-400">{t("apiKeysForm.generateHint")}</p>
<p className="text-xs text-gray-500 dark:text-gray-400">
{t("apiKeysForm.generateHint")}
</p>
<form action={createApiKey} className="admin-card">
<div className="grid grid-cols-1 gap-4 md:grid-cols-2">
<div>
@@ -186,29 +190,17 @@ export default async function AdminRadioApiKeysPage() {
<tbody>
{keys.map((k) => (
<tr key={String(k.id)}>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">
{String(k.id)}
</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">{String(k.id)}</td>
<td>{k.name}</td>
<td>
<code title={t("apiKeysForm.maskedHint")}>{maskKey(k.key)}</code>
</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">
{k.allowedIps || t("apiKeysForm.any")}
</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">
{k.rateLimit}/min
</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">
{formatDate(k.lastUsedAt)}
</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">
{formatDate(k.expiresAt)}
</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">{k.allowedIps || t("apiKeysForm.any")}</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">{k.rateLimit}/min</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">{formatDate(k.lastUsedAt)}</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">{formatDate(k.expiresAt)}</td>
<td>
<span
className={`inline-block text-[0.72rem] font-bold px-2 py-0.5 rounded-full ${k.isActive ? "bg-green-600/20 text-[var(--color-text)]" : "bg-red-500/22 text-[var(--color-text)]"}`}
>
<span className={`inline-block text-[0.72rem] font-bold px-2 py-0.5 rounded-full ${k.isActive ? "bg-green-600/20 text-[var(--color-text)]" : "bg-red-500/22 text-[var(--color-text)]"}`}>
{k.isActive ? t("apiKeysForm.activeLabel") : t("apiKeysForm.inactiveLabel")}
</span>
</td>
src/app/admin/radio/autodj/page.tsx
+47 -59
View File
@@ -1,14 +1,14 @@
import Link from "next/link";
import Image from "next/image";
import { createTrack, deleteTrack, toggleTrack } from "@/actions/admin-radio-autodj";
import { StatusCard } from "@/components/admin/dashboard";
import { prisma } from "@/lib/prisma";
import { Disc3 } from "lucide-react";
import Link from 'next/link';
import Image from 'next/image';
import { createTrack, deleteTrack, toggleTrack } from '@/actions/admin-radio-autodj';
import { StatusCard } from '@/components/admin/dashboard';
import { prisma } from '@/lib/prisma';
import { Disc3 } from 'lucide-react';
import { getTranslations } from "next-intl/server";
export const dynamic = "force-dynamic";
export const dynamic = 'force-dynamic';
export const metadata = { title: "Radio AutoDJ" };
export const metadata = { title: 'Radio AutoDJ' };
type Track = {
id: bigint;
@@ -24,14 +24,14 @@ type Track = {
};
function formatDuration(seconds: number | null): string {
if (seconds == null || seconds < 0) return "\u2014";
if (seconds == null || seconds < 0) return '\u2014';
const m = Math.floor(seconds / 60);
const s = seconds % 60;
return `${m}:${String(s).padStart(2, "0")}`;
return `${m}:${String(s).padStart(2, '0')}`;
}
function formatDate(d: Date | null): string {
return d ? d.toISOString().slice(0, 16).replace("T", " ") : "\u2014";
return d ? d.toISOString().slice(0, 16).replace('T', ' ') : '\u2014';
}
export default async function AdminRadioAutoDjPage() {
@@ -55,7 +55,7 @@ export default async function AdminRadioAutoDjPage() {
isActive: true,
sortOrder: true,
},
orderBy: [{ sortOrder: "asc" }, { title: "asc" }],
orderBy: [{ sortOrder: 'asc' }, { title: 'asc' }],
})
.catch(() => {
dbError = true;
@@ -72,11 +72,11 @@ export default async function AdminRadioAutoDjPage() {
return (
<main>
<nav className="text-xs text-gray-500 dark:text-gray-400 mb-2">
<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> ·{" "}
<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> ·{' '}
<Link href="/admin/radio/autodj">{t("autoDj")}</Link>
</nav>
@@ -93,7 +93,9 @@ export default async function AdminRadioAutoDjPage() {
{dbError ? (
<div className="admin-card mb-6">
<p className="text-xs text-gray-500 dark:text-gray-400 m-0">{t("autoDjForm.dbError")}</p>
<p className="text-xs text-gray-500 dark:text-gray-400 m-0">
{t("autoDjForm.dbError")}
</p>
</div>
) : (
<div className="grid grid-cols-[repeat(auto-fit,minmax(180px,1fr))] gap-3.5 mb-6">
@@ -101,13 +103,13 @@ export default async function AdminRadioAutoDjPage() {
<StatusCard
label={t("autoDjForm.active")}
value={activeCount}
state={activeCount > 0 ? "ok" : "neutral"}
state={activeCount > 0 ? 'ok' : 'neutral'}
icon="\u{25B6}\uFE0F"
/>
<StatusCard
label={t("autoDjForm.inactive")}
value={inactiveCount}
state={inactiveCount > 0 ? "warn" : "neutral"}
state={inactiveCount > 0 ? 'warn' : 'neutral'}
icon="\u{23F8}\uFE0F"
/>
</div>
@@ -119,7 +121,7 @@ export default async function AdminRadioAutoDjPage() {
<form action={createTrack} className="admin-card">
<div className="grid grid-cols-1 gap-4 md:grid-cols-2">
<div>
<label htmlFor="new_title" style={{ display: "block", fontWeight: 700 }}>
<label htmlFor="new_title" style={{ display: 'block', fontWeight: 700 }}>
{t("autoDjForm.title")}
</label>
<input
@@ -127,34 +129,34 @@ export default async function AdminRadioAutoDjPage() {
name="title"
placeholder={t("autoDjForm.titlePlaceholder")}
required
style={{ width: "100%" }}
style={{ width: '100%' }}
/>
</div>
<div>
<label htmlFor="new_artist" style={{ display: "block", fontWeight: 700 }}>
<label htmlFor="new_artist" style={{ display: 'block', fontWeight: 700 }}>
{t("autoDjForm.artist")}
</label>
<input id="new_artist" name="artist" style={{ width: "100%" }} />
<input id="new_artist" name="artist" style={{ width: '100%' }} />
</div>
<div>
<label htmlFor="new_album" style={{ display: "block", fontWeight: 700 }}>
<label htmlFor="new_album" style={{ display: 'block', fontWeight: 700 }}>
{t("autoDjForm.album")}
</label>
<input id="new_album" name="album" style={{ width: "100%" }} />
<input id="new_album" name="album" style={{ width: '100%' }} />
</div>
<div>
<label htmlFor="new_artworkUrl" style={{ display: "block", fontWeight: 700 }}>
<label htmlFor="new_artworkUrl" style={{ display: 'block', fontWeight: 700 }}>
{t("autoDjForm.artworkUrl")}
</label>
<input
id="new_artworkUrl"
name="artworkUrl"
placeholder={t("autoDjForm.artworkUrlPlaceholder")}
style={{ width: "100%" }}
style={{ width: '100%' }}
/>
</div>
<div>
<label htmlFor="new_duration" style={{ display: "block", fontWeight: 700 }}>
<label htmlFor="new_duration" style={{ display: 'block', fontWeight: 700 }}>
{t("autoDjForm.duration")}
</label>
<input
@@ -163,11 +165,11 @@ export default async function AdminRadioAutoDjPage() {
type="number"
min={0}
placeholder={t("autoDjForm.durationPlaceholder")}
style={{ width: "100%" }}
style={{ width: '100%' }}
/>
</div>
<div>
<label htmlFor="new_sortOrder" style={{ display: "block", fontWeight: 700 }}>
<label htmlFor="new_sortOrder" style={{ display: 'block', fontWeight: 700 }}>
{t("autoDjForm.sortOrder")}
</label>
<input
@@ -175,16 +177,16 @@ export default async function AdminRadioAutoDjPage() {
name="sortOrder"
type="number"
defaultValue={0}
style={{ width: "100%" }}
style={{ width: '100%' }}
/>
</div>
<div style={{ display: "flex", alignItems: "flex-end" }}>
<label style={{ display: "inline-flex", gap: "0.4rem", alignItems: "center" }}>
<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 /> {t("autoDjForm.active")}
</label>
</div>
</div>
<div style={{ marginTop: "0.75rem" }}>
<div style={{ marginTop: '0.75rem' }}>
<button type="submit" className="btn btn-primary">
{t("autoDjForm.addTrack")}
</button>
@@ -215,9 +217,7 @@ export default async function AdminRadioAutoDjPage() {
<tbody>
{tracks.map((track) => (
<tr key={String(track.id)}>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">
{track.sortOrder}
</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">{track.sortOrder}</td>
<td>
<span className="inline-flex gap-2 items-center">
{track.artworkUrl ? (
@@ -226,40 +226,28 @@ export default async function AdminRadioAutoDjPage() {
alt=""
width={32}
height={32}
style={{ borderRadius: 4, objectFit: "cover" }}
style={{ borderRadius: 4, objectFit: 'cover' }}
unoptimized
/>
) : null}
<strong>{track.title}</strong>
</span>
</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">
{track.artist ?? "\u2014"}
</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">
{track.album ?? "\u2014"}
</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">
{formatDuration(track.duration)}
</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">
{track.playCount}
</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">
{formatDate(track.lastPlayedAt)}
</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">{track.artist ?? '\u2014'}</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">{track.album ?? '\u2014'}</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">{formatDuration(track.duration)}</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">{track.playCount}</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">{formatDate(track.lastPlayedAt)}</td>
<td>
<span
className={`inline-block text-[0.72rem] font-bold px-2 py-0.5 rounded-full ${track.isActive ? "bg-green-600/20 text-[var(--color-text)]" : "bg-red-500/22 text-[var(--color-text)]"}`}
>
<span className={`inline-block text-[0.72rem] font-bold px-2 py-0.5 rounded-full ${track.isActive ? 'bg-green-600/20 text-[var(--color-text)]' : 'bg-red-500/22 text-[var(--color-text)]'}`}>
{track.isActive ? t("autoDjForm.activeLabel") : t("autoDjForm.inactiveLabel")}
</span>
</td>
<td>
<div style={{ display: "flex", gap: "0.4rem", flexWrap: "wrap" }}>
<div style={{ display: 'flex', gap: '0.4rem', flexWrap: 'wrap' }}>
<form action={toggleTrack}>
<input type="hidden" name="id" value={String(track.id)} />
<input type="hidden" name="isActive" value={track.isActive ? "0" : "1"} />
<input type="hidden" name="isActive" value={track.isActive ? '0' : '1'} />
<button type="submit" className="btn">
{track.isActive ? t("autoDjForm.deactivate") : t("autoDjForm.activate")}
</button>
src/app/admin/radio/banners/page.tsx
+76 -48
View File
@@ -1,12 +1,16 @@
import Link from "next/link";
import { createRadioBanner, deleteRadioBanner, updateRadioBanner } from "@/actions/admin-radio-extra";
import { prisma } from "@/lib/prisma";
import { StatusCard } from "@/components/admin/dashboard";
import NextImage from "next/image";
import { Image as LucideImage } from "lucide-react";
import Link from 'next/link';
import {
createRadioBanner,
deleteRadioBanner,
updateRadioBanner,
} from '@/actions/admin-radio-extra';
import { prisma } from '@/lib/prisma';
import { StatusCard } from '@/components/admin/dashboard';
import NextImage from 'next/image';
import { Image as LucideImage } from 'lucide-react';
import { getTranslations } from "next-intl/server";
export const dynamic = "force-dynamic";
export const dynamic = 'force-dynamic';
type Banner = {
id: bigint;
@@ -20,7 +24,7 @@ type Banner = {
};
function formatDate(d: Date | null): string {
return d ? d.toISOString().slice(0, 16).replace("T", " ") : "\u2014";
return d ? d.toISOString().slice(0, 16).replace('T', ' ') : '\u2014';
}
export default async function AdminRadioBannersPage() {
@@ -41,7 +45,7 @@ export default async function AdminRadioBannersPage() {
isActive: true,
createdAt: true,
},
orderBy: [{ sortOrder: "asc" }, { id: "asc" }],
orderBy: [{ sortOrder: 'asc' }, { id: 'asc' }],
});
} catch {
dbError = true;
@@ -54,10 +58,10 @@ export default async function AdminRadioBannersPage() {
return (
<main>
<nav className="text-xs text-gray-500 dark:text-gray-400 mb-2">
<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">{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>
@@ -73,7 +77,9 @@ export default async function AdminRadioBannersPage() {
{dbError ? (
<div className="admin-card mb-6">
<p className="text-xs text-gray-500 dark:text-gray-400 m-0">{t("banners.dbError")}</p>
<p className="text-xs text-gray-500 dark:text-gray-400 m-0">
{t("banners.dbError")}
</p>
</div>
) : (
<div className="grid grid-cols-[repeat(auto-fit,minmax(180px,1fr))] gap-3.5 mb-6">
@@ -81,13 +87,13 @@ export default async function AdminRadioBannersPage() {
<StatusCard
label={t("banners.statusActive")}
value={activeCount}
state={activeCount > 0 ? "ok" : "neutral"}
state={activeCount > 0 ? 'ok' : 'neutral'}
icon="\u{2705}"
/>
<StatusCard
label={t("banners.statusHidden")}
value={hiddenCount}
state={hiddenCount > 0 ? "warn" : "neutral"}
state={hiddenCount > 0 ? 'warn' : 'neutral'}
icon="\u{1F6AB}"
/>
</div>
@@ -98,7 +104,7 @@ export default async function AdminRadioBannersPage() {
<form action={createRadioBanner} className="admin-card">
<div className="grid grid-cols-1 gap-4 md:grid-cols-2">
<div>
<label htmlFor="new_imagePath" style={{ display: "block", fontWeight: 700 }}>
<label htmlFor="new_imagePath" style={{ display: 'block', fontWeight: 700 }}>
{t("banners.form.imagePath")}
</label>
<input
@@ -106,23 +112,28 @@ export default async function AdminRadioBannersPage() {
name="imagePath"
placeholder={t("banners.form.imagePathPlaceholder")}
required
style={{ width: "100%" }}
style={{ width: '100%' }}
/>
</div>
<div>
<label htmlFor="new_title" style={{ display: "block", fontWeight: 700 }}>
<label htmlFor="new_title" style={{ display: 'block', fontWeight: 700 }}>
{t("banners.form.title")}
</label>
<input id="new_title" name="title" style={{ width: "100%" }} />
<input id="new_title" name="title" style={{ width: '100%' }} />
</div>
<div style={{ gridColumn: "1 / -1" }}>
<label htmlFor="new_description" style={{ display: "block", fontWeight: 700 }}>
<div style={{ gridColumn: '1 / -1' }}>
<label htmlFor="new_description" style={{ display: 'block', fontWeight: 700 }}>
{t("banners.form.description")}
</label>
<textarea id="new_description" name="description" rows={2} style={{ width: "100%" }} />
<textarea
id="new_description"
name="description"
rows={2}
style={{ width: '100%' }}
/>
</div>
<div>
<label htmlFor="new_sortOrder" style={{ display: "block", fontWeight: 700 }}>
<label htmlFor="new_sortOrder" style={{ display: 'block', fontWeight: 700 }}>
{t("banners.form.sortOrder")}
</label>
<input
@@ -130,16 +141,16 @@ export default async function AdminRadioBannersPage() {
name="sortOrder"
type="number"
defaultValue={0}
style={{ width: "100%" }}
style={{ width: '100%' }}
/>
</div>
<div style={{ display: "flex", alignItems: "flex-end" }}>
<label style={{ display: "inline-flex", gap: "0.4rem", alignItems: "center" }}>
<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 /> {t("banners.form.active")}
</label>
</div>
</div>
<div style={{ marginTop: "0.75rem" }}>
<div style={{ marginTop: '0.75rem' }}>
<button type="submit" className="btn btn-primary">
{t("banners.createBanner")}
</button>
@@ -158,10 +169,8 @@ 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">
{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)]"}`}
>
{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 ? t("banners.active") : t("banners.hidden")}
</span>
</span>
@@ -182,7 +191,10 @@ export default async function AdminRadioBannersPage() {
<input type="hidden" name="id" value={String(b.id)} />
<div className="grid grid-cols-1 gap-4 md:grid-cols-2">
<div>
<label htmlFor={`img_${b.id}`} style={{ display: "block", fontWeight: 700 }}>
<label
htmlFor={`img_${b.id}`}
style={{ display: 'block', fontWeight: 700 }}
>
{t("banners.form.imagePath")}
</label>
<input
@@ -190,34 +202,43 @@ export default async function AdminRadioBannersPage() {
name="imagePath"
defaultValue={b.imagePath}
required
style={{ width: "100%" }}
style={{ width: '100%' }}
/>
</div>
<div>
<label htmlFor={`title_${b.id}`} style={{ display: "block", fontWeight: 700 }}>
<label
htmlFor={`title_${b.id}`}
style={{ display: 'block', fontWeight: 700 }}
>
{t("banners.form.title")}
</label>
<input
id={`title_${b.id}`}
name="title"
defaultValue={b.title ?? ""}
style={{ width: "100%" }}
defaultValue={b.title ?? ''}
style={{ width: '100%' }}
/>
</div>
<div style={{ gridColumn: "1 / -1" }}>
<label htmlFor={`desc_${b.id}`} style={{ display: "block", fontWeight: 700 }}>
<div style={{ gridColumn: '1 / -1' }}>
<label
htmlFor={`desc_${b.id}`}
style={{ display: 'block', fontWeight: 700 }}
>
{t("banners.form.description")}
</label>
<textarea
id={`desc_${b.id}`}
name="description"
rows={2}
defaultValue={b.description ?? ""}
style={{ width: "100%" }}
defaultValue={b.description ?? ''}
style={{ width: '100%' }}
/>
</div>
<div>
<label htmlFor={`sort_${b.id}`} style={{ display: "block", fontWeight: 700 }}>
<label
htmlFor={`sort_${b.id}`}
style={{ display: 'block', fontWeight: 700 }}
>
{t("banners.form.sortOrder")}
</label>
<input
@@ -225,24 +246,31 @@ export default async function AdminRadioBannersPage() {
name="sortOrder"
type="number"
defaultValue={b.sortOrder}
style={{ width: "100%" }}
style={{ width: '100%' }}
/>
</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={b.isActive} />{" "}
<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={b.isActive}
/>{' '}
{t("banners.form.active")}
</label>
</div>
</div>
<div style={{ marginTop: "0.6rem" }}>
<div style={{ marginTop: '0.6rem' }}>
<button type="submit" className="btn btn-primary">
{t("banners.save")}
</button>
</div>
</form>
<form action={deleteRadioBanner} style={{ marginTop: "0.5rem" }}>
<form action={deleteRadioBanner} style={{ marginTop: '0.5rem' }}>
<input type="hidden" name="id" value={String(b.id)} />
<button type="submit" className="btn btn-danger">
{t("banners.delete")}
src/app/admin/radio/embed/embed-snippet.tsx
+11 -7
View File
@@ -1,6 +1,6 @@
"use client";
'use client';
import { useState } from "react";
import { useState } from 'react';
/**
* Read-only copy box for an embed snippet. Renders the code inside a
@@ -27,24 +27,28 @@ export function EmbedSnippet({
// Clipboard API unavailable (e.g. insecure context) — fall back to
// selecting the textarea so the user can copy manually.
const el = document.getElementById(
`snippet-${title.replace(/\s+/g, "-").toLowerCase()}`,
`snippet-${title.replace(/\s+/g, '-').toLowerCase()}`,
) as HTMLTextAreaElement | null;
el?.select();
}
}
const id = `snippet-${title.replace(/\s+/g, "-").toLowerCase()}`;
const lines = snippet.split("\n").length;
const id = `snippet-${title.replace(/\s+/g, '-').toLowerCase()}`;
const lines = snippet.split('\n').length;
return (
<section className="mt-6">
<div className="flex items-center justify-between gap-4 mb-1">
<h2 className="m-0 text-base font-bold text-[var(--color-text)]">{title}</h2>
<button type="button" className="btn btn-primary" onClick={copy}>
{copied ? "Copied!" : "Copy"}
{copied ? 'Copied!' : 'Copy'}
</button>
</div>
{description ? <p className="text-xs text-gray-500 dark:text-gray-400 mb-3">{description}</p> : null}
{description ? (
<p className="text-xs text-gray-500 dark:text-gray-400 mb-3">
{description}
</p>
) : null}
<textarea
id={id}
readOnly
src/app/admin/radio/embed/page.tsx
+36 -35
View File
@@ -1,54 +1,54 @@
import Link from "next/link";
import { StatusCard } from "@/components/admin/dashboard";
import { siteSettings } from "@/lib/services/site-settings";
import { requireStaff } from "@/lib/admin/guard";
import { EmbedSnippet } from "./embed-snippet";
import { Code } from "lucide-react";
import Link from 'next/link';
import { StatusCard } from '@/components/admin/dashboard';
import { siteSettings } from '@/lib/services/site-settings';
import { requireStaff } from '@/lib/admin/guard';
import { EmbedSnippet } from './embed-snippet';
import { Code } from 'lucide-react';
import { getTranslations } from "next-intl/server";
export const dynamic = "force-dynamic";
export const dynamic = 'force-dynamic';
export const metadata = { title: "Radio Embed" };
export const metadata = { title: 'Radio Embed' };
export default async function AdminRadioEmbedPage() {
await requireStaff();
const t = await getTranslations("pages.admin.radio");
let streamUrl = "";
let radioName = "Radio";
let nowPlayingApiUrl = "";
let streamUrl = '';
let radioName = 'Radio';
let nowPlayingApiUrl = '';
try {
streamUrl = (await siteSettings.get("radio_stream_url", "")) ?? "";
streamUrl = (await siteSettings.get('radio_stream_url', '')) ?? '';
radioName =
(await siteSettings.get("radio_name", null)) ??
(await siteSettings.get("hotel_name", "Radio")) ??
"Radio";
nowPlayingApiUrl = (await siteSettings.get("radio_now_playing_api_url", "")) ?? "";
(await siteSettings.get('radio_name', null)) ??
(await siteSettings.get('hotel_name', 'Radio')) ??
'Radio';
nowPlayingApiUrl = (await siteSettings.get('radio_now_playing_api_url', '')) ?? '';
} catch {
streamUrl = "";
streamUrl = '';
}
streamUrl = streamUrl.trim();
nowPlayingApiUrl = nowPlayingApiUrl.trim();
const hasStream = streamUrl !== "";
const hasStream = streamUrl !== '';
const audioSnippet = hasStream
? `<audio controls preload="none" src="${streamUrl}">\n ${t("embedPage.audioUnsupported")}\n</audio>`
: "";
: '';
const iframeSnippet = hasStream
? `<iframe\n src="/radio/embed"\n title="${radioName}"\n width="320"\n height="120"\n frameborder="0"\n allow="autoplay"\n style="border:0;border-radius:8px;overflow:hidden"\n></iframe>`
: "";
: '';
return (
<main>
<nav className="text-xs text-gray-500 dark:text-gray-400 mb-2">
<Link href="/admin/radio">{t("title")}</Link> ·{" "}
<Link href="/admin/radio/settings">{t("settings")}</Link> ·{" "}
<Link href="/admin/radio/embed">{t("embed")}</Link> ·{" "}
<Link href="/admin/radio/banners">{t("banners.title")}</Link> ·{" "}
<Link href="/admin/radio/ranks">{t("ranks")}</Link> ·{" "}
<Link href="/admin/radio">{t("title")}</Link> ·{' '}
<Link href="/admin/radio/settings">{t("settings")}</Link> ·{' '}
<Link href="/admin/radio/embed">{t("embed")}</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>
@@ -67,14 +67,14 @@ export default async function AdminRadioEmbedPage() {
<StatusCard
label={t("embedPage.streamUrl")}
value={hasStream ? t("embedPage.configured") : t("embedPage.missing")}
state={hasStream ? "ok" : "danger"}
state={hasStream ? 'ok' : 'danger'}
icon="\u{1F4BB}"
/>
<StatusCard label={t("embedPage.radioName")} value={radioName} icon="\u{1F399}\uFE0F" />
<StatusCard
label={t("embedPage.nowPlayingApi")}
value={nowPlayingApiUrl ? t("embedPage.set") : t("embedPage.notSet")}
state={nowPlayingApiUrl ? "ok" : "neutral"}
state={nowPlayingApiUrl ? 'ok' : 'neutral'}
icon="\u{1F3B5}"
/>
</div>
@@ -83,7 +83,9 @@ export default async function AdminRadioEmbedPage() {
{!hasStream ? (
<section className="mt-6">
<h2 className="admin-section-title">{t("embedPage.noStreamUrl")}</h2>
<p className="text-xs text-gray-500 dark:text-gray-400">{t("embedPage.noStreamUrlText")}</p>
<p className="text-xs text-gray-500 dark:text-gray-400">
{t("embedPage.noStreamUrlText")}
</p>
<p>
<Link href="/admin/radio/settings" className="btn btn-primary">
{t("embedPage.goToSettings")}
@@ -94,16 +96,15 @@ export default async function AdminRadioEmbedPage() {
<>
<section className="mt-6">
<h2 className="admin-section-title">{t("embedPage.livePreview")}</h2>
<p className="text-xs text-gray-500 dark:text-gray-400">{t("embedPage.livePreviewText")}</p>
<p className="text-xs text-gray-500 dark:text-gray-400">
{t("embedPage.livePreviewText")}
</p>
<div className="admin-card">
{}
<audio controls preload="none" src={streamUrl} style={{ width: "100%" }}>
{ }
<audio controls preload="none" src={streamUrl} style={{ width: '100%' }}>
{t("embedPage.audioUnsupported")}
</audio>
<p
className="text-xs text-gray-500 dark:text-gray-400"
style={{ margin: "0.5rem 0 0", wordBreak: "break-all" }}
>
<p className="text-xs text-gray-500 dark:text-gray-400" style={{ margin: '0.5rem 0 0', wordBreak: 'break-all' }}>
{t("embedPage.source")}: <code>{streamUrl}</code>
</p>
</div>
src/app/admin/radio/history/page.tsx
+30 -33
View File
@@ -1,10 +1,10 @@
import Link from "next/link";
import { prisma } from "@/lib/prisma";
import { StatusCard } from "@/components/admin/dashboard";
import { Clock } from "lucide-react";
import Link from 'next/link';
import { prisma } from '@/lib/prisma';
import { StatusCard } from '@/components/admin/dashboard';
import { Clock } from 'lucide-react';
import { getTranslations } from "next-intl/server";
export const dynamic = "force-dynamic";
export const dynamic = 'force-dynamic';
type History = {
id: bigint;
@@ -17,13 +17,13 @@ type History = {
};
function formatDate(d: Date | null): string {
return d ? d.toISOString().slice(0, 16).replace("T", " ") : "\u2014";
return d ? d.toISOString().slice(0, 16).replace('T', ' ') : '\u2014';
}
function formatDuration(start: Date, end: Date | null): string {
if (!end) return "\u2014";
if (!end) return '\u2014';
const ms = end.getTime() - start.getTime();
if (ms <= 0) return "\u2014";
if (ms <= 0) return '\u2014';
const mins = Math.round(ms / 60000);
const h = Math.floor(mins / 60);
const m = mins % 60;
@@ -48,7 +48,7 @@ export default async function AdminRadioHistoryPage() {
listenersCount: true,
notes: true,
},
orderBy: { startedAt: "desc" },
orderBy: { startedAt: 'desc' },
take: 100,
});
@@ -68,16 +68,19 @@ export default async function AdminRadioHistoryPage() {
}
const liveCount = history.filter((h) => !h.endedAt).length;
const peakListeners = history.reduce((max, h) => (h.listenersCount > max ? h.listenersCount : max), 0);
const peakListeners = history.reduce(
(max, h) => (h.listenersCount > max ? h.listenersCount : max),
0,
);
const uniqueDjs = new Set(history.map((h) => String(h.userId))).size;
return (
<main>
<nav className="text-xs text-gray-500 dark:text-gray-400 mb-2">
<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">{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>
@@ -93,7 +96,9 @@ export default async function AdminRadioHistoryPage() {
{dbError ? (
<div className="admin-card mb-6">
<p className="text-xs text-gray-500 dark:text-gray-400 m-0">{t("historyPage.dbError")}</p>
<p className="text-xs text-gray-500 dark:text-gray-400 m-0">
{t("historyPage.dbError")}
</p>
</div>
) : (
<div className="grid grid-cols-[repeat(auto-fit,minmax(180px,1fr))] gap-3.5 mb-6">
@@ -101,7 +106,7 @@ export default async function AdminRadioHistoryPage() {
<StatusCard
label={t("historyPage.onAirNow")}
value={liveCount}
state={liveCount > 0 ? "ok" : "neutral"}
state={liveCount > 0 ? 'ok' : 'neutral'}
icon="\u{1F534}"
/>
<StatusCard label={t("historyPage.uniqueDjs")} value={uniqueDjs} icon="\u{1F9D1}\u200D\u{1F3A4}" />
@@ -109,7 +114,9 @@ export default async function AdminRadioHistoryPage() {
</div>
)}
{!dbError && history.length === 0 ? <div className="admin-empty">{t("historyPage.empty")}</div> : null}
{!dbError && history.length === 0 ? (
<div className="admin-empty">{t("historyPage.empty")}</div>
) : null}
{history.length > 0 ? (
<section className="mt-6">
@@ -132,28 +139,18 @@ export default async function AdminRadioHistoryPage() {
<tr key={String(h.id)}>
<td>{String(h.id)}</td>
<td>{names.get(String(h.userId)) ?? `#${String(h.userId)}`}</td>
<td>{h.showName ?? "\u2014"}</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">
{formatDate(h.startedAt)}
</td>
<td>{h.showName ?? '\u2014'}</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">{formatDate(h.startedAt)}</td>
<td>
{h.endedAt ? (
<span className="text-sm text-gray-500 dark:text-gray-400">
{formatDate(h.endedAt)}
</span>
<span className="text-sm text-gray-500 dark:text-gray-400">{formatDate(h.endedAt)}</span>
) : (
<span className="inline-block text-[0.72rem] font-bold px-2 py-0.5 rounded-full bg-green-600/20 text-[var(--color-text)]">
{t("historyPage.onAir")}
</span>
<span className="inline-block text-[0.72rem] font-bold px-2 py-0.5 rounded-full bg-green-600/20 text-[var(--color-text)]">{t("historyPage.onAir")}</span>
)}
</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">
{formatDuration(h.startedAt, h.endedAt)}
</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">{formatDuration(h.startedAt, h.endedAt)}</td>
<td>{h.listenersCount}</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">
{h.notes ?? "\u2014"}
</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">{h.notes ?? '\u2014'}</td>
</tr>
))}
</tbody>
src/app/admin/radio/moderation/page.tsx
+14 -16
View File
@@ -1,11 +1,11 @@
import Link from "next/link";
import { prisma } from "@/lib/prisma";
import { deleteShout } from "@/actions/admin-radio-moderation";
import { StatusCard } from "@/components/admin/dashboard";
import { Shield } from "lucide-react";
import Link from 'next/link';
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";
export const dynamic = 'force-dynamic';
type Shout = {
id: bigint;
@@ -16,7 +16,7 @@ type Shout = {
};
function formatDate(d: Date | null): string {
return d ? d.toISOString().slice(0, 16).replace("T", " ") : "\u2014";
return d ? d.toISOString().slice(0, 16).replace('T', ' ') : '\u2014';
}
export default async function AdminRadioModerationPage() {
@@ -32,7 +32,7 @@ export default async function AdminRadioModerationPage() {
createdAt: true,
updatedAt: true,
},
orderBy: { id: "desc" },
orderBy: { id: 'desc' },
take: 50,
});
} catch {
@@ -42,11 +42,11 @@ export default async function AdminRadioModerationPage() {
return (
<main>
<nav className="text-xs text-gray-500 dark:text-gray-400 mb-2">
<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">{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>
@@ -85,9 +85,7 @@ export default async function AdminRadioModerationPage() {
<td>{String(s.id)}</td>
<td>{String(s.userId)}</td>
<td>{s.message}</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">
{formatDate(s.createdAt)}
</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">{formatDate(s.createdAt)}</td>
<td>
<form action={deleteShout}>
<input type="hidden" name="id" value={String(s.id)} />
src/app/admin/radio/monitoring/page.tsx
+70 -67
View File
@@ -1,13 +1,13 @@
import Link from "next/link";
import { requireStaff } from "@/lib/admin/guard";
import { siteSettings } from "@/lib/services/site-settings";
import { StatusCard, DiagnosticRow } from "@/components/admin/dashboard";
import { Radio } from "lucide-react";
import Link from 'next/link';
import { requireStaff } from '@/lib/admin/guard';
import { siteSettings } from '@/lib/services/site-settings';
import { StatusCard, DiagnosticRow } from '@/components/admin/dashboard';
import { Radio } from 'lucide-react';
import { getTranslations } from "next-intl/server";
export const dynamic = "force-dynamic";
export const dynamic = 'force-dynamic';
export const metadata = { title: "Radio Monitoring" };
export const metadata = { title: 'Radio Monitoring' };
const FETCH_TIMEOUT_MS = 4000;
@@ -25,14 +25,14 @@ async function probe(url: string): Promise<ProbeResult> {
try {
const res = await fetch(url, {
signal: controller.signal,
cache: "no-store",
headers: { accept: "application/json, text/plain, */*" },
cache: 'no-store',
headers: { accept: 'application/json, text/plain, */*' },
});
const raw = await res.text();
let json: unknown = null;
let text: string | null = null;
const trimmed = raw.trim();
if (trimmed !== "") {
if (trimmed !== '') {
try {
json = JSON.parse(trimmed);
} catch {
@@ -47,13 +47,13 @@ async function probe(url: string): Promise<ProbeResult> {
error: res.ok ? null : `HTTP ${res.status}`,
};
} catch (e) {
const aborted = e instanceof Error && e.name === "AbortError";
const aborted = e instanceof Error && e.name === 'AbortError';
return {
reachable: false,
status: null,
json: null,
text: null,
error: aborted ? `Timed out after ${FETCH_TIMEOUT_MS / 1000}s` : "Fetch failed",
error: aborted ? `Timed out after ${FETCH_TIMEOUT_MS / 1000}s` : 'Fetch failed',
};
} finally {
clearTimeout(timer);
@@ -61,13 +61,13 @@ async function probe(url: string): Promise<ProbeResult> {
}
function isRecord(v: unknown): v is Record<string, unknown> {
return typeof v === "object" && v !== null && !Array.isArray(v);
return typeof v === 'object' && v !== null && !Array.isArray(v);
}
function pickString(obj: Record<string, unknown>, key: string): string | null {
// eslint-disable-next-line security/detect-object-injection -- only called with hardcoded keys
const v = obj[key];
return typeof v === "string" && v.trim() !== "" ? v.trim() : null;
return typeof v === 'string' && v.trim() !== '' ? v.trim() : null;
}
function parseNowPlaying(result: ProbeResult): string | null {
@@ -75,46 +75,46 @@ function parseNowPlaying(result: ProbeResult): string | null {
return result.text && result.text.length <= 200 ? result.text : null;
}
const data = result.json;
if (typeof data === "string") return data.trim() || null;
if (typeof data === 'string') return data.trim() || null;
if (!isRecord(data)) return null;
const np = data.now_playing;
if (typeof np === "string" && np.trim() !== "") return np.trim();
if (typeof np === 'string' && np.trim() !== '') return np.trim();
if (isRecord(np)) {
const song = np.song;
if (isRecord(song)) {
const title = pickString(song, "title");
const artist = pickString(song, "artist");
const title = pickString(song, 'title');
const artist = pickString(song, 'artist');
if (title || artist) {
return [artist, title].filter(Boolean).join(" - ");
return [artist, title].filter(Boolean).join(' - ');
}
const txt = pickString(song, "text");
const txt = pickString(song, 'text');
if (txt) return txt;
}
}
const song = data.song;
if (isRecord(song)) {
const title = pickString(song, "title");
const artist = pickString(song, "artist");
if (title || artist) return [artist, title].filter(Boolean).join(" - ");
const title = pickString(song, 'title');
const artist = pickString(song, 'artist');
if (title || artist) return [artist, title].filter(Boolean).join(' - ');
}
const title = pickString(data, "title");
const artist = pickString(data, "artist");
if (title || artist) return [artist, title].filter(Boolean).join(" - ");
const title = pickString(data, 'title');
const artist = pickString(data, 'artist');
if (title || artist) return [artist, title].filter(Boolean).join(' - ');
return pickString(data, "text") ?? pickString(data, "song") ?? null;
return pickString(data, 'text') ?? pickString(data, 'song') ?? null;
}
function findNumberDeep(value: unknown, keys: string[], depth = 0): number | null {
if (depth > 4) return null;
if (typeof value === "number" && Number.isFinite(value)) return value;
if (typeof value === 'number' && Number.isFinite(value)) return value;
if (!isRecord(value)) return null;
for (const key of keys) {
// eslint-disable-next-line security/detect-object-injection -- keys from hardcoded array
const v = value[key];
if (typeof v === "number" && Number.isFinite(v)) return v;
if (typeof v === "string" && v.trim() !== "" && Number.isFinite(Number(v))) {
if (typeof v === 'number' && Number.isFinite(v)) return v;
if (typeof v === 'string' && v.trim() !== '' && Number.isFinite(Number(v))) {
return Number(v);
}
}
@@ -135,21 +135,21 @@ function parseListeners(result: ProbeResult): number | null {
return null;
}
const data = result.json;
if (typeof data === "number" && Number.isFinite(data)) return data;
if (typeof data === 'number' && Number.isFinite(data)) return data;
return findNumberDeep(data, [
"current",
"total",
"num_listeners",
"listeners",
"unique_listeners",
"count",
'current',
'total',
'num_listeners',
'listeners',
'unique_listeners',
'count',
]);
}
function shortUrl(url: string): string {
try {
const u = new URL(url);
return u.host + (u.pathname === "/" ? "" : u.pathname);
return u.host + (u.pathname === '/' ? '' : u.pathname);
} catch {
return url.length > 60 ? `${url.slice(0, 57)}\u2026` : url;
}
@@ -164,9 +164,9 @@ export default async function AdminRadioMonitoringPage() {
let listenersUrl: string | null = null;
let streamUrl: string | null = null;
try {
nowPlayingUrl = (await siteSettings.get("radio_now_playing_api_url", "")) || null;
listenersUrl = (await siteSettings.get("radio_listeners_api_url", "")) || null;
streamUrl = (await siteSettings.get("radio_stream_url", "")) || null;
nowPlayingUrl = (await siteSettings.get('radio_now_playing_api_url', '')) || null;
listenersUrl = (await siteSettings.get('radio_listeners_api_url', '')) || null;
streamUrl = (await siteSettings.get('radio_stream_url', '')) || null;
} catch {
nowPlayingUrl = null;
listenersUrl = null;
@@ -195,11 +195,11 @@ export default async function AdminRadioMonitoringPage() {
return (
<main>
<nav className="text-xs text-gray-500 dark:text-gray-400 mb-2">
<Link href="/admin/radio">{t("title")}</Link> ·{" "}
<Link href="/admin/radio/settings">{t("settings")}</Link> ·{" "}
<Link href="/admin/radio/monitoring">{t("monitoring.title")}</Link> ·{" "}
<Link href="/admin/radio/banners">{t("banners.title")}</Link> ·{" "}
<Link href="/admin/radio/ranks">{t("ranks")}</Link> ·{" "}
<Link href="/admin/radio">{t("title")}</Link> ·{' '}
<Link href="/admin/radio/settings">{t("settings")}</Link> ·{' '}
<Link href="/admin/radio/monitoring">{t("monitoring.title")}</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>
@@ -210,9 +210,7 @@ export default async function AdminRadioMonitoringPage() {
</div>
<div>
<h1 className="m-0 text-xl font-extrabold text-[var(--color-text)]">{t("monitoring.title")}</h1>
<p className="m-0 text-xs text-[var(--color-text-muted)] mt-0.5">
{t("monitoring.subtitle", { timeout: FETCH_TIMEOUT_MS / 1000 })}
</p>
<p className="m-0 text-xs text-[var(--color-text-muted)] mt-0.5">{t("monitoring.subtitle", { timeout: FETCH_TIMEOUT_MS / 1000 })}</p>
</div>
</div>
@@ -220,27 +218,23 @@ export default async function AdminRadioMonitoringPage() {
<StatusCard
label={t("monitoring.stream")}
value={
!streamConfigured
? t("monitoring.notConfigured")
: streamOnline
? t("monitoring.online")
: t("monitoring.offline")
!streamConfigured ? t("monitoring.notConfigured") : streamOnline ? t("monitoring.online") : t("monitoring.offline")
}
state={!streamConfigured ? "neutral" : streamOnline ? "ok" : "danger"}
state={!streamConfigured ? 'neutral' : streamOnline ? 'ok' : 'danger'}
hint={streamUrl ? shortUrl(streamUrl) : undefined}
icon="\u{1F4E1}"
/>
<StatusCard
label={t("monitoring.nowPlaying")}
value={nowPlaying ?? "\u2014"}
state={nowPlaying ? "ok" : "neutral"}
value={nowPlaying ?? '\u2014'}
state={nowPlaying ? 'ok' : 'neutral'}
hint={!nowPlayingUrl ? t("monitoring.noNowPlayingHint") : undefined}
icon="\u{1F3B5}"
/>
<StatusCard
label={t("monitoring.listeners")}
value={listeners ?? "\u2014"}
state={listeners != null ? "ok" : "neutral"}
value={listeners ?? '\u2014'}
state={listeners != null ? 'ok' : 'neutral'}
hint={!listenersUrl ? t("monitoring.noListenersHint") : undefined}
icon="\u{1F3A7}"
/>
@@ -249,29 +243,38 @@ export default async function AdminRadioMonitoringPage() {
<section className="mt-6">
<h2 className="admin-section-title">{t("monitoring.endpointDiagnostics")}</h2>
<p className="text-xs text-gray-500 dark:text-gray-400">{t("monitoring.diagnosticsLegend")}</p>
<p className="text-xs text-gray-500 dark:text-gray-400">
{t("monitoring.diagnosticsLegend")}
</p>
<div className="flex flex-col">
{endpoints.map((ep) => {
let state: "ok" | "warn" | "danger";
let state: 'ok' | 'warn' | 'danger';
let detail: string;
if (!ep.url) {
state = "warn";
state = 'warn';
detail = t("monitoring.notConfigured");
} else if (ep.result?.reachable) {
state = "ok";
state = 'ok';
detail = `${shortUrl(ep.url)}${
ep.result.status != null ? ` \u00B7 HTTP ${ep.result.status}` : ""
ep.result.status != null ? ` \u00B7 HTTP ${ep.result.status}` : ''
}`;
} else {
state = "danger";
state = 'danger';
detail = `${shortUrl(ep.url)} \u00B7 ${ep.result?.error ?? t("monitoring.unreachable")}`;
}
return <DiagnosticRow key={ep.label} label={ep.label} detail={detail} state={state} />;
return (
<DiagnosticRow
key={ep.label}
label={ep.label}
detail={detail}
state={state}
/>
);
})}
<DiagnosticRow
label={t("monitoring.streamUrl")}
detail={streamUrl ? shortUrl(streamUrl) : t("monitoring.notConfigured")}
state={streamUrl ? "ok" : "warn"}
state={streamUrl ? 'ok' : 'warn'}
/>
</div>
</section>
src/app/admin/radio/page.tsx
+34 -42
View File
@@ -1,10 +1,10 @@
import Link from "next/link";
import { prisma } from "@/lib/prisma";
import { deleteShout } from "@/actions/admin-radio-moderation";
import { StatusCard } from "@/components/admin/dashboard";
import Link from 'next/link';
import { prisma } from '@/lib/prisma';
import { deleteShout } from '@/actions/admin-radio';
import { StatusCard } from '@/components/admin/dashboard';
import { getTranslations } from "next-intl/server";
export const dynamic = "force-dynamic";
export const dynamic = 'force-dynamic';
type Shout = {
id: bigint;
@@ -35,18 +35,18 @@ type Schedule = {
};
function formatDate(d: Date | null): string {
return d ? d.toISOString().slice(0, 16).replace("T", " ") : "\u2014";
return d ? d.toISOString().slice(0, 16).replace('T', ' ') : '\u2014';
}
function formatTime(d: Date | null): string {
return d ? d.toISOString().slice(11, 16) : "\u2014";
return d ? d.toISOString().slice(11, 16) : '\u2014';
}
function statusBadgeClass(status: string): string {
const s = status.toLowerCase();
if (s === "approved" || s === "accepted") return "ok";
if (s === "rejected" || s === "denied") return "danger";
return "";
if (s === 'approved' || s === 'accepted') return 'ok';
if (s === 'rejected' || s === 'denied') return 'danger';
return '';
}
export default async function AdminRadioPage() {
@@ -59,7 +59,7 @@ export default async function AdminRadioPage() {
try {
shouts = await prisma.radioShouts.findMany({
select: { id: true, userId: true, message: true, createdAt: true },
orderBy: { id: "desc" },
orderBy: { id: 'desc' },
take: 25,
});
} catch {
@@ -78,7 +78,7 @@ export default async function AdminRadioPage() {
discordUsername: true,
createdAt: true,
},
orderBy: { id: "desc" },
orderBy: { id: 'desc' },
take: 25,
});
} catch {
@@ -96,50 +96,52 @@ export default async function AdminRadioPage() {
showName: true,
isActive: true,
},
orderBy: { id: "desc" },
orderBy: { id: 'desc' },
take: 25,
});
} catch {
schedules = [];
}
const pendingApps = applications.filter((a) => a.status.toLowerCase() === "pending").length;
const pendingApps = applications.filter(
(a) => a.status.toLowerCase() === 'pending',
).length;
const activeSchedules = schedules.filter((sc) => sc.isActive).length;
return (
<main>
<nav className="text-xs text-gray-500 dark:text-gray-400 mb-2">
<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">{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>
<h1>{t("title")}</h1>
<p className="text-xs text-gray-500 dark:text-gray-400">{t("subtitle")}</p>
<p className="text-xs text-gray-500 dark:text-gray-400">
{t("subtitle")}
</p>
<div className="grid grid-cols-[repeat(auto-fit,minmax(180px,1fr))] gap-3.5 mb-6">
<StatusCard label={t("shouts")} value={shouts.length} icon="\u{1F4E3}" />
<StatusCard
label={t("pendingApplications")}
value={pendingApps}
state={pendingApps > 0 ? "warn" : "ok"}
state={pendingApps > 0 ? 'warn' : 'ok'}
icon="\u{1F4DD}"
/>
<StatusCard label={t("schedules")} value={schedules.length} icon="\u{1F5D3}\uFE0F" />
<StatusCard
label={t("activeSchedules")}
value={activeSchedules}
state={activeSchedules > 0 ? "ok" : "neutral"}
state={activeSchedules > 0 ? 'ok' : 'neutral'}
icon="\u{1F399}\uFE0F"
/>
</div>
<section className="mt-6">
<h2>
{t("shouts")} ({shouts.length})
</h2>
<h2>{t("shouts")} ({shouts.length})</h2>
{shouts.length === 0 ? (
<p className="text-xs text-gray-500 dark:text-gray-400">{t("noShouts")}</p>
) : (
@@ -156,9 +158,7 @@ export default async function AdminRadioPage() {
<tbody>
{shouts.map((s) => (
<tr key={String(s.id)}>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">
{String(s.id)}
</td>
<td className="text-sm text-gray-500 dark:text-gray-400 whitespace-nowrap">{String(s.id)}</td>
<td>{String(s.userId)}</td>
<td>{s.message}</td>
<td className="text-sm text-gray-500 dark:text-gray-400">{formatDate(s.createdAt)}</td>
@@ -178,9 +178,7 @@ export default async function AdminRadioPage() {
</section>
<section className="mt-6">
<h2>
{t("applications")} ({applications.length})
</h2>
<h2>{t("applications")} ({applications.length})</h2>
{applications.length === 0 ? (
<p className="text-xs text-gray-500 dark:text-gray-400">{t("noApplications")}</p>
) : (
@@ -204,12 +202,10 @@ export default async function AdminRadioPage() {
<td>{String(a.userId)}</td>
<td>{a.realName}</td>
<td>{a.age}</td>
<td>{a.musicStyle ?? "\u2014"}</td>
<td>{a.discordUsername ?? "\u2014"}</td>
<td>{a.musicStyle ?? '\u2014'}</td>
<td>{a.discordUsername ?? '\u2014'}</td>
<td>
<span
className={`inline-block text-[0.72rem] font-bold px-2 py-0.5 rounded-full ${statusBadgeClass(a.status) === "ok" ? "bg-green-600/20 text-[var(--color-text)]" : statusBadgeClass(a.status) === "danger" ? "bg-red-500/22 text-[var(--color-text)]" : "bg-[var(--color-primary)]/18 text-[var(--color-text)]"}`}
>
<span className={`inline-block text-[0.72rem] font-bold px-2 py-0.5 rounded-full ${statusBadgeClass(a.status) === 'ok' ? 'bg-green-600/20 text-[var(--color-text)]' : statusBadgeClass(a.status) === 'danger' ? 'bg-red-500/22 text-[var(--color-text)]' : 'bg-[var(--color-primary)]/18 text-[var(--color-text)]'}`}>
{a.status}
</span>
</td>
@@ -222,9 +218,7 @@ export default async function AdminRadioPage() {
</section>
<section className="mt-6">
<h2>
{t("schedules")} ({schedules.length})
</h2>
<h2>{t("schedules")} ({schedules.length})</h2>
{schedules.length === 0 ? (
<p className="text-xs text-gray-500 dark:text-gray-400">{t("noSchedules")}</p>
) : (
@@ -248,11 +242,9 @@ export default async function AdminRadioPage() {
<td>{sc.day}</td>
<td>{formatTime(sc.startTime)}</td>
<td>{formatTime(sc.endTime)}</td>
<td>{sc.showName ?? "\u2014"}</td>
<td>{sc.showName ?? '\u2014'}</td>
<td>
<span
className={`inline-block text-[0.72rem] font-bold px-2 py-0.5 rounded-full ${sc.isActive ? "bg-green-600/20 text-[var(--color-text)]" : "bg-red-500/22 text-[var(--color-text)]"}`}
>
<span className={`inline-block text-[0.72rem] font-bold px-2 py-0.5 rounded-full ${sc.isActive ? 'bg-green-600/20 text-[var(--color-text)]' : 'bg-red-500/22 text-[var(--color-text)]'}`}>
{sc.isActive ? t("active") : t("inactive")}
</span>
</td>
src/app/admin/radio/points/page.tsx
+13 -6
View File
@@ -79,9 +79,7 @@ export default async function AdminRadioPointsPage({
{saved === "1" ? (
<p>
<span className="inline-block text-[0.72rem] font-bold px-2 py-0.5 rounded-full bg-green-600/20 text-[var(--color-text)]">
{t("pointsForm.saved")}
</span>
<span className="inline-block text-[0.72rem] font-bold px-2 py-0.5 rounded-full bg-green-600/20 text-[var(--color-text)]">{t("pointsForm.saved")}</span>
</p>
) : null}
@@ -151,7 +149,10 @@ export default async function AdminRadioPointsPage({
</div>
<div>
<label htmlFor="radio_points_per_minute" style={{ display: "block", fontWeight: 700 }}>
<label
htmlFor="radio_points_per_minute"
style={{ display: "block", fontWeight: 700 }}
>
{t("pointsForm.pointsPerMinute")}
</label>
<input
@@ -169,7 +170,10 @@ export default async function AdminRadioPointsPage({
</div>
<div>
<label htmlFor="radio_points_max_per_day" style={{ display: "block", fontWeight: 700 }}>
<label
htmlFor="radio_points_max_per_day"
style={{ display: "block", fontWeight: 700 }}
>
{t("pointsForm.maxPerDay")}
</label>
<input
@@ -187,7 +191,10 @@ export default async function AdminRadioPointsPage({
</div>
<div>
<label htmlFor="radio_points_min_listeners" style={{ display: "block", fontWeight: 700 }}>
<label
htmlFor="radio_points_min_listeners"
style={{ display: "block", fontWeight: 700 }}
>
{t("pointsForm.minListeners")}
</label>
<input
src/app/admin/radio/ranks/page.tsx
+42 -31
View File
@@ -1,11 +1,15 @@
import Link from "next/link";
import { createRadioRank, deleteRadioRank, updateRadioRank } from "@/actions/admin-radio-extra";
import { prisma } from "@/lib/prisma";
import { StatusCard } from "@/components/admin/dashboard";
import { Medal } from "lucide-react";
import Link from 'next/link';
import {
createRadioRank,
deleteRadioRank,
updateRadioRank,
} from '@/actions/admin-radio-extra';
import { prisma } from '@/lib/prisma';
import { StatusCard } from '@/components/admin/dashboard';
import { Medal } from 'lucide-react';
import { getTranslations } from "next-intl/server";
export const dynamic = "force-dynamic";
export const dynamic = 'force-dynamic';
type Rank = {
id: bigint;
@@ -30,7 +34,7 @@ export default async function AdminRadioRanksPage() {
badgeCode: true,
isActive: true,
},
orderBy: { id: "asc" },
orderBy: { id: 'asc' },
});
} catch {
dbError = true;
@@ -42,10 +46,10 @@ export default async function AdminRadioRanksPage() {
return (
<main>
<nav className="text-xs text-gray-500 dark:text-gray-400 mb-2">
<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">{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>
@@ -61,7 +65,9 @@ export default async function AdminRadioRanksPage() {
{dbError ? (
<div className="admin-card mb-6">
<p className="text-xs text-gray-500 dark:text-gray-400 m-0">{t("ranksForm.dbError")}</p>
<p className="text-xs text-gray-500 dark:text-gray-400 m-0">
{t("ranksForm.dbError")}
</p>
</div>
) : (
<div className="grid grid-cols-[repeat(auto-fit,minmax(180px,1fr))] gap-3.5 mb-6">
@@ -69,7 +75,7 @@ export default async function AdminRadioRanksPage() {
<StatusCard
label={t("ranksForm.active")}
value={activeCount}
state={activeCount > 0 ? "ok" : "neutral"}
state={activeCount > 0 ? 'ok' : 'neutral'}
icon="\u{2705}"
/>
</div>
@@ -80,30 +86,30 @@ export default async function AdminRadioRanksPage() {
<form action={createRadioRank} className="admin-card">
<div className="grid grid-cols-1 gap-4 md:grid-cols-3">
<div>
<label htmlFor="new_name" style={{ display: "block", fontWeight: 700 }}>
<label htmlFor="new_name" style={{ display: 'block', fontWeight: 700 }}>
{t("ranksForm.name")}
</label>
<input id="new_name" name="name" required style={{ width: "100%" }} />
<input id="new_name" name="name" required style={{ width: '100%' }} />
</div>
<div>
<label htmlFor="new_badge" style={{ display: "block", fontWeight: 700 }}>
<label htmlFor="new_badge" style={{ display: 'block', fontWeight: 700 }}>
{t("ranksForm.badgeCode")}
</label>
<input id="new_badge" name="badgeCode" style={{ width: "100%" }} />
<input id="new_badge" name="badgeCode" style={{ width: '100%' }} />
</div>
<div style={{ display: "flex", alignItems: "flex-end" }}>
<label style={{ display: "inline-flex", gap: "0.4rem", alignItems: "center" }}>
<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 /> {t("ranksForm.active")}
</label>
</div>
<div style={{ gridColumn: "1 / -1" }}>
<label htmlFor="new_desc" style={{ display: "block", fontWeight: 700 }}>
<div style={{ gridColumn: '1 / -1' }}>
<label htmlFor="new_desc" style={{ display: 'block', fontWeight: 700 }}>
{t("ranksForm.description")}
</label>
<input id="new_desc" name="description" style={{ width: "100%" }} />
<input id="new_desc" name="description" style={{ width: '100%' }} />
</div>
</div>
<div style={{ marginTop: "0.75rem" }}>
<div style={{ marginTop: '0.75rem' }}>
<button type="submit" className="btn btn-primary">
{t("ranksForm.createRank")}
</button>
@@ -121,9 +127,7 @@ export default async function AdminRadioRanksPage() {
<div key={String(r.id)} className="admin-card">
<div className="flex justify-between items-baseline gap-3 mb-2">
<strong>#{String(r.id)}</strong>
<span
className={`inline-block text-[0.72rem] font-bold px-2 py-0.5 rounded-full ${r.isActive ? "bg-green-600/20 text-[var(--color-text)]" : "bg-red-500/22 text-[var(--color-text)]"}`}
>
<span className={`inline-block text-[0.72rem] font-bold px-2 py-0.5 rounded-full ${r.isActive ? 'bg-green-600/20 text-[var(--color-text)]' : 'bg-red-500/22 text-[var(--color-text)]'}`}>
{r.isActive ? t("ranksForm.activeLabel") : t("ranksForm.inactiveLabel")}
</span>
</div>
@@ -139,18 +143,25 @@ export default async function AdminRadioRanksPage() {
/>
<input
name="badgeCode"
defaultValue={r.badgeCode ?? ""}
defaultValue={r.badgeCode ?? ''}
placeholder={t("ranksForm.badgeCode")}
style={{ minWidth: 100 }}
/>
<input
name="description"
defaultValue={r.description ?? ""}
defaultValue={r.description ?? ''}
placeholder={t("ranksForm.description")}
className="flex-1 min-w-[160px]"
/>
<label style={{ display: "inline-flex", gap: "0.3rem", alignItems: "center" }}>
<input type="checkbox" name="isActive" value="1" defaultChecked={r.isActive} />{" "}
<label
style={{ display: 'inline-flex', gap: '0.3rem', alignItems: 'center' }}
>
<input
type="checkbox"
name="isActive"
value="1"
defaultChecked={r.isActive}
/>{' '}
{t("ranksForm.active")}
</label>
<button type="submit" className="btn btn-primary">
@@ -158,7 +169,7 @@ export default async function AdminRadioRanksPage() {
</button>
</form>
<form action={deleteRadioRank} style={{ marginTop: "0.5rem" }}>
<form action={deleteRadioRank} style={{ marginTop: '0.5rem' }}>
<input type="hidden" name="id" value={String(r.id)} />
<button type="submit" className="btn btn-danger">
{t("ranksForm.deleteRank", { id: String(r.id) })}
src/app/admin/radio/settings/page.tsx
+146 -144
View File
@@ -1,181 +1,181 @@
import Link from "next/link";
import { saveRadioSetting, saveRadioSettings } from "@/actions/admin-radio-extra";
import { prisma } from "@/lib/prisma";
import { StatusCard } from "@/components/admin/dashboard";
import { Settings } from "lucide-react";
import Link from 'next/link';
import { saveRadioSetting, saveRadioSettings } from '@/actions/admin-radio-extra';
import { prisma } from '@/lib/prisma';
import { StatusCard } from '@/components/admin/dashboard';
import { Settings } from 'lucide-react';
import { getTranslations } from "next-intl/server";
export const dynamic = "force-dynamic";
export const dynamic = 'force-dynamic';
type Field = { key: string; comment: string };
type Group = { title: string; fields: Field[] };
const GROUPS: Group[] = [
{
title: "AzureCast & Stream",
title: 'AzureCast & Stream',
fields: [
{ key: "radio_enabled", comment: "Radio enabled (0=no, 1=yes)" },
{ key: "radio_stream_url", comment: "Main stream URL" },
{ key: "radio_stream_backup_url", comment: "Backup stream URL" },
{ key: "radio_azurecast_base_url", comment: "AzureCast base URL" },
{ key: "radio_azurecast_station_id", comment: "AzureCast station ID" },
{ key: "radio_azurecast_api_key", comment: "AzureCast API key" },
{ key: "radio_azurecast_port", comment: "AzureCast stream port" },
{ key: "radio_azurecast_protocol", comment: "AzureCast protocol (http/https)" },
{ key: "radio_azurecast_use_proxy", comment: "Use AzureCast proxy (0=no, 1=yes)" },
{ key: 'radio_enabled', comment: 'Radio enabled (0=no, 1=yes)' },
{ key: 'radio_stream_url', comment: 'Main stream URL' },
{ key: 'radio_stream_backup_url', comment: 'Backup stream URL' },
{ key: 'radio_azurecast_base_url', comment: 'AzureCast base URL' },
{ key: 'radio_azurecast_station_id', comment: 'AzureCast station ID' },
{ key: 'radio_azurecast_api_key', comment: 'AzureCast API key' },
{ key: 'radio_azurecast_port', comment: 'AzureCast stream port' },
{ key: 'radio_azurecast_protocol', comment: 'AzureCast protocol (http/https)' },
{ key: 'radio_azurecast_use_proxy', comment: 'Use AzureCast proxy (0=no, 1=yes)' },
],
},
{
title: "External sources",
title: 'External sources',
fields: [
{ key: "radio_sambroadcaster_api_url", comment: "Sambroadcaster API URL" },
{ key: "radio_sambroadcaster_password", comment: "Sambroadcaster password" },
{ key: "radio_virtual_dj_url", comment: "Virtual DJ URL" },
{ key: "radio_virtual_dj_password", comment: "Virtual DJ password" },
{ key: "radio_djs_api_url", comment: "DJs API URL" },
{ key: 'radio_sambroadcaster_api_url', comment: 'Sambroadcaster API URL' },
{ key: 'radio_sambroadcaster_password', comment: 'Sambroadcaster password' },
{ key: 'radio_virtual_dj_url', comment: 'Virtual DJ URL' },
{ key: 'radio_virtual_dj_password', comment: 'Virtual DJ password' },
{ key: 'radio_djs_api_url', comment: 'DJs API URL' },
],
},
{
title: "Player",
title: 'Player',
fields: [
{ key: "radio_style", comment: "Player style (dark/light/blue/purple/pink/gold)" },
{ key: "radio_player_type", comment: "Player type (default/minimal/embedded)" },
{ key: "radio_auto_play", comment: "Auto-play on page load (0=no, 1=yes)" },
{ key: "radio_auto_play_delay", comment: "Auto-play delay in seconds" },
{ key: "radio_mute_on_start", comment: "Muted on start (0=no, 1=yes)" },
{ key: "radio_volume", comment: "Default volume (0-100)" },
{ key: "radio_language", comment: "Default language (nl/en/de/fr/es/pt/it/br)" },
{ key: "radio_multi_language_enabled", comment: "Multi-language support (0=no, 1=yes)" },
{ key: "radio_player_color_primary", comment: "Player primary color" },
{ key: "radio_player_color_secondary", comment: "Player secondary color" },
{ key: "radio_player_color_text", comment: "Player text color" },
{ key: "radio_player_color_accent", comment: "Player accent color" },
{ key: 'radio_style', comment: 'Player style (dark/light/blue/purple/pink/gold)' },
{ key: 'radio_player_type', comment: 'Player type (default/minimal/embedded)' },
{ key: 'radio_auto_play', comment: 'Auto-play on page load (0=no, 1=yes)' },
{ key: 'radio_auto_play_delay', comment: 'Auto-play delay in seconds' },
{ key: 'radio_mute_on_start', comment: 'Muted on start (0=no, 1=yes)' },
{ key: 'radio_volume', comment: 'Default volume (0-100)' },
{ key: 'radio_language', comment: 'Default language (nl/en/de/fr/es/pt/it/br)' },
{ key: 'radio_multi_language_enabled', comment: 'Multi-language support (0=no, 1=yes)' },
{ key: 'radio_player_color_primary', comment: 'Player primary color' },
{ key: 'radio_player_color_secondary', comment: 'Player secondary color' },
{ key: 'radio_player_color_text', comment: 'Player text color' },
{ key: 'radio_player_color_accent', comment: 'Player accent color' },
],
},
{
title: "Now playing & history",
title: 'Now playing & history',
fields: [
{ key: "radio_now_playing_enabled", comment: "Show now playing info (0=no, 1=yes)" },
{ key: "radio_now_playing_api_url", comment: "Now playing API URL" },
{ key: "radio_now_playing_cache_duration", comment: "Now playing cache duration in seconds" },
{ key: "radio_show_song_history", comment: "Show song history (0=no, 1=yes)" },
{ key: "radio_song_history_count", comment: "Number of songs in history" },
{ key: 'radio_now_playing_enabled', comment: 'Show now playing info (0=no, 1=yes)' },
{ key: 'radio_now_playing_api_url', comment: 'Now playing API URL' },
{ key: 'radio_now_playing_cache_duration', comment: 'Now playing cache duration in seconds' },
{ key: 'radio_show_song_history', comment: 'Show song history (0=no, 1=yes)' },
{ key: 'radio_song_history_count', comment: 'Number of songs in history' },
],
},
{
title: "Listeners",
title: 'Listeners',
fields: [
{ key: "radio_listeners_enabled", comment: "Show listeners count (0=no, 1=yes)" },
{ key: "radio_listeners_api_url", comment: "Listeners API URL" },
{ key: "radio_listeners_update_interval", comment: "Listeners update interval in seconds" },
{ key: "radio_show_listener_peak", comment: "Show listener peak (0=no, 1=yes)" },
{ key: "radio_peak_reset_time", comment: "Peak reset time (HH:MM)" },
{ key: "radio_store_listener_stats", comment: "Store listener statistics (0=no, 1=yes)" },
{ key: "radio_stats_retention_days", comment: "Statistics retention in days" },
{ key: "radio_show_listener_graph", comment: "Show listener graph (0=no, 1=yes)" },
{ key: "radio_listener_graph_period", comment: "Listener graph period (1h/6h/12h/24h/7d)" },
{ key: "radio_show_average_listeners", comment: "Show average listeners (0=no, 1=yes)" },
{ key: "radio_show_unique_listeners", comment: "Show unique listeners (0=no, 1=yes)" },
{ key: "radio_listener_alerts_enabled", comment: "Enable listener alerts (0=no, 1=yes)" },
{ key: "radio_min_listeners_threshold", comment: "Minimum listeners threshold" },
{ key: "radio_listener_alert_threshold_high", comment: "High listener alert threshold" },
{ key: "radio_listener_alert_threshold_low", comment: "Low listener alert threshold" },
{ key: 'radio_listeners_enabled', comment: 'Show listeners count (0=no, 1=yes)' },
{ key: 'radio_listeners_api_url', comment: 'Listeners API URL' },
{ key: 'radio_listeners_update_interval', comment: 'Listeners update interval in seconds' },
{ key: 'radio_show_listener_peak', comment: 'Show listener peak (0=no, 1=yes)' },
{ key: 'radio_peak_reset_time', comment: 'Peak reset time (HH:MM)' },
{ key: 'radio_store_listener_stats', comment: 'Store listener statistics (0=no, 1=yes)' },
{ key: 'radio_stats_retention_days', comment: 'Statistics retention in days' },
{ key: 'radio_show_listener_graph', comment: 'Show listener graph (0=no, 1=yes)' },
{ key: 'radio_listener_graph_period', comment: 'Listener graph period (1h/6h/12h/24h/7d)' },
{ key: 'radio_show_average_listeners', comment: 'Show average listeners (0=no, 1=yes)' },
{ key: 'radio_show_unique_listeners', comment: 'Show unique listeners (0=no, 1=yes)' },
{ key: 'radio_listener_alerts_enabled', comment: 'Enable listener alerts (0=no, 1=yes)' },
{ key: 'radio_min_listeners_threshold', comment: 'Minimum listeners threshold' },
{ key: 'radio_listener_alert_threshold_high', comment: 'High listener alert threshold' },
{ key: 'radio_listener_alert_threshold_low', comment: 'Low listener alert threshold' },
],
},
{
title: "DJ",
title: 'DJ',
fields: [
{ key: "radio_show_current_dj", comment: "Show current DJ (0=no, 1=yes)" },
{ key: "radio_current_dj_id", comment: "Manual DJ user ID" },
{ key: "radio_dj_avatar_size", comment: "DJ avatar size in pixels" },
{ key: "radio_show_dj_schedule", comment: "Show DJ schedule (0=no, 1=yes)" },
{ key: "radio_auto_dj_detection", comment: "Enable auto DJ detection (0=no, 1=yes)" },
{ key: "radio_dj_detection_interval", comment: "DJ detection interval in seconds" },
{ key: "auto_dj_detected_action", comment: "Action on DJ detection (set_dj/notify/both)" },
{ key: 'radio_show_current_dj', comment: 'Show current DJ (0=no, 1=yes)' },
{ key: 'radio_current_dj_id', comment: 'Manual DJ user ID' },
{ key: 'radio_dj_avatar_size', comment: 'DJ avatar size in pixels' },
{ key: 'radio_show_dj_schedule', comment: 'Show DJ schedule (0=no, 1=yes)' },
{ key: 'radio_auto_dj_detection', comment: 'Enable auto DJ detection (0=no, 1=yes)' },
{ key: 'radio_dj_detection_interval', comment: 'DJ detection interval in seconds' },
{ key: 'auto_dj_detected_action', comment: 'Action on DJ detection (set_dj/notify/both)' },
],
},
{
title: "Shouts & chat",
title: 'Shouts & chat',
fields: [
{ key: "radio_shouts_enabled", comment: "Enable shouts (0=no, 1=yes)" },
{ key: "radio_shouts_max_length", comment: "Maximum shout length in characters" },
{ key: "radio_shouts_cooldown", comment: "Shout cooldown in seconds" },
{ key: "radio_shouts_require_moderation", comment: "Require shout moderation (0=no, 1=yes)" },
{ key: "radio_chat_enabled", comment: "Enable live chat (0=no, 1=yes)" },
{ key: "radio_chat_position", comment: "Chat position (left/right/bottom)" },
{ key: "radio_chat_width", comment: "Chat width in pixels" },
{ key: "radio_chat_height", comment: "Chat height in pixels" },
{ key: "radio_chat_messages_count", comment: "Number of chat messages to show" },
{ key: "radio_chat_show_timestamps", comment: "Show chat timestamps (0=no, 1=yes)" },
{ key: "radio_chat_allow_links", comment: "Allow links in chat (0=no, 1=yes)" },
{ key: "radio_chat_allow_emojis", comment: "Allow emojis in chat (0=no, 1=yes)" },
{ key: 'radio_shouts_enabled', comment: 'Enable shouts (0=no, 1=yes)' },
{ key: 'radio_shouts_max_length', comment: 'Maximum shout length in characters' },
{ key: 'radio_shouts_cooldown', comment: 'Shout cooldown in seconds' },
{ key: 'radio_shouts_require_moderation', comment: 'Require shout moderation (0=no, 1=yes)' },
{ key: 'radio_chat_enabled', comment: 'Enable live chat (0=no, 1=yes)' },
{ key: 'radio_chat_position', comment: 'Chat position (left/right/bottom)' },
{ key: 'radio_chat_width', comment: 'Chat width in pixels' },
{ key: 'radio_chat_height', comment: 'Chat height in pixels' },
{ key: 'radio_chat_messages_count', comment: 'Number of chat messages to show' },
{ key: 'radio_chat_show_timestamps', comment: 'Show chat timestamps (0=no, 1=yes)' },
{ key: 'radio_chat_allow_links', comment: 'Allow links in chat (0=no, 1=yes)' },
{ key: 'radio_chat_allow_emojis', comment: 'Allow emojis in chat (0=no, 1=yes)' },
],
},
{
title: "Requests & widget",
title: 'Requests & widget',
fields: [
{ key: "radio_request_form_enabled", comment: "Enable song requests (0=no, 1=yes)" },
{ key: "radio_request_max_per_user", comment: "Maximum requests per user" },
{ key: "radio_request_cooldown", comment: "Request cooldown in seconds" },
{ key: "radio_voting_enabled", comment: "Enable request voting (0=no, 1=yes)" },
{ key: "radio_voting_show_song_requests", comment: "Show requests with votes (0=no, 1=yes)" },
{ key: "radio_widget_enabled", comment: "Enable radio widget (0=no, 1=yes)" },
{ key: "radio_widget_show_globally", comment: "Show widget globally (0=no, 1=yes)" },
{ key: "radio_widget_position", comment: "Widget position" },
{ key: 'radio_request_form_enabled', comment: 'Enable song requests (0=no, 1=yes)' },
{ key: 'radio_request_max_per_user', comment: 'Maximum requests per user' },
{ key: 'radio_request_cooldown', comment: 'Request cooldown in seconds' },
{ key: 'radio_voting_enabled', comment: 'Enable request voting (0=no, 1=yes)' },
{ key: 'radio_voting_show_song_requests', comment: 'Show requests with votes (0=no, 1=yes)' },
{ key: 'radio_widget_enabled', comment: 'Enable radio widget (0=no, 1=yes)' },
{ key: 'radio_widget_show_globally', comment: 'Show widget globally (0=no, 1=yes)' },
{ key: 'radio_widget_position', comment: 'Widget position' },
],
},
{
title: "Offline & branding",
title: 'Offline & branding',
fields: [
{ key: "radio_show_offline_message", comment: "Show offline message (0=no, 1=yes)" },
{ key: "radio_offline_message", comment: "Offline message text" },
{ key: "radio_offline_image", comment: "Offline page image URL" },
{ key: "radio_background_image", comment: "Background image URL" },
{ key: "radio_logo_url", comment: "Radio logo URL" },
{ key: 'radio_show_offline_message', comment: 'Show offline message (0=no, 1=yes)' },
{ key: 'radio_offline_message', comment: 'Offline message text' },
{ key: 'radio_offline_image', comment: 'Offline page image URL' },
{ key: 'radio_background_image', comment: 'Background image URL' },
{ key: 'radio_logo_url', comment: 'Radio logo URL' },
],
},
{
title: "Applications",
title: 'Applications',
fields: [
{ key: "radio_applications_enabled", comment: "Enable DJ applications (0=no, 1=yes)" },
{ key: "radio_applications_max_per_day", comment: "Maximum applications per day" },
{ key: "radio_applications_require_approval", comment: "Require application approval (0=no, 1=yes)" },
{ key: 'radio_applications_enabled', comment: 'Enable DJ applications (0=no, 1=yes)' },
{ key: 'radio_applications_max_per_day', comment: 'Maximum applications per day' },
{ key: 'radio_applications_require_approval', comment: 'Require application approval (0=no, 1=yes)' },
],
},
{
title: "Stats display",
title: 'Stats display',
fields: [
{ key: "radio_stats_show_daily", comment: "Show daily statistics (0=no, 1=yes)" },
{ key: "radio_stats_show_weekly", comment: "Show weekly statistics (0=no, 1=yes)" },
{ key: "radio_stats_show_monthly", comment: "Show monthly statistics (0=no, 1=yes)" },
{ key: "radio_stats_show_top_djs", comment: "Show top DJs (0=no, 1=yes)" },
{ key: "radio_stats_show_top_songs", comment: "Show top songs (0=no, 1=yes)" },
{ key: 'radio_stats_show_daily', comment: 'Show daily statistics (0=no, 1=yes)' },
{ key: 'radio_stats_show_weekly', comment: 'Show weekly statistics (0=no, 1=yes)' },
{ key: 'radio_stats_show_monthly', comment: 'Show monthly statistics (0=no, 1=yes)' },
{ key: 'radio_stats_show_top_djs', comment: 'Show top DJs (0=no, 1=yes)' },
{ key: 'radio_stats_show_top_songs', comment: 'Show top songs (0=no, 1=yes)' },
],
},
{
title: "Social & contact",
title: 'Social & contact',
fields: [
{ key: "radio_social_facebook", comment: "Facebook URL" },
{ key: "radio_social_twitter", comment: "Twitter URL" },
{ key: "radio_social_instagram", comment: "Instagram URL" },
{ key: "radio_social_discord", comment: "Discord URL" },
{ key: "radio_social_youtube", comment: "YouTube URL" },
{ key: "radio_social_twitch", comment: "Twitch URL" },
{ key: "radio_contact_email", comment: "Contact email" },
{ key: "radio_contact_phone", comment: "Contact phone" },
{ key: "radio_about_text", comment: "About radio text" },
{ key: 'radio_social_facebook', comment: 'Facebook URL' },
{ key: 'radio_social_twitter', comment: 'Twitter URL' },
{ key: 'radio_social_instagram', comment: 'Instagram URL' },
{ key: 'radio_social_discord', comment: 'Discord URL' },
{ key: 'radio_social_youtube', comment: 'YouTube URL' },
{ key: 'radio_social_twitch', comment: 'Twitch URL' },
{ key: 'radio_contact_email', comment: 'Contact email' },
{ key: 'radio_contact_phone', comment: 'Contact phone' },
{ key: 'radio_about_text', comment: 'About radio text' },
],
},
{
title: "Discord webhook & custom code",
title: 'Discord webhook & custom code',
fields: [
{ key: "radio_discord_webhook_url", comment: "Discord webhook URL" },
{ key: "radio_discord_enabled", comment: "Enable Discord notifications (0=no, 1=yes)" },
{ key: "radio_discord_dj_live", comment: "Discord DJ live notification (0=no, 1=yes)" },
{ key: "radio_discord_song_changes", comment: "Discord song change notification (0=no, 1=yes)" },
{ key: "radio_discord_custom_message", comment: "Custom Discord message template" },
{ key: "radio_custom_css", comment: "Custom CSS code" },
{ key: "radio_custom_js", comment: "Custom JavaScript code" },
{ key: 'radio_discord_webhook_url', comment: 'Discord webhook URL' },
{ key: 'radio_discord_enabled', comment: 'Enable Discord notifications (0=no, 1=yes)' },
{ key: 'radio_discord_dj_live', comment: 'Discord DJ live notification (0=no, 1=yes)' },
{ key: 'radio_discord_song_changes', comment: 'Discord song change notification (0=no, 1=yes)' },
{ key: 'radio_discord_custom_message', comment: 'Custom Discord message template' },
{ key: 'radio_custom_css', comment: 'Custom CSS code' },
{ key: 'radio_custom_js', comment: 'Custom JavaScript code' },
],
},
];
@@ -195,8 +195,12 @@ export default async function AdminRadioSettingsPage() {
});
values = new Map(rows.map((r) => [r.key, r.value]));
extra = rows
.filter((r) => (r.key.startsWith("radio_") || r.key.startsWith("auto_dj_")) && !CURATED_KEYS.has(r.key))
.map((r) => ({ key: r.key, comment: r.comment ?? "" }));
.filter(
(r) =>
(r.key.startsWith('radio_') || r.key.startsWith('auto_dj_')) &&
!CURATED_KEYS.has(r.key),
)
.map((r) => ({ key: r.key, comment: r.comment ?? '' }));
} catch {
dbError = true;
}
@@ -205,22 +209,22 @@ export default async function AdminRadioSettingsPage() {
? [...GROUPS, { title: t("settingsForm.otherSettings"), fields: extra }]
: GROUPS;
const allKeys = [...CURATED_KEYS, ...extra.map((e) => e.key)].join(",");
const allKeys = [...CURATED_KEYS, ...extra.map((e) => e.key)].join(',');
const totalKeys = CURATED_KEYS.size + extra.length;
const configuredKeys = [...CURATED_KEYS].filter((k) => {
const v = values.get(k);
return v != null && v !== "";
return v != null && v !== '';
}).length;
const radioEnabled = (values.get("radio_enabled") ?? "") === "1";
const radioEnabled = (values.get('radio_enabled') ?? '') === '1';
return (
<main>
<nav className="text-xs text-gray-500 dark:text-gray-400 mb-2">
<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">{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>
@@ -236,14 +240,16 @@ export default async function AdminRadioSettingsPage() {
{dbError ? (
<div className="admin-card mb-6">
<p className="text-xs text-gray-500 dark:text-gray-400 m-0">{t("settingsForm.dbError")}</p>
<p className="text-xs text-gray-500 dark:text-gray-400 m-0">
{t("settingsForm.dbError")}
</p>
</div>
) : (
<div className="grid grid-cols-[repeat(auto-fit,minmax(180px,1fr))] gap-3.5 mb-6">
<StatusCard
label="Radio"
value={radioEnabled ? t("settingsForm.enabled") : t("settingsForm.disabled")}
state={radioEnabled ? "ok" : "danger"}
state={radioEnabled ? 'ok' : 'danger'}
icon="\u{1F4BB}"
/>
<StatusCard label={t("settingsForm.totalKeys")} value={totalKeys} icon="\u{1F511}" />
@@ -256,7 +262,7 @@ export default async function AdminRadioSettingsPage() {
<StatusCard
label={t("settingsForm.customKeys")}
value={extra.length}
state={extra.length > 0 ? "warn" : "neutral"}
state={extra.length > 0 ? 'warn' : 'neutral'}
icon="\u{2795}"
/>
</div>
@@ -271,25 +277,25 @@ export default async function AdminRadioSettingsPage() {
</div>
{groups.map((group) => (
<section key={group.title} className="admin-card" style={{ marginBottom: "1.25rem" }}>
<section key={group.title} className="admin-card" style={{ marginBottom: '1.25rem' }}>
<h2 style={{ marginTop: 0 }}>{group.title}</h2>
<div className="grid grid-cols-1 gap-4 md:grid-cols-2">
{group.fields.map((field) => (
<div key={field.key}>
<label
htmlFor={`f_${field.key}`}
style={{ display: "block", fontWeight: 700, fontSize: "0.85rem" }}
style={{ display: 'block', fontWeight: 700, fontSize: '0.85rem' }}
>
{field.key}
</label>
<input
id={`f_${field.key}`}
name={field.key}
defaultValue={values.get(field.key) ?? ""}
style={{ width: "100%" }}
defaultValue={values.get(field.key) ?? ''}
style={{ width: '100%' }}
/>
{field.comment ? (
<p className="text-xs text-gray-500 dark:text-gray-400" style={{ margin: "0.2rem 0 0" }}>
<p className="text-xs text-gray-500 dark:text-gray-400" style={{ margin: '0.2rem 0 0' }}>
{field.comment}
</p>
) : null}
@@ -306,15 +312,11 @@ export default async function AdminRadioSettingsPage() {
</div>
</form>
<section className="admin-card" style={{ marginTop: "1.5rem" }}>
<section className="admin-card" style={{ marginTop: '1.5rem' }}>
<h3 style={{ marginTop: 0 }}>{t("settingsForm.singleKey")}</h3>
<form action={saveRadioSetting} className="flex gap-2 flex-wrap">
<input name="key" placeholder={t("settingsForm.keyPlaceholder")} required />
<input
name="value"
placeholder={t("settingsForm.valuePlaceholder")}
className="flex-1 min-w-[160px]"
/>
<input name="value" placeholder={t("settingsForm.valuePlaceholder")} className="flex-1 min-w-[160px]" />
<input name="comment" placeholder={t("settingsForm.commentPlaceholder")} />
<button type="submit" className="btn btn-primary">
{t("settingsForm.saveSingle")}