Decouple admin from public max-w-7xl via (site) route group.

Public chrome and width live only under (site). /admin and /client inherit the root layout alone, so housekeeping width is no longer tied to the public template.

Co-authored-by: Cursor <[email protected]>

src/app/(site)/photos/page.tsx

@@ -0,0 +1,64 @@
+import { getTranslations } from "next-intl/server";
+import {
+	type LightboxPhoto,
+	PhotoLightbox,
+} from "@/components/public/photo-lightbox";
+import { ContentCard, EmptyState } from "@/components/public/ui";
+import { prisma } from "@/lib/prisma";
+
+export const revalidate = 300;
+
+export const metadata = { title: "Photos" };
+
+type Photo = {
+	id: number;
+	userId: number;
+	roomId: number;
+	timestamp: number;
+	url: string;
+};
+
+function formatDate(timestamp: number): string {
+	return new Date(timestamp * 1000)
+		.toISOString()
+		.slice(0, 16)
+		.replace("T", " ");
+}
+
+export default async function PhotosPage() {
+	const t = await getTranslations("pages.photos");
+
+	let photos: Photo[] = [];
+	try {
+		photos = await prisma.cameraWeb.findMany({
+			orderBy: { timestamp: "desc" },
+			take: 48,
+		});
+	} catch {
+		photos = [];
+	}
+
+	// Pre-shape for the client lightbox: translate captions server-side so the
+	// client component stays free of i18n/prisma dependencies.
+	const items: LightboxPhoto[] = photos.map((p) => ({
+		id: String(p.id),
+		url: p.url,
+		alt: t("photoAlt", { id: p.userId }),
+		date: formatDate(p.timestamp),
+		user: t("byUser", { id: p.userId }),
+	}));
+
+	return (
+		<main style={{ display: "grid", gap: "1.5rem" }}>
+			<ContentCard icon="📸" title={t("title")} subtitle={t("subtitle")} />
+
+			<ContentCard padded={items.length === 0}>
+				{items.length === 0 ? (
+					<EmptyState icon="📸">{t("noPhotos")}</EmptyState>
+				) : (
+					<PhotoLightbox photos={items} />
+				)}
+			</ContentCard>
+		</main>
+	);
+}