🔀 Merge #1676 into deploy/rinkeby

likecoin · Jul 17, 2024 · f5ac533 · f5ac533
2 parents 13b965c + 2a9e9da
commit f5ac533
Show file tree

Hide file tree

Showing 5 changed files with 32 additions and 16 deletions.
diff --git a/src/components/NFTBook/ItemCardV2.vue b/src/components/NFTBook/ItemCardV2.vue
@@ -13,41 +13,41 @@
       :class-aspect-ratio="classCoverFrameAspectRatio"
       cover-class="group-hover:scale-[1.02] transition-transform"
       :cover-resize="coverResize"
-      :src="NFTImageUrl"
-      :alt="NFTName"
-      :to="nftCollectRoute"
+      :src="productImageUrl"
+      :alt="productName"
+      :to="viewInfoLocation"
       :event="isLinkDisabled ? '' : 'click'"
       @click.native="$emit('click-cover', $event)"
     />
 
     <div
       class="mt-[8px] text-[#333] text-[1rem] font-[500] laptop:text-[1.125rem]"
     >
-      {{ NFTName }}
+      {{ productName }}
     </div>
 
     <div class="text-[#8B8B8B] text-[0.875rem] laptop:text-[1rem]">
       {{ (iscnWorkAuthor || creatorDisplayName) | ellipsis }}
     </div>
 
     <div class="mt-[16px] text-[#1F1F1F] text-[0.875rem] laptop:text-[1rem]">
-      {{ nftBookAvailablePriceLabel || $t('nft_details_page_label_sold_out') }}
+      {{ productAvailablePriceLabel || $t('nft_details_page_label_sold_out') }}
     </div>
   </div>
 </template>
 
 <script>
-import nftMixin from '~/mixins/nft';
+import nftOrCollectionMixin from '~/mixins/nft-or-collection';
 
 import { ellipsis } from '~/util/ui';
 
 export default {
   filters: {
     ellipsis,
   },
-  mixins: [nftMixin],
+  mixins: [nftOrCollectionMixin],
   props: {
-    classId: {
+    itemId: {
       type: String,
       required: true,
     },
@@ -69,9 +69,16 @@ export default {
     },
   },
   computed: {
+    classId() {
+      return this.itemId.startsWith('likenft1') ? this.itemId : '';
+    },
+    collectionId() {
+      return this.itemId.startsWith('col') ? this.itemId : '';
+    },
     creatorDisplayName() {
       return (
-        this.getUserInfoByAddress(this.iscnOwner)?.displayName || this.iscnOwner
+        this.getUserInfoByAddress(this.productOwner)?.displayName ||
+        this.productOwner
       );
     },
   },
@@ -80,7 +87,11 @@ export default {
   },
   methods: {
     async fetchInfo() {
-      await this.lazyFetchNFTClassAggregatedData();
+      if (this.isCollection) {
+        await this.lazyFetchNFTCollectionInfo();
+      } else {
+        await this.lazyFetchNFTClassAggregatedData();
+      }
     },
   },
 };

diff --git a/src/mixins/nft-or-collection.js b/src/mixins/nft-or-collection.js
@@ -56,6 +56,11 @@ export default {
     productPrice() {
       return this.isCollection ? this.collectionPrice : this.NFTPrice;
     },
+    productAvailablePriceLabel() {
+      return this.isCollection
+        ? this.collectionAvailablePriceLabel
+        : this.nftBookAvailablePriceLabel;
+    },
     viewInfoLocation() {
       return this.isCollection
         ? this.localeLocation({

diff --git a/src/package-lock.json b/src/package-lock.json
diff --git a/src/package.json b/src/package.json
@@ -34,7 +34,7 @@
     "@likecoin/iscn-js": "^0.6.9",
     "@likecoin/nuxt-google-optimize": "^0.5.3-like.11",
     "@likecoin/ui-vue": "^0.7.1",
-    "@likecoin/wallet-connector": "^0.26.2",
+    "@likecoin/wallet-connector": "^0.26.3",
     "@nuxtjs/axios": "^5.12.2",
     "@nuxtjs/i18n": "^7.3.1",
     "@nuxtjs/sentry": "^5.1.7",

diff --git a/src/pages/index.vue b/src/pages/index.vue
@@ -403,7 +403,7 @@
           >
             <li v-for="item in bookstoreItemsInGrid" :key="item.classId">
               <NFTBookItemCardV2
-                :class-id="item.classId"
+                :item-id="item.classId"
                 class-cover-frame-aspect-ratio="min-h-[360px] laptop:min-h-[0] aspect-[4/5]"
                 :cover-resize="300"
                 :is-link-disabled="item.isMultiple"