fix: og image generation

app/magazines/[slug]/[issue]/page.tsx

@@ -1,5 +1,6 @@
 export const dynamic = "force-dynamic";
 
+import type { Metadata } from "next";
 import Link from "next/link";
 import { notFound } from "next/navigation";
 import {
@@ -9,6 +10,7 @@ import {
   slugToBookCode,
   type MagazineSidebarItem,
 } from "@/lib/magazines";
+import { ogForMagazine, extractQuoteFromHl, buildOgMeta } from "@/lib/og";
 import { PageHeader } from "@/components/page-header";
 import { Card, CardContent } from "@/components/ui/card";
 import { buttonVariants } from "@/components/ui/button";
@@ -16,6 +18,35 @@ import { ChevronLeft, ChevronRight } from "lucide-react";
 import { cn } from "@/lib/utils";
 import { MobileNav, type MobileNavGroup } from "@/components/mobile-nav";
 
+export async function generateMetadata({
+  params,
+  searchParams,
+}: {
+  params: Promise<{ slug: string; issue: string }>;
+  searchParams: Promise<Record<string, string | string[] | undefined>>;
+}): Promise<Metadata> {
+  const { slug, issue: issueSlug } = await params;
+  const sp = await searchParams;
+  const bookCode = slugToBookCode(slug);
+
+  const quote = extractQuoteFromHl(sp);
+  if (quote) {
+    const meta = await getMagazineMeta(bookCode);
+    const title = meta?.title ?? slug;
+    return buildOgMeta({ title, quote });
+  }
+
+  const [meta, content] = await Promise.all([
+    getMagazineMeta(bookCode),
+    getMagazineContent(bookCode, issueSlug),
+  ]);
+
+  const magTitle = meta?.title ?? slug;
+  const issueTitle = content?.title ?? undefined;
+
+  return ogForMagazine(magTitle, issueTitle);
+}
+
 export default async function MagazineIssuePage({
   params,
 }: {