From 4e6867b3654e2c10457036aa4104b2d8abbfc3a2 Mon Sep 17 00:00:00 2001
From: Claude Integration <claude@systemd.cosmolan.fr>
Date: Mon, 1 Jun 2026 00:44:39 +0000
Subject: [PATCH] =?UTF-8?q?feat(admin):=20Sprint=206=20=E2=80=94=20/admin/?=
 =?UTF-8?q?media=20gallery=20+=20theme=20write-through?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/admin/media/page.tsx      | 137 ++++++++++++++++++++++++++++++
 src/app/admin/settings/actions.ts |  11 +++
 src/lib/admin/media.ts            |  60 +++++++++++++
 3 files changed, 208 insertions(+)
 create mode 100644 src/app/admin/media/page.tsx
 create mode 100644 src/lib/admin/media.ts

diff --git a/src/app/admin/media/page.tsx b/src/app/admin/media/page.tsx
new file mode 100644
index 0000000..36dc856
--- /dev/null
+++ b/src/app/admin/media/page.tsx
@@ -0,0 +1,137 @@
+import Link from "next/link";
+import { MediaType } from "@/generated/prisma/enums";
+import { getMediaStats, listMediaAdmin } from "@/lib/admin/media";
+import { StatusBadge } from "@/components/admin/StatusBadge";
+
+export const dynamic = "force-dynamic";
+
+type PageProps = {
+  searchParams: Promise<{ q?: string; type?: string; carbetId?: string }>;
+};
+
+const TYPE_VALUES = new Set<string>([MediaType.PHOTO, MediaType.VIDEO]);
+
+export default async function MediaAdminPage({ searchParams }: PageProps) {
+  const sp = await searchParams;
+  const filters = {
+    q: sp.q?.trim() || undefined,
+    type: TYPE_VALUES.has(sp.type ?? "") ? (sp.type as MediaType) : undefined,
+    carbetId: sp.carbetId || undefined,
+  };
+  const [items, stats] = await Promise.all([listMediaAdmin(filters), getMediaStats()]);
+  const dateFmt = new Intl.DateTimeFormat("fr-FR", { day: "2-digit", month: "short", year: "2-digit" });
+
+  return (
+    <div className="mx-auto max-w-7xl">
+      <header className="mb-5 mt-2">
+        <h1 className="text-2xl font-semibold text-zinc-900">Médias</h1>
+        <p className="mt-1 text-sm text-zinc-500">
+          {items.length} affiché{items.length > 1 ? "s" : ""}
+          {items.length === 200 ? " (limite atteinte — affinez les filtres)" : ""}
+        </p>
+      </header>
+
+      <section className="mb-4 grid grid-cols-2 gap-3 sm:grid-cols-5">
+        <Stat label="Total fichiers" value={stats.total} />
+        <Stat label="Photos" value={stats.photo} />
+        <Stat label="Vidéos" value={stats.video} />
+        <Stat label="Carbets avec média" value={stats.carbetsWithMedia} />
+        <Stat label="Carbets sans média" value={stats.carbetsWithoutMedia} tone="warn" />
+      </section>
+
+      <form className="mb-4 flex flex-wrap items-center gap-2 rounded-lg border border-zinc-200 bg-white p-3" method="get">
+        <input
+          type="text"
+          name="q"
+          defaultValue={filters.q ?? ""}
+          placeholder="Recherche s3Key, carbet, slug…"
+          className="flex-1 min-w-[220px] rounded-md border border-zinc-300 px-3 py-1.5 text-sm focus:border-zinc-900 focus:outline-none"
+        />
+        <select
+          name="type"
+          defaultValue={filters.type ?? ""}
+          className="rounded-md border border-zinc-300 bg-white px-2 py-1.5 text-sm focus:border-zinc-900 focus:outline-none"
+        >
+          <option value="">Photos + vidéos</option>
+          <option value={MediaType.PHOTO}>Photos</option>
+          <option value={MediaType.VIDEO}>Vidéos</option>
+        </select>
+        <button type="submit" className="rounded-md bg-zinc-900 px-3 py-1.5 text-sm font-medium text-white hover:bg-zinc-800">
+          Filtrer
+        </button>
+        {(filters.q || filters.type || filters.carbetId) ? (
+          <Link href="/admin/media" className="text-sm text-zinc-500 hover:text-zinc-900">
+            Réinit.
+          </Link>
+        ) : null}
+      </form>
+
+      {items.length === 0 ? (
+        <div className="rounded-lg border border-zinc-200 bg-white px-4 py-8 text-center text-sm text-zinc-500">
+          Aucun média ne correspond aux filtres.
+        </div>
+      ) : (
+        <div className="grid grid-cols-2 gap-3 sm:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5">
+          {items.map((m) => (
+            <Link
+              key={m.id}
+              href={`/admin/carbets/${m.carbet.id}`}
+              className="group flex flex-col overflow-hidden rounded-lg border border-zinc-200 bg-white shadow-sm transition hover:shadow-md"
+            >
+              <div className="relative aspect-video bg-zinc-100">
+                {m.type === MediaType.PHOTO ? (
+                  // eslint-disable-next-line @next/next/no-img-element
+                  <img
+                    src={m.s3Url}
+                    alt={m.s3Key}
+                    loading="lazy"
+                    className="h-full w-full object-cover transition group-hover:scale-105"
+                  />
+                ) : (
+                  <div className="flex h-full w-full items-center justify-center text-3xl text-zinc-400">▶</div>
+                )}
+                <span className="absolute right-1 top-1 rounded bg-black/60 px-1.5 py-0.5 text-[10px] font-semibold uppercase tracking-wider text-white">
+                  {m.type}
+                </span>
+              </div>
+              <div className="flex flex-col gap-1 p-2 text-xs">
+                <div className="flex items-center justify-between gap-2">
+                  <span className="truncate font-semibold text-zinc-900">{m.carbet.title}</span>
+                  <StatusBadge status={m.carbet.status} />
+                </div>
+                <div className="flex items-center justify-between gap-2 text-[10px] text-zinc-500">
+                  <code className="truncate">{m.s3Key}</code>
+                  <span className="whitespace-nowrap">{dateFmt.format(m.createdAt)}</span>
+                </div>
+              </div>
+            </Link>
+          ))}
+        </div>
+      )}
+    </div>
+  );
+}
+
+function Stat({
+  label,
+  value,
+  tone = "neutral",
+}: {
+  label: string;
+  value: number;
+  tone?: "neutral" | "warn";
+}) {
+  return (
+    <div
+      className={
+        "rounded-lg border bg-white p-3 shadow-sm " +
+        (tone === "warn" && value > 0 ? "border-amber-300" : "border-zinc-200")
+      }
+    >
+      <div className="text-[11px] uppercase tracking-wider text-zinc-500">{label}</div>
+      <div className={"mt-1 text-2xl font-semibold " + (tone === "warn" && value > 0 ? "text-amber-700" : "text-zinc-900")}>
+        {value}
+      </div>
+    </div>
+  );
+}
diff --git a/src/app/admin/settings/actions.ts b/src/app/admin/settings/actions.ts
index c112f4a..7da4291 100644
--- a/src/app/admin/settings/actions.ts
+++ b/src/app/admin/settings/actions.ts
@@ -7,6 +7,7 @@ import { UserRole } from "@/generated/prisma/enums";
 import { requireRole } from "@/lib/authorization";
 import { recordAudit } from "@/lib/admin/audit";
 import { setSetting } from "@/lib/admin/settings";
+import { togglePlugin } from "@/lib/plugins/server";
 
 const platformSchema = z.object({
   name: z.string().trim().min(2).max(80),
@@ -66,8 +67,18 @@ export async function saveThemeSettingsAction(fd: FormData) {
   }
   const who = await actor();
   await setSetting("theme", parsed.data, who);
+
+  // Le rendu du site public est piloté par l'état des plugins thème.
+  // On synchronise : un seul plugin actif (ou aucun pour "default").
+  const wantAquarelle = parsed.data.active === "theme-aquarelle";
+  const wantGuyane = parsed.data.active === "theme-guyane";
+  await togglePlugin("theme-aquarelle", wantAquarelle);
+  await togglePlugin("theme-guyane", wantGuyane);
+
   await recordAudit({ scope: "admin.settings", event: "theme.update", actorEmail: who, details: parsed.data });
   revalidatePath("/admin/settings");
+  revalidatePath("/admin/plugins");
+  revalidatePath("/");
   return { ok: true as const };
 }
 
diff --git a/src/lib/admin/media.ts b/src/lib/admin/media.ts
new file mode 100644
index 0000000..f96654e
--- /dev/null
+++ b/src/lib/admin/media.ts
@@ -0,0 +1,60 @@
+import "server-only";
+
+import { Prisma } from "@/generated/prisma/client";
+import { MediaType } from "@/generated/prisma/enums";
+import { prisma } from "@/lib/prisma";
+
+export type AdminMediaFilters = {
+  q?: string;
+  type?: MediaType;
+  carbetId?: string;
+};
+
+export type AdminMediaListItem = {
+  id: string;
+  type: MediaType;
+  s3Key: string;
+  s3Url: string;
+  sortOrder: number;
+  createdAt: Date;
+  carbet: { id: string; title: string; slug: string; status: string };
+};
+
+export async function listMediaAdmin(filters: AdminMediaFilters = {}): Promise<AdminMediaListItem[]> {
+  const where: Prisma.MediaWhereInput = {};
+  if (filters.q) {
+    where.OR = [
+      { s3Key: { contains: filters.q, mode: "insensitive" } },
+      { carbet: { title: { contains: filters.q, mode: "insensitive" } } },
+      { carbet: { slug: { contains: filters.q, mode: "insensitive" } } },
+    ];
+  }
+  if (filters.type) where.type = filters.type;
+  if (filters.carbetId) where.carbetId = filters.carbetId;
+
+  return prisma.media.findMany({
+    where,
+    orderBy: [{ createdAt: "desc" }],
+    take: 200,
+    select: {
+      id: true,
+      type: true,
+      s3Key: true,
+      s3Url: true,
+      sortOrder: true,
+      createdAt: true,
+      carbet: { select: { id: true, title: true, slug: true, status: true } },
+    },
+  });
+}
+
+export async function getMediaStats() {
+  const [total, photo, video, carbetsWithMedia, carbetsWithoutMedia] = await Promise.all([
+    prisma.media.count(),
+    prisma.media.count({ where: { type: MediaType.PHOTO } }),
+    prisma.media.count({ where: { type: MediaType.VIDEO } }),
+    prisma.carbet.count({ where: { media: { some: {} } } }),
+    prisma.carbet.count({ where: { media: { none: {} } } }),
+  ]);
+  return { total, photo, video, carbetsWithMedia, carbetsWithoutMedia };
+}