93 lines
3.7 KiB
TypeScript
93 lines
3.7 KiB
TypeScript
import { getTranslations } from "next-intl/server";
|
|
import { createSetting, deleteSetting, updateSetting } from "@/actions/admin-settings";
|
|
import { StatusCard } from "@/components/admin/dashboard";
|
|
import { prisma } from "@/lib/prisma";
|
|
|
|
export const dynamic = "force-dynamic";
|
|
|
|
export default async function AdminSettings() {
|
|
const t = await getTranslations("pages.admin.settings");
|
|
|
|
let settings: Awaited<ReturnType<typeof prisma.websiteSetting.findMany>> = [];
|
|
try {
|
|
settings = await prisma.websiteSetting.findMany({ orderBy: { key: "asc" } });
|
|
} catch {
|
|
settings = [];
|
|
}
|
|
|
|
const documented = settings.filter((s) => !!s.comment).length;
|
|
|
|
return (
|
|
<main>
|
|
<div className="flex items-center gap-3 mb-6">
|
|
<div className="w-10 h-10 rounded-xl bg-gradient-to-br from-[var(--color-primary)]/20 to-[var(--color-primary)]/5 grid place-items-center">
|
|
<span className="text-lg">⚙️</span>
|
|
</div>
|
|
<div>
|
|
<h1 className="m-0 text-xl font-extrabold text-[var(--color-text)]">{t("title")}</h1>
|
|
<p className="m-0 text-xs text-[var(--color-text-muted)] mt-0.5">
|
|
{t.rich("subtitle", { code: (chunks) => <code>{chunks}</code> })}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="admin-stat-row">
|
|
<span className="admin-stat-chip">{t("settingsCount", { count: settings.length })}</span>
|
|
<span className="admin-stat-chip">{t("documentedCount", { count: documented })}</span>
|
|
</div>
|
|
|
|
<section>
|
|
<h2 className="admin-section-title">{t("addOverwrite")}</h2>
|
|
<form action={createSetting} className="admin-card">
|
|
<div className="flex gap-2 flex-wrap">
|
|
<input name="key" placeholder={t("form.keyPlaceholder")} required />
|
|
<input name="value" placeholder={t("form.valuePlaceholder")} className="flex-1 min-w-[160px]" />
|
|
<input name="comment" placeholder={t("form.commentPlaceholder")} />
|
|
<button type="submit" className="btn btn-primary">{t("save")}</button>
|
|
</div>
|
|
</form>
|
|
</section>
|
|
|
|
<section>
|
|
<h2 className="admin-section-title">
|
|
{t("settings")} <span className="inline-block text-[0.72rem] font-bold px-2 py-0.5 rounded-full bg-[var(--color-primary)]/18 text-[var(--color-text)]">{settings.length}</span>
|
|
</h2>
|
|
{settings.length === 0 ? (
|
|
<div className="admin-empty">{t("noSettings")}</div>
|
|
) : (
|
|
<div className="grid">
|
|
{settings.map((s) => (
|
|
<div key={s.key} className="admin-card">
|
|
<div style={{ display: "flex", gap: "0.75rem", alignItems: "baseline" }}>
|
|
<strong style={{ minWidth: 220 }}>{s.key}</strong>
|
|
<form
|
|
action={updateSetting}
|
|
style={{ display: "flex", gap: "0.5rem", flex: 1 }}
|
|
>
|
|
<input type="hidden" name="key" value={s.key} />
|
|
<input name="value" defaultValue={s.value} style={{ flex: 1 }} />
|
|
<button type="submit" className="btn btn-outline">
|
|
{t("save")}
|
|
</button>
|
|
</form>
|
|
<form action={deleteSetting}>
|
|
<input type="hidden" name="key" value={s.key} />
|
|
<button type="submit" className="btn btn-danger">
|
|
✕
|
|
</button>
|
|
</form>
|
|
</div>
|
|
{s.comment ? (
|
|
<p className="muted" style={{ margin: "0.4rem 0 0" }}>
|
|
{s.comment}
|
|
</p>
|
|
) : null}
|
|
</div>
|
|
))}
|
|
</div>
|
|
)}
|
|
</section>
|
|
</main>
|
|
);
|
|
}
|