Merge branch 'main' into issue-7643

components/carousel/CarouselTypeGenerative.vue

@@ -0,0 +1,14 @@
+<template>
+  <CarouselIndex
+    :key="ids"
+    data-testid="generative-activity"
+    :title="$t('general.generativeActivity')"
+    :nfts="nfts"
+    action-type="pagination" />
+</template>
+
+<script lang="ts" setup>
+import { useCarouselGenerativeNftEvents } from './utils/useCarouselEvents'
+
+const { nfts, ids } = await useCarouselGenerativeNftEvents('ahk', ['176'])
+</script>

components/carousel/utils/useCarouselEvents.ts

@@ -37,7 +37,7 @@ const fetchLatestEvents = async (chain, type, where = {}) => {
   })
 }
 
-const useChainEvents = async (chain, type) => {
+const useChainEvents = async (chain, type, collectionIds) => {
   const nfts = ref<{ nft: NFTWithMetadata; timestamp: string }[]>([])
   const uniqueNftId = ref<string[]>([])
   const totalCollection = reactive({})
@@ -64,7 +64,7 @@ const useChainEvents = async (chain, type) => {
       totalCollection[nft.nft.collection.id] += 1
 
       // limit nft in same collection by 3
-      if (totalCollection[nft.nft.collection.id] > 3) {
+      if (!collectionIds && totalCollection[nft.nft.collection.id] > 3) {
         return excludeCollectionId.value.push(nft.nft.collection.id)
       }
 
@@ -80,6 +80,7 @@ const useChainEvents = async (chain, type) => {
       ...(type === 'newestList' && { price_gt: 0 }),
       id_not_in: [...new Set(excludeNftId.value)],
       collection: {
+        ...(collectionIds && { id_in: collectionIds }),
         id_not_in: [...new Set(excludeCollectionId.value)],
       },
     },
@@ -108,6 +109,20 @@ export const flattenNFT = (data, chain) => {
 
 const sortNftByTime = (data) => data.sort((a, b) => b.unixTime - a.unixTime)
 
+const limitDisplayNfts = (data) => {
+  const nfts = ref<CarouselNFT[]>([])
+
+  // show 30 nfts in carousel
+  const sortedNfts = sortNftByTime(data).slice(0, 30)
+
+  nfts.value = sortedNfts
+
+  return {
+    nfts,
+    ids: computed(() => nfts.value.map((nft) => nft.id).join()),
+  }
+}
+
 export const useCarouselNftEvents = async ({ type }: Types) => {
   const { data: dataAhk } = await useChainEvents('ahk', type)
   const { data: dataAhp } = await useChainEvents('ahp', type)
@@ -116,8 +131,6 @@ export const useCarouselNftEvents = async ({ type }: Types) => {
   const { data: dataRmrk } = await useChainEvents('rmrk', type)
   const { data: dataRmrk2 } = await useChainEvents('ksm', type)
 
-  const nfts = ref<CarouselNFT[]>([])
-
   const data = [
     ...flattenNFT(dataAhk.value, 'ahk'),
     ...flattenNFT(dataAhp.value, 'ahp'),
@@ -127,13 +140,28 @@ export const useCarouselNftEvents = async ({ type }: Types) => {
     ...flattenNFT(dataRmrk2.value, 'ksm'),
   ]
 
-  // show 30 nfts in carousel
-  const sortedNfts = sortNftByTime(data).slice(0, 30)
+  return limitDisplayNfts(data)
+}
 
-  nfts.value = sortedNfts
+export const useCarouselGenerativeNftEvents = async (
+  chain: Prefix,
+  collectionIds: string[],
+) => {
+  const { data: salesData } = await useChainEvents(
+    chain,
+    'latestSales',
+    collectionIds,
+  )
+  const { data: listData } = await useChainEvents(
+    chain,
+    'newestList',
+    collectionIds,
+  )
 
-  return {
-    nfts,
-    ids: computed(() => nfts.value.map((nft) => nft.id).join()),
-  }
+  const data = [
+    ...flattenNFT(salesData.value, chain),
+    ...flattenNFT(listData.value, chain),
+  ]
+
+  return limitDisplayNfts(data)
 }

components/gallery/GalleryItemAction/GalleryItemActionType/GalleryItemBuy.vue

@@ -3,42 +3,13 @@
     <GalleryItemPriceSection v-if="nft.price" title="Price" :price="nft.price">
       <div v-if="Number(nft.price)" class="is-flex desktop-full-w">
         <div class="is-flex buy-button-width">
-          <NeoTooltip
-            :active="disabled"
-            class="w-full"
-            content-class="buy-tooltip"
-            :auto-close="isMobileDevice ? true : ['outside']"
-            :position="isMobileDevice ? 'top' : 'left'"
-            :triggers="[isMobileDevice ? 'click' : 'hover']"
-            multiline>
-            <template #content>
-              <div class="is-size-6">
-                {{
-                  $t('tooltip.notEnoughBalanceChain', {
-                    chain: chainNames[urlPrefix],
-                  })
-                }}
-                <div>
-                  {{ $t('tip') }}:
-                  <nuxt-link :to="`/${urlPrefix}/teleport`" target="_blank">
-                    {{ $t('useTeleport') }}</nuxt-link
-                  >
-
-                  {{ $t('or') }}
-
-                  <a @click="addFunds"> {{ $t('addFunds') }}</a>
-                </div>
-              </div>
-            </template>
-            <NeoButton
-              :label="label"
-              size="large"
-              class="button-height w-full"
-              variant="k-accent"
-              :disabled="disabled"
-              data-testid="item-buy"
-              @click="onClick" />
-          </NeoTooltip>
+          <NeoButton
+            :label="label"
+            size="large"
+            class="button-height w-full"
+            variant="k-accent"
+            data-testid="item-buy"
+            @click="onClick" />
         </div>
 
         <NeoButton
@@ -57,34 +28,24 @@
 </template>
 
 <script setup lang="ts">
-import { NeoButton, NeoTooltip } from '@kodadot1/brick'
+import { NeoButton } from '@kodadot1/brick'
 import GalleryItemPriceSection from '../GalleryItemActionSection.vue'
-import { getKusamaAssetId } from '@/utils/api/bsx/query'
-import { useIdentityStore } from '@/stores/identity'
 import { useShoppingCartStore } from '@/stores/shoppingCart'
 import { usePreferencesStore } from '@/stores/preferences'
 import OnRampModal from '@/components/shared/OnRampModal.vue'
 import { openShoppingCart } from '@/components/common/shoppingCart/ShoppingCartModalConfig'
-import { NFT } from '@/components/rmrk/service/scheme'
+import type { NFT } from '@/components/rmrk/service/scheme'
 import { nftToShoppingCartItem } from '@/components/common/shoppingCart/utils'
-import { chainNames } from '@/libs/static/src/chains'
-
-import { useWindowSize } from '@vueuse/core'
 
 const props = defineProps<{ nft: NFT }>()
-const isMobileDevice = computed(() => useWindowSize().width.value < 1024)
 
-const { urlPrefix } = usePrefix()
-const { accountId } = useAuth()
 const { $i18n } = useNuxtApp()
 const preferencesStore = usePreferencesStore()
 const shoppingCartStore = useShoppingCartStore()
 const { cartIcon } = useShoppingCartIcon(props.nft.id)
 
 const instance = getCurrentInstance()
 const { doAfterLogin } = useDoAfterlogin(instance)
-const identityStore = useIdentityStore()
-const connected = computed(() => Boolean(accountId.value))
 const showRampModal = ref(false)
 
 enum BuyStatus {
@@ -105,36 +66,6 @@ const label = computed(() => {
   )
 })
 
-const addFunds = () => {
-  showRampModal.value = true
-}
-
-const balance = computed<string>(() => {
-  switch (urlPrefix.value) {
-    case 'rmrk':
-    case 'ksm':
-    case 'ahk':
-    case 'ahp':
-      return identityStore.getAuthBalance
-    case 'bsx':
-      return identityStore.multiBalances.chains.basilisk?.ksm?.nativeBalance
-    case 'snek':
-      return identityStore.multiBalances.chains['basilisk-testnet']?.ksm
-        ?.nativeBalance
-    default:
-      return identityStore.getTokenBalanceOf(getKusamaAssetId(urlPrefix.value))
-  }
-})
-const disabled = computed(() => {
-  if (btnStatus.value === BuyStatus.CART) {
-    return false
-  }
-  if (!(Number(props.nft.price) && balance.value) || !connected.value) {
-    return false
-  }
-  return Number(balance.value) <= Number(props.nft.price)
-})
-
 const openCompletePurcahseModal = () => {
   shoppingCartStore.setItemToBuy(nftToShoppingCartItem(props.nft))
   preferencesStore.setCompletePurchaseModal({

components/landing/LandingPage.vue

@@ -38,6 +38,9 @@
 
             <!-- latest sales -->
             <LazyCarouselTypeLatestSales class="mt-8" />
+
+            <!-- generative  -->
+            <LazyCarouselTypeGenerative class="mt-8" />
           </div>
         </section>
       </ClientOnly>

locales/en.json

@@ -938,6 +938,7 @@
     "copyToClipboard": "Copied to clipboard",
     "copyRewardLink": "Copy Reward Me link",
     "latestSales": "Latest sales",
+    "generativeActivity": "Generative",
     "search": "Search",
     "searchResultsText": "Showing results for",
     "searchNoResultsTitle": "Whoops, Couldn't find anything matching your search",