Merge branch 'main' into neotabs-tailwindcss

components/collection/CollectionInfo.vue

@@ -12,6 +12,13 @@
           <IdentityIndex ref="identity" :address="address" show-clipboard />
         </nuxt-link>
       </div>
+      <div v-if="recipient" class="is-flex mb-2">
+        <div class="mr-2 is-capitalized">{{ $t('royalty') }}</div>
+        <nuxt-link :to="`/${urlPrefix}/u/${recipient}`" class="has-text-link">
+          <IdentityIndex ref="identity" :address="recipient" show-clipboard />
+        </nuxt-link>
+        &nbsp;({{ royalty }}%)
+      </div>
       <div class="overflow-wrap">
         <Markdown
           :source="visibleDescription"
@@ -83,6 +90,8 @@ const chain = computed(
       ?.text,
 )
 const address = computed(() => collectionInfo.value?.currentOwner)
+const recipient = computed(() => collectionInfo.value?.recipient)
+const royalty = computed(() => collectionInfo.value?.royalty)
 const seeAllDescription = ref(false)
 const DESCRIPTION_MAX_LENGTH = 210
 

components/collection/utils/useCollectionDetails.ts

@@ -117,9 +117,13 @@ export function useCollectionSoldData({ address, collectionId }) {
 }
 
 export const useCollectionMinimal = ({ collectionId }) => {
+  const { urlPrefix } = usePrefix()
+  const { isAssetHub } = useIsChain(urlPrefix)
   const collection = ref()
   const { data } = useGraphql({
-    queryName: 'collectionByIdMinimal',
+    queryName: isAssetHub.value
+      ? 'collectionByIdMinimalWithRoyalty'
+      : 'collectionByIdMinimal',
     variables: {
       id: collectionId,
     },

components/gallery/GalleryItemTabsPanel/GalleryItemActivityTable.vue

@@ -25,7 +25,7 @@
         <p v-if="Number(props.row.meta)">
           {{ formatPrice(props.row.meta)[0] }}
           <span class="has-text-grey">
-            (${{ formatPrice(props.row.meta)[1] }})</span
+            ${{ formatPrice(props.row.meta)[1] }}</span
           >
         </p>
       </NeoTableColumn>

libs/ui/src/components/MediaItem/type/ImageMedia.vue

@@ -11,11 +11,7 @@
       :image-component-props="imageComponentProps"
       :src="src"
       :alt="alt"
-      class="block rounded-none"
-      :class="{
-        'object-cover absolute inset-0 w-full h-full':
-          !original && !isFullscreen,
-      }"
+      :class="className"
       data-testid="type-image"
       @error.once="() => onError('error-1')" />
     <!-- if fail, try to load original url -->
@@ -24,15 +20,15 @@
       v-if="status === 'error-1'"
       :src="src"
       :alt="alt"
-      class="is-block image-media__image no-border-radius"
+      :class="className"
       data-testid="type-image"
       @error.once="() => onError('error-2')" />
     <!-- else, load placeholder -->
     <img
       v-if="status === 'error-2'"
       :src="placeholder"
       :alt="alt"
-      class="is-block image-media__image no-border-radius"
+      :class="className"
       data-testid="type-image" />
   </figure>
 </template>
@@ -73,6 +69,12 @@ type Status = 'ok' | 'error-1' | 'error-2'
 const status = ref<Status>('ok')
 const isGif = computed(() => props.mimeType === 'image/gif')
 
+const className = computed(() =>
+  !props.original && !props.isFullscreen
+    ? 'object-cover absolute inset-0 w-full h-full'
+    : 'block rounded-none',
+)
+
 const toOriginalContentUrl = (baseurl: string) => {
   const url = new URL(baseurl)
   url.searchParams.append('original', 'true')

queries/subsquid/general/collectionByIdMinimalWithRoyalty.graphql

@@ -0,0 +1,21 @@
+query collectionByIdMinimalWithRoyalty($id: String!) {
+  collectionEntityById(id: $id) {
+    id
+    issuer
+    royalty
+    recipient
+    meta {
+      animationUrl
+      description
+      id
+      image
+      name
+      type
+    }
+    nftCount
+    max
+    metadata
+    name
+    currentOwner
+  }
+}