Dossier Views
Le dossier Views/ contient toutes les pages principales de l'application.
Chaque fichier représente une page complète et correspond à une route définie dans AppRoutes.js.
1. Organisation des pages
Les pages sont regroupées par fonctionnalité pour plus de clarté :
/User: pages liées à l'utilisateur (ex :Profil.js,Statistiques.js,Calendrier.js)./Administration: pages pour la gestion administrative (ex :Admin.js,UserAdministration.js,GroupAdministration.js)./Tickets: pages liées aux tickets (ex :Tickets.js,Ticket.js,TicketsFermes.js)./Projets: pages liées aux projets (ex :Projets.js,Projet.js)./Client: pages pour la gestion des clients (ex :Clients.js,Client.js).
2. Bonnes pratiques
- Chaque page est autonome et importe uniquement les composants nécessaires depuis
components/. - La logique métier ou les appels API sont réalisés via des hooks personnalisés pour garder les pages propres et lisibles.
- Les pages sont réutilisables et faciles à maintenir grâce à cette séparation des responsabilités.
3. Interaction avec AppRoutes et Layout
Les pages de Views sont rendues via AppRoutes.js.
Elles sont encapsulées dans le Layout pour afficher Navbar, Topbar et Footer, sauf la page Login qui n'utilise pas Layout.
4. Passage de props et routes dynamiques
Les vues sont des composants fonctionnels. Depuis AppRoutes.js, il est possible de leur passer des variables via des props.
Par exemple : <Projets titre="Projets" /> permet à la page Projets de recevoir un titre et de l'utiliser pour l'affichage ou la logique interne.
Pour les routes dynamiques, comme /ticket/:ticketId ou /projet/:projetId, React Router fournit le hook useParams.
Il permet de récupérer les paramètres directement dans la vue et de les utiliser pour charger des données spécifiques depuis l'API.