From e7cdc1148afef098ed979d981ea113d09302dc03 Mon Sep 17 00:00:00 2001
From: Viki Val <viktorko99@gmail.com>
Date: Tue, 28 Jun 2022 09:25:54 +0200
Subject: [PATCH] :tada: copypasted moonsama from bsx

---
 pages/moonsama/collection/_id.vue | 50 +++++++++++++++++++++++++++++
 pages/moonsama/create.vue         | 45 ++++++++++++++++++++++++++
 pages/moonsama/detail/_id.vue     | 53 +++++++++++++++++++++++++++++++
 pages/moonsama/explore.vue        | 31 ++++++++++++++++++
 pages/moonsama/gallery/_id.vue    | 53 +++++++++++++++++++++++++++++++
 pages/moonsama/index.vue          | 23 ++++++++++++++
 pages/moonsama/u/_id.vue          | 18 +++++++++++
 7 files changed, 273 insertions(+)
 create mode 100644 pages/moonsama/collection/_id.vue
 create mode 100644 pages/moonsama/create.vue
 create mode 100644 pages/moonsama/detail/_id.vue
 create mode 100644 pages/moonsama/explore.vue
 create mode 100644 pages/moonsama/gallery/_id.vue
 create mode 100644 pages/moonsama/index.vue
 create mode 100644 pages/moonsama/u/_id.vue

diff --git a/pages/moonsama/collection/_id.vue b/pages/moonsama/collection/_id.vue
new file mode 100644
index 0000000000..15d6634d66
--- /dev/null
+++ b/pages/moonsama/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>
diff --git a/pages/moonsama/create.vue b/pages/moonsama/create.vue
new file mode 100644
index 0000000000..e4bb43508f
--- /dev/null
+++ b/pages/moonsama/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"
+          @navigateToCreateNftTab="switchToCreateNFT"
+          v-if="components[activeTab] === x" />
+      </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>
diff --git a/pages/moonsama/detail/_id.vue b/pages/moonsama/detail/_id.vue
new file mode 100644
index 0000000000..263ddb75a2
--- /dev/null
+++ b/pages/moonsama/detail/_id.vue
@@ -0,0 +1,53 @@
+<template>
+  <GalleryItem />
+</template>
+
+<script lang="ts">
+import { Component, Vue } from 'nuxt-property-decorator'
+
+import GalleryItem from '@/components/rmrk/Gallery/GalleryItem.vue'
+import { generateNftImage } from '@/utils/seoImageGenerator'
+import { formatBalanceEmptyOnZero } from '@/utils/format/balance'
+
+@Component<GalleryItemPage>({
+  name: 'GalleryItemPage',
+  components: {
+    GalleryItem,
+  },
+  head() {
+    const { title, description, author: content } = this.currentlyViewedItem
+    const metaData = {
+      title,
+      type: 'profile',
+      description,
+      url: this.$route.path,
+      image: this.image,
+    }
+    return {
+      title,
+      meta: [
+        ...this.$seoMeta(metaData),
+        {
+          hid: 'og:author',
+          property: 'og:author',
+          content,
+        },
+      ],
+    }
+  },
+})
+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>
diff --git a/pages/moonsama/explore.vue b/pages/moonsama/explore.vue
new file mode 100644
index 0000000000..4653b62b52
--- /dev/null
+++ b/pages/moonsama/explore.vue
@@ -0,0 +1,31 @@
+<template>
+  <ExploreLayout type="rmrk" />
+</template>
+
+<script lang="ts">
+import { Component, Vue } from 'nuxt-property-decorator'
+import ExploreLayout from '@/components/rmrk/ExploreLayout/ExploreLayout.vue'
+
+const components = {
+  ExploreLayout,
+}
+
+@Component<ExploreBsx>({
+  components,
+  head() {
+    const title = 'Low minting fees and carbonless NFTs'
+    const metaData = {
+      title,
+      type: 'profile',
+      description: 'Buy Carbonless NFTs on Kusama',
+      url: '/moonsama/explore',
+      image: `${this.$config.baseUrl}/k_card_collections.png`,
+    }
+    return {
+      title,
+      meta: [...this.$seoMeta(metaData)],
+    }
+  },
+})
+export default class ExploreBsx extends Vue {}
+</script>
diff --git a/pages/moonsama/gallery/_id.vue b/pages/moonsama/gallery/_id.vue
new file mode 100644
index 0000000000..d1d4c9e0f9
--- /dev/null
+++ b/pages/moonsama/gallery/_id.vue
@@ -0,0 +1,53 @@
+<template>
+  <GalleryItem />
+</template>
+
+<script lang="ts">
+import { Component, Vue } from 'nuxt-property-decorator'
+
+import GalleryItem from '@/components/bsx/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>
diff --git a/pages/moonsama/index.vue b/pages/moonsama/index.vue
new file mode 100644
index 0000000000..1515a0ed9f
--- /dev/null
+++ b/pages/moonsama/index.vue
@@ -0,0 +1,23 @@
+<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 !== 'moonsama') {
+      this.$consola.log('Not Moonsama')
+      store.dispatch('setUrlPrefix', 'moonsama')
+    }
+
+    redirect('/')
+  }
+}
+</script>
diff --git a/pages/moonsama/u/_id.vue b/pages/moonsama/u/_id.vue
new file mode 100644
index 0000000000..b371e5ea1a
--- /dev/null
+++ b/pages/moonsama/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>