Système de journal des modifications

Journal public MDX avec chronologie et widget latéral pour informer les utilisateurs.

Le journal des modifications permet de publier les notes de version. Il associe du contenu MDX, une chronologie, des pages détaillées et un widget latéral qui signale les nouveautés.

Structure des fichiers

content/changelog/          # Fichiers MDX du journal
├── 2026-01-15-v220.mdx
├── 2026-02-10-v230.mdx
└── 2026-03-05-v240.mdx

src/routes/(layout)/changelog/  # Routes publiques
├── index.tsx                   # Page de chronologie
└── $slug/index.tsx             # Page de détail

src/features/changelog/     # Code de la fonctionnalité
├── changelog-manager.ts    # Chargement des données
├── changelog-timeline.tsx  # Composant de chronologie
├── changelog-sidebar-stack.tsx  # Widget latéral et état local
└── changelog-debug-actions.tsx  # Réinitialisation de débogage

Créer une entrée

Créez un fichier .mdx dans content/changelog/ en suivant le format YYYY-MM-DD-vXXX.mdx :

---
date: 2025-01-15
version: "2.2.0"
title: "Nouvelles fonctionnalités du tableau de bord"
image: /images/changelog/v220.png
status: published
---

Court paragraphe présentant cette version.

### Fonctionnalités

- **Nom de la fonctionnalité** — description
- **Autre fonctionnalité** — rôle

### Corrections

- **Description de la correction** — élément corrigé

### Refactorisation

- **Nom de la refactorisation** — amélioration apportée

Options du frontmatter

Champ	Type	Requis	Description
`date`	`date`	Oui	Date de publication au format YYYY-MM-DD
`version`	`string`	Non	Numéro de version, par exemple « 2.1.0 »
`title`	`string`	Non	Titre affiché
`image`	`string`	Non	Chemin de l’image de couverture
`status`	`"draft" \| "published"`	Non	Les brouillons sont masqués en production

Routes publiques

Le journal est accessible sur :

/changelog — chronologie des entrées publiées
/changelog/$slug — page détaillée d’une entrée

ChangelogSidebarStack affiche les entrées récentes sous forme de cartes empilées que l’utilisateur peut masquer :

import { ChangelogSidebarStack } from "@/features/changelog/changelog-sidebar-stack";
import { getChangelogs } from "@/features/changelog/changelog-manager";

export async function Sidebar() {
  const changelogs = await getChangelogs();

  return <ChangelogSidebarStack changelogs={changelogs} />;
}

Chargement des données

import {
  getChangelogs,
  getCurrentChangelog,
} from "@/features/changelog/changelog-manager";

// Get all published changelogs (sorted by date, newest first)
const changelogs = await getChangelogs();

// Get a specific changelog by slug
const changelog = await getCurrentChangelog("2025-12-27-v210");

État de masquage

Le widget enregistre les slugs masqués dans localStorage. Chaque navigateur peut ainsi cacher les nouveautés déjà consultées sans stockage côté serveur.

En développement, l’action « Réinitialiser les nouveautés » du panneau de débogage efface cet état local.

Mode brouillon

Définissez status: draft pour masquer une entrée en production tout en la conservant en développement :

---
date: 2025-01-20
title: "Fonctionnalités à venir"
status: draft
---

Bonnes pratiques

Utilisez des numéros de version SemVer explicites.
Ajoutez une image de couverture.
Regroupez les changements par catégorie.
Rédigez des descriptions concises et informatives.
Prévisualisez les entrées en brouillon avant publication.