From 365892a0f15ead05ee8e7a487438c63b3bf13259 Mon Sep 17 00:00:00 2001
From: hamed <15238-genius.ha@users.noreply.drupalcode.org>
Date: Mon, 15 Jun 2026 15:21:07 +0330
Subject: [PATCH] fix(doctor): render location map reliably when accordion
 expands

The map iframe lived inside a collapsed (max-h-0, overflow-hidden)
accordion with loading=lazy, so it often never loaded after expanding.
Mount the iframe only when the location item is open so it loads fresh,
and raise the open clamp from max-h-screen to max-h-[800px] so the map
isn't clipped on shorter viewports.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
---
 components/doctor/detailDoctor/cards/locations/Item.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/components/doctor/detailDoctor/cards/locations/Item.js b/components/doctor/detailDoctor/cards/locations/Item.js
index 715e9b8..7d10bbe 100644
--- a/components/doctor/detailDoctor/cards/locations/Item.js
+++ b/components/doctor/detailDoctor/cards/locations/Item.js
@@ -38,7 +38,7 @@ function Item({ data }) {
       <div
         className={`
                     overflow-hidden transition-all duration-500
-                    ${isOpen ? "max-h-screen " : "max-h-0"}
+                    ${isOpen ? "max-h-[800px] " : "max-h-0"}
                 `}
       >
         <div className="gap-3 md:gap-4 flex flex-col items-start mt-[16px] sm:mt-[19px] md:mt-[22px] lg:mt-[24px]">
@@ -68,7 +68,7 @@ function Item({ data }) {
             )}
           </div>
         </div>
-        {data?.map?.latitude && data?.map?.longitude && (
+        {isOpen && data?.map?.latitude && data?.map?.longitude && (
           <div className="w-full relative h-[219px] sm:h-[302px] md:h-[385px] lg:h-[470px] mt-[24px]">
             <iframe
               src={`https://maps.google.com/maps?q=${data.map.latitude},${data.map.longitude}&z=14&output=embed`}