Added a badge with the amount of pending tickets assigned to the user

src/hooks/useTickets.tsx

@@ -1,22 +1,22 @@
 import { Ticket } from "@/interfaces/ticket";
 import { Code, Group, User } from "@/interfaces/user";
 import axios from "axios";
-import { useEffect, useState } from "react";
+import { useEffect, useState, useCallback } from "react";
 
 export default function useTickets() {
   const [tickets, setTickets] = useState<Ticket[]>([]);
   const [isLoading, setIsLoading] = useState(false);
   const [isError, setIsError] = useState(false);
 
-  const getData = () => {
+  const getData = useCallback(() => {
     setIsLoading(true);
     axios
       .get<Ticket[]>(`/api/tickets`)
       .then((response) => setTickets(response.data))
       .finally(() => setIsLoading(false));
-  };
+  }, []);
 
-  useEffect(getData, []);
+  useEffect(getData, [getData]);
 
   return { tickets, isLoading, isError, reload: getData };
 }