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

components/doctor/detailDoctor/Title.js

@@ -15,7 +15,7 @@ function Title({ doctor, loading }) {
                     w-[40px] sm:w-[81px] md:w-[123px] lg:w-[164px]
                     h-[40px] sm:h-[81px] md:h-[123px] lg:h-[164px]
                 "
-          src={doctor.img}
+          src={doctor?.img}
           alt="img-doctor"
           height={164}
           width={164}
@@ -24,18 +24,18 @@ function Title({ doctor, loading }) {
       <div className="flex flex-col items-center lg:items-start gap-[8px] lg:gap-[16px]">
         <TextLoading loading={loading} width={90} height={20}>
           <h1 className="text-[#3B3B3B] text-[14px] sm:text-[16px] md:text-[18px] lg:text-[20px] font-bold">
-            {doctor.name}
+            {doctor?.title}
           </h1>
         </TextLoading>
         <TextLoading loading={loading} width={100} height={20}>
           <h3 className="text-[#525252] text-[14px] md:text-[16px] font-medium">
-            تخصص: {doctor.expertise}
+            تخصص: {doctor?.expertise}
           </h3>
         </TextLoading>
         <div className="flex items-center justify-start gap-11">
           <TextLoading loading={loading} width={60} height={20}>
             <p className="text-[#525252] text-[16px] font-medium">
-              {doctor.experience} سال تجربه
+              {doctor?.experience} سال تجربه
             </p>
           </TextLoading>
           <div className="flex items-center gap-1">
@@ -44,7 +44,7 @@ function Title({ doctor, loading }) {
             </div>
             <TextLoading loading={loading} width={120} height={20}>
               <p className="text-[#525252] text-[12px] md:text-[14px] lg:text-[16px] font-medium">
-                کد نظام پزشکی: {doctor.medical_system_code}
+                کد نظام پزشکی: {doctor?.medical_system_code}
               </p>
             </TextLoading>
           </div>
@@ -54,13 +54,13 @@ function Title({ doctor, loading }) {
             <div className="flex p-1 gap-0.5 items-start justify-center">
               <StarDI />
               <p className="text-[#616161] text-[12px] md:text-[14px] font-normal">
-                امتیاز: {doctor.point}
+                امتیاز: {doctor?.point}
               </p>
             </div>
             <div className="flex p-1 items-start gap-0.5">
               <LikeDI />
               <p className="text-[#616161] text-[12px] md:text-[14px] font-normal">
-                {doctor.satisfaction}% رضایت کاربران
+                {doctor?.satisfaction}% رضایت کاربران
               </p>
             </div>
           </div>