Do SikiandClaude Sonnet 5
d6f3dda9e5
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>
mozdIT Bt. Website - Next.js Application
Modern Next.js 15 website for mozdIT Bt. - Hungarian IT services company.
🚀 Quick Start
# Install dependencies
npm install
# Development server (with Turbopack)
npm run dev
# Production build
npm run build
# Run tests
npm test
Open http://localhost:3000 to view the site.
📁 Project Structure
src/
├── app/ # Next.js App Router
│ ├── page.tsx # Homepage
│ ├── rolunk/ # About page
│ ├── szolgaltatasok/ # Services page
│ ├── kapcsolat/ # Contact page
│ ├── api/ # API routes
│ └── globals.css # Design system & styles
├── components/ # React components
│ ├── Header.tsx # Navigation header
│ ├── Footer.tsx # Site footer
│ └── ThemeProvider.tsx # Dark mode provider
├── content/ # JSON content management
│ ├── types.ts # Content type definitions
│ ├── index.ts # Content loader
│ ├── common.json # Shared texts
│ └── pages/ # Page-specific content
├── config/ # Site configuration
├── lib/ # Utilities
└── types/ # TypeScript definitions
🎨 Design System
The project uses a comprehensive design system defined in globals.css:
CSS Variables
- Brand colors (
--color-primary-*) - Semantic colors (
--color-background,--color-foreground) - Shadows, transitions, border radius
Dark Mode
- Automatic system preference detection
- Manual toggle via ThemeProvider
- Uses
data-theme="dark"attribute
Animations
animate-fade-in-up- Fade in with upward motionanimate-float- Floating effectanimate-pulse-slow- Slow pulsinghover-lift,hover-scale,hover-glow- Hover effects
Utility Classes
.card- Card component styling.btn,.btn-primary,.btn-secondary- Button styles.icon-container- Icon wrapper styling
📝 Content Management
All page content is managed through JSON files in src/content/:
import { content, getPageContent } from '@/content'
// Access specific page content
const aboutContent = content.pages.about
// Or use the helper function
const servicesContent = getPageContent('services')
Content Files
| File | Description |
|---|---|
common.json |
Shared texts (buttons, labels, validation) |
pages/home.json |
Homepage CTA section |
pages/about.json |
About page (hero, story, mission, team, CTA) |
pages/services.json |
Services (hero, details, support, CTA) |
pages/contact.json |
Contact (form labels, FAQ, info) |
🧪 Testing
# Unit tests
npm test
# Watch mode
npm run test:watch
# Coverage report
npm run test:coverage
# All test suites
npm run test:all
🐳 Docker Development
For full-stack development with MongoDB and monitoring:
# From project root
docker-compose -f docker-compose.dev.yml up -d
Services:
- Website: http://localhost:3000
- MongoDB UI: http://localhost:8081
- Grafana: http://localhost:3001