From 126a61f234218ec4553bdcf2ab0c19cfeff5a921 Mon Sep 17 00:00:00 2001
From: "Indoteknik ." <andrifebriyadiputra@gmail.com>
Date: Thu, 17 Jul 2025 15:55:10 +0700
Subject: (andri) fix popup

---
 src/lib/home/components/PopupBannerPromotion.jsx | 53 ++++++++++++++++++++----
 1 file changed, 44 insertions(+), 9 deletions(-)

(limited to 'src/lib')

diff --git a/src/lib/home/components/PopupBannerPromotion.jsx b/src/lib/home/components/PopupBannerPromotion.jsx
index eff2ba59..1392a246 100644
--- a/src/lib/home/components/PopupBannerPromotion.jsx
+++ b/src/lib/home/components/PopupBannerPromotion.jsx
@@ -47,6 +47,27 @@ const PagePopupInformation = () => {
     }
   };
 
+  useEffect(() => {
+    const handleResizeOrZoom = () => {
+      if (!popupRef.current) return;
+
+      const popupWidth = popupRef.current.offsetWidth || 85;
+      const popupHeight = popupRef.current.offsetHeight || 85;
+
+      setPosition({
+        x: 20,
+        y: window.innerHeight - popupHeight - 20,
+      });
+    };
+
+    window.addEventListener('resize', handleResizeOrZoom);
+
+    return () => {
+      window.removeEventListener('resize', handleResizeOrZoom);
+    };
+  }, []);
+
+
   const updateContainerLeft = () => {
     const container = document.querySelector('.container');
     if (container) {
@@ -85,8 +106,11 @@ const PagePopupInformation = () => {
     const popupWidth = popupRef.current?.offsetWidth || 85;
     const popupHeight = popupRef.current?.offsetHeight || 85;
     const maxX = window.innerWidth - popupWidth - 20;
-    const maxY = window.innerHeight - popupHeight - 20;
-    const minX = isDesktop ? containerLeft - popupWidth - 20 : 0;
+    
+    const bottomPadding = 80; // batas bawah minimal
+    const maxY = window.innerHeight - popupHeight - bottomPadding;
+    
+    const minX = 0;
 
     let newX = clientX - dragStartPos.current.x;
     let newY = clientY - dragStartPos.current.y;
@@ -99,19 +123,30 @@ const PagePopupInformation = () => {
 
   const endDrag = () => {
     if (isDragging.current) {
-      const popupWidth = popupRef.current?.offsetWidth || 85;
-      const screenMiddle = window.innerWidth / 2;
-
       setIsSnapping(true);
-      setPosition(pos => ({
-        x: pos.x + popupWidth / 2 < screenMiddle ? 20 : window.innerWidth - popupWidth - 20,
-        y: pos.y,
-      }));
+
+      if (isDesktop) {
+        const popupWidth = popupRef.current?.offsetWidth || 85;
+        setPosition({
+          x: containerLeft - popupWidth - 20,
+          y: window.innerHeight - 130,
+        });
+      } else {
+        const popupWidth = popupRef.current?.offsetWidth || 85;
+        const screenMiddle = window.innerWidth / 2;
+
+        setPosition(pos => ({
+          x: pos.x + popupWidth / 2 < screenMiddle ? 20 : window.innerWidth - popupWidth - 20,
+          y: pos.y,
+        }));
+      }
     }
     isDragging.current = false;
     isTouching.current = false;
   };
 
+
+
   const handleMouseDown = e => {
     e.preventDefault();
     startDrag(e.clientX, e.clientY);
-- 
cgit v1.2.3