From 67b3d9e2a9bb53d96957dc89cbb90b67636d02a6 Mon Sep 17 00:00:00 2001
From: Julien Froidefond <julien.froidefond@cdbdx.biz>
Date: Wed, 17 Dec 2025 10:37:30 +0100
Subject: [PATCH] Add API call optimization in EventsPageSection: Introduce a
 ref to prevent multiple API calls for event registrations, ensuring efficient
 data fetching. Update effect dependencies for improved performance and
 maintainability.

---
 components/events/EventsPageSection.tsx | 18 +++++++++++++++++-
 1 file changed, 17 insertions(+), 1 deletion(-)

diff --git a/components/events/EventsPageSection.tsx b/components/events/EventsPageSection.tsx
index d3158d4..8364e4e 100644
--- a/components/events/EventsPageSection.tsx
+++ b/components/events/EventsPageSection.tsx
@@ -115,6 +115,8 @@ export default function EventsPageSection({
 
   // Ref pour tracker si on a déjà utilisé les données initiales
   const hasUsedInitialData = useRef(hasInitialData);
+  // Ref pour tracker si on a déjà fait les appels API
+  const hasFetchedRegistrations = useRef(false);
 
   // Séparer et trier les événements (du plus récent au plus ancien)
   // Le statut est calculé automatiquement en fonction de la date
@@ -179,11 +181,24 @@ export default function EventsPageSection({
       return;
     }
 
+    // Si on a déjà fait les appels API, ne pas refaire
+    if (hasFetchedRegistrations.current) {
+      return;
+    }
+
     // Si pas de session, ne rien faire (on garde les données vides)
     if (!session?.user?.id) {
       return;
     }
 
+    // Si pas d'événements, ne rien faire
+    if (events.length === 0) {
+      return;
+    }
+
+    // Marquer qu'on va faire les appels
+    hasFetchedRegistrations.current = true;
+
     // Charger les inscriptions depuis l'API seulement si on n'a pas de données initiales
     // On charge pour tous les événements (passés et à venir) pour permettre le feedback
     const checkRegistrations = async () => {
@@ -206,7 +221,8 @@ export default function EventsPageSection({
     };
 
     checkRegistrations();
-  }, [session?.user?.id, events]);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [session?.user?.id]);
 
   // Fonctions pour le calendrier
   const getDaysInMonth = (date: Date) => {