use event context in calendar component

src/pages/Home/HomePage.jsx

@@ -1,24 +1,13 @@
 import styles from "./HomePage.module.css";
 import Calendar from "./components/Calendar/calendar.jsx";
 import EventList from "./components/EventList/eventList.jsx";
-import { useState, useEffect } from "react";
-import getAllEvents from "../../utils/events/getAllEvents.js";
 
 function HomePage() {
 
-    const [events, setEvents] = useState([]);
-
-    useEffect(() => {
-        (async () => {
-            const data = await getAllEvents();
-            setEvents(data.data);
-        }) ()
-    }, [])
-
     return (
         <div className={styles.allContent}>
-            <Calendar events={events} />
+            <Calendar />
-            <EventList events={events} />
+            <EventList />
         </div>
     );
 }

src/pages/Home/components/Calendar/calendar.jsx

@@ -1,8 +1,11 @@
-import { useState, useMemo, useEffect } from "react";
+import {useState, useMemo, useEffect, useContext} from "react";
 import styles from "./calendar.module.css";
 import { formatDateLetterJS } from "../../../../utils/date/formatDateLetter.js";
+import {EventContext} from "../../../../contexts/events/EventContext.js";
 
-function Calendar({ events = [] }) {
+function Calendar() {
+
+    const { events } = useContext(EventContext);
 
     const monthNames = [
         "Janvier", "Février", "Mars", "Avril", "Mai", "Juin",