fix(cms): resolve double-root-layout conflict between the site and Payload admin

Next.js 16 requires either one shared root layout for every route, or each top-level route group to be fully self-contained (no ancestor layout.tsx above it). MITHOME-86 added (payload)/layout.tsx — which itself renders Payload's own <html>/<body> via <RootLayout> — while src/app/layout.tsx still existed as a shared ancestor and did the same. The result was two React trees fighting over <html>/<body>/<head>, surfacing in the browser as hydration failures and "You are mounting a new html component" errors on /admin (invisible to curl-based checks in the MITHOME-86 verification, since they only exercise SSR, not client hydration — that verification's "confirmed live" claim was therefore incomplete; caught now with an actual browser). Fix, per Payload's documented multi-root pattern: move every existing site route (page.tsx, globals.css, kapcsolat/szolgaltatasok/rolunk/ adatvedelem/felhasznalasi-feltetelek) into a new (frontend) route group with its own layout.tsx (renamed from src/app/layout.tsx, with relative imports adjusted one level deeper), as a sibling of (payload). No shared layout.tsx remains directly under src/app/. Verified in a real browser (not just curl): /admin/login and the dashboard now render and hydrate cleanly, and all site routes (/, /rolunk, /szolgaltatasok, /kapcsolat, /adatvedelem, /felhasznalasi-feltetelek) are unaffected — same output, just moved. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-09-10 03:40:00 +02:00
parent 2a4f33172b
commit a661739844
9 changed files with 0 additions and 0 deletions
@@ -0,0 +1,53 @@
+import { content } from '@/content'
+
+export const metadata = {
+  title: `${content.pages.hasznalatiFeltetelek.title} | ${content.common.labels.features || 'mozdIT Bt.'}`,
+  description: 'Általános Szerződési Feltételek - Ismerje meg a mozdIT Bt. szolgáltatásainak használati feltételeit.',
+}
+
+export default function TermsOfService() {
+  const pageContent = content.pages.hasznalatiFeltetelek
+
+  return (
+    <div className="py-20 lg:py-28 max-w-4xl mx-auto px-4 sm:px-6 lg:px-8">
+      <div className="mb-12">
+        <h1 
+          className="text-4xl md:text-5xl font-bold mb-4"
+          style={{ color: 'var(--color-foreground)' }}
+        >
+          {pageContent.title}
+        </h1>
+        <p 
+          className="text-sm"
+          style={{ color: 'var(--color-foreground-muted)' }}
+        >
+          Utolsó frissítés: {pageContent.lastUpdated}
+        </p>
+      </div>
+
+      <div className="space-y-12">
+        {pageContent.sections.map((section) => (
+          <section key={section.id}>
+            <h2 
+              className="text-2xl font-semibold mb-4"
+              style={{ color: 'var(--color-foreground)' }}
+            >
+              {section.title}
+            </h2>
+            <div 
+              className="prose max-w-none"
+              style={{ color: 'var(--color-foreground-muted)' }}
+              dangerouslySetInnerHTML={{
+                __html: section.content
+                  .replace(/\n\n/g, '</p><p class="mb-4">')
+                  .replace(/• \*\*(.*?)\*\*/g, '<br/>• <strong>$1</strong>')
+                  .replace(/^/, '<p class="mb-4">')
+                  .replace(/$/, '</p>')
+              }}
+            />
+          </section>
+        ))}
+      </div>
+    </div>
+  )
+}