diff --git a/components/gallery/GalleryItem.vue b/components/gallery/GalleryItem.vue index 716b683ef4..ab5fe952b3 100644 --- a/components/gallery/GalleryItem.vue +++ b/components/gallery/GalleryItem.vue @@ -181,6 +181,7 @@ import GalleryItemDescription from './GalleryItemDescription.vue' import GalleryItemTabsPanel from './GalleryItemTabsPanel/GalleryItemTabsPanel.vue' import UnlockableTag from './UnlockableTag.vue' import { useGalleryItem } from './useGalleryItem' +import { GALLERY_ITEM_TABS } from '@/components/gallery/GalleryItemTabsPanel/types' import CollectionDetailsPopover from '@/components/collectionDetailsPopover/CollectionDetailsPopover.vue' import { MediaType } from '@/components/rmrk/types' import { usePreferencesStore } from '@/stores/preferences' @@ -206,6 +207,7 @@ const mediaItemRef = ref<{ } | null>(null) const galleryDescriptionRef = ref<{ isLewd: boolean } | null>(null) const preferencesStore = usePreferencesStore() +const { getTriggerBuySuccess: triggerBuySuccess, getTriggerOfferSuccess: triggerOfferSuccess } = storeToRefs(preferencesStore) const pageViewCount = usePageViews() const fiatStore = useFiatStore() @@ -216,19 +218,13 @@ const collection = computed(() => nft.value?.collection) const nftCreator = computed(() => nft.value?.dropCreator || nft.value?.issuer) -const triggerBuySuccess = computed(() => preferencesStore.triggerBuySuccess) - const breakPointWidth = 930 const isMobile = computed(() => useWindowSize().width.value < breakPointWidth) -const tabs = { - activity: '1', - chart: '2', -} -const activeTab = ref(tabs.activity) +const activeTab = ref(GALLERY_ITEM_TABS.ACTIVITY) const onNFTBought = () => { - activeTab.value = tabs.activity + activeTab.value = GALLERY_ITEM_TABS.ACTIVITY } const image = computed(() => { @@ -249,6 +245,13 @@ watch(triggerBuySuccess, (value, oldValue) => { } }) +watch(triggerOfferSuccess, (value) => { + if (value) { + activeTab.value = GALLERY_ITEM_TABS.OFFERS + preferencesStore.setTriggerOfferSuccess(false) + } +}) + const congratsNewNft = ref('') onMounted(() => { diff --git a/components/gallery/GalleryItemTabsPanel/GalleryItemTabsPanel.vue b/components/gallery/GalleryItemTabsPanel/GalleryItemTabsPanel.vue index 061ffa5582..8ec8648b9b 100644 --- a/components/gallery/GalleryItemTabsPanel/GalleryItemTabsPanel.vue +++ b/components/gallery/GalleryItemTabsPanel/GalleryItemTabsPanel.vue @@ -8,9 +8,8 @@ > @@ -61,30 +58,24 @@ import GalleryItemActivity from './GalleryItemActivity.vue' import GalleryItemOffers from './GalleryItemOffers.vue' import GalleryItemSwaps from './GalleryItemSwaps.vue' import GalleryItemChart from './GalleryItemChart.vue' -import { offerVisible } from '@/utils/config/permission.config' +import { GALLERY_ITEM_TABS } from './types' +import { offerVisible, swapVisible } from '@/utils/config/permission.config' const props = withDefaults( defineProps<{ - activeTab?: string + activeTab?: GALLERY_ITEM_TABS }>(), { - activeTab: '0', + activeTab: GALLERY_ITEM_TABS.ACTIVITY, }, ) const { urlPrefix } = usePrefix() const { getNft: nft } = storeToRefs(useNftStore()) -const active = ref('1') -const collectionId = ref('') - -watchEffect(() => { - if (props.activeTab) { - active.value = props.activeTab - } +const active = ref(props.activeTab) - collectionId.value = nft.value?.collection.id || '' -}) +watch(() => props.activeTab, activeTab => active.value = activeTab)