feat: add update list in thirty minutes

ctrlmais · Apr 9, 2022 · 310473e · 310473e
1 parent 5cbbfd6
commit 310473e
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 9 deletions.
diff --git a/src/hooks/useBarbeiro.tsx b/src/hooks/useBarbeiro.tsx
@@ -4,16 +4,27 @@ import { format } from 'date-fns';
 
 import { useUser } from 'contexts/User';
 
+const THIRTYMINUTES = 30 * 60 * 1000;
+
 export function useBarbeiro() {
-  const { getFirstCliente, buscaClientesHorario } = useUser();
+  const { getFirstCliente, buscaClientesHorario, buscarClientes } = useUser();
   const [visible, setVisible] = useState(true);
   const [modalIsOpen, setIsOpen] = useState(false);
   const [date, setDate] = useState(new Date());
+  const [ultimaAtualizacao, setUltimaAtualizacao] = useState(format(new Date(), 'HH:mm:ss'));
 
   function tick() {
     setDate(new Date());
   }
 
+  function openModal() {
+    setIsOpen(true);
+  }
+
+  function closeModal() {
+    setIsOpen(false);
+  }
+
   useEffect(() => {
     const timerID = setInterval(() => tick(), 1000);
 
@@ -33,13 +44,16 @@ export function useBarbeiro() {
     }
   }, [date]);
 
-  function openModal() {
-    setIsOpen(true);
-  }
+  useEffect(() => {
+    const interval = setInterval(() => {
+      buscarClientes();
 
-  function closeModal() {
-    setIsOpen(false);
-  }
+      const dateAtual = format(new Date(), 'HH:mm:ss');
+      setUltimaAtualizacao(dateAtual);
+    }, THIRTYMINUTES);
+
+    return () => clearInterval(interval);
+  }, []);
 
   const customStyles = {
     content: {
@@ -73,5 +87,6 @@ export function useBarbeiro() {
     closeModal,
     customStyles,
     date,
+    ultimaAtualizacao,
   };
 }
diff --git a/src/pages/Barbeiro/index.tsx b/src/pages/Barbeiro/index.tsx
@@ -28,7 +28,8 @@ export function Barbeiro() {
     getFirstCliente,
   } = useUser();
 
-  const { visible, setVisible, modalIsOpen, openModal, closeModal, customStyles, date } = useBarbeiro();
+  const { visible, setVisible, modalIsOpen, openModal, closeModal, customStyles, date, ultimaAtualizacao } =
+    useBarbeiro();
 
   return (
     <>
@@ -89,7 +90,7 @@ export function Barbeiro() {
           <div className={styles.containerHorarioAgendados}>
             <h2 className={styles.titleHome}>Horários agendados</h2>
             <p className={styles.infoText}>
-              Hoje | Dia {new Date().getDate()} | {getDiaSemana()}
+              Hoje | Dia {new Date().getDate()} | {getDiaSemana()} | Última atualização: {ultimaAtualizacao}
             </p>
           </div>