From 41c606cfa5b52b59da1d05c7f2787d1876b5c5d9 Mon Sep 17 00:00:00 2001
From: mosjim <mosjim@gmail.com>
Date: Fri, 10 Nov 2023 07:20:49 -0300
Subject: [PATCH] Implementing custom hook: useOnInit (#3)

---
 src/components/MailReader.jsx | 18 ++++++++++--------
 src/customHooks/hooks.js      |  7 +++++++
 2 files changed, 17 insertions(+), 8 deletions(-)
 create mode 100644 src/customHooks/hooks.js

diff --git a/src/components/MailReader.jsx b/src/components/MailReader.jsx
index ff8ed2a..333fd65 100644
--- a/src/components/MailReader.jsx
+++ b/src/components/MailReader.jsx
@@ -1,39 +1,41 @@
 import { Button } from 'primereact/button'
 import { InputText } from 'primereact/inputtext'
 import { Panel } from 'primereact/panel'
-import { useEffect, useState } from 'react'
+import { useState } from 'react'
 
 import { mailService } from '../service/mailService'
 import { MailsGrid } from './MailsGrid'
 import { MailsSummary } from './MailsSummary'
+import { useOnInit } from '../customHooks/hooks'
 
 export const MailReader = () => {
   const [textoBusqueda, setTextoBusqueda] = useState('')
   const [mails, setMails] = useState([])
-
+  
+  useOnInit(()=>buscarMails(textoBusqueda))
+  
   const leerMail = async (mail) => {
     mail.leer()
     // no es necesario hacer esto, pero ojo con avisar al backend
     await mailService.actualizar(mail)
     setMails([...mails])
-
+    
     // setMails(mails.map((mail) =>
     //   mail.id === idLeido ? mail.leer() : mail
     // ))
     // leer debería ser una función que devuelve un nuevo mail
   }
-
+  
   // Variante más simple
   const buscarMails = async (textoBusquedaNuevo) => {
     setTextoBusqueda(textoBusquedaNuevo)
     const nuevosMails = await mailService.getMails(textoBusquedaNuevo)
     setMails(nuevosMails)
   }
+  
+  
+
 
-  useEffect(() => {
-    buscarMails(textoBusqueda)
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [])
 
   // otra variante más rebuscada
   // es que el InputText tenga el onchange definido como onChange={(event) => setTextoBusqueda(event.target.value)} 
diff --git a/src/customHooks/hooks.js b/src/customHooks/hooks.js
new file mode 100644
index 0000000..64670fd
--- /dev/null
+++ b/src/customHooks/hooks.js
@@ -0,0 +1,7 @@
+import { useEffect } from "react"
+
+export const useOnInit = (initialCallBack)=>{
+    useEffect(() => {
+      initialCallBack()
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [])}
\ No newline at end of file