From c8f6a0634061589924c000559268a864d831a175 Mon Sep 17 00:00:00 2001
From: muraschal <marcel@marcelrapold.com>
Date: Thu, 25 Jun 2026 23:38:46 +0200
Subject: [PATCH] fix(web): give the /reports pages real Open Graph cards
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Follow-up to the audit fix: removing the broken hardcoded `/opengraph-image`
override left the reports pages with no og:image at all (Next does not
cascade the route-group OG into the reports segments). Add colocated
opengraph-image routes (index + [slug], en + de) that render a branded card
via the shared renderOgImage — the index uses the gallery kicker/headline,
the detail uses the report title/summary.

Closes the remaining half of the /reports OG finding.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 .../de/reports/[slug]/opengraph-image.tsx     | 24 +++++++++++++++++++
 web/app/(de)/de/reports/opengraph-image.tsx   | 11 +++++++++
 .../(en)/reports/[slug]/opengraph-image.tsx   | 24 +++++++++++++++++++
 web/app/(en)/reports/opengraph-image.tsx      | 11 +++++++++
 4 files changed, 70 insertions(+)
 create mode 100644 web/app/(de)/de/reports/[slug]/opengraph-image.tsx
 create mode 100644 web/app/(de)/de/reports/opengraph-image.tsx
 create mode 100644 web/app/(en)/reports/[slug]/opengraph-image.tsx
 create mode 100644 web/app/(en)/reports/opengraph-image.tsx

diff --git a/web/app/(de)/de/reports/[slug]/opengraph-image.tsx b/web/app/(de)/de/reports/[slug]/opengraph-image.tsx
new file mode 100644
index 0000000..8626c2e
--- /dev/null
+++ b/web/app/(de)/de/reports/[slug]/opengraph-image.tsx
@@ -0,0 +1,24 @@
+import { reportProseFor } from "@/lib/i18n";
+import { REPORTS } from "@/lib/reports";
+import { ogContentType, ogSize, renderOgImage } from "@/lib/og";
+
+export const alt = "auditor — Audit-Bericht";
+export const size = ogSize;
+export const contentType = ogContentType;
+
+// Pre-render one card per report slug; mirror the page's `dynamicParams = false`.
+export function generateStaticParams() {
+  return REPORTS.map((r) => ({ slug: r.slug }));
+}
+
+export const dynamicParams = false;
+
+export default async function OpengraphImage({
+  params,
+}: {
+  params: Promise<{ slug: string }>;
+}) {
+  const { slug } = await params;
+  const prose = reportProseFor("de", slug);
+  return renderOgImage({ title: prose?.title ?? "auditor", subtitle: prose?.summary ?? "" });
+}
diff --git a/web/app/(de)/de/reports/opengraph-image.tsx b/web/app/(de)/de/reports/opengraph-image.tsx
new file mode 100644
index 0000000..446b094
--- /dev/null
+++ b/web/app/(de)/de/reports/opengraph-image.tsx
@@ -0,0 +1,11 @@
+import { t } from "@/lib/i18n";
+import { ogContentType, ogSize, renderOgImage } from "@/lib/og";
+
+export const alt = "auditor — echte Audit-Berichte";
+export const size = ogSize;
+export const contentType = ogContentType;
+
+export default function OpengraphImage() {
+  const tt = t("de");
+  return renderOgImage({ title: tt.repIndexKicker, subtitle: tt.repIndexTitle });
+}
diff --git a/web/app/(en)/reports/[slug]/opengraph-image.tsx b/web/app/(en)/reports/[slug]/opengraph-image.tsx
new file mode 100644
index 0000000..d501042
--- /dev/null
+++ b/web/app/(en)/reports/[slug]/opengraph-image.tsx
@@ -0,0 +1,24 @@
+import { reportProseFor } from "@/lib/i18n";
+import { REPORTS } from "@/lib/reports";
+import { ogContentType, ogSize, renderOgImage } from "@/lib/og";
+
+export const alt = "auditor — audit report";
+export const size = ogSize;
+export const contentType = ogContentType;
+
+// Pre-render one card per report slug; mirror the page's `dynamicParams = false`.
+export function generateStaticParams() {
+  return REPORTS.map((r) => ({ slug: r.slug }));
+}
+
+export const dynamicParams = false;
+
+export default async function OpengraphImage({
+  params,
+}: {
+  params: Promise<{ slug: string }>;
+}) {
+  const { slug } = await params;
+  const prose = reportProseFor("en", slug);
+  return renderOgImage({ title: prose?.title ?? "auditor", subtitle: prose?.summary ?? "" });
+}
diff --git a/web/app/(en)/reports/opengraph-image.tsx b/web/app/(en)/reports/opengraph-image.tsx
new file mode 100644
index 0000000..b43c925
--- /dev/null
+++ b/web/app/(en)/reports/opengraph-image.tsx
@@ -0,0 +1,11 @@
+import { t } from "@/lib/i18n";
+import { ogContentType, ogSize, renderOgImage } from "@/lib/og";
+
+export const alt = "auditor — real audit reports";
+export const size = ogSize;
+export const contentType = ogContentType;
+
+export default function OpengraphImage() {
+  const tt = t("en");
+  return renderOgImage({ title: tt.repIndexKicker, subtitle: tt.repIndexTitle });
+}