updates services and home components to refresh events associated wit…

…h services b00tc4mp#403
benjo12 · Mar 20, 2024 · 1f304a8 · 1f304a8
1 parent 7f48e75
commit 1f304a8
Show file tree

Hide file tree

Showing 3 changed files with 60 additions and 32 deletions.
diff --git a/staff/benjamin-mayiba/project/app/src/components/Services.jsx b/staff/benjamin-mayiba/project/app/src/components/Services.jsx
@@ -49,6 +49,8 @@ function Services(props) {
           (service) => service.id != serviceId
         );
         setServices(updateServices);
+        // Emitir una señal al componente padre (Home) de que se ha eliminado un servicio
+      props.onServiceDeleted();
       } catch (error) {
        setError(error.message);
       }

diff --git a/staff/benjamin-mayiba/project/app/src/index.css b/staff/benjamin-mayiba/project/app/src/index.css
@@ -79,15 +79,15 @@ h2 {
   border: 2px solid #ccc; 
   padding: 20px;
   margin: 20px 0; 
-  background-color: darkslategrey;
+  background-color: rgb(68, 107, 107);
   margin-top: -30px;
 }
 .event-items{
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   justify-content: space-between;
-  height: 270px;
+  height: 370px;
   max-height: 500px;
   overflow: auto;
 

diff --git a/staff/benjamin-mayiba/project/app/src/pages/Home.jsx b/staff/benjamin-mayiba/project/app/src/pages/Home.jsx
@@ -46,6 +46,17 @@ export default function Home(props) {
     return `${day}/${month}/${year}`;
   };
 
+
+  // Nos quedamos en la home despues del cambio de correo o contraseña
+  const handleChangeEmail = () => {
+    navigate("/");
+  };
+
+  const handleChangePassword = () => {
+    navigate("/");
+  };
+
+
   // Función para manejar el clic en el botón "Add Event" del footer
   const handleAddEventClick = async () => {
     setShowMessage(false);
@@ -102,29 +113,9 @@ export default function Home(props) {
     setError(false);
   };
 
-  // Función para mostrar la lista de eventos
-  const handleShowEvents = async () => {
-    navigate("/events");
-    setSubmitted(false);
-    setError(false);
 
-    try {
-      // Obtener la lista completa de eventos
-      const fullEvents = await logic.retrieveEvent();
-      if (Array.isArray(fullEvents) && fullEvents.length === 0) {
-        setMessage("No pending events");
-        setShowMessage(true); // Muestra el mensaje si no hay eventos disponibles
-      } else {
-        // Mostrar los eventos si hay eventos disponibles
-        setEvents(fullEvents);
-        setShowMessage(false);
-      }
-    } catch (error) {
-      setError(error.message);
-    }
-  };
 
-  // Efecto para cargar los datos iniciales al montar el componente
+   // Efecto para cargar los datos iniciales al montar el componente
   useEffect(() => {
     (async () => {
       try {
@@ -153,6 +144,48 @@ export default function Home(props) {
     handleShowEvents();
   }, []);
 
+
+  // Función para mostrar la lista de eventos
+  const handleShowEvents = async () => {
+    navigate("/events");
+    setSubmitted(false);
+    setError(false);
+
+    try {
+      // Obtener la lista completa de eventos
+      const fullEvents = await logic.retrieveEvent();
+      if (Array.isArray(fullEvents) && fullEvents.length === 0) {
+        setMessage("No pending events");
+        setShowMessage(true); // Muestra el mensaje si no hay eventos disponibles
+      } else {
+        // Mostrar los eventos si hay eventos disponibles
+        setEvents(fullEvents);
+        setShowMessage(false);
+      }
+    } catch (error) {
+      setError(error.message);
+    }
+  };
+
+
+ // Llamar a handleShowEvents cuando ya no quedan servicios
+  const handleServiceEvent = async () => {
+  try {
+    const fullEvents = await logic.retrieveEvent();
+
+    setEvents(fullEvents);
+  } catch (error) {
+    setError(error.message);
+  }
+};
+useEffect(() => {
+  // solo carga eventos cuando ya no quedan servicios
+  if (services.length === 0) {
+    handleShowEvents();
+  }
+}, [services]);
+
+
   // Función para eliminar un evento
   const handleDeleteEvent = async (eventId) => {
     try {
@@ -170,14 +203,7 @@ export default function Home(props) {
     }
   };
 
-  // Nos quedamos en la home despues del cambio de correo o contraseña
-  const handleChangeEmail = () => {
-    navigate("/");
-  };
-
-  const handleChangePassword = () => {
-    navigate("/");
-  };
+
 
   // Renderizado del componente
   return (
@@ -220,7 +246,7 @@ export default function Home(props) {
             />
 
             {/* Mostrar el componente Services si showServices es true */}
-            <Route path="/services" element={error ? null : <div><Services onServiceLogout={handleLogout} /></div>} />
+            <Route path="/services" element={error ? null : <div><Services onServiceLogout={handleLogout} onServiceDeleted={handleServiceEvent} /></div>} />
 
             {/* Mostrar el perfil del usuario */}
             <Route path="/profile" element={error ? null : <div><Profile className="profile-container" onChangeEmail={handleChangeEmail} onChangePassword={handleChangePassword}/></div>}/>