change design poster and text head && design modal filter & data for filter and doctors & handle functionality filter, set in url, read from url and change state

components/clinic/components/contact/Detail.js

@@ -7,10 +7,7 @@ function Detail({ data }) {
         head="روزهای کاری: "
         detail={`ساعت کاری: ${data.hours_of_work}`}
       />
-      <ContentDetail
-        head="تلفن: "
-        detail={`${data.phone_number_1} ${data.phone_number_2}`}
-      />
+      <ContentDetail head="تلفن: " detail={`${data.phone_number}`} />
       <ContentDetail head="ایمیل:" detail={data.email} />
       <ContentDetail head="آدرس: " detail={data.location} />
     </ul>

components/clinic/components/contact/index.js

@@ -15,14 +15,15 @@ function Contact({ data }) {
   return (
     <div
       className="
-                opacity-page border border-[#EFEFEF] rounded-[16px]
-                py-[12px] sm:py-[18px] md:py-[25px] lg:py-[32px] 
-                px-[12px] sm:px-[30px] md:px-[47px] lg:px-[64px]
-            "
+        opacity-page border border-[#EFEFEF] rounded-[16px]
+        py-[12px] sm:py-[18px] md:py-[25px] lg:py-[32px] 
+        px-[12px] sm:px-[30px] md:px-[47px] lg:px-[64px]
+      "
     >
       <div className="flex items-end justify-between">
         <Detail data={data} />
         <ModalOpenLocation
+          data={data}
           open={open}
           setOpen={setOpen}
           handleClose={handleClose}
@@ -40,11 +41,12 @@ function Contact({ data }) {
       <div className="w-full relative h-[460px] mt-[24px]">
         <CustomLoading width="full" height={400}>
           <iframe
-            src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d83998.96777841153!2d2.264635095144491!3d48.85882549249809!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x47e66e1f06e2b70f%3A0x40b82c3688c9460!2sParis%2C%20France!5e0!3m2!1sen!2snl!4v1723498499341!5m2!1sen!2snl"
+            src={`https://maps.google.com/maps?q=${data.map.latitude},${data.map.longitude}&z=14&output=embed`}
             className="w-full h-full rounded-lg"
             loading="lazy"
           ></iframe>
           <ModalOpenLocation
+            data={data}
             open={open}
             setOpen={setOpen}
             handleClose={handleClose}