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,70 @@
+import type { Metadata } from "next";
+import Link from "next/link";
+import { PageHeader } from "@/components/PageHeader";
+import { Section } from "@/components/Section";
+import { ImagePlaceholder } from "@/components/ImagePlaceholder";
+import { Reveal } from "@/components/Reveal";
+import { getPosts } from "@/lib/payload/content";
+import { getAktuellesIntroGlobal } from "@/lib/payload/globals";
+import { mediaAlt, mediaUrl } from "@/lib/payload/media";
+
+export const dynamic = "force-dynamic";
+
+export async function generateMetadata(): Promise<Metadata> {
+  const intro = await getAktuellesIntroGlobal();
+  return {
+    title: intro.title || "Aktuelles",
+    description: intro.lead || "Neuigkeiten, Termine und Inspiration von Anouma.",
+  };
+}
+
+export default async function AktuellesPage() {
+  const [intro, posts] = await Promise.all([getAktuellesIntroGlobal(), getPosts()]);
+
+  return (
+    <>
+      <PageHeader
+        eyebrow={intro.eyebrow || "Aktuelles"}
+        title={intro.title || "Neuigkeiten, Termine und Inspiration"}
+        lead={intro.lead}
+        crumbs={[{ title: "Aktuelles" }]}
+      />
+
+      <Section tone="plain">
+        {posts.length === 0 ? (
+          <p className="text-lg text-anouma-plum">
+            Hier erscheinen bald die ersten Neuigkeiten — schau gerne wieder vorbei.
+          </p>
+        ) : (
+          <div className="grid gap-6 sm:grid-cols-2 lg:grid-cols-3">
+            {posts.map((post, i) => (
+              <Reveal key={post.slug} delay={Math.min(i * 0.06, 0.3)}>
+                <Link href={`/aktuelles/${post.slug}`} className="group block">
+                  <div className="relative aspect-[4/3] w-full overflow-hidden rounded-3xl">
+                    <ImagePlaceholder
+                      mood="sand"
+                      label={post.title}
+                      src={mediaUrl(post.coverImage, "card")}
+                      alt={mediaAlt(post.coverImage) ?? post.title}
+                      shape="soft"
+                      className="h-full w-full transition-transform duration-700 group-hover:scale-[1.03]"
+                    />
+                  </div>
+                  <p className="mt-4 text-xs font-medium uppercase tracking-[0.18em] text-anouma-plum/70">
+                    {new Date(post.publishDate ?? post.createdAt).toLocaleDateString("de-DE", {
+                      day: "2-digit",
+                      month: "long",
+                      year: "numeric",
+                    })}
+                  </p>
+                  <h2 className="mt-2 font-serif text-xl font-medium text-anouma-plum">{post.title}</h2>
+                  <p className="mt-2 text-sm leading-relaxed text-anouma-plum/90">{post.teaser}</p>
+                </Link>
+              </Reveal>
+            ))}
+          </div>
+        )}
+      </Section>
+    </>
+  );
+}