Add database and Prisma configurations, enhance event and leaderboard components with API integration, and update navigation for session management

components/EventsSection.tsx

@@ -1,26 +1,44 @@
 "use client";
 
+import { useEffect, useState } from "react";
+
 interface Event {
+  id: string;
   date: string;
   name: string;
 }
 
-const events: Event[] = [
-  {
-    date: "18 NOVEMBRE 2023",
-    name: "Sommet de l'Innovation Tech",
-  },
-  {
-    date: "3 DÉCEMBRE 2023",
-    name: "Lancement de la Révolution IA",
-  },
-  {
-    date: "22 DÉCEMBRE 2023",
-    name: "Festival du Code d'Hiver",
-  },
-];
-
 export default function EventsSection() {
+  const [events, setEvents] = useState<Event[]>([]);
+  const [loading, setLoading] = useState(true);
+
+  useEffect(() => {
+    fetch("/api/events")
+      .then((res) => res.json())
+      .then((data) => {
+        // Prendre seulement les 3 premiers événements pour la section d'accueil
+        setEvents(data.slice(0, 3));
+        setLoading(false);
+      })
+      .catch((err) => {
+        console.error("Error fetching events:", err);
+        setLoading(false);
+      });
+  }, []);
+
+  if (loading) {
+    return (
+      <section className="w-full bg-gray-950 border-t border-pixel-gold/30 py-16">
+        <div className="max-w-7xl mx-auto px-8 text-center text-pixel-gold">
+          Chargement...
+        </div>
+      </section>
+    );
+  }
+
+  if (events.length === 0) {
+    return null;
+  }
   return (
     <section className="w-full bg-gray-950 border-t border-pixel-gold/30 py-16">
       <div className="max-w-7xl mx-auto px-8">