From f99e0aba70efad0deb907d8e27f09fc9f527c8a4 Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Fri, 17 Feb 2023 17:07:50 +0700
Subject: Refactor

---
 src/core/components/elements/Popup/BottomPopup.jsx | 21 +++++++++++++++++++++
 1 file changed, 21 insertions(+)
 create mode 100644 src/core/components/elements/Popup/BottomPopup.jsx

(limited to 'src/core/components/elements/Popup')

diff --git a/src/core/components/elements/Popup/BottomPopup.jsx b/src/core/components/elements/Popup/BottomPopup.jsx
new file mode 100644
index 00000000..e687cf20
--- /dev/null
+++ b/src/core/components/elements/Popup/BottomPopup.jsx
@@ -0,0 +1,21 @@
+import { XMarkIcon } from "@heroicons/react/24/outline"
+
+const BottomPopup = ({ children, active, title, close }) => (
+  <>
+    <div 
+      onClick={close} 
+      className={`overlay ${active ? 'block' : 'hidden'}`} 
+    />
+    <div className={`fixed bottom-0 left-0 w-full border-t border-gray_r-6 rounded-t-xl z-[60] p-4 pt-0 bg-white ${active ? 'block' : 'hidden'}`}>
+      <div className="flex justify-between py-4">
+        <div className="font-semibold text-h-sm">{ title }</div>
+        <button type="button" onClick={close}>
+          <XMarkIcon className="w-5 stroke-2" />
+        </button>
+      </div>
+      { children }
+    </div>
+  </>
+)
+
+export default BottomPopup
\ No newline at end of file
-- 
cgit v1.2.3


From 525166e62b793b351d1a6be2421c0a33b22f7b7b Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Mon, 20 Feb 2023 11:35:25 +0700
Subject: cart refactor

---
 src/core/components/elements/Popup/BottomPopup.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src/core/components/elements/Popup')

diff --git a/src/core/components/elements/Popup/BottomPopup.jsx b/src/core/components/elements/Popup/BottomPopup.jsx
index e687cf20..5deceadf 100644
--- a/src/core/components/elements/Popup/BottomPopup.jsx
+++ b/src/core/components/elements/Popup/BottomPopup.jsx
@@ -6,7 +6,7 @@ const BottomPopup = ({ children, active, title, close }) => (
       onClick={close} 
       className={`overlay ${active ? 'block' : 'hidden'}`} 
     />
-    <div className={`fixed bottom-0 left-0 w-full border-t border-gray_r-6 rounded-t-xl z-[60] p-4 pt-0 bg-white ${active ? 'block' : 'hidden'}`}>
+    <div className={`fixed left-0 w-full border-t border-gray_r-6 rounded-t-xl z-[60] p-4 pt-0 bg-white idt-transition ${active ? 'bottom-0' : '-bottom-full'}`}>
       <div className="flex justify-between py-4">
         <div className="font-semibold text-h-sm">{ title }</div>
         <button type="button" onClick={close}>
-- 
cgit v1.2.3


From 4fd738fd54f81fa53c2b3e78b7a80fbfda250352 Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Tue, 21 Feb 2023 10:19:32 +0700
Subject: fix

---
 src/core/components/elements/Popup/BottomPopup.jsx | 52 ++++++++++++++++------
 1 file changed, 38 insertions(+), 14 deletions(-)

(limited to 'src/core/components/elements/Popup')

diff --git a/src/core/components/elements/Popup/BottomPopup.jsx b/src/core/components/elements/Popup/BottomPopup.jsx
index 5deceadf..933a8f11 100644
--- a/src/core/components/elements/Popup/BottomPopup.jsx
+++ b/src/core/components/elements/Popup/BottomPopup.jsx
@@ -1,20 +1,44 @@
 import { XMarkIcon } from "@heroicons/react/24/outline"
+import { AnimatePresence, motion } from "framer-motion"
 
-const BottomPopup = ({ children, active, title, close }) => (
+const transition = { ease: 'linear', duration: 0.2 }
+
+const BottomPopup = ({ 
+  children, 
+  active = false, 
+  title, 
+  close 
+}) => (
   <>
-    <div 
-      onClick={close} 
-      className={`overlay ${active ? 'block' : 'hidden'}`} 
-    />
-    <div className={`fixed left-0 w-full border-t border-gray_r-6 rounded-t-xl z-[60] p-4 pt-0 bg-white idt-transition ${active ? 'bottom-0' : '-bottom-full'}`}>
-      <div className="flex justify-between py-4">
-        <div className="font-semibold text-h-sm">{ title }</div>
-        <button type="button" onClick={close}>
-          <XMarkIcon className="w-5 stroke-2" />
-        </button>
-      </div>
-      { children }
-    </div>
+    <AnimatePresence>
+      { active && (
+        <>
+          <motion.div
+            className="overlay"
+            initial={{ opacity: 0 }}
+            animate={{ opacity: 1 }}
+            exit={{ opacity: 0 }}
+            transition={transition}
+            onClick={close}
+          />
+          <motion.div
+            initial={{ bottom: '-100%' }}
+            animate={{ bottom: 0 }}
+            exit={{ bottom: '-100%' }}
+            transition={transition}
+            className="fixed left-0 w-full border-t border-gray_r-6 rounded-t-xl z-[60] p-4 pt-0 bg-white"
+          >
+            <div className="flex justify-between py-4">
+              <div className="font-semibold text-h-sm">{ title }</div>
+              <button type="button" onClick={close}>
+                <XMarkIcon className="w-5 stroke-2" />
+              </button>
+            </div>
+            { children }
+          </motion.div>
+        </>
+      ) }
+    </AnimatePresence>
   </>
 )
 
-- 
cgit v1.2.3


From 488f323e4441b75244785cb66b018f1179b262de Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Tue, 21 Feb 2023 10:31:23 +0700
Subject: fix

---
 src/core/components/elements/Popup/BottomPopup.jsx | 77 ++++++++++++----------
 1 file changed, 44 insertions(+), 33 deletions(-)

(limited to 'src/core/components/elements/Popup')

diff --git a/src/core/components/elements/Popup/BottomPopup.jsx b/src/core/components/elements/Popup/BottomPopup.jsx
index 933a8f11..c3c380c0 100644
--- a/src/core/components/elements/Popup/BottomPopup.jsx
+++ b/src/core/components/elements/Popup/BottomPopup.jsx
@@ -1,5 +1,6 @@
 import { XMarkIcon } from "@heroicons/react/24/outline"
 import { AnimatePresence, motion } from "framer-motion"
+import { useEffect } from "react"
 
 const transition = { ease: 'linear', duration: 0.2 }
 
@@ -8,38 +9,48 @@ const BottomPopup = ({
   active = false, 
   title, 
   close 
-}) => (
-  <>
-    <AnimatePresence>
-      { active && (
-        <>
-          <motion.div
-            className="overlay"
-            initial={{ opacity: 0 }}
-            animate={{ opacity: 1 }}
-            exit={{ opacity: 0 }}
-            transition={transition}
-            onClick={close}
-          />
-          <motion.div
-            initial={{ bottom: '-100%' }}
-            animate={{ bottom: 0 }}
-            exit={{ bottom: '-100%' }}
-            transition={transition}
-            className="fixed left-0 w-full border-t border-gray_r-6 rounded-t-xl z-[60] p-4 pt-0 bg-white"
-          >
-            <div className="flex justify-between py-4">
-              <div className="font-semibold text-h-sm">{ title }</div>
-              <button type="button" onClick={close}>
-                <XMarkIcon className="w-5 stroke-2" />
-              </button>
-            </div>
-            { children }
-          </motion.div>
-        </>
-      ) }
-    </AnimatePresence>
-  </>
-)
+}) => {
+  useEffect(() => {
+    if (active) {
+      document.querySelector('html, body').classList.add('overflow-hidden')
+    } else {
+      document.querySelector('html, body').classList.remove('overflow-hidden')
+    }
+  }, [active])
+
+  return (
+    <>
+      <AnimatePresence>
+        { active && (
+          <>
+            <motion.div
+              className="overlay"
+              initial={{ opacity: 0 }}
+              animate={{ opacity: 1 }}
+              exit={{ opacity: 0 }}
+              transition={transition}
+              onClick={close}
+            />
+            <motion.div
+              initial={{ bottom: '-100%' }}
+              animate={{ bottom: 0 }}
+              exit={{ bottom: '-100%' }}
+              transition={transition}
+              className="fixed left-0 w-full border-t border-gray_r-6 rounded-t-xl z-[60] p-4 pt-0 bg-white"
+            >
+              <div className="flex justify-between py-4">
+                <div className="font-semibold text-h-sm">{ title }</div>
+                <button type="button" onClick={close}>
+                  <XMarkIcon className="w-5 stroke-2" />
+                </button>
+              </div>
+              { children }
+            </motion.div>
+          </>
+        ) }
+      </AnimatePresence>
+    </>
+  )
+}
 
 export default BottomPopup
\ No newline at end of file
-- 
cgit v1.2.3


From f66b12fd1d0b83af0d7230d7b1565fbe00afbe3c Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Wed, 22 Feb 2023 11:03:34 +0700
Subject: prettier

---
 src/core/components/elements/Popup/BottomPopup.jsx | 33 +++++++++-------------
 1 file changed, 14 insertions(+), 19 deletions(-)

(limited to 'src/core/components/elements/Popup')

diff --git a/src/core/components/elements/Popup/BottomPopup.jsx b/src/core/components/elements/Popup/BottomPopup.jsx
index c3c380c0..af1149ca 100644
--- a/src/core/components/elements/Popup/BottomPopup.jsx
+++ b/src/core/components/elements/Popup/BottomPopup.jsx
@@ -1,15 +1,10 @@
-import { XMarkIcon } from "@heroicons/react/24/outline"
-import { AnimatePresence, motion } from "framer-motion"
-import { useEffect } from "react"
+import { XMarkIcon } from '@heroicons/react/24/outline'
+import { AnimatePresence, motion } from 'framer-motion'
+import { useEffect } from 'react'
 
 const transition = { ease: 'linear', duration: 0.2 }
 
-const BottomPopup = ({ 
-  children, 
-  active = false, 
-  title, 
-  close 
-}) => {
+const BottomPopup = ({ children, active = false, title, close }) => {
   useEffect(() => {
     if (active) {
       document.querySelector('html, body').classList.add('overflow-hidden')
@@ -21,10 +16,10 @@ const BottomPopup = ({
   return (
     <>
       <AnimatePresence>
-        { active && (
+        {active && (
           <>
             <motion.div
-              className="overlay"
+              className='overlay'
               initial={{ opacity: 0 }}
               animate={{ opacity: 1 }}
               exit={{ opacity: 0 }}
@@ -36,21 +31,21 @@ const BottomPopup = ({
               animate={{ bottom: 0 }}
               exit={{ bottom: '-100%' }}
               transition={transition}
-              className="fixed left-0 w-full border-t border-gray_r-6 rounded-t-xl z-[60] p-4 pt-0 bg-white"
+              className='fixed left-0 w-full border-t border-gray_r-6 rounded-t-xl z-[60] p-4 pt-0 bg-white'
             >
-              <div className="flex justify-between py-4">
-                <div className="font-semibold text-h-sm">{ title }</div>
-                <button type="button" onClick={close}>
-                  <XMarkIcon className="w-5 stroke-2" />
+              <div className='flex justify-between py-4'>
+                <div className='font-semibold text-h-sm'>{title}</div>
+                <button type='button' onClick={close}>
+                  <XMarkIcon className='w-5 stroke-2' />
                 </button>
               </div>
-              { children }
+              {children}
             </motion.div>
           </>
-        ) }
+        )}
       </AnimatePresence>
     </>
   )
 }
 
-export default BottomPopup
\ No newline at end of file
+export default BottomPopup
-- 
cgit v1.2.3


From ac3fdf7be9982e65d8f83a20bc487f8dd62e3bfc Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Wed, 22 Feb 2023 23:36:47 +0700
Subject: fix

---
 src/core/components/elements/Popup/BottomPopup.jsx | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

(limited to 'src/core/components/elements/Popup')

diff --git a/src/core/components/elements/Popup/BottomPopup.jsx b/src/core/components/elements/Popup/BottomPopup.jsx
index af1149ca..24366802 100644
--- a/src/core/components/elements/Popup/BottomPopup.jsx
+++ b/src/core/components/elements/Popup/BottomPopup.jsx
@@ -35,7 +35,10 @@ const BottomPopup = ({ children, active = false, title, close }) => {
             >
               <div className='flex justify-between py-4'>
                 <div className='font-semibold text-h-sm'>{title}</div>
-                <button type='button' onClick={close}>
+                <button
+                  type='button'
+                  onClick={close}
+                >
                   <XMarkIcon className='w-5 stroke-2' />
                 </button>
               </div>
-- 
cgit v1.2.3