fix(appointment): update display logic for inactive doctors and free turns

components/doctor/appointmentList/ItemAppointment.js

@@ -7,6 +7,7 @@ import Link from "next/link";
 import DoctorAvatar from "@/app/component/DoctorAvatar";
 
 function ItemAppointment({ turn, loading, doctorSlug }) {
+  const bookingDisabled = !loading && turn?.active === false;
   return (
     <li
       key={turn.id}
@@ -38,24 +39,34 @@ function ItemAppointment({ turn, loading, doctorSlug }) {
           <GreenCalendarTurn />
           <TextLoading width={100} height={15} loading={loading}>
             <p className="text-[#05BA58] text-[12px] font-medium">
-              {turn?.free_turn
-                ? ` ${turn?.free_turn}`
-                : "نوبت ندارد"}
+              {bookingDisabled || !turn?.free_turn
+                ? "نوبت‌دهی غیرفعال است"
+                : `اولین نوبت آزاد: ${turn.free_turn}`}
             </p>
           </TextLoading>
         </div>
-        <Link href={loading ? "#" : `/appointment/${doctorSlug}`}>
+        {bookingDisabled ? (
           <Button
             variant="contained"
             className="!py-2 !px-3 xl:!px-6 gap-1"
-            disabled={loading}
+            disabled
           >
-            دریافت نوبت
-            <div className="w-[20px] h-[20px]">
-              <ArrowLeftD />
-            </div>
+            نوبت‌دهی غیرفعال
           </Button>
-        </Link>
+        ) : (
+          <Link href={loading ? "#" : `/appointment/${doctorSlug}`}>
+            <Button
+              variant="contained"
+              className="!py-2 !px-3 xl:!px-6 gap-1"
+              disabled={loading}
+            >
+              دریافت نوبت
+              <div className="w-[20px] h-[20px]">
+                <ArrowLeftD />
+              </div>
+            </Button>
+          </Link>
+        )}
       </div>
     </li>
   );

components/doctor/appointmentList/index.js

@@ -18,19 +18,31 @@ function AppointmentList({ doctor, loading, doctorSlug }) {
             border-solid bottom-0 right-0 w-full p-4 flex items-center justify-between"
       >
         <p className="text-[#05BA58] text-[11px] font-normal">
-          {doctor && doctor?.free_turn}
+          {doctor?.active === false || !doctor?.free_turn
+            ? "نوبت‌دهی غیرفعال است"
+            : `اولین نوبت آزاد: ${doctor.free_turn}`}
         </p>
-        <Link href={`/appointment/${doctorSlug}`}>
+        {doctor?.active === false ? (
           <Button
             variant="contained"
             className="!py-2 !px-4 gap-1 !text-[14px] !font-medium"
+            disabled
           >
-            دریافت نوبت
-            <div className="w-[20px] h-[20px]">
-              <ArrowLeftD />
-            </div>
+            نوبت‌دهی غیرفعال
           </Button>
-        </Link>
+        ) : (
+          <Link href={`/appointment/${doctorSlug}`}>
+            <Button
+              variant="contained"
+              className="!py-2 !px-4 gap-1 !text-[14px] !font-medium"
+            >
+              دریافت نوبت
+              <div className="w-[20px] h-[20px]">
+                <ArrowLeftD />
+              </div>
+            </Button>
+          </Link>
+        )}
       </div>
     </>
   );