Merge pull request #1192 from EthVM/develop

Release v2.1.5
EthVM · Jul 24, 2023 · 9153e55 · 9153e55 · mew-bot · Jul 24, 2023
2 parents 9495454 + 02d2d70
commit 9153e55
Show file tree

Hide file tree

Showing 94 changed files with 1,335 additions and 529 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,15 @@
+### Release v2.1.5
+
+### Feature
+- add change lang in settings [#1184](https://github.com/EthVM/EthVM/pull/1184)
+
+### Devop
+- refactor missing string, add translations [#1175](https://github.com/EthVM/EthVM/pull/1175)
+- add settings to mobile menu[#1184](https://github.com/EthVM/EthVM/pull/1184)
+- localize timeago helper [$1188](https://github.com/EthVM/EthVM/pull/1188)
+
+======================================================================
+
 ### Release v2.1.4
 
 ###  Fix

diff --git a/v2/package.json b/v2/package.json
@@ -1,6 +1,6 @@
 {
     "name": "client",
-    "version": "2.1.4",
+    "version": "2.1.5",
     "description": "",
     "main": "index.js",
     "private": true,

diff --git a/v2/src/App.vue b/v2/src/App.vue
@@ -11,6 +11,7 @@
             </v-container>
             <the-notifications />
         </v-main>
+        <the-promo />
         <the-app-footer />
     </v-app>
 </template>
@@ -20,18 +21,20 @@ import TheAppHeader from './core/components/TheAppHeader.vue'
 import TheAppFooter from '@core/components/TheAppFooter.vue'
 import TheAppNavigationDrawerVue from './core/components/TheAppNavigationDrawer.vue'
 import TheNotifications from './core/components/TheNotifications.vue'
+import ThePromo from '@core/components/ThePromo.vue'
 import { useStore } from '@/store'
 import { useGetLatestPricesQuery } from '@core/composables/CoinData/getLatestPrices.generated'
 import { useSetPortfolio } from './core/composables/Portfolio/useSetPortfolioBalance'
 import { computed, watch, reactive, onMounted } from 'vue'
 import { useRoute } from 'vue-router'
 import { ROUTE_NAME } from '@core/router/routesNames'
-import { useStorage } from '@vueuse/core'
 import { usePreferredColorScheme } from '@vueuse/core'
 import { useTheme } from 'vuetify/lib/framework.mjs'
 import { themes } from './core/plugins/vuetify'
 import { useNetwork } from './core/composables/Network/useNetwork'
 import { useState } from 'vue-gtag-next'
+import { useI18n } from 'vue-i18n'
+import { isOfTypeMes } from './translations/helpers'
 import configs from './configs'
 
 const store = useStore()
@@ -162,6 +165,8 @@ watch(
  * Set Default Theme
  * --------------------*/
 const theme = useTheme()
+const { locale } = useI18n()
+
 onMounted(() => {
     const preferredColor = usePreferredColorScheme()
     if (store.appTheme) {
@@ -173,6 +178,9 @@ onMounted(() => {
     if (isEnabled && configs.NODE_ENV !== 'development') {
         isEnabled.value = store.dataShare
     }
+    if (store.lang && isOfTypeMes(store.lang)) {
+        locale.value = store.lang
+    }
     //Clean old Storage
     if (localStorage.getItem('dataShare')) {
         localStorage.removeItem('dataShare')
@@ -186,6 +194,12 @@ onMounted(() => {
     if (localStorage.getItem('favToksData')) {
         localStorage.removeItem('favToksData')
     }
+    //Check Survey and hide after aug 18th:
+    const _now = Date.now()
+    const _end = 1692403200000
+    if (_now > _end) {
+        store.setPopup(false)
+    }
 })
 </script>
 <style lang="scss">

diff --git a/v2/src/core/components/AppCopyToClip.vue b/v2/src/core/components/AppCopyToClip.vue
@@ -9,7 +9,9 @@ import { reactive } from 'vue'
 import clipboardCopy from 'clipboard-copy'
 import AppBtnIcon from './AppBtnIcon.vue'
 import { useStore } from '@/store'
+import { useI18n } from 'vue-i18n'
 
+const { t } = useI18n()
 const props = defineProps({
     valueToCopy: {
         type: String,
@@ -45,7 +47,7 @@ const copy = async (): Promise<void> => {
     state.message = ''
     try {
         await clipboardCopy(props.valueToCopy)
-        state.message = props.customMessage === '' ? `Copied: ${props.valueToCopy}` : `${props.customMessage}`
+        state.message = props.customMessage === '' ? t('notify.copied', { result: props.valueToCopy }) : `${props.customMessage}`
         store.notify(state.message)
     } catch (err) {
         state.message = 'Error in copy'

diff --git a/v2/src/core/components/AppInput.vue b/v2/src/core/components/AppInput.vue
@@ -42,7 +42,9 @@
 
 <script setup lang="ts">
 import { defineProps, defineEmits, reactive, onBeforeUnmount, watch, computed } from 'vue'
+import { useI18n } from 'vue-i18n'
 
+const { t } = useI18n()
 interface ComponentProps {
     isLoading?: boolean
     hasError?: boolean
@@ -116,7 +118,7 @@ const showRequired = computed(() => {
 })
 
 const message = computed(() => {
-    return showRequired.value ? 'Required' : props.errorMessage
+    return showRequired.value ? t('message.required') : props.errorMessage
 })
 
 /**

diff --git a/v2/src/core/components/AppUploadFile.vue b/v2/src/core/components/AppUploadFile.vue
@@ -7,8 +7,10 @@
             @drop="drop"
             @click="openOnClick"
         >
-            <p class="px-5 px-sm-10 mb-3 text-center text-info mb-5">Drag and drop your ethVM-adrs-names.json file or click to browse</p>
-            <app-btn text="Select File" min-width="160" @click="openOnClick"></app-btn>
+            <p class="px-5 px-sm-10 mb-3 text-center text-info mb-5">
+                {{ $t('settings.import.dragAndDrop') }}
+            </p>
+            <app-btn :text="$t('settings.import.selectFile')" min-width="160" @click="openOnClick"></app-btn>
         </div>
 
         <div style="min-height: 48px">

diff --git a/v2/src/core/components/TheAppHeader.vue b/v2/src/core/components/TheAppHeader.vue
@@ -12,7 +12,9 @@
             </div>
             <v-spacer />
             <v-scroll-y-reverse-transition hide-on-leave>
-                <p v-if="gasPriceLoaded" key="gas-transition"><span class="text-info">GAS</span> {{ gasPrice }} Gwei</p>
+                <p v-if="gasPriceLoaded" key="gas-transition">
+                    <span class="text-info">{{ $t('coreMenu.gas') }}</span> {{ gasPrice }} Gwei
+                </p>
             </v-scroll-y-reverse-transition>
         </v-system-bar>
         <v-app-bar app flat :color="background" :class="['py-0 px-0 py-sm-2']" :height="xs ? '64' : '114'">
@@ -74,7 +76,7 @@
                         <div v-if="loadingMarketInfo" style="height: 20px; width: 153px"></div>
                     </div>
                     <v-scroll-y-reverse-transition hide-on-leave>
-                        <p v-if="gasPriceLoaded" key="gas-transition">Gas {{ gasPrice }} Gwei</p>
+                        <p v-if="gasPriceLoaded" key="gas-transition">{{ $t('coreMenu.gas') }} {{ gasPrice }} Gwei</p>
                     </v-scroll-y-reverse-transition>
                     <v-spacer />
                     <app-change-network />

diff --git a/v2/src/core/components/TheAppNavigationDrawer.vue b/v2/src/core/components/TheAppNavigationDrawer.vue
@@ -10,6 +10,7 @@
 
         <v-list bg-color="primary" lines="one">
             <template v-for="item in navItems" :key="item.header.text">
+                <v-divider v-if="item.header.text === $t('home.footer.settings')"></v-divider>
                 <v-list-item
                     v-if="!item.links"
                     :title="item.header.text"

diff --git a/v2/src/core/components/TheNotifications.vue b/v2/src/core/components/TheNotifications.vue
@@ -13,14 +13,16 @@
     >
         <div v-if="state.notification" class="text-body-1 text-break-new-line">
             <!-- TYPE: DELETE ADDRESS -->
-            <p v-if="state.notification._type === TYPES.DELETE_ADR">"{{ state.notification.name }}" was deleted from portfolio</p>
+            <p v-if="state.notification._type === TYPES.DELETE_ADR">{{ $t('notify.adrDeleted', { address: state.notification.name }) }}</p>
             <!-- TYPE: PLAIN -->
             <p v-if="state.notification._type === TYPES.PLAIN" class="d-flex flex-nowrap">
                 {{ state.notification.text }}
             </p>
         </div>
         <template v-if="state.notification && state.notification._type === TYPES.DELETE_ADR" #actions>
-            <v-btn color="secondary" variant="text" rounded="pill" @click="restoreAddress(state.notification.hash, state.notification.name)"> Undo </v-btn>
+            <v-btn color="secondary" variant="text" rounded="pill" @click="restoreAddress(state.notification.hash, state.notification.name)">
+                {{ $t('notify.undo') }}
+            </v-btn>
         </template>
     </v-snackbar>
 </template>

diff --git a/v2/src/core/components/ThePromo.vue b/v2/src/core/components/ThePromo.vue
@@ -0,0 +1,103 @@
+<template>
+    <v-snackbar
+        v-if="store.showPopUp && !store.notification"
+        v-model="state.showPopup"
+        location="bottom right"
+        color="snackbar"
+        content-class="break-string"
+        :timeout="-1"
+        transition="slide-y-reverse-transition"
+        mode="in-out"
+        rounded="lg"
+        :close-on-back="false"
+    >
+        <!--
+            Change below content to display different message in case of promo
+        -->
+        <v-row align="center" justify="start" class="pa-4 pa-sm-6 flex-sm-nowrap ma-n3" no-gutters>
+            <v-col cols="10" sm="auto" order="1" class="flex-shrink-1 flex-grow-0">
+                <p class="text-body-1">Help us make an awesome user friendly product</p>
+            </v-col>
+            <v-col cols="auto" order="3" orde-sm="2">
+                <v-btn
+                    text="Take a quick survey"
+                    min-width="186"
+                    height="40px"
+                    color="secondary"
+                    rounded="pill"
+                    variant="flat"
+                    class="mt-5 mt-sm-0 ml-sm-5 mr-sm-3"
+                    href="https://mewwallet.typeform.com/ethvm"
+                    target="_blank"
+                ></v-btn>
+            </v-col>
+            <v-col cols="2" sm="auto" order="2" order-sm="3" class="d-flex align-center justify-end d-sm-block">
+                <v-btn icon height="34px" width="34px" color="snackbar" variant="flat" @click.stop="closePopUp()">
+                    <v-icon icon="close" class="white--text" size="22px"></v-icon>
+                </v-btn>
+            </v-col>
+        </v-row>
+    </v-snackbar>
+</template>
+
+<script setup lang="ts">
+import { reactive, watch, onMounted, onBeforeUnmount } from 'vue'
+import { useStore } from '@/store'
+import { useTimeoutFn } from '@vueuse/core'
+
+const store = useStore()
+
+interface StateType {
+    showPopup: boolean
+}
+const state = reactive<StateType>({
+    showPopup: false
+})
+
+const { start, stop } = useTimeoutFn(() => {
+    state.showPopup = true
+}, 5000)
+
+stop()
+
+watch(
+    () => store.showPopUp,
+    newVal => {
+        if (newVal === undefined) {
+            state.showPopup = false
+            stop()
+        } else {
+            if (store.showPopUp) {
+                start()
+            } else {
+                stop()
+            }
+        }
+    }
+)
+
+/**
+ * Shows promo popup on mounted
+ * NOTE: promo will be hidden while store notification is active
+ */
+onMounted(() => {
+    if (store.showPopUp) {
+        start()
+    }
+})
+
+onBeforeUnmount(() => {
+    stop()
+})
+
+const closePopUp = () => {
+    store.setPopup(false)
+    state.showPopup = false
+}
+</script>
+<style lang="scss">
+.v-snackbar__wrapper {
+    border-bottom: 3px solid rgb(var(--v-theme-secondary));
+    min-width: 300px;
+}
+</style>