Tâche : Refactorisation Admin Header + ActionBar

Date : 31/12/2024 Projet : QwikPress Status : ✅ Terminé

Objectif

Refactoriser les composants admin pour avoir un header universel et une barre d'actions intelligente (fixe/inline).

Réalisations

1. AdminPageHeader universel

Nouveau composant qui remplace tous les headers existants.

Props disponibles :

title (obligatoire) : Titre de la section
subtitle (optionnel) : Description sous le titre
icon (optionnel) : Icône avant le titre
backHref (optionnel) : Lien de retour avec bouton ←
badge (optionnel) : Badge avec texte et variant
parentInfo (optionnel) : Info parent pour sous-pages
<Slot /> : Actions à droite

Fichier : src/components/admin/ui/index.tsx

2. AdminActionBar (fixe/inline)

Barre d'actions intelligente avec IntersectionObserver :

Fixe : Reste visible en bas de l'écran pendant le scroll
Inline : S'intègre au contenu quand on atteint le bas de page

Fichier : src/components/admin/ui/admin-action-bar.tsx

3. ModuleListItem

Nouveau composant pour afficher les modules en style liste (comme PageListItem).

Features :

Position + boutons réordonnement (↑↓)
Icône type (📦 standard / 🔗 commun)
Badge "Commun" si référence
Actions : Éditer, Dupliquer, Déplacer, Supprimer

Fichier : src/components/admin/module-list-item.tsx

4. Layout page edit simplifié

Le layout page/[pageId]/layout.tsx ne contient plus que les tabs. Chaque page enfant gère son propre header avec AdminPageHeader.

5. Pages mises à jour

Page	Changements
`content/index.tsx`	AdminPageHeader + AdminStats + ModuleListItem
`subpages/index.tsx`	AdminPageHeader + AdminStats + PageListItem
`settings/index.tsx`	AdminPageHeader + AdminActionBar
`seo/index.tsx`	AdminPageHeader + AdminActionBar

Fichiers modifiés

src/components/admin/ui/index.tsx - AdminPageHeader refactorisé
src/components/admin/ui/admin-action-bar.tsx - NOUVEAU
src/components/admin/module-list-item.tsx - NOUVEAU
src/routes/admin/(pages)/page/[pageId]/layout.tsx - Simplifié
src/routes/admin/(pages)/page/[pageId]/content/index.tsx
src/routes/admin/(pages)/page/[pageId]/subpages/index.tsx
src/routes/admin/(pages)/page/[pageId]/settings/index.tsx
src/routes/admin/(pages)/page/[pageId]/seo/index.tsx
src/routes/admin/layout.scss - Nouveaux styles

CSS ajouté

/* AdminPageHeader */
.admin-page-header
.admin-page-header__main
.admin-page-header__left
.admin-page-header__back
.admin-page-header__title-row
.admin-page-header__title
.admin-page-header__subtitle
.admin-page-header__actions

/* AdminActionBar */
.admin-action-bar
.admin-action-bar--fixed
.admin-action-bar--inline
.admin-action-bar__content
.admin-action-bar__hint
.admin-action-bar__sentinel

/* ModuleListItem */
.admin-list-item--module
.admin-list-item__position-col
.admin-list-item__position
.admin-list-item__reorder

Commit

dcdbf47 refactor(admin): AdminPageHeader universel + AdminActionBar fixe/inline

Push : main → GitLab