@goerlitz starting step 3 and 4 I think you get confused:
- move the code that needs "use client" into a separate file, for instance:
// app/datasets/[slug]/page.tsx
export const generateStaticParams()
export async function YourPage() {
return <ClientPage />
}
// app/datasets/[slug]/ClientPage.tsx
"use client"
export async function ClientPage() {
const [someState] = useState("foo")
return <div>{someState}</div>
}
- As for generating the page with a dummy parameter, I am not sure what cause this error specifically (might but just a bug?), but anyway I think this approach won't work as is.
The thing is that if you use a dummy static param, Next only knows the dummy "/datasets/foo" route. So "/datasets/bar" won't work. You could do an URL rewrite from "/datasets/bar" to "/datasets/foo", but then the route parameter is lost.
You could opt for a query parameter instead.
Sadly until Next.js supports exporting dynamic routes that are not statically rendered like it did in Next 12 pages dir, I don't think you can use a dynamic route and do a static export, you should prefer a query parameter, + optionally an URL rewrite from a route param to a query param.