handle limit page dashboard & change header profile user & get data from api in page clinics & clinic item and doctor item

components/doctors/index.js

@@ -11,7 +11,7 @@ import ModalSearchCity from "@/app/component/modalSearchCity";
 // Data
 import specialties from "@/data/specialties.json";
 
-function DoctorsPage({ params, matchedCity, matchedState }) {
+function DoctorsPage({ params, matchedCity, matchedState, list }) {
   const [loading, setLoading] = useState(true);
   const [open, setOpen] = useState(false);
   const [selected, setSelected] = useState({
@@ -65,7 +65,7 @@ function DoctorsPage({ params, matchedCity, matchedState }) {
           <SortList data={data} setData={setData} />
         </div>
       </div>
-      <ListDoctors loading={loading} />
+      <ListDoctors loading={loading} list={list} />
     </div>
   );
 }

components/doctors/listDoctors/index.js

@@ -2,11 +2,11 @@ import doctors from "@/data/doctors.json";
 import Pagination from "@/app/component/Pagination";
 import ItemDoctor from "@/app/component/ItemDoctor";
 
-function ListDoctors({ loading }) {
+function ListDoctors({ loading, list }) {
   return (
     <>
       <ul className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 mt-[24px] sm:mt-[37px] md:mt-[50px] lg:mt-[64px] gap-[24px]">
-        {doctors.map((doctor) => (
+        {list.map((doctor) => (
           <ItemDoctor key={doctor.id} doctor={doctor} loading={loading} />
         ))}
       </ul>