# Audit des blocks — designs distincts & exposition BO

> Audit code + **vision** (lecture de screenshots pleine page) — 2026-06-14.
> Objectif : rendre tous les designs réellement distincts sélectionnables dans la modale ACF du BO.

## Résultat

- **110 candidats** (composants groupés par le code) → **49 designs visuellement distincts** après fusion des sosies (vision, −55%).
- **~24 déjà sélectionnables** (coquilles génériques de `sections.php`).
- **~23-25 designs INVISIBLES** = bespoke (registry `origine`), jamais exposés dans la modale → périmètre à implémenter.

Règle de lecture validée : *différence cosmétique (logos grille vs marquee, nb de champs d'un form, contenu/produit) = MÊME design*. Ex. DistributionHero = LogistiqueHero ; les 4 ProductHeroCova\* = 1 design.

## Distincts par catégorie (vision)

| Catégorie | Candidats | Distincts | Invisibles à exposer |
|---|---|---|---|
| Héros | 9 | 6 | 5 (product, industrie, secteur=distri/logi, roof, local) |
| Showcase | 15 | 7 | 2 (produit-showcase, principe-cool-roof) |
| Grille | 20 | 7 | 3 (frictions, expertise 2×2, avantages navy) |
| Comparatif | 16 | 6 | 3 (duel cartes, absorption/réflexion, prime-CEE) |
| Process | 5 | 2 | 1 (système en couches) |
| Réassurance | 14 | 6 | 2 (bénéfices mesurables, logos presse) |
| Témoignage+FAQ | 10 | 3 | 1 (preuve-chiffres) |
| CTA+Autre+Fiche | 21 | 12 | ~6 (constat, explainer, cta-final simple, cta-final enrichi, applicateurs ; +winter/RSE à confirmer) |
| **Total** | **110** | **49** | **~23** |

## Mécanisme retenu : 1 layout ACF par design, `origine` figée

Le rendu existe déjà (`origineRegistry`, 72 adaptateurs pixel-parfaits) ; il manque, par design invisible :
1. `wordpress/mu-plugins/covalba-core/inc/field-groups/layouts/<slug>.php` — schéma des champs éditables (modèle `hero.php`), noms de sous-champs **uniques** (collisions WPGraphQL-ACF).
2. ajout de `<slug>` aux 3 listes de `sections.php` (`$files`, `cvb_layout_categories()`, `$with_thumb`).
3. fragment/type GraphQL du layout (`src/lib/wp/*`) — le `BlockRenderer` route par `__typename`.
4. vérifier le mapping de l'adaptateur origine (la plupart déjà faits).
5. vignette (`scripts/block-thumbnails/` + page galerie ; capture page réelle pour les designs contextuels).

Rejeté : un layout unique + sélecteur de style (champs incompatibles entre designs, branching fragile).

## Pièges
- **Parité** : ne PAS migrer les pages seedées existantes (elles ont `origine=...` qui court-circuite le générique) — les nouveaux layouts ne servent qu'aux nouvelles sections BO.
- **`_absorbe`** : un layout unitaire doit embarquer TOUS les champs (sinon perte de contenu des composants 1-pour-N).
- **Types WPGraphQL-ACF** : sous-champs répétés = noms uniques préfixés (cf. commit aff259d). 
- **Vignettes contextuelles** : héros à fond photo + fiche-chantier ne rendent pas en galerie générique → capture page réelle.
- **À confirmer visuellement** avant de coder : WinterObjection, RSESection (non observés sur les captures).

## Effort réaliste
**~23-27 jours-homme** (le coût = schéma de champs design par design + types GraphQL + vignettes contextuelles, pas le rendu).

## Ordre conseillé
1. **Pilote bout-en-bout** sur 1 design non-contextuel déjà mappé (ex. `benefices-mesurables`) → valide la chaîne champs→GraphQL→fragment→renderer→vignette.
2. Génériques navy déjà mappés (CTA final, preuve-chiffres, expertise, avantages…).
3. Héros (form, fonds photo, vignettes contextuelles).
4. Showcase/Comparatif/Process bespoke (iso, duel, couches, prime-CEE).
5. Reliquats à statuer + finition vignette `fiche-chantier`.

## Campagne réalisée (2026-06-14/15) — 23/23 designs exposés ✅

Mécanisme appliqué partout : **1 layout ACF par design** (slug dédié) + **fragment GraphQL** (index.ts) + **block générique** dans `src/components/blocks/` qui **réutilise le composant bespoke** (zéro réimplémentation, fallback défauts = parité) + entrée `registry` (BlockRenderer, routé par `__typename`) + type + 3 listes `sections.php` + **vignette** capturée via `scripts/block-thumbnails/capture-one.mjs` sur la page interne `/test-blocks` (instances de chaque layout). Convention anti-collision : **noms de repeaters/groups uniques préfixés** (sauf clones `entete`/`cta`).

- **Pilote** : benefices-mesurables.
- **Lot 1** : preuve-chiffres, cta-final-simple, cta-final-enrichi, expertise, logos-presse, avantages-produit.
- **Lot 2** : constat, cool-roof-explainer, applicateurs, grille-frictions, principe-cool-roof, systeme-couches.
- **Lot 3** : produit-showcase, duel-comparatif, prime-cee, winter-objection, rse-section.
- **Lot 4 (héros)** : product-hero, industrie-hero, secteur-hero (=Distribution/Logistique), local-hero.
- **Finition** : roof-hero (RoofHero extrait de RoofPageTemplate via `export`, le block construit un `RoofPageData` partiel) + vignette `fiche-chantier` (capturée depuis une vraie page reference, bandeau infos chantier).

Total : **23 nouveaux blocks** sélectionnables dans la modale ACFE (catégorisés + vignettes). Validé : 25 blocks rendent sur `/test-blocks`, aucune erreur GraphQL ; builds verts ; commités + auto-deploy Vercel.

### RoofHero — exposé (finition)
`RoofHero` est désormais **exporté** depuis `src/components/roof/RoofPageTemplate.tsx` (ajout d'un `export`, zéro changement de comportement sur les pages toitures) ; le block `src/components/blocks/RoofHero.tsx` lui passe un objet `RoofPageData` partiel construit depuis les champs WP (breadcrumb/titre/lead/image/stats ; slug fixe ; formulaire interne + logos non éditables). Rendu vérifié identique au héros toiture.

### Tout exposé
Plus de design distinct invisible. Page interne `/test-blocks` = galerie de tous les layouts (25 sections) servant aux vignettes.