feat: add metadata generator for remaining books

app/books/pk/[chapter]/page.tsx

@@ -1,3 +1,6 @@
+export const dynamic = "force-dynamic";
+
+import type { Metadata } from "next";
 import Link from "next/link";
 import { notFound } from "next/navigation";
 import {
@@ -6,6 +9,9 @@ import {
   type PkChapter,
   type PkSidebarItem,
 } from "@/lib/pk";
+import { getProseChapter } from "@/lib/api";
+import { ogForChapter, extractQuoteFromHl, buildOgMeta } from "@/lib/og";
+import { BOOK_NAMES } from "@/lib/constants";
 import { PageHeader } from "@/components/page-header";
 import { Card, CardContent } from "@/components/ui/card";
 import { buttonVariants } from "@/components/ui/button";
@@ -13,7 +19,26 @@ import { ChevronLeft, ChevronRight } from "lucide-react";
 import { cn } from "@/lib/utils";
 import { MobileNav, type MobileNavGroup } from "@/components/mobile-nav";
 
-export const dynamic = "force-dynamic";
+// ---------------------------------------------------------------------------
+// Metadata
+// ---------------------------------------------------------------------------
+
+export async function generateMetadata({
+  params,
+  searchParams,
+}: {
+  params: Promise<{ chapter: string }>;
+  searchParams: Promise<Record<string, string | string[] | undefined>>;
+}): Promise<Metadata> {
+  const { chapter: slug } = await params;
+  const sp = await searchParams;
+  const chapter = await getProseChapter("pk", 0, slug);
+  const hlQuote = extractQuoteFromHl(sp, chapter?.paragraphs);
+  if (hlQuote) {
+    return buildOgMeta({ title: BOOK_NAMES["pk"], quote: hlQuote });
+  }
+  return ogForChapter("pk", chapter?.title || "");
+}
 
 // ---------------------------------------------------------------------------
 // Page
@@ -204,9 +229,7 @@ function PkNav({
           >
             <ChevronLeft className="size-4" />
             <span className="hidden sm:inline truncate max-w-[180px]">
-              {prev.chapter != null
-                ? `Prayer ${prev.chapter}`
-                : prev.label}
+              {prev.chapter != null ? `Prayer ${prev.chapter}` : prev.label}
             </span>
             <span className="sm:hidden">Previous</span>
           </Link>
@@ -224,9 +247,7 @@ function PkNav({
           )}
         >
           <span className="hidden sm:inline truncate max-w-[180px]">
-            {next.chapter != null
-              ? `Prayer ${next.chapter}`
-              : next.label}
+            {next.chapter != null ? `Prayer ${next.chapter}` : next.label}
           </span>
           <span className="sm:hidden">Next</span>
           <ChevronRight className="size-4" />