feat: add realtime update list client

src/contexts/User.tsx

@@ -7,7 +7,7 @@ import { ClienteMetadata, UserContextProps, UserMetadata } from 'types/IContext'
 import { useAuth } from 'hooks/useAuth';
 
 import { getBarbeiros } from 'services/get/barbeiros';
-import { getClientes } from 'services/get/clientes';
+import { getClientes, getClientesHour } from 'services/get/clientes';
 import { getHorarioMarcadoCliente } from 'services/get/horarioMarcado';
 import { shedule } from 'services/post/schedule';
 
@@ -182,6 +182,30 @@ export function UserProvider({ children }: any) {
     setBarbeiros(data[0].j);
   }
 
+  async function buscaClientesHorario(hour: string) {
+    if (!clientId) return;
+
+    if (isBarbeiro) {
+      const { data, error, status } = await getClientesHour(clientId, selectDayFormatted, hour);
+
+      if (error) {
+        switch (status) {
+          default:
+            return;
+        }
+      }
+
+      if (!data) return;
+
+      if (data[0].j === null) {
+        setClientes([]);
+        return;
+      }
+
+      setClientes(data[0].j);
+    }
+  }
+
   async function buscarClientes() {
     if (!clientId) return;
 
@@ -352,6 +376,7 @@ export function UserProvider({ children }: any) {
         generateGoogleCalendarEvent,
         startDate,
         endDate,
+        buscaClientesHorario,
       }}
     >
       {children}

src/hooks/useBarbeiro.tsx

@@ -1,8 +1,37 @@
-import { useState } from 'react';
+import { useEffect, useState } from 'react';
+
+import { format } from 'date-fns';
+
+import { useUser } from 'contexts/User';
 
 export function useBarbeiro() {
+  const { getFirstCliente, buscaClientesHorario } = useUser();
   const [visible, setVisible] = useState(true);
   const [modalIsOpen, setIsOpen] = useState(false);
+  const [date, setDate] = useState(new Date());
+
+  function tick() {
+    setDate(new Date());
+  }
+
+  useEffect(() => {
+    const timerID = setInterval(() => tick(), 1000);
+
+    return function cleanup() {
+      clearInterval(timerID);
+    };
+  });
+
+  useEffect(() => {
+    const actualHour = format(date, 'HH:mm:ss');
+    const dateCliente = `${getFirstCliente()?.hour}:00`;
+
+    const actualHourMinutePlusOne = format(new Date(date.setMinutes(date.getMinutes() + 1)), 'HH:mm');
+
+    if (actualHour === dateCliente) {
+      buscaClientesHorario(actualHourMinutePlusOne);
+    }
+  }, [date]);
 
   function openModal() {
     setIsOpen(true);
@@ -43,5 +72,6 @@ export function useBarbeiro() {
     openModal,
     closeModal,
     customStyles,
+    date,
   };
 }