Do SikiandClaude Sonnet 5
3132fcb8eb
Payload Global configs mirroring proto/src/content/types.ts:
- src/globals/{Home,About,Services,Contact,Common}.ts
- src/globals/fields/stringArray.ts — shared helper: Payload has no
native string[] field, so every plain string array from the old
content types (trustBullets, paragraphs, features, spec items, …)
becomes an array of one-field { value } objects.
- home.partners is intentionally NOT included — that becomes its own
Partners collection (logo -> Media upload) in MITHOME-89, to avoid
two disagreeing sources for the same data.
- contact.form.fields.gdpr.label stays a plain textarea (not lexical
richText): the JSON source is a hand-written HTML string with an
<a> tag; richText's node-tree serialization would need its own
migration/render logic, out of scope for this bootstrap pass.
scripts/migrate-content-to-payload.ts: one-shot, idempotent Local API
migration reading the existing JSON files and calling updateGlobal —
does not touch or delete the JSON files. Run via the new
`npm run migrate:content` script.
Registered the five Globals in payload.config.ts.
Also included here (belongs with the previous "resolve double-root-
layout conflict" commit but didn't actually get staged there —
verified only now by diffing HEAD against the working tree):
(frontend)/layout.tsx's relative imports corrected to ../../ instead
of ../ (one directory deeper than the original src/app/layout.tsx).
Verified:
- npm run build / lint, tsc --noEmit, npm test (58 passed) all clean
- npm run migrate:content against the real dev MongoDB container,
then read back via payload.findGlobal() — hero.title, trustBullets,
services.items[0].features, footer.address, faq.items.length all
match the JSON source
- Real browser: logged into /admin, opened the Home global editor —
Hero/Trust bullets group renders and shows the migrated Hungarian
content correctly (see screenshot shared in chat)
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