petitspas/docs/27_BRIEFING-FRONTEND.md

🎯 BRIEFING - Développement Frontend P'titsPas

Projet

Application de gestion de crèches/assistantes maternelles - Frontend Flutter Web

---

Accès Git

# Cloner le repo
git clone https://git.ptits-pas.fr/jmartin/petitspas.git
cd petitspas/frontend

# Identifiants Gitea (si demandé)
# User: jmartin
# Token: giteabu_1796c6aace0e2ef7e4fdb49cdc3bc1bf8ee31fbc

# API Gitea pour consulter les tickets frontend
curl -H "Authorization: token giteabu_1796c6aace0e2ef7e4fdb49cdc3bc1bf8ee31fbc" \
  "https://git.ptits-pas.fr/api/v1/repos/jmartin/petitspas/issues?state=open" | jq '.[] | select(.labels[].name == "frontend") | {number, title}'

---

Backend API (déjà déployé)

URL de base : https://app.ptits-pas.fr/api/v1/

Endpoints clés disponibles

Endpoint	Méthode	Description
/configuration/setup/status	GET	Vérifie si setup terminé (setupCompleted: true/false)
/auth/login	POST	Connexion ({email, password})
/auth/me	GET	Profil utilisateur (inclut changement_mdp_obligatoire)
/auth/change-password-required	POST	Changement MDP obligatoire
/auth/refresh	POST	Rafraîchir les tokens
/configuration	GET	Liste toutes les configs (super_admin)
/configuration/:category	GET	Configs par catégorie (email, app, security)
/configuration/bulk	PATCH	Mise à jour multiple des configs
/configuration/test-smtp	POST	Test connexion SMTP
/configuration/setup/complete	POST	Marquer setup comme terminé
/gestionnaires	POST	Créer gestionnaire (super_admin only)
/gestionnaires	GET	Liste des gestionnaires
/documents-legaux/actifs	GET	CGU et Privacy actifs

Compte test super_admin

Email: admin@ptits-pas.fr
MDP: 4dm1n1strateur
changement_mdp_obligatoire: true (première connexion)

---

Tickets Frontend prioritaires

Workflow d'initialisation (P1 - BLOQUANT)

#	Ticket	Description	Effort
#12	Panneau Paramètres / Configuration	Une page avec 3 sections (Email, Personnalisation, Avancé) ; première config = affichage direct + navigation bloquée jusqu'à sauvegarde	5h
#13	Intégration panneau au dashboard	Onglet Configuration, accès permanent, même interface	1h
#47	Changement MDP Obligatoire	Modale bloquante après login si flag=true	1-2h
#35	Création Gestionnaire	Formulaire création gestionnaire	2-3h

Authentification (P3)

#	Ticket	Description	Effort
#43	Écran Création MDP	Page /create-password?token=xxx	2h
#48	Gestion Erreurs & Messages	Snackbars, intercepteur HTTP	2h

Dashboard Gestionnaire (P3)

#	Ticket	Description	Effort
#44	Structure Dashboard	Layout avec onglets Parents/AM	2h
#45	Liste Parents	Liste des parents en attente	2h
#46	Liste AM	Liste des AM en attente	2h

Inscription (P3)

#	Ticket	Description	Effort
#38	Inscription Parent Étape 3	Enfants	3h
#39	Inscription Parent Étapes 4-6	Finalisation	4h
#40-42	Inscription AM	3 panneaux	6h
#50	Affichage CGU dynamique	Version lors inscription	1h

Admin (P3)

#	Ticket	Description	Effort
#49	Gestion Documents Légaux	Upload/activation CGU/Privacy	4h
#51	Écran Logs Admin	Optionnel v1.1	4h

---

Règles de codage

Langue

• Français pour : commentaires, descriptions, noms métier
• Anglais pour : termes techniques (controller, service, widget, singleton, etc.)

Exemples

// ✅ BON - Noms métier en français, technique en anglais
class EcranConnexion extends StatefulWidget { }
final utilisateurConnecte = authService.recupererUtilisateur();
final gestionnaire = await gestionnaireService.creer(donnees);

// Widget avec nom métier
class CarteEnfant extends StatelessWidget { }
class FormulaireInscriptionParent extends StatefulWidget { }

// ❌ MAUVAIS - Tout en anglais
class LoginScreen extends StatefulWidget { }
final loggedInUser = authService.getUser();
class ChildCard extends StatelessWidget { }

Termes à garder en anglais

• Widget, StatefulWidget, StatelessWidget
• Controller, Service, Provider
• Singleton, Factory, Builder
• async, await, Future, Stream
• Navigator, Router, Route
• API, HTTP, JSON, DTO

Termes métier en français

• Utilisateur, Parent, Enfant, Gestionnaire, Administrateur
• AssistanteMaternelle (ou AM)
• Inscription, Connexion, Déconnexion
• Configuration, Paramètres
• Validation, Refus, EnAttente

---

Structure frontend existante

frontend/lib/
├── config/
│   └── env.dart                    # Configuration environnement
├── controllers/
│   └── parent_dashboard_controller.dart
├── models/
│   ├── user_registration_data.dart
│   ├── parent_user_registration_data.dart
│   └── am_user_registration_data.dart
├── navigation/
│   └── app_router.dart             # Routes de l'application
├── screens/
│   ├── auth/
│   │   ├── login_screen.dart       ✅ Fait
│   │   ├── register_choice_screen.dart ✅ Fait
│   │   ├── parent_register_step1-5_screen.dart ✅ Fait
│   │   ├── am/                     ✅ 4 étapes faites
│   │   └── parent/                 ✅ 5 étapes faites
│   ├── administrateurs/
│   │   ├── admin_dashboardScreen.dart
│   │   └── creation/
│   │       └── gestionnaires_create.dart  ⚠️ Placeholder
│   ├── home/
│   │   ├── home_screen.dart
│   │   └── parent_screen/
│   └── legal/
├── services/
│   ├── auth_service.dart
│   ├── bug_report_service.dart
│   ├── dashboardService.dart
│   ├── login_navigation_service.dart
│   └── api/
│       ├── api_config.dart
│       └── tokenService.dart
├── utils/
│   └── data_generator.dart
└── widgets/
    ├── admin/
    │   ├── dashboard_admin.dart
    │   ├── gestionnaire_card.dart
    │   ├── gestionnaire_management_widget.dart
    │   └── parent_managmant_widget.dart
    ├── dashbord_parent/
    └── ...

---

Workflow Git

# 1. Créer une branche feature
git checkout develop
git pull origin develop
git checkout -b feature/XX-nom-ticket

# 2. Développer et commiter
git add .
git commit -m "feat(#XX): Description courte"

# 3. Pousser et créer PR
git push -u origin feature/XX-nom-ticket

# 4. Créer PR vers master via Gitea ou API
curl -X POST \
  -H "Authorization: token giteabu_1796c6aace0e2ef7e4fdb49cdc3bc1bf8ee31fbc" \
  -H "Content-Type: application/json" \
  -d '{"title":"feat(#XX): Titre","body":"Description\n\nCloses #XX","head":"feature/XX-nom-ticket","base":"master"}' \
  "https://git.ptits-pas.fr/api/v1/repos/jmartin/petitspas/pulls"

---

Commandes Flutter

# Installation des dépendances
cd frontend
flutter pub get

# Lancer en mode développement
flutter run -d chrome
# ou
flutter run -d windows
# ou
flutter run -d macos

# Build web
flutter build web

# Analyser le code
flutter analyze

---

Fichiers de configuration importants

lib/config/env.dart

class Env {
  static const String apiUrl = 'https://app.ptits-pas.fr/api/v1';
}

lib/services/api/api_config.dart

Configuration des appels API avec intercepteurs.

---

Recommandation de démarrage

1. Ticket #47 - Modale changement MDP obligatoire (simple, rapide)
2. Tickets #12 + #13 - Panneau Paramètres (3 sections) : première config + onglet Configuration dans le dashboard
3. Ticket #35 - Formulaire création gestionnaire

Ces tickets complètent le workflow d'initialisation !

---

Dernière mise à jour : 9 février 2026