fix(templates): static generation from incorrect params provided (#8530)

templates/website/src/app/(frontend)/[slug]/page.tsx

@@ -13,8 +13,6 @@ import { RenderBlocks } from '@/blocks/RenderBlocks'
 import { RenderHero } from '@/heros/RenderHero'
 import { generateMeta } from '@/utilities/generateMeta'
 
-export const dynamic = 'force-static'
-
 export async function generateStaticParams() {
   const payload = await getPayloadHMR({ config: configPromise })
   const pages = await payload.find({
@@ -24,11 +22,15 @@ export async function generateStaticParams() {
     overrideAccess: false,
   })
 
-  return pages.docs
+  const params = pages.docs
     ?.filter((doc) => {
       return doc.slug !== 'home'
     })
-    .map(({ slug }) => slug)
+    .map(({ slug }) => {
+      return { slug }
+    })
+
+  return params
 }
 
 export default async function Page({ params: { slug = 'home' } }) {

templates/website/src/app/(frontend)/posts/[slug]/page.tsx

@@ -14,8 +14,6 @@ import { PostHero } from '@/heros/PostHero'
 import { generateMeta } from '@/utilities/generateMeta'
 import PageClient from './page.client'
 
-export const dynamic = 'force-static'
-
 export async function generateStaticParams() {
   const payload = await getPayloadHMR({ config: configPromise })
   const posts = await payload.find({
@@ -25,7 +23,11 @@ export async function generateStaticParams() {
     overrideAccess: false,
   })
 
-  return posts.docs?.map(({ slug }) => slug)
+  const params = posts.docs.map(({ slug }) => {
+    return { slug }
+  })
+
+  return params
 }
 
 export default async function Post({ params: { slug = '' } }) {

templates/website/src/app/(frontend)/posts/page/[pageNumber]/page.tsx

@@ -6,11 +6,9 @@ import { Pagination } from '@/components/Pagination'
 import configPromise from '@payload-config'
 import { getPayloadHMR } from '@payloadcms/next/utilities'
 import React from 'react'
-
-export const dynamic = 'force-static'
 export const revalidate = 600
 
-export default async function Page({ params: { pageNumber = 2 } }) {
+export default async function Page({ params: { pageNumber } }) {
   const payload = await getPayloadHMR({ config: configPromise })
 
   const posts = await payload.find({
@@ -49,9 +47,9 @@ export default async function Page({ params: { pageNumber = 2 } }) {
   )
 }
 
-export function generateMetadata({ params: { pageNumber = 2 } }): Metadata {
+export function generateMetadata({ params: { pageNumber } }): Metadata {
   return {
-    title: `Payload Website Template Posts Page ${pageNumber}`,
+    title: `Payload Website Template Posts Page ${pageNumber || ''}`,
   }
 }
 
@@ -65,10 +63,10 @@ export async function generateStaticParams() {
     overrideAccess: false,
   })
 
-  const pages: number[] = []
+  const pages: { pageNumber: string }[] = []
 
   for (let i = 1; i <= posts.totalPages; i++) {
-    pages.push(i)
+    pages.push({ pageNumber: String(i) })
   }
 
   return pages