feat(frontend): Payload Local API + hu/en locale routing (MITHOME-91/114)
CI Pipeline with Test Management / 🧪 Run Tests & Generate Reports (push) Waiting to run
CI Pipeline with Test Management / 🐳 Docker Integration Tests (push) Blocked by required conditions
CI Pipeline with Test Management / 🏗️ Build Docker Image (push) Blocked by required conditions
CI Pipeline with Test Management / 📊 Generate Test Summary (push) Blocked by required conditions
Test Reporting & Gherkin Analysis / 🧪 Run Tests & Generate Reports (push) Waiting to run
Test Reporting & Gherkin Analysis / 📊 Analyze Test Coverage (push) Blocked by required conditions
Test Reporting & Gherkin Analysis / 🔄 Sync with Linear (push) Blocked by required conditions
Test Reporting & Gherkin Analysis / ⚡ Performance Monitoring (push) Blocked by required conditions

Replaces the JSON content system with Payload's Local API across every
frontend page, and introduces symmetric locale-prefixed routing
(/hu/..., /en/...) with per-locale translated slugs — supersedes the
earlier "hu unprefixed" decision (see chat 2026-09-10).

Routing structure:
- src/app/(frontend)/layout.tsx: now a minimal shell (html/body, theme
  script, ThemeProvider) — no longer locale-aware.
- src/app/(frontend)/page.tsx: redirects bare "/" to the default
  locale (/hu).
- src/app/(frontend)/not-found.tsx: explicit 404 for the (frontend)
  group — without it, Next's built-in fallback collided with the
  (payload) group's own root and reproduced the "double html / script
  tag" symptom from MITHOME-87, but only on notFound() paths. Verified
  fixed in both dev and a real production (standalone) server; the
  remaining "script tag" console warning on invalid routes turned out
  to be Turbopack dev-mode-only noise (zero console errors in
  production) — confirmed by building and running .next/standalone
  directly.
- src/app/(frontend)/[locale]/layout.tsx: validates the locale segment
  (generateStaticParams hu/en, notFound() otherwise), fetches Common +
  Home via Payload, renders Header/Footer/staging-banner.
- src/app/(frontend)/[locale]/page.tsx: home, fetches Home global +
  Partners collection.
- src/app/(frontend)/[locale]/[slug]/page.tsx: catch-all for about/
  services/contact/privacy/terms — resolves slug -> PageKey via
  src/lib/i18n.ts's PAGE_SLUGS map (generateStaticParams pre-renders
  all 10 locale×slug combinations), generateMetadata per page.

New lib layer:
- src/lib/i18n.ts: Locale/PageKey types, PAGE_SLUGS (translated slugs
  per locale), localePath()/resolvePageKey()/switchLocalePath()
  helpers (the last one already shaped for MITHOME-115).
- src/lib/payload-content.ts: Local API getters that also unwrap
  Payload's `{ value: string }[]` array-field shape back into plain
  string[] (see src/globals/fields/stringArray.ts) — keeps the page
  JSX consuming the exact shape the old content/types.ts had, so the
  migration is a data-source swap, not a markup rewrite.

Presentational split: page bodies moved to src/components/views/
(HomeView, AboutView, ServicesView, ContactView, LegalPageView — the
last one shared by both legal pages, identical shape) as prop-driven
components; the app-router page.tsx files became thin server-side
fetch + render wrappers. Header/Footer converted from importing
content directly to accepting nav/locale/content props, since they're
'use client' and can't call the Payload Local API themselves —
config/site.ts's navigation arrays became getMainNavigation(locale)/
getFooterNavigation(locale)/getFooterLegalLinks(locale) functions.

Two real, pre-existing bugs fixed along the way (not introduced by
this migration):
- Services and Contact pages' "Webmail belépés" links used the
  primary CTA's href (/kapcsolat) with target="_blank" instead of the
  actual webmail URL (home.hero.cta.secondary.href) — now correct.
- The GDPR checkbox link pointed to "/adatkezelesi-tajekoztato", which
  never matched the real privacy page route under any past URL
  scheme. contact.json's gdpr.label now carries a {privacyHref}
  placeholder that ContactView replaces with the locale-correct path
  — also fixes the adatvedelem page's own <title> tag, which
  previously read "Adatvédelmi Tájékoztató | Szolgáltatás jellemzők:"
  (a copy-paste bug using common.labels.features instead of the site
  name).

Known, accepted limitation: the outer shell layout hardcodes
<html lang="hu"> because it sits above the [locale] segment and can't
read the param — every [locale]/[slug] page's own generateMetadata is
locale-correct, but the initial lang attribute isn't. Documented as a
MITHOME-116 (SEO/hreflang) follow-up rather than restructured now.

Verified end to end in a real browser: /hu matches the
https://stage.mozdit.hu visual baseline (MITHOME-117) exactly; /en
renders with English nav/metadata (content body still Hungarian-only,
as expected — MITHOME-111/113 not done yet); /hu/kapcsolat's GDPR link
resolves to /hu/adatvedelem; dark mode still works; invalid locale
(/fr/about) and invalid slug (/hu/nemletezo-oldal) both 404 correctly;
bare "/" redirects to /hu. build/lint/tsc/test (58 passed) all clean,
including a clean production standalone-server run.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
Do Siki
2026-09-10 16:15:09 +02:00
co-authored by Claude Sonnet 5
parent 594865ea9a
commit d6f3dda9e5
21 changed files with 1007 additions and 596 deletions
+41
View File
@@ -0,0 +1,41 @@
import type { Metadata } from 'next'
import HomeView from '@/components/views/HomeView'
import { isLocale, type Locale } from '@/lib/i18n'
import { getHomeContent, getPartners } from '@/lib/payload-content'
import { siteConfig, getSiteDescription, getOgLocale } from '@/config/site'
import { notFound } from 'next/navigation'
type Params = { locale: string }
export async function generateMetadata({ params }: { params: Promise<Params> }): Promise<Metadata> {
const { locale: rawLocale } = await params
if (!isLocale(rawLocale)) return {}
const locale: Locale = rawLocale
const description = getSiteDescription(locale)
return {
title: `${siteConfig.general.name} | ${description}`,
description,
openGraph: {
title: siteConfig.general.name,
description,
url: siteConfig.general.url,
siteName: siteConfig.general.name,
images: [{ url: siteConfig.general.ogImage, width: 1200, height: 630, alt: siteConfig.general.name }],
locale: getOgLocale(locale),
type: 'website',
},
}
}
export default async function HomePage({ params }: { params: Promise<Params> }) {
const { locale: rawLocale } = await params
if (!isLocale(rawLocale)) notFound()
const locale: Locale = rawLocale
const [content, partners] = await Promise.all([
getHomeContent(locale),
getPartners(),
])
return <HomeView content={content} partners={partners} locale={locale} />
}