Release 1.26.1 (sora-xor#1252)

* Update package.json * Add vote on survey and new banner (sora-xor#1251) * Add new banner * Add vote on survey & move SORA mobile link * Add survey image --------- Co-authored-by: Stefan Popov <[email protected]> --------- Co-authored-by: Stefan Popov <[email protected]>
soramitsu · Dec 19, 2023 · 985089b · 985089b
1 parent cbfc25c
commit 985089b
Show file tree

Hide file tree

Showing 6 changed files with 70 additions and 23 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "polkaswap-exchange-web",
-  "version": "1.26.0",
+  "version": "1.26.1",
   "repository": {
     "type": "git",
     "url": "https://github.com/sora-xor/polkaswap-exchange-web.git"

diff --git a/public/marketing.json b/public/marketing.json
@@ -1,4 +1,9 @@
 [
+  {
+    "title": "ROADMAP 2024 SURVEY",
+    "img": "/marketing/survey.png",
+    "link": "https://form.typeform.com/to/Mb6p2Kpy"
+  },
   {
     "title": "SORA POLKADOT CROWDLOAN",
     "img": "/marketing/crowdloan.png",

diff --git a/public/marketing/survey.png b/public/marketing/survey.png
diff --git a/src/App.vue b/src/App.vue
@@ -6,7 +6,7 @@
         :visible="menuVisibility"
         :on-select="goTo"
         :is-about-page-opened="isAboutPage"
-        @open-download-dialog="openDownloadDialog"
+        @open-product-dialog="openProductDialog"
         @click.native="handleAppMenuClick"
       >
         <app-logo-button slot="head" class="app-logo--menu" :theme="libraryTheme" @click="goToSwap" />
@@ -23,7 +23,7 @@
     <app-footer />
     <referrals-confirm-invite-user :visible.sync="showConfirmInviteUser" />
     <bridge-transfer-notification />
-    <app-mobile-popup :visible.sync="showMobilePopup" />
+    <app-mobile-popup :visible.sync="showSoraMobilePopup" />
     <app-browser-notifs-enable-dialog :visible.sync="showBrowserNotifPopup" @set-dark-page="setDarkPage" />
     <app-browser-notifs-blocked-dialog :visible.sync="showBrowserNotifBlockedPopup" />
     <notification-enabling-page v-if="showNotifsDarkPage">
@@ -88,9 +88,10 @@ import type Theme from '@soramitsu/soramitsu-js-ui/lib/types/Theme';
   },
 })
 export default class App extends Mixins(mixins.TransactionMixin, NodeErrorMixin) {
+  /** Product-based class fields should be like show${product}Popup */
+  showSoraMobilePopup = false;
   menuVisibility = false;
   showConfirmInviteUser = false;
-  showMobilePopup = false;
   showNotifsDarkPage = false;
   responsiveClass = BreakpointClass.LargeDesktop;
 
@@ -354,8 +355,12 @@ export default class App extends Mixins(mixins.TransactionMixin, NodeErrorMixin)
     }
   }
 
-  openDownloadDialog(): void {
-    this.showMobilePopup = true;
+  openProductDialog(product: string): void {
+    // Product-based class fields should be like show${product}Popup (like showSoraMobilePopup)
+    const fieldName = `show${product[0].toUpperCase() + product.slice(1)}Popup`;
+    if (typeof this[fieldName] === 'boolean') {
+      this[fieldName] = true;
+    }
   }
 
   async beforeDestroy(): Promise<void> {

diff --git a/src/components/App/Menu/AppInfoPopper.vue b/src/components/App/Menu/AppInfoPopper.vue
@@ -1,5 +1,11 @@
 <template>
-  <el-popover :visible-arrow="false" placement="top-start" popper-class="app-info-popper" trigger="click">
+  <el-popover
+    ref="infoPopup"
+    :visible-arrow="false"
+    placement="top-start"
+    popper-class="app-info-popper"
+    trigger="click"
+  >
     <div class="app-info">
       <div>
         <a
@@ -15,6 +21,24 @@
         </a>
       </div>
       <s-divider />
+      <template v-for="product in products">
+        <a
+          v-if="product.href"
+          :key="product.title"
+          class="app-info-link app-info-link--product"
+          target="_blank"
+          rel="nofollow noopener"
+          :href="product.href"
+        >
+          <s-icon v-if="product.icon" :name="product.icon" size="20" />
+          <span>{{ product.title }}</span>
+        </a>
+        <div v-else :key="product.title" class="app-info-link app-info-link--product" @click="product.action">
+          <s-icon v-if="product.icon" :name="product.icon" size="20" />
+          <span>{{ product.title }}</span>
+        </div>
+      </template>
+      <s-divider />
       <div>
         <a
           v-for="(link, index) in sortedTextLinks"
@@ -40,7 +64,7 @@
 
 <script lang="ts">
 import { api, mixins } from '@soramitsu/soraneo-wallet-web';
-import { Component, Mixins } from 'vue-property-decorator';
+import { Component, Mixins, Ref } from 'vue-property-decorator';
 
 import TranslationMixin from '@/components/mixins/TranslationMixin';
 import { app, SocialNetworkLinks, Links } from '@/consts';
@@ -50,6 +74,8 @@ export default class AppInfoPopper extends Mixins(TranslationMixin, mixins.Loadi
   readonly SocialNetworkLinks = SocialNetworkLinks;
   readonly app = app;
 
+  @Ref('infoPopup') private readonly infoPopup!: any;
+
   specVersion: Nullable<number> = null;
 
   created(): void {
@@ -58,6 +84,21 @@ export default class AppInfoPopper extends Mixins(TranslationMixin, mixins.Loadi
     });
   }
 
+  private showSoraMobileDialog(): void {
+    this.$emit('open-product-dialog', 'soraMobile');
+    this.infoPopup?.doClose?.();
+  }
+
+  get products(): Array<{ title: string; icon?: string; href?: string; action?: () => void }> {
+    return [
+      {
+        title: this.t('mobilePopup.sideMenu'),
+        icon: 'symbols-24',
+        action: this.showSoraMobileDialog,
+      },
+    ];
+  }
+
   get textLinks(): Array<{ title: string; href: string }> {
     return [
       {
@@ -148,10 +189,15 @@ $social-link-min-height: 34px;
       }
     }
 
-    &--social {
+    &--social,
+    &--product {
       min-height: $social-link-min-height;
     }
 
+    &--product:hover {
+      cursor: pointer;
+    }
+
     &--text {
       & + & {
         margin-top: $basic-spacing-small;

diff --git a/src/components/App/Menu/AppMenu.vue b/src/components/App/Menu/AppMenu.vue
@@ -49,25 +49,16 @@
           active-hover-color="transparent"
         >
           <app-sidebar-item-content
-            v-if="false"
             v-button
             icon="star-16"
             title="Vote on Survey!"
-            href="https://soramitsu.typeform.com/Polkaswap"
+            href="https://form.typeform.com/to/Mb6p2Kpy"
             tag="a"
             target="_blank"
             rel="nofollow noopener"
             class="el-menu-item menu-item--small marketing"
           />
-          <app-sidebar-item-content
-            v-button
-            icon="symbols-24"
-            :title="t('mobilePopup.sideMenu')"
-            class="el-menu-item menu-item--small"
-            tabindex="0"
-            @click.native="openSoraDownloadDialog"
-          />
-          <app-info-popper>
+          <app-info-popper @open-product-dialog="openProductDialog">
             <app-sidebar-item-content
               v-button
               icon="info-16"
@@ -162,8 +153,8 @@ export default class AppMenu extends Mixins(TranslationMixin) {
     return currentName as string;
   }
 
-  openSoraDownloadDialog(): void {
-    this.$emit('open-download-dialog');
+  openProductDialog(product: string): void {
+    this.$emit('open-product-dialog', product);
   }
 
   /** To ignore left click */
@@ -320,7 +311,7 @@ export default class AppMenu extends Mixins(TranslationMixin) {
     display: flex;
     flex: 1;
     flex-flow: column nowrap;
-    padding: $inner-spacing-small 0;
+    padding-top: $inner-spacing-small;
     border-right: none;
 
     &-menu {