refactor: docubook@latest template nextjs-docker

app/docs/[[...slug]]/page.tsx

@@ -1,5 +1,5 @@
 import { notFound } from "next/navigation"
-import { getDocsForSlug, getDocsTocs } from "@/lib/markdown"
+import { getDocsForSlug, getDocsFrontmatterForSlug, getDocsStaticParams } from "@/lib/markdown"
 import DocsBreadcrumb from "@/components/DocsBreadcrumb"
 import Pagination from "@/components/pagination"
 import Toc from "@/components/toc"
@@ -17,6 +17,8 @@ type PageProps = {
   }>
 }
 
+export const dynamicParams = true
+
 // Function to generate metadata dynamically
 export async function generateMetadata(props: PageProps) {
   const params = await props.params
@@ -24,22 +26,24 @@ export async function generateMetadata(props: PageProps) {
   const { slug = [] } = params
 
   const pathName = slug.join("/")
-  const res = await getDocsForSlug(pathName)
+  // React.cache() deduplicates within this request, so if the page component
+  // also calls getDocsFrontmatterForSlug, they share the same file read
+  const frontmatter = await getDocsFrontmatterForSlug(pathName)
 
-  if (!res) {
+  if (!frontmatter) {
     return {
       title: "Page Not Found",
       description: "The requested page was not found.",
     }
   }
 
-  const { title, description, image } = res.frontmatter
+  const { title, description, image } = frontmatter
 
-  // Absolute URL for og:image
+  // Absolute URL for og:image - compute once
   const ogImage = image ? `${meta.baseURL}/images/${image}` : `${meta.baseURL}/images/og-image.png`
 
   return {
-    title: `${title}`,
+    title,
     description,
     openGraph: {
       title,
@@ -64,6 +68,10 @@ export async function generateMetadata(props: PageProps) {
   }
 }
 
+export async function generateStaticParams() {
+  return getDocsStaticParams()
+}
+
 export default async function DocsPage(props: PageProps) {
   const params = await props.params
 
@@ -76,11 +84,11 @@ export default async function DocsPage(props: PageProps) {
 
   const { title, description, image: _image, date } = res.frontmatter
   const filePath = res.filePath
-  const tocs = await getDocsTocs(pathName)
+  const tocs = res.tocs
 
   return (
     <div className="flex w-full flex-1 px-0 pb-4 lg:px-8 lg:pb-8 lg:h-[calc(100vh-4rem)]">
-      <div id="scroll-container" className="max-lg:scroll-p-54 bg-card dark:bg-card/20 border-muted-foreground/20 flex w-full flex-col items-start lg:h-full lg:rounded-xl rounded-b-3xl border shadow-md backdrop-blur-sm lg:flex-row lg:overflow-y-auto relative">
+      <div id="scroll-container" className="max-lg:scroll-p-54 bg-card dark:bg-card border-muted-foreground/20 flex w-full flex-col items-start lg:h-full lg:rounded-xl rounded-b-3xl border shadow-md lg:backdrop-blur-sm lg:dark:bg-card/20 lg:flex-row lg:overflow-y-auto relative">
         <div className="flex-7 w-full min-w-0 px-4 py-4 lg:px-8 lg:py-8">
           <MobToc tocs={tocs} title={title} />
           <DocsBreadcrumb paths={slug} />
@@ -95,7 +103,7 @@ export default async function DocsPage(props: PageProps) {
               {docuConfig.repository?.editLink && <EditThisPage filePath={filePath} />}
               {date && (
                 <p className="text-muted-foreground text-[13px]">
-                  Published on {formatDate2(date)}
+                  Last updated {formatDate2(date)}
                 </p>
               )}
             </div>