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

components/doctor/index.js

@@ -1,29 +1,18 @@
-"use client";
-
-import { useEffect, useState } from "react";
 import AppointmentList from "./appointmentList";
 import DetailDoctor from "./detailDoctor";
 import Share from "./detailDoctor/Share";
 import CustomLoading from "@/app/component/loading/Custom";
 
 function DoctorPage({ doctor }) {
-  const [loading, setLoading] = useState(true);
-
-  useEffect(() => {
-    setTimeout(() => {
-      setLoading(false);
-    }, 2000);
-  }, []);
-
   return (
     <div className="pt-[92px] sm:pt-[120px] mt:pt-[148px] lg:pt-[176px] mt-[px] padding-responsive">
       <div className="flex items-center justify-between">
-        <CustomLoading loading={loading} width={180} height={25}>
+        <CustomLoading loading={false} width={180} height={25}>
           <div className="flex items-center justify-start text-[14px] md:text-[16px] font-normal">
             <h2 className="text-[#9B9B9B] text-nowrap">
-              متخصص {doctor.expertise} {" >"}
+              متخصص {doctor?.expertise} {" >"}
             </h2>
-            <p className="text-[#525252] text-nowrap mr-1">{doctor.name}</p>
+            <p className="text-[#525252] text-nowrap mr-1">{doctor?.title}</p>
           </div>
         </CustomLoading>
         <div className="flex lg:hidden">
@@ -31,8 +20,8 @@ function DoctorPage({ doctor }) {
         </div>
       </div>
       <div className="flex items-start justify-center gap-6 mt-[30px]">
-        <DetailDoctor doctor={doctor} loading={loading} />
-        <AppointmentList doctor={doctor} loading={loading} />
+        <DetailDoctor doctor={doctor} loading={false} />
+        <AppointmentList doctor={doctor} loading={false} />
       </div>
     </div>
   );