change data clinics & page clinics tab about & contact & doctors

components/doctors/listDoctors/ItemDoctor.js

@@ -1,72 +0,0 @@
-import Image from "next/image"
-import { Button } from "@mui/material"
-
-// Icons
-import ArrowLeftD from "@/components/icons/ArrowLeftD"
-import ClockD from "@/components/icons/ClockD"
-import LikeD from "@/components/icons/LikeD"
-import PointD from "@/components/icons/PointD"
-import Link from "next/link"
-
-function ItemDoctor({ doctor }) {
-    return (
-        <li className="p-4 relative rounded-lg bg-[#FFF] border border-[#EFEFEF]">
-            {/* Detail Doctor */}
-            <div className="flex items-center justify-start gap-2.5">
-                <Image
-                    width={72}
-                    height={72}
-                    src={doctor.img}
-                    alt="image-doctor"
-                    className="py-1.5"
-                />
-                <div className="flex flex-col items-start justify-center gap-2">
-                    <p className="text-[#3B3B3B] text-[14px] font-bold">{doctor.name}</p>
-                    <p className="text-[#616161] text-[14px] font-normal">تخصص: {doctor.expertise}</p>
-                    <div className="flex rounded items-center justify-start gap-2">
-                        <div className="p-1 bg-[#F8F8FF] flex items-center rounded-[4px] gap-0.5">
-                            <LikeD />
-                            <p className="text-[#616161] text-[12px] font-normal">{doctor.satisfaction}%</p>
-                        </div>
-                        <div className="p-1 bg-[#F8F8FF] flex items-center rounded-[4px] gap-0.5">
-                            <PointD />
-                            <p className="text-[#616161] text-[12px] font-normal">{doctor.point}</p>
-                        </div>
-                    </div>
-                </div>
-            </div>
-
-            {/* Hours of work */}
-            <div className="flex my-4 items-center justify-start gap-0.5">
-                <ClockD />
-                <p className="text-[#7E7E7E] text-[12px] font-normal">ساعت کاری: {doctor.hours_of_work}</p>
-            </div>
-            <p
-                className={`text-[12px] font-medium rounded w-fit p-1.5
-                    ${doctor.free_turn ?
-                        'bg-[rgba(5,_186,_88,_0.04)] text-[#05BA58]' :
-                        'bg-[rgba(211,_47,_47,_0.04)] text-[#D32F2F]'
-                    }`}
-            >{doctor.free_turn ?
-                `اولین نوبت آزاد: ${doctor.free_turn}` :
-                'نوبت ندارد'
-                }</p>
-
-            {/* Arrow */}
-            <Link href={`/doctor/${doctor.id}`}>
-                <Button
-                    className={`!p-[14px] !absolute !left-4 !bottom-4  !rounded-full !w-fit 
-                    ${doctor.free_turn ?
-                            '!bg-[#5559CE]' :
-                            '!bg-[#D7D7D7]'
-                        }`}
-                    disabled={!doctor.free_turn}
-                >
-                    <ArrowLeftD />
-                </Button>
-            </Link>
-        </li>
-    )
-}
-
-export default ItemDoctor

components/doctors/listDoctors/index.js

@@ -1,10 +1,10 @@
 import doctors from '@/data/doctors.json'
-import ItemDoctor from './ItemDoctor';
 import Pagination from '@/app/component/Pagination';
+import ItemDoctor from '@/app/component/ItemDoctor';
 
 function ListDoctors() {
     return (
-        <div>
+        <>
             <ul className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 mt-[64px] gap-[24px]">
                 {doctors.map(doctor => (
                     <ItemDoctor
@@ -16,7 +16,7 @@ function ListDoctors() {
             <div className='mt-[56px] flex justify-center'>
                 <Pagination />
             </div>
-        </div>
+        </>
     )
 }