Merge branch 'main' into feat-new-footer

components/carousel/module/CarouselInfo.vue

@@ -42,7 +42,8 @@ const isCollection = inject('isCollection')
 const chainName = computed(() => {
   const name = {
     rmrk: 'RMRK',
-    snek: 'Basilisk',
+    snek: 'Snek (Rococo)',
+    bsx: 'Basilisk',
   }
 
   return name[props.item.chain || 'rmrk']

components/carousel/utils/useCarousel.ts

@@ -78,6 +78,7 @@ const useChainEvents = (chain, type) => {
 export const useCarouselNftEvents = ({ type }: Types) => {
   const { data: dataRmrk, loading: loadingRmrk } = useChainEvents('rmrk', type)
   const { data: dataSnek, loading: loadingSnek } = useChainEvents('snek', type)
+  const { data: dataBsx, loading: loadingBsx } = useChainEvents('bsx', type)
   const nfts = ref<CarouselNFT[]>([])
 
   const flattenNFT = async (data, chain) => {
@@ -91,12 +92,13 @@ export const useCarouselNftEvents = ({ type }: Types) => {
 
   // currently only support rmrk and snek
   // moonriver: https://github.com/kodadot/nft-gallery/issues/3891
-  watch([loadingRmrk, loadingSnek], async () => {
-    if (!loadingRmrk.value && !loadingSnek.value) {
+  watch([loadingRmrk, loadingSnek, loadingBsx], async () => {
+    if (!loadingRmrk.value && !loadingSnek.value && !loadingBsx.value) {
       const rmrkNfts = await flattenNFT(dataRmrk.value, 'rmrk')
       const snekNfts = await flattenNFT(dataSnek.value, 'snek')
+      const bsxNfts = await flattenNFT(dataBsx.value, 'bsx')
 
-      const data = [...rmrkNfts, ...snekNfts]
+      const data = [...rmrkNfts, ...snekNfts, ...bsxNfts]
 
       nfts.value = data.sort((a, b) => b.unixTime - a.unixTime).slice(0, 10)
     }

components/landing/LandingPage.vue

@@ -12,7 +12,9 @@
     </section>
 
     <!-- top collections -->
-    <section v-if="showCarousel" class="section instance instance-accent">
+    <section
+      v-if="urlPrefix.value === 'rmrk' || urlPrefix.value === 'snek'"
+      class="section instance instance-accent">
       <div class="container">
         <LazyReTopCollections class="my-5" />
       </div>
@@ -39,7 +41,11 @@ const { urlPrefix } = usePrefix()
 
 // currently only supported on rmrk and snek
 const showCarousel = computed(() => {
-  return urlPrefix.value === 'rmrk' || urlPrefix.value === 'snek'
+  return (
+    urlPrefix.value === 'rmrk' ||
+    urlPrefix.value === 'snek' ||
+    urlPrefix.value === 'bsx'
+  )
 })
 </script>
 

components/landing/ReTopCollections.vue

@@ -8,7 +8,7 @@
       </div>
     </div>
 
-    <nuxt-link :to="`/${urlPrefix}/series`" class="link">
+    <nuxt-link to="/series-insight" class="link">
       {{ $t('helper.seeMore') }} >
     </nuxt-link>
   </div>

components/landing/SearchLanding.vue

@@ -45,9 +45,7 @@ const landingImage = computed(() => {
 const chainList = computed(() => {
   const availableUrlPrefixes: Option[] = $store.getters['availableUrlPrefixes']
   return availableUrlPrefixes.filter(
-    (urlPrefix) =>
-      !chainTestList.includes(urlPrefix.value as string) &&
-      urlPrefix.value !== 'bsx'
+    (urlPrefix) => !chainTestList.includes(urlPrefix.value as string)
   )
 })
 

package.json

@@ -67,15 +67,15 @@
     "@google/model-viewer": "^1.12.1",
     "@keeex/qrcodejs-kx": "^1.0.2",
     "@kodadot1/minimark": "^0.0.1-rc.10",
-    "@kodadot1/sub-api": "0.1.0-alpha.3",
+    "@kodadot1/sub-api": "0.1.1-alpha.3",
     "@kodadot1/vuex-options": "0.0.3-rc.9",
     "@nuxtjs/apollo": "^4.0.1-rc.5",
     "@nuxtjs/i18n": "^7.3.0",
-    "@polkadot/extension-dapp": "^0.44.2",
-    "@polkadot/extension-inject": "^0.44.2",
-    "@polkadot/ui-keyring": "2.9.2",
-    "@polkadot/vue-identicon": "^2.9.2",
-    "@ramp-network/ramp-instant-sdk": "^3.2.0",
+    "@polkadot/extension-dapp": "^0.44.6",
+    "@polkadot/extension-inject": "^0.44.6",
+    "@polkadot/ui-keyring": "2.9.10",
+    "@polkadot/vue-identicon": "^2.9.10",
+    "@ramp-network/ramp-instant-sdk": "^3.2.3",
     "apollo-boost": "^0.4.9",
     "axios": "^0.27.2",
     "buefy": "^0.9.22",
@@ -113,13 +113,13 @@
     "vuex-persist": "^3.1.3"
   },
   "devDependencies": {
-    "@babel/core": "^7.19.1",
+    "@babel/core": "^7.19.3",
     "@babel/helper-define-map": "^7.18.6",
     "@babel/helper-regex": "^7.10.5",
     "@babel/plugin-proposal-optional-chaining": "^7.18.9",
     "@babel/plugin-proposal-private-property-in-object": "^7.18.6",
     "@babel/plugin-transform-runtime": "^7.19.1",
-    "@babel/preset-env": "^7.19.1",
+    "@babel/preset-env": "^7.19.3",
     "@nuxt/bridge": "npm:@nuxt/[email protected]",
     "@nuxt/test-utils": "^0.2.2",
     "@nuxt/types": "^2.15.8",
@@ -129,18 +129,18 @@
     "@rollup/plugin-graphql": "^1.1.0",
     "@types/jest": "^27.5.2",
     "@types/markdown-it": "^12.2.3",
-    "@typescript-eslint/eslint-plugin": "^5.37.0",
-    "@typescript-eslint/parser": "^5.37.0",
+    "@typescript-eslint/eslint-plugin": "^5.38.1",
+    "@typescript-eslint/parser": "^5.38.1",
     "@vue/test-utils": "^1.3.0",
-    "all-contributors-cli": "^6.20.4",
+    "all-contributors-cli": "^6.22.0",
     "c8": "^7.12.0",
     "consola": "^2.15.3",
     "cross-env": "^7.0.3",
-    "cypress": "^10.8.0",
+    "cypress": "^10.9.0",
     "cypress-file-upload": "^5.0.8",
-    "cypress-network-idle": "^1.10.0",
+    "cypress-network-idle": "^1.10.1",
     "cypress-real-events": "^1.7.1",
-    "eslint": "^8.23.1",
+    "eslint": "^8.24.0",
     "eslint-config-prettier": "^8.5.0",
     "eslint-plugin-prettier": "^4.2.1",
     "eslint-plugin-unicorn": "^42.0.0",
@@ -153,17 +153,18 @@
     "netlify-lambda": "^2.0.15",
     "prettier": "^2.7.1",
     "raw-loader": "^4.0.2",
-    "sass": "^1.54.9",
+    "sass": "^1.55.0",
     "sass-loader": "^10.3",
-    "typescript": "^4.8.3",
+    "typescript": "^4.8.4",
     "vite-plugin-vue2": "^2.0.2",
     "vitest": "^0.23.4",
     "vue-debounce-decorator": "^1.0.1",
     "vue-eslint-parser": "^9.1.0"
   },
   "pnpm": {
     "overrides": {
-      "@substrate/smoldot-light": "^0.6.27"
+      "@substrate/smoldot-light": "^0.6.27",
+      "@polkadot/util": "^10.1.9"
     },
     "patchedDependencies": {
       "[email protected]": "patches/[email protected]"

pages/glmr/collection/_id.vue

@@ -0,0 +1,50 @@
+<template>
+  <CollectionItem />
+</template>
+
+<script lang="ts">
+import { Component, Vue } from 'nuxt-property-decorator'
+import CollectionItem from '@/components/rmrk/Gallery/CollectionItem.vue'
+import { generateCollectionImage } from '~/utils/seoImageGenerator'
+
+type CurrentCollection = {
+  name: string
+  numberOfItems: number
+  image: string
+  description: string
+}
+
+@Component<CollectionItemPage>({
+  name: 'CollectionItemPage',
+  components: {
+    CollectionItem,
+  },
+  head() {
+    const title = this.currentlyViewedCollection.name
+    const metaData = {
+      title,
+      type: 'profile',
+      description: this.currentlyViewedCollection.description,
+      url: this.$route.path,
+      image: this.image,
+    }
+    return {
+      title,
+      meta: [...this.$seoMeta(metaData)],
+    }
+  },
+})
+export default class CollectionItemPage extends Vue {
+  get currentlyViewedCollection(): CurrentCollection {
+    return this.$store.getters['history/getCurrentlyViewedCollection']
+  }
+
+  get image(): string {
+    return generateCollectionImage(
+      this.currentlyViewedCollection.name,
+      this.currentlyViewedCollection.numberOfItems,
+      this.currentlyViewedCollection.image
+    )
+  }
+}
+</script>

pages/glmr/create.vue

@@ -0,0 +1,45 @@
+<template>
+  <section>
+    <br />
+    <b-tabs v-model="activeTab" destroy-on-hide expanded>
+      <b-tab-item v-for="x in components" :key="x" :label="x">
+        <component
+          :is="x"
+          v-if="components[activeTab] === x"
+          @navigateToCreateNftTab="switchToCreateNFT" />
+      </b-tab-item>
+    </b-tabs>
+  </section>
+</template>
+
+<script lang="ts">
+import { Component, mixins } from 'nuxt-property-decorator'
+import CreateMixin from '~/utils/mixins/createMixin'
+
+const Collection = () => import('@/components/bsx/Create/Create.vue')
+const NFT = () => import('@/components/bsx/Create/CreateToken.vue')
+
+const components = { Collection, NFT }
+
+@Component<BsxCreatePage>({
+  components,
+  layout() {
+    return 'centered-half-layout'
+  },
+  head() {
+    const title = 'KodaDot | Low fees and low carbon minting'
+    const metaData = {
+      title,
+      type: 'article',
+      description: 'Create carbonless NFTs with low on-chain fees',
+      url: '/statemine/create',
+      image: `${this.$config.baseUrl}/k_card_mint.png`,
+    }
+    return {
+      title,
+      meta: [...this.$seoMeta(metaData)],
+    }
+  },
+})
+export default class BsxCreatePage extends mixins(CreateMixin) {}
+</script>

pages/glmr/explore.vue

@@ -0,0 +1,31 @@
+<template>
+  <ExploreLayout />
+</template>
+
+<script lang="ts">
+import { Component, Vue } from 'nuxt-property-decorator'
+import ExploreLayout from '@/components/rmrk/ExploreLayout/ExploreLayout.vue'
+
+const components = {
+  ExploreLayout,
+}
+
+@Component<ExploreMoonriver>({
+  components,
+  head() {
+    const title = 'Low minting fees and carbonless NFTs'
+    const metaData = {
+      title,
+      type: 'profile',
+      description: 'Buy Carbonless NFTs on Kusama',
+      url: '/movr/explore',
+      image: `${this.$config.baseUrl}/k_card_collections.png`,
+    }
+    return {
+      title,
+      meta: [...this.$seoMeta(metaData)],
+    }
+  },
+})
+export default class ExploreMoonriver extends Vue {}
+</script>

pages/glmr/gallery/_id.vue

@@ -0,0 +1,53 @@
+<template>
+  <GalleryItem />
+</template>
+
+<script lang="ts">
+import { Component, Vue } from 'nuxt-property-decorator'
+
+import GalleryItem from '@/components/movr/Gallery/Item/GalleryItem.vue'
+import { generateNftImage } from '@/utils/seoImageGenerator'
+import { formatBalanceEmptyOnZero } from '@/utils/format/balance'
+
+@Component<GalleryItemPage>({
+  name: 'GalleryItemPage',
+  components: {
+    GalleryItem,
+  },
+  head() {
+    const title = this.currentlyViewedItem.title
+    const metaData = {
+      title,
+      type: 'profile',
+      description: this.currentlyViewedItem.description,
+      url: this.$route.path,
+      image: this.image,
+    }
+    return {
+      title,
+      meta: [
+        ...this.$seoMeta(metaData),
+        {
+          hid: 'og:author',
+          property: 'og:author',
+          content: this.currentlyViewedItem.author,
+        },
+      ],
+    }
+  },
+})
+export default class GalleryItemPage extends Vue {
+  get currentlyViewedItem() {
+    return this.$store.getters['history/getCurrentlyViewedItem']
+  }
+
+  get image(): string {
+    return generateNftImage(
+      this.currentlyViewedItem.name,
+      formatBalanceEmptyOnZero(this.currentlyViewedItem.price),
+      this.currentlyViewedItem.image,
+      this.currentlyViewedItem.mimeType
+    )
+  }
+}
+</script>

pages/glmr/index.vue

@@ -0,0 +1,22 @@
+<script lang="ts">
+import { Component, Vue } from 'nuxt-property-decorator'
+
+@Component({
+  components: {},
+})
+export default class LandingPage extends Vue {
+  layout() {
+    return 'full-width-layout'
+  }
+
+  middleware({ store, redirect }) {
+    // If the user is not authenticated
+    const prefix = store.getters.currentUrlPrefix
+    if (prefix !== 'glmr') {
+      console.log('Not Moonriver')
+      store.dispatch('setUrlPrefix', 'glmr')
+    }
+    setTimeout(() => redirect('/'))
+  }
+}
+</script>

pages/glmr/u/_id.vue

@@ -0,0 +1,18 @@
+<template>
+  <ProfileDetail />
+</template>
+
+<script lang="ts">
+import { Component, Vue } from 'nuxt-property-decorator'
+import ProfileDetail from '@/components/rmrk/Profile/ProfileDetail.vue'
+
+const components = {
+  ProfileDetail,
+}
+
+@Component<ProfilePage>({
+  name: 'ProfilePage',
+  components,
+})
+export default class ProfilePage extends Vue {}
+</script>