Enhance challenge management and badge components: Implement event dispatch for refreshing challenge badges after various actions (acceptance, rejection, deletion, cancellation) in ChallengeManagement and ChallengesSection. Update ChallengeBadge to listen for refresh events, ensuring accurate challenge count display and improved user experience.

components/navigation/ChallengeBadge.tsx

@@ -14,15 +14,14 @@ export default function ChallengeBadge({
 }: ChallengeBadgeProps) {
   const [count, setCount] = useState(initialCount);
 
+  // Utiliser le count initial (déjà récupéré côté serveur)
   useEffect(() => {
-    // Si on a déjà un initialCount, l'utiliser et ne pas faire d'appel immédiat
-    // On rafraîchit seulement après un délai pour éviter les appels redondants
-    if (initialCount > 0) {
-      setCount(initialCount);
-    }
+    setCount(initialCount);
+  }, [initialCount]);
 
-    // Récupérer le nombre de défis actifs (seulement si pas d'initialCount ou pour rafraîchir)
-    const fetchActiveCount = async () => {
+  // Écouter les événements de refresh des défis (déclenché après acceptation/annulation)
+  useEffect(() => {
+    const handleRefreshChallenges = async () => {
       try {
         const response = await fetch("/api/challenges/active-count");
         const data = await response.json();
@@ -32,16 +31,11 @@ export default function ChallengeBadge({
       }
     };
 
-    // Si pas d'initialCount, charger immédiatement, sinon attendre 30s avant le premier refresh
-    if (initialCount === 0) {
-      fetchActiveCount();
-    }
-
-    // Rafraîchir toutes les 30 secondes
-    const interval = setInterval(fetchActiveCount, 30000);
-
-    return () => clearInterval(interval);
-  }, [initialCount]);
+    window.addEventListener("refreshChallenges", handleRefreshChallenges);
+    return () => {
+      window.removeEventListener("refreshChallenges", handleRefreshChallenges);
+    };
+  }, []);
 
   return (
     <Link