feat: préparation Payload CMS — couche d'abstraction contenu
Sépare données et affichage pour basculer vers Payload CMS sans réécrire les composants. Nouveaux fichiers : - lib/site-config.ts : source unique de vérité pour toutes les données du site (as const) - lib/content.ts : couche async entre données et composants (static aujourd'hui, Payload demain) - types/content.ts : types TypeScript partagés (Service, Realisation, Partner, BlogPost, etc.) - payload/ : schémas CollectionConfig et GlobalConfig commentés prêts à activer Données enrichies dans siteConfig : - partners : ajout du champ desc pour chaque partenaire - realisations : 6 entrées complètes avec categorie et color - blogPosts : 6 articles avec slug, titre, extrait, cat, date, readTime Refactorisations (composants → content layer) : - Navbar, Footer : importent siteConfig directement (client component) - app/page.tsx : async, Promise.all sur getServices/getTestimonials/getFAQ/getValues/getPartners/getRealisations - app/services/page.tsx : getServices() + getSiteConfig() - app/contact/page.tsx : getSiteConfig() pour phone, email, address, zones - app/realisations/page.tsx : getRealisations() + getSiteConfig() - app/partenaires/page.tsx : getPartners() - app/blog/page.tsx : getBlogPosts() - app/blog/[slug]/page.tsx : getBlogPost() + getBlogPosts() pour generateStaticParams - LocalSEOPage.tsx : siteConfig pour services list, phone, address - 5 pages service (construction-maison, renovation, assainissement, creation-acces, demolition) : getSiteConfig() pour phone - Pages légales et SEO locales : siteConfig importé pour données dynamiques Corrections URL : - Toutes les URLs canoniques obc-maconnerie.fr → obc-terrassement.fr (30+ fichiers) - layout.tsx : BASE_URL depuis siteConfig.url - robots.ts, sitemap.ts : BASE_URL depuis siteConfig.url - api/contact/route.ts : email fallback → obc-terrassement.fr https://claude.ai/code/session_01Uec4iHjcPwB1pU41idWEdF
This commit is contained in:
Claude
54
payload/README.md
Normal file
54
payload/README.md
Normal file
@@ -0,0 +1,54 @@
|
||||
# Payload CMS — Préparation
|
||||
|
||||
Ce dossier contient les schémas Payload CMS commentés, prêts à être activés
|
||||
quand le projet bascule de contenu statique vers un CMS administrable.
|
||||
|
||||
## Architecture cible
|
||||
|
||||
```
|
||||
payload/
|
||||
├── collections/
|
||||
│ ├── Articles.ts → Articles de blog
|
||||
│ ├── Realisations.ts → Galerie chantiers
|
||||
│ ├── Services.ts → Services proposés
|
||||
│ ├── Testimonials.ts → Avis clients
|
||||
│ └── FAQ.ts → Questions fréquentes
|
||||
└── globals/
|
||||
└── SiteSettings.ts → Paramètres globaux du site
|
||||
```
|
||||
|
||||
## Migration (3 étapes)
|
||||
|
||||
### Étape 1 — Installer Payload CMS
|
||||
```bash
|
||||
npm install payload @payloadcms/db-postgres @payloadcms/richtext-lexical
|
||||
```
|
||||
|
||||
### Étape 2 — Activer les collections
|
||||
Décommenter le code dans chaque fichier `collections/*.ts` et `globals/*.ts`,
|
||||
puis créer `payload.config.ts` à la racine :
|
||||
|
||||
```ts
|
||||
import { buildConfig } from 'payload'
|
||||
import { Services } from './payload/collections/Services'
|
||||
import { Realisations } from './payload/collections/Realisations'
|
||||
import { Articles } from './payload/collections/Articles'
|
||||
import { Testimonials } from './payload/collections/Testimonials'
|
||||
import { FAQ } from './payload/collections/FAQ'
|
||||
import { SiteSettings } from './payload/globals/SiteSettings'
|
||||
|
||||
export default buildConfig({
|
||||
collections: [Services, Realisations, Articles, Testimonials, FAQ],
|
||||
globals: [SiteSettings],
|
||||
// ...db, admin, etc.
|
||||
})
|
||||
```
|
||||
|
||||
### Étape 3 — Mettre à jour lib/content.ts
|
||||
Remplacer les `return siteConfig.xxx` par les appels Payload commentés.
|
||||
**Les composants n'ont pas à changer.**
|
||||
|
||||
## Données actuelles
|
||||
|
||||
Toutes les données sont dans `lib/site-config.ts`.
|
||||
Les composants les consomment via `lib/content.ts`.
|
||||
94
payload/collections/Articles.ts
Normal file
94
payload/collections/Articles.ts
Normal file
@@ -0,0 +1,94 @@
|
||||
// payload/collections/Articles.ts
|
||||
// Schéma Payload CMS pour les articles de blog.
|
||||
// COMMENTÉ — activé lors de la migration vers Payload.
|
||||
|
||||
/*
|
||||
import type { CollectionConfig } from 'payload'
|
||||
import { lexicalEditor } from '@payloadcms/richtext-lexical'
|
||||
|
||||
export const Articles: CollectionConfig = {
|
||||
slug: 'articles',
|
||||
admin: {
|
||||
useAsTitle: 'title',
|
||||
defaultColumns: ['title', 'category', 'status', 'publishedAt'],
|
||||
},
|
||||
fields: [
|
||||
{
|
||||
name: 'title',
|
||||
type: 'text',
|
||||
required: true,
|
||||
label: 'Titre de l\'article',
|
||||
},
|
||||
{
|
||||
name: 'slug',
|
||||
type: 'text',
|
||||
required: true,
|
||||
unique: true,
|
||||
label: 'URL (slug)',
|
||||
admin: {
|
||||
description: 'ex: combien-coute-construction-maison-nord',
|
||||
},
|
||||
},
|
||||
{
|
||||
name: 'excerpt',
|
||||
type: 'textarea',
|
||||
label: 'Extrait (meta description)',
|
||||
},
|
||||
{
|
||||
name: 'content',
|
||||
type: 'richText',
|
||||
editor: lexicalEditor(),
|
||||
label: 'Contenu complet',
|
||||
},
|
||||
{
|
||||
name: 'category',
|
||||
type: 'select',
|
||||
options: [
|
||||
{ label: 'Construction', value: 'construction' },
|
||||
{ label: 'Rénovation', value: 'renovation' },
|
||||
{ label: 'Assainissement', value: 'assainissement' },
|
||||
{ label: 'Conseils', value: 'conseils' },
|
||||
],
|
||||
label: 'Catégorie',
|
||||
},
|
||||
{
|
||||
name: 'publishedAt',
|
||||
type: 'date',
|
||||
label: 'Date de publication',
|
||||
},
|
||||
{
|
||||
name: 'status',
|
||||
type: 'select',
|
||||
options: [
|
||||
{ label: 'Brouillon', value: 'draft' },
|
||||
{ label: 'Publié', value: 'published' },
|
||||
],
|
||||
defaultValue: 'draft',
|
||||
label: 'Statut',
|
||||
},
|
||||
{
|
||||
name: 'seoTitle',
|
||||
type: 'text',
|
||||
label: 'Titre SEO (optionnel — remplace title)',
|
||||
},
|
||||
{
|
||||
name: 'seoDescription',
|
||||
type: 'textarea',
|
||||
label: 'Description SEO (optionnel — remplace excerpt)',
|
||||
},
|
||||
],
|
||||
}
|
||||
*/
|
||||
|
||||
export type PayloadArticle = {
|
||||
id: string;
|
||||
slug: string;
|
||||
title: string;
|
||||
excerpt: string;
|
||||
content: unknown; // Lexical rich text
|
||||
category: string;
|
||||
publishedAt: string;
|
||||
status: "draft" | "published";
|
||||
seoTitle?: string;
|
||||
seoDescription?: string;
|
||||
};
|
||||
42
payload/collections/FAQ.ts
Normal file
42
payload/collections/FAQ.ts
Normal file
@@ -0,0 +1,42 @@
|
||||
// payload/collections/FAQ.ts
|
||||
// Schéma Payload CMS pour la FAQ.
|
||||
// COMMENTÉ — activé lors de la migration vers Payload.
|
||||
|
||||
/*
|
||||
import type { CollectionConfig } from 'payload'
|
||||
|
||||
export const FAQ: CollectionConfig = {
|
||||
slug: 'faq',
|
||||
admin: {
|
||||
useAsTitle: 'question',
|
||||
defaultColumns: ['question', 'order'],
|
||||
},
|
||||
fields: [
|
||||
{
|
||||
name: 'question',
|
||||
type: 'text',
|
||||
required: true,
|
||||
label: 'Question',
|
||||
},
|
||||
{
|
||||
name: 'answer',
|
||||
type: 'textarea',
|
||||
required: true,
|
||||
label: 'Réponse',
|
||||
},
|
||||
{
|
||||
name: 'order',
|
||||
type: 'number',
|
||||
label: 'Ordre d\'affichage',
|
||||
defaultValue: 0,
|
||||
},
|
||||
],
|
||||
}
|
||||
*/
|
||||
|
||||
export type PayloadFAQItem = {
|
||||
id: string;
|
||||
question: string;
|
||||
answer: string;
|
||||
order: number;
|
||||
};
|
||||
84
payload/collections/Realisations.ts
Normal file
84
payload/collections/Realisations.ts
Normal file
@@ -0,0 +1,84 @@
|
||||
// payload/collections/Realisations.ts
|
||||
// Schéma Payload CMS pour les réalisations / portfolio.
|
||||
// COMMENTÉ — activé lors de la migration vers Payload.
|
||||
|
||||
/*
|
||||
import type { CollectionConfig } from 'payload'
|
||||
|
||||
export const Realisations: CollectionConfig = {
|
||||
slug: 'realisations',
|
||||
admin: {
|
||||
useAsTitle: 'title',
|
||||
defaultColumns: ['title', 'ville', 'service', 'publishedAt'],
|
||||
},
|
||||
fields: [
|
||||
{
|
||||
name: 'title',
|
||||
type: 'text',
|
||||
required: true,
|
||||
label: 'Titre du chantier',
|
||||
},
|
||||
{
|
||||
name: 'ville',
|
||||
type: 'text',
|
||||
required: true,
|
||||
label: 'Ville',
|
||||
},
|
||||
{
|
||||
name: 'service',
|
||||
type: 'relationship',
|
||||
relationTo: 'services',
|
||||
label: 'Service associé',
|
||||
},
|
||||
{
|
||||
name: 'description',
|
||||
type: 'textarea',
|
||||
label: 'Description courte',
|
||||
},
|
||||
{
|
||||
name: 'image',
|
||||
type: 'upload',
|
||||
relationTo: 'media',
|
||||
label: 'Photo principale',
|
||||
},
|
||||
{
|
||||
name: 'gallery',
|
||||
type: 'array',
|
||||
label: 'Galerie photos',
|
||||
fields: [
|
||||
{
|
||||
name: 'image',
|
||||
type: 'upload',
|
||||
relationTo: 'media',
|
||||
},
|
||||
{
|
||||
name: 'caption',
|
||||
type: 'text',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
name: 'featured',
|
||||
type: 'checkbox',
|
||||
label: 'Mettre en avant (page accueil)',
|
||||
defaultValue: false,
|
||||
},
|
||||
{
|
||||
name: 'publishedAt',
|
||||
type: 'date',
|
||||
label: 'Date du chantier',
|
||||
},
|
||||
],
|
||||
}
|
||||
*/
|
||||
|
||||
export type PayloadRealisation = {
|
||||
id: string;
|
||||
title: string;
|
||||
ville: string;
|
||||
service: string;
|
||||
description: string;
|
||||
image: string;
|
||||
featured: boolean;
|
||||
publishedAt: string;
|
||||
};
|
||||
78
payload/collections/Services.ts
Normal file
78
payload/collections/Services.ts
Normal file
@@ -0,0 +1,78 @@
|
||||
// payload/collections/Services.ts
|
||||
// Schéma Payload CMS pour les services OBC Maçonnerie.
|
||||
// COMMENTÉ — activé lors de la migration vers Payload.
|
||||
//
|
||||
// Pour activer : décommenter et importer dans payload.config.ts
|
||||
|
||||
/*
|
||||
import type { CollectionConfig } from 'payload'
|
||||
|
||||
export const Services: CollectionConfig = {
|
||||
slug: 'services',
|
||||
admin: {
|
||||
useAsTitle: 'title',
|
||||
defaultColumns: ['title', 'slug', 'updatedAt'],
|
||||
},
|
||||
fields: [
|
||||
{
|
||||
name: 'slug',
|
||||
type: 'text',
|
||||
required: true,
|
||||
unique: true,
|
||||
admin: { description: 'Identifiant URL (ex: construction-maison)' },
|
||||
},
|
||||
{
|
||||
name: 'title',
|
||||
type: 'text',
|
||||
required: true,
|
||||
label: 'Titre du service',
|
||||
},
|
||||
{
|
||||
name: 'shortDescription',
|
||||
type: 'text',
|
||||
required: true,
|
||||
label: 'Description courte (carte home page)',
|
||||
},
|
||||
{
|
||||
name: 'longDescription',
|
||||
type: 'textarea',
|
||||
label: 'Description longue (page dédiée)',
|
||||
},
|
||||
{
|
||||
name: 'icon',
|
||||
type: 'text',
|
||||
label: 'Emoji icône',
|
||||
admin: { description: 'ex: 🏠' },
|
||||
},
|
||||
{
|
||||
name: 'keywords',
|
||||
type: 'array',
|
||||
label: 'Mots-clés SEO',
|
||||
fields: [
|
||||
{
|
||||
name: 'keyword',
|
||||
type: 'text',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
name: 'order',
|
||||
type: 'number',
|
||||
label: 'Ordre d\'affichage',
|
||||
defaultValue: 0,
|
||||
},
|
||||
],
|
||||
}
|
||||
*/
|
||||
|
||||
// Type exporté pour l'autocomplétion — reste actif même sans Payload
|
||||
export type PayloadService = {
|
||||
id: string;
|
||||
slug: string;
|
||||
title: string;
|
||||
shortDescription: string;
|
||||
longDescription: string;
|
||||
icon: string;
|
||||
keywords: { keyword: string }[];
|
||||
order: number;
|
||||
};
|
||||
64
payload/collections/Testimonials.ts
Normal file
64
payload/collections/Testimonials.ts
Normal file
@@ -0,0 +1,64 @@
|
||||
// payload/collections/Testimonials.ts
|
||||
// Schéma Payload CMS pour les témoignages clients.
|
||||
// COMMENTÉ — activé lors de la migration vers Payload.
|
||||
|
||||
/*
|
||||
import type { CollectionConfig } from 'payload'
|
||||
|
||||
export const Testimonials: CollectionConfig = {
|
||||
slug: 'testimonials',
|
||||
admin: {
|
||||
useAsTitle: 'name',
|
||||
defaultColumns: ['name', 'ville', 'service', 'rating', 'featured'],
|
||||
},
|
||||
fields: [
|
||||
{
|
||||
name: 'name',
|
||||
type: 'text',
|
||||
required: true,
|
||||
label: 'Nom du client',
|
||||
},
|
||||
{
|
||||
name: 'ville',
|
||||
type: 'text',
|
||||
label: 'Ville',
|
||||
},
|
||||
{
|
||||
name: 'service',
|
||||
type: 'relationship',
|
||||
relationTo: 'services',
|
||||
label: 'Service concerné',
|
||||
},
|
||||
{
|
||||
name: 'text',
|
||||
type: 'textarea',
|
||||
required: true,
|
||||
label: 'Témoignage',
|
||||
},
|
||||
{
|
||||
name: 'rating',
|
||||
type: 'number',
|
||||
min: 1,
|
||||
max: 5,
|
||||
defaultValue: 5,
|
||||
label: 'Note (1 à 5)',
|
||||
},
|
||||
{
|
||||
name: 'featured',
|
||||
type: 'checkbox',
|
||||
label: 'Afficher sur la page d\'accueil',
|
||||
defaultValue: true,
|
||||
},
|
||||
],
|
||||
}
|
||||
*/
|
||||
|
||||
export type PayloadTestimonial = {
|
||||
id: string;
|
||||
name: string;
|
||||
ville: string;
|
||||
service: string;
|
||||
text: string;
|
||||
rating: number;
|
||||
featured: boolean;
|
||||
};
|
||||
95
payload/globals/SiteSettings.ts
Normal file
95
payload/globals/SiteSettings.ts
Normal file
@@ -0,0 +1,95 @@
|
||||
// payload/globals/SiteSettings.ts
|
||||
// Schéma Payload CMS pour les paramètres globaux du site.
|
||||
// COMMENTÉ — activé lors de la migration vers Payload.
|
||||
//
|
||||
// Permet à Benoît (ou à un admin) de modifier les infos
|
||||
// de contact, le texte du hero, etc. sans toucher au code.
|
||||
|
||||
/*
|
||||
import type { GlobalConfig } from 'payload'
|
||||
|
||||
export const SiteSettings: GlobalConfig = {
|
||||
slug: 'site-settings',
|
||||
admin: {
|
||||
group: 'Paramètres',
|
||||
},
|
||||
fields: [
|
||||
// ── Informations de contact ───────────────────────────────
|
||||
{
|
||||
name: 'contact',
|
||||
type: 'group',
|
||||
label: 'Contact',
|
||||
fields: [
|
||||
{ name: 'phone', type: 'text', label: 'Téléphone' },
|
||||
{ name: 'email', type: 'email', label: 'Email' },
|
||||
{ name: 'address', type: 'text', label: 'Adresse complète' },
|
||||
],
|
||||
},
|
||||
// ── Hero page d'accueil ───────────────────────────────────
|
||||
{
|
||||
name: 'hero',
|
||||
type: 'group',
|
||||
label: 'Section Hero (page d\'accueil)',
|
||||
fields: [
|
||||
{ name: 'title', type: 'text', label: 'Titre H1' },
|
||||
{ name: 'subtitle', type: 'textarea', label: 'Sous-titre' },
|
||||
{ name: 'badge', type: 'text', label: 'Badge/accroche' },
|
||||
{ name: 'cta', type: 'text', label: 'CTA principal' },
|
||||
{ name: 'ctaSecondary', type: 'text', label: 'CTA secondaire' },
|
||||
],
|
||||
},
|
||||
// ── Zone d'intervention ────────────────────────────────────
|
||||
{
|
||||
name: 'zones',
|
||||
type: 'array',
|
||||
label: 'Villes d\'intervention',
|
||||
fields: [
|
||||
{ name: 'city', type: 'text', label: 'Ville' },
|
||||
],
|
||||
},
|
||||
{
|
||||
name: 'zoneDescription',
|
||||
type: 'text',
|
||||
label: 'Description zone (ex: 20 à 30 km autour de Mouchin)',
|
||||
},
|
||||
// ── SEO global ────────────────────────────────────────────
|
||||
{
|
||||
name: 'seo',
|
||||
type: 'group',
|
||||
label: 'SEO global',
|
||||
fields: [
|
||||
{ name: 'title', type: 'text', label: 'Titre SEO par défaut' },
|
||||
{ name: 'description', type: 'textarea', label: 'Description SEO par défaut' },
|
||||
],
|
||||
},
|
||||
// ── Message partenaires ───────────────────────────────────
|
||||
{
|
||||
name: 'partnersMessage',
|
||||
type: 'textarea',
|
||||
label: 'Message section partenaires',
|
||||
},
|
||||
],
|
||||
}
|
||||
*/
|
||||
|
||||
export type PayloadSiteSettings = {
|
||||
contact: {
|
||||
phone: string;
|
||||
email: string;
|
||||
address: string;
|
||||
};
|
||||
hero: {
|
||||
title: string;
|
||||
subtitle: string;
|
||||
badge: string;
|
||||
cta: string;
|
||||
ctaSecondary: string;
|
||||
};
|
||||
zones: { city: string }[];
|
||||
zoneDescription: string;
|
||||
seo: {
|
||||
title: string;
|
||||
description: string;
|
||||
};
|
||||
partnersMessage: string;
|
||||
};
|
||||
Reference in New Issue
Block a user