Add the page-builder frontend: /[slug] catch-all + block renderer

Pages/getPageBySlug/mapPayloadPage in payload.ts follow the exact
getPostBySlug/mapPayloadPost pattern. PageBlocks.tsx renders a Pages
doc's `layout` field, reusing existing components (RichText,
StepArrow, STEP_ICONS, TestimonialsGrid) rather than reinventing per-
block styling — matches what /lebensuhr, /3x3-system, and
/7-tage-klarheits-check already hand-built. LivePageContent.tsx
mirrors LivePostContent.tsx's live-preview pattern, using a synchronous
subset of the block renderer (testimonialsRef needs an async fetch a
client component can't perform inline, so it's skipped in preview
only — same "editable subset" scope-cut LivePostContent.tsx already
makes). buildWebPageSchema in structuredData.ts is the generic
JSON-LD fallback for content types with no bespoke schema (Article/
Product don't fit a page-builder page).

Verified end-to-end: inserted a real Pages test document (SQL, since
no admin auth available here) covering richTextSection/quote/ctaCard,
confirmed /[slug] renders it correctly, confirmed notFound() after
deleting it, then cleaned up the test row.
This commit is contained in:
Marco
2026-08-26 20:08:24 +00:00
parent 940545888c
commit 885389b300
6 changed files with 451 additions and 0 deletions
+20
View File
@@ -100,3 +100,23 @@ export function buildArticleSchema(
// directly (no need for a shared component around one line of JSX, and
// keeps this file free of "use client"/React concerns so server
// components can import it without issue).
// Generic fallback for content pages with no bespoke schema type of their
// own (Article for blog posts, Product for PDPs) — the Payload Pages
// collection (page builder) serves arbitrary content types, so a generic
// WebPage node is the right shape rather than guessing at a more specific
// one from the blocks it happens to contain.
export function buildWebPageSchema(
page: { title: string; seoDescription: string | null; slug: string },
seller: CompanySettings | null,
): Record<string, unknown> {
const url = `${SITE_URL}/${page.slug}`;
return {
"@context": "https://schema.org",
"@type": "WebPage",
name: page.title,
url,
...(page.seoDescription ? { description: page.seoDescription } : {}),
isPartOf: seller ? { "@id": `${SITE_URL}/#organization` } : { "@type": "Organization", name: "einfach produktiv." },
};
}