refactor: making offer

kodadot · Aug 19, 2024 · eca9f9c · eca9f9c
1 parent b4cdef7
commit eca9f9c
Show file tree

Hide file tree

Showing 6 changed files with 14 additions and 120 deletions.
diff --git a/components/common/CartItemDetails.vue b/components/common/CartItemDetails.vue
@@ -4,7 +4,7 @@
       <div class="flex">
         <div>
           <BaseMediaItem
-            v-if="nft?.mediaUrl"
+            v-if="nft.mediaUrl"
             class="border border-k-shade image is-48x48"
             :class="{ 'opacity-50': discarded }"
             :alt="nft?.name"

diff --git a/components/common/listingCart/ListingCartModal.vue b/components/common/listingCart/ListingCartModal.vue
@@ -139,11 +139,9 @@ const { chainSymbol, decimals } = useChain()
 
 const fixedPrice = ref()
 const floorPricePercentAdjustment = ref()
-const autoTeleport = ref(false)
-const autoTeleportButton = ref()
+
 const itemCount = ref(listingCartStore.count)
 const items = ref<ListCartItem[]>([])
-const autoTeleportLoaded = ref(false)
 
 const isSuccessModalOpen = computed(
   () => Boolean(items.value.length) && isTransactionSuccessful.value,
@@ -188,10 +186,7 @@ const getAction = (items: ListCartItem[]): Actions => {
   }
 }
 
-const { action } = useAutoTeleportActionButton({
-  autoTeleport,
-  autoTeleportButton,
-  autoTeleportLoaded,
+const { action, autoTeleport, autoTeleportButton, autoTeleportLoaded } = useAutoTeleportActionButton({
   getActionFn: () => getAction(listingCartStore.itemsInChain),
 })
 
@@ -329,21 +324,6 @@ watch(
   },
 )
 
-// watch(
-//   () => autoTeleportButton.value?.isReady,
-//   () => {
-//     if (autoTeleportButton.value?.isReady && !autoTeleportLoaded.value) {
-//       autoTeleportLoaded.value = true
-//     }
-//   },
-// )
-
-// watchSyncEffect(() => {
-//   if (!autoTeleport.value) {
-//     action.value = getAction(listingCartStore.itemsInChain)
-//   }
-// })
-
 const closeListingCartModal = () =>
   (preferencesStore.listingCartModalOpen = false)
 

diff --git a/components/gallery/GalleryItemAction/GalleryItemActionType/GalleryItemOffer.vue b/components/gallery/GalleryItemAction/GalleryItemActionType/GalleryItemOffer.vue
@@ -34,20 +34,10 @@ const openOfferModal = () => {
   preferencesStore.setMakeOfferModalOpen(true)
 }
 
-watch(
-  () => preferencesStore.makeOfferModalOpen,
-  (isOpen) => {
-    if (!isOpen) {
-      onOfferModalClose()
-    }
-  },
-)
-
-const onOfferModalClose = () => {
-  setTimeout(() => {
-    makeOfferStore.clear()
-  }, 500) // wait for modal animation
-}
+useModalIsOpenTracker({
+  isOpen: computed(() => preferencesStore.makeOfferModalOpen),
+  onChange: () => makeOfferStore.clear(),
+})
 </script>
 
 <style lang="scss" scoped>

diff --git a/components/offer/MakeOffer.vue b/components/offer/MakeOffer.vue
@@ -104,12 +104,8 @@ const { isTransactionSuccessful } = useTransactionSuccessful({
 
 const { decimals } = useChain()
 const { $i18n } = useNuxtApp()
-
-const autoTeleport = ref(false)
-const autoTeleportButton = ref()
 const itemCount = ref(offerStore.count)
 const items = ref<MakingOfferItem[]>([])
-const autoTeleportLoaded = ref(false)
 
 const isSuccessModalOpen = computed(
   () => Boolean(items.value.length) && isTransactionSuccessful.value,
@@ -130,10 +126,7 @@ const getAction = (items: MakingOfferItem[]): Actions => {
   }
 }
 
-const { action } = useAutoTeleportActionButton({
-  autoTeleport,
-  autoTeleportButton,
-  autoTeleportLoaded,
+const { action, autoTeleport, autoTeleportButton, autoTeleportLoaded } = useAutoTeleportActionButton({
   getActionFn: () => getAction(offerStore.itemsInChain),
 })
 

diff --git a/components/offer/MakingOfferItemDetails.vue b/components/offer/MakingOfferItemDetails.vue
diff --git a/composables/autoTeleport/useAutoTeleportActionButton.ts b/composables/autoTeleport/useAutoTeleportActionButton.ts
@@ -1,11 +1,11 @@
 import type { Actions } from '@/composables/transaction/types'
 
 export default ({
-  autoTeleport,
-  autoTeleportButton,
-  autoTeleportLoaded,
   getActionFn,
 }) => {
+  const autoTeleport = ref(false)
+  const autoTeleportButton = ref()
+  const autoTeleportLoaded = ref(false)
   const action = ref<Actions>(emptyObject<Actions>())
 
   watch(
@@ -25,5 +25,8 @@ export default ({
 
   return {
     action,
+    autoTeleport,
+    autoTeleportButton,
+    autoTeleportLoaded,
   }
 }