Merge branch 'main' into issue-5552

floyd-li · Apr 10, 2023 · be6d6e6 · be6d6e6
2 parents da33172 + f1dc104
commit be6d6e6
Show file tree

Hide file tree

Showing 32 changed files with 884 additions and 72 deletions.
diff --git a/components/Navbar.vue b/components/Navbar.vue
@@ -7,7 +7,7 @@
     fixed-top
     mobile-burger
     spaced
-    wrapper-class="container is-fluid">
+    :wrapper-class="{ container: true, 'is-fluid': !isMobile }">
     <template #brand>
       <b-navbar-item :to="{ path: '/' }" class="logo" tag="nuxt-link">
         <img
@@ -77,6 +77,10 @@
         id="NavChainSelect"
         class="navbar-chain custom-navbar-item"
         data-cy="chain-select" />
+      <NotificationBoxButton
+        v-if="account"
+        :show-label="isMobile"
+        @closeBurgerMenu="closeBurgerMenu" />
       <template v-if="isMobile">
         <MobileLanguageOption v-if="!account" />
         <MobileExpandableSection
@@ -150,6 +154,7 @@ import ChainSelectDropdown from '~/components/navbar/ChainSelectDropdown.vue'
 import StatsDropdown from '~/components/navbar/StatsDropdown.vue'
 import MobileNavbarProfile from '~/components/navbar/MobileNavbarProfile.vue'
 import ConnectWalletButton from '~/components/shared/ConnectWalletButton.vue'
+import NotificationBoxButton from '~/components/navbar/NotificationBoxButton.vue'
 import { ConnectWalletModalConfig } from '@/components/common/ConnectWallet/useConnectWallet'
 import { BModalConfig } from 'buefy/types/components'
 import type Vue from 'vue'

diff --git a/components/TheFooter.vue b/components/TheFooter.vue
@@ -25,12 +25,37 @@
           <script src="https://substackapi.com/widget.js" async></script>
         </div>
       </div>
+      <div class="footer-container-info is-flex is-flex-direction-column">
+        <h4 class="subtitle is-5">Marketplace</h4>
+        <div>
+          <ul class="">
+            <li
+              v-for="item in menuMarketplace"
+              :key="item.url"
+              class="footer-container-info-list-item">
+              <a
+                v-if="item.external"
+                :href="item.url"
+                target="_blank"
+                rel="noopener noreferrer"
+                class="is-flex is-align-items-center">
+                {{ item.name }}
+                <b-icon icon="external-link-alt" class="ml-1" size="is-small">
+                </b-icon>
+              </a>
+              <nuxt-link v-else :to="item.url">
+                {{ item.name }}
+              </nuxt-link>
+            </li>
+          </ul>
+        </div>
+      </div>
       <div class="footer-container-info is-flex is-flex-direction-column">
         <h4 class="subtitle is-5">KodaDot</h4>
         <div>
-          <ul class="footer-container-info-list">
+          <ul>
             <li
-              v-for="item in menu"
+              v-for="item in menuKodadot"
               :key="item.url"
               class="footer-container-info-list-item">
               <a
@@ -50,6 +75,7 @@
           </ul>
         </div>
       </div>
+
       <div class="footer-container-socials is-flex is-flex-direction-column">
         <h4 class="subtitle is-5">
           {{ $t('footer.join') }}
@@ -90,38 +116,54 @@ interface Menu {
 const { $i18n } = useNuxtApp()
 const { isDarkMode } = useTheme()
 
-const menu: Menu[] = [
-  {
-    name: $i18n.t('about'),
-    url: '/about',
-  },
+const menuMarketplace: Menu[] = [
   {
     name: $i18n.t('faq.page'),
     url: '/rmrk/faq',
   },
   {
-    name: $i18n.t('careers'),
-    url: '/jobs',
+    name: $i18n.t('documentation'),
+    url: 'https://docs.kodadot.xyz/',
+    external: true,
   },
   {
     name: $i18n.t('contribute'),
     url: '/contribute',
   },
+]
+
+const menuKodadot: Menu[] = [
+  {
+    name: $i18n.t('about'),
+    url: '/about',
+  },
+  {
+    name: $i18n.t('careers'),
+    url: '/jobs',
+  },
+  {
+    name: $i18n.t('merchshop'),
+    url: 'https://shop.kodadot.xyz',
+    external: true,
+  },
+
   {
     name: $i18n.t('referralProgram'),
     url: 'https://docs.kodadot.xyz/referral-program.html',
     external: true,
   },
+
   {
-    name: $i18n.t('documentation'),
-    url: 'https://docs.kodadot.xyz/',
+    name: $i18n.t('artist ambassador'),
+    url: 'https://docs.kodadot.xyz/artist-ambassador.html#conditions-%F0%9F%94%8D',
     external: true,
   },
   {
     name: $i18n.t('press kit'),
     url: 'https://github.com/kodadot/kodadot-presskit/tree/main/v3',
     external: true,
   },
+
   {
     name: $i18n.t('ambassador program'),
     url: 'https://docs.kodadot.xyz/ambassador-program/ambassador-intro.html#the-opportunity',

diff --git a/components/collection/HeroButtons.vue b/components/collection/HeroButtons.vue
@@ -34,7 +34,7 @@
           <NeoButton icon="share-alt" class="square-32 mr-3" />
           <template #items>
             <NeoDropdownItem
-              v-clipboard:copy="currentURL"
+              v-clipboard:copy="currentCollectionUrl"
               @click.native="toast(`${$i18n.t('toast.urlCopy')}`)">
               {{ $i18n.t('share.copyLink') }}
             </NeoDropdownItem>
@@ -46,7 +46,7 @@
                 tag="div"
                 network="twitter"
                 :hashtags="hashtags"
-                :url="currentURL"
+                :url="currentCollectionUrl"
                 :title="sharingLabel"
                 twitter-user="KodaDot">
                 {{ $i18n.t('share.twitter') }}
@@ -81,30 +81,42 @@
         </NeoDropdown>
       </div>
     </div>
-    <b-modal v-model="QRModalActive">
+    <NeoModal v-model="QRModalActive" @close="QRModalActive = false">
       <div class="card">
         <header class="card-header">
           <p class="card-header-title">{{ collection?.name }}</p>
         </header>
         <div class="card-content">
-          <QRCode :text="currentURL" color="#db2980" bg-color="#000" />
+          <QRCode
+            :text="currentCollectionUrl"
+            color="#db2980"
+            bg-color="#000" />
         </div>
       </div>
-    </b-modal>
+    </NeoModal>
   </div>
 </template>
 
 <script setup lang="ts">
-import { NeoButton, NeoDropdown, NeoDropdownItem } from '@kodadot1/brick'
+import {
+  NeoButton,
+  NeoDropdown,
+  NeoDropdownItem,
+  NeoModal,
+} from '@kodadot1/brick'
 import { isOwner as checkOwner } from '@/utils/account'
 import { useCollectionMinimal } from '@/components/collection/utils/useCollectionDetails'
 import useIdentity from '@/components/identity/utils/useIdentity'
 
 const route = useRoute()
 const { accountId } = useAuth()
+const { urlPrefix } = usePrefix()
 const { $i18n, $buefy } = useNuxtApp()
 const collectionId = computed(() => route.params.id)
-const currentURL = computed(() => window.location.href)
+const currentCollectionUrl = computed(
+  () =>
+    `${window.location.origin}/${urlPrefix.value}/collection/${collectionId.value}`
+)
 const { collection } = useCollectionMinimal({
   collectionId: collectionId.value,
 })

diff --git a/components/collection/activity/FilterFloatButton.vue b/components/collection/activity/FilterFloatButton.vue
@@ -0,0 +1,42 @@
+<template>
+  <div class="fixed-bottom-middle has-min-width">
+    <NeoButton expanded @click.native="openMobileFilters">
+      {{ $t('general.filters')
+      }}<span v-if="numOfActiveFilters">: {{ numOfActiveFilters }}</span>
+    </NeoButton>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { NeoButton } from '@kodadot1/brick'
+import { usePreferencesStore } from '@/stores/preferences'
+import useActiveRouterFilters from '@/composables/useActiveRouterFilters'
+
+const preferencesStore = usePreferencesStore()
+const activeFilters = useActiveRouterFilters()
+
+const numOfActiveFilters = computed(
+  () => Object.keys(activeFilters.value).length
+)
+const openMobileFilters = () => preferencesStore.setMobileFilterCollapse(true)
+</script>
+
+<style lang="scss" scoped>
+a.disabled {
+  opacity: 0.3;
+  cursor: not-allowed;
+  pointer-events: none;
+}
+
+.fixed-bottom-middle {
+  position: fixed;
+  bottom: 24px;
+  left: 50%;
+  transform: translateX(-50%);
+  z-index: 1;
+}
+
+.has-min-width {
+  min-width: 134px;
+}
+</style>
diff --git a/components/common/ConnectWallet/ConnectWalletModal.vue b/components/common/ConnectWallet/ConnectWalletModal.vue
@@ -81,6 +81,8 @@
 
 <script lang="ts" setup>
 import { SupportedWallets } from '@/utils/config/wallets'
+import { getRedirectToRmrk2HostnameWhitelist } from '@/utils/config/whitelist'
+import { toDefaultAddress } from '@/utils/account'
 import { BaseDotsamaWallet } from '@/utils/config/wallets/BaseDotsamaWallet'
 import { NeoButton, NeoIcon } from '@kodadot1/brick'
 import WalletMenuItem from '@/components/common/ConnectWallet/WalletMenuItem'
@@ -134,6 +136,13 @@ watch(account, (account) => {
   if (selectedWalletProvider.value) {
     localStorage.setItem('wallet', selectedWalletProvider.value.extensionName)
   }
+  if (
+    getRedirectToRmrk2HostnameWhitelist().includes(toDefaultAddress(account)) &&
+    !location.hostname.startsWith('rmrk2.') &&
+    !location.hostname.startsWith('rmrk.')
+  ) {
+    window.open(`${location.protocol}//rmrk2.${location.host}`, '_self')
+  }
 })
 
 const setUserAuthValue = () => {