33800 Docs

← Retour

QwikPress v2 - Migration Header/Footer vers Layouts

Date : 29/12/2024 Status : TERMINÉ


Changement majeur

Header et Footer ne sont plus dans config.json mais dans les fichiers layouts/*.json.

Avant (v1)

// config.json
{
  "header": {
    "navigation": [...]
  },
  "footer": {
    "copyright": "..."
  }
}

Après (v2)

// STORAGE/data/layouts/root.json
{
  "id": "root",
  "path": "/",
  "zones": {
    "header": {
      "module": "site-header",
      "data": {
        "navigation": [...]
      }
    },
    "footer": {
      "module": "site-footer",
      "data": {
        "copyright": "..."
      }
    }
  }
}

Fichiers modifiés

Plugin

src/routes/plugin@data.ts
- Charge layouts depuis STORAGE/data/layouts/*.json
- Injecte 'layout' et 'allLayouts' dans sharedMap

Layout Site

src/routes/(site)/layout.tsx
- Ajout useLayout() routeLoader
- Layout disponible dans globalContext.layout

Storage

STORAGE/data/layouts/
├── root.json    # Header + Footer + navigation
└── docs.json    # Sidebar pour /documentation

Accès aux données

// Dans un composant
const globalContext = useContext(GLOBALCONTENT);

// Layout résolu avec zones fusionnées
globalContext.layout.value.zones.header
globalContext.layout.value.zones.footer
globalContext.layout.value.zones.sidebar

// Chaîne de layouts appliqués
globalContext.layout.value.chain

Logs

[LAYOUTS] Chargé: docs (/documentation)
[LAYOUTS] Chargé: root (/)

Instances

Instance Port Storage
Local 4500 Fichiers JSON
Supabase 4501 Cloud

Prochaines étapes

  1. Migrer Header/Footer composants pour lire depuis layout au lieu de config FAIT
  2. Créer interface admin pour éditer les layouts
  3. Synchroniser layouts vers Supabase

Migration Header/Footer (29/12/2024 - 18h)

Fichiers modifiés

src/components/site/header/index.tsx
- Lit navigation depuis layout.zones.header.data avec fallback vers config
- Support du format v2 simplifié (pageId direct)

src/components/site/footer/index.tsx
- Lit copyright, tagline, companyInfo, columns depuis layout.zones.footer.data
- Fallback vers config pour rétrocompatibilité
- Support format v2 "columns" et v1 "linkGroups"

STORAGE/data/layouts/root.json
- Navigation complète avec type/actionType/pageId/target
- Footer avec copyright, tagline, companyInfo, columns

Test

# Les deux instances affichent le copyright depuis root.json
curl http://vscode.local:4500/ | grep 'site-footer__copyright'
# → © 2024 QwikPress - Powered by Qwik

curl http://vscode.local:4501/ | grep 'site-footer__copyright'
# → © 2024 QwikPress - Powered by Qwik

Architecture finale v2

config.json          → Site info, SEO, colors (global)
layouts/root.json    → Header navigation, Footer content (zones)
layouts/docs.json    → Sidebar pour /documentation (zones)