feat(doctors): add loading state management and pass filter to sendReq

components/doctors/listDoctors/index.js

@@ -13,8 +13,10 @@ function ListDoctors({
   doctors,
   setPage,
   setDoctors,
+  loading: filterLoading,
 }) {
   const [loading, setLoading] = useState(false);
+  const isLoading = loading || filterLoading;
   const router = useRouter();
 
   const changePage =async (_, num) => {
@@ -54,14 +56,14 @@ function ListDoctors({
 
   return (
     <>
-      <div className="mt-[24px] sm:mt-[37px] md:mt-[50px] lg:mt-[64px]">
+      <div className="mt-[24px] sm:mt-[37px] md:mt-[50px] lg:mt-[64px] relative">
         {doctors && doctors.length ? (
           <ul className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-[24px]">
             {doctors?.map((doctor, idx) => (
               <ItemDoctor
                 key={doctor.id}
                 doctor={doctor}
-                loading={loading}
+                loading={isLoading}
                 priority={idx < 3}
                 setDoctors={setDoctors}
               />