Initial commit: ANOUMA website with Payload CMS, WebRTC meetings, and booking system

- Next.js 16 App Router site with the ANOUMA design system - Payload CMS (PostgreSQL) for offers, events, posts and page content - WebRTC video-call system with custom signaling server - SMTP email reminders and booking-request notifications - Customer accounts, calendar-based availability, and booking workflow
2026-08-25 16:40:51 +02:00
commit 45261a0461
138 changed files with 23263 additions and 0 deletions
@@ -0,0 +1,60 @@
+import type { Metadata } from "next";
+import { notFound } from "next/navigation";
+import { PageHeader } from "@/components/PageHeader";
+import { Section } from "@/components/Section";
+import { ImagePlaceholder } from "@/components/ImagePlaceholder";
+import { RichText } from "@/components/RichText";
+import { getPostBySlug } from "@/lib/payload/content";
+import { mediaAlt, mediaUrl } from "@/lib/payload/media";
+
+export const dynamic = "force-dynamic";
+
+type Args = { params: Promise<{ slug: string }> };
+
+export async function generateMetadata({ params }: Args): Promise<Metadata> {
+  const { slug } = await params;
+  const post = await getPostBySlug(slug);
+  if (!post) return {};
+  return { title: post.title, description: post.teaser };
+}
+
+export default async function PostDetailPage({ params }: Args) {
+  const { slug } = await params;
+  const post = await getPostBySlug(slug);
+  if (!post) notFound();
+
+  const publishDate = new Date(post.publishDate ?? post.createdAt).toLocaleDateString("de-DE", {
+    day: "2-digit",
+    month: "long",
+    year: "numeric",
+  });
+
+  return (
+    <>
+      <PageHeader
+        eyebrow={publishDate}
+        title={post.title}
+        lead={post.teaser}
+        crumbs={[{ title: "Aktuelles", href: "/aktuelles" }, { title: post.title }]}
+      />
+      <div className="mx-auto -mt-10 max-w-5xl px-6 sm:px-8 lg:px-12">
+        <div className="relative aspect-[21/9] w-full">
+          <ImagePlaceholder
+            mood="sand"
+            label={post.title}
+            src={mediaUrl(post.coverImage, "hero")}
+            alt={mediaAlt(post.coverImage) ?? post.title}
+            shape="soft"
+            priority
+            className="h-full w-full"
+          />
+        </div>
+      </div>
+      <Section tone="plain">
+        <div className="mx-auto max-w-2xl">
+          <RichText data={post.content} />
+        </div>
+      </Section>
+    </>
+  );
+}