From 03d7f63183165c3bb72f70fbaf6f8c05199880bb Mon Sep 17 00:00:00 2001
From: Raju Udava <86527202+dstala@users.noreply.github.com>
Date: Tue, 1 Feb 2022 14:20:29 +0530
Subject: [PATCH] refactor: i18n changes (header/ spreadsheet menu options)

Signed-off-by: Raju Udava <86527202+dstala@users.noreply.github.com>
---
 .../nc-gui/components/ProjectTreeView.vue     |  4 +--
 .../spreadsheet/components/columnFilter.vue   |  8 +++--
 .../components/columnFilterMenu.vue           |  8 +++--
 .../spreadsheet/components/fieldsMenu.vue     | 14 ++++++---
 .../spreadsheet/components/moreActions.vue    |  9 ++++--
 .../spreadsheet/components/shareViewMenu.vue  |  3 +-
 .../spreadsheet/components/sortListMenu.vue   |  6 ++--
 packages/nc-gui/components/sponsorMini.vue    | 10 +++---
 packages/nc-gui/layouts/default.vue           | 31 ++++++++++++-------
 9 files changed, 61 insertions(+), 32 deletions(-)

diff --git a/packages/nc-gui/components/ProjectTreeView.vue b/packages/nc-gui/components/ProjectTreeView.vue
index f0ca6bc702..0bbb76b605 100644
--- a/packages/nc-gui/components/ProjectTreeView.vue
+++ b/packages/nc-gui/components/ProjectTreeView.vue
@@ -162,7 +162,7 @@
                       <v-tooltip v-if="!isNonAdminAccessAllowed(item)" top>
                         <template #activator="{ on }">
                           <span v-if="item.type === 'tableDir'" class="body-2 font-weight-medium" v-on="on">
-                            Tables<template v-if="item.children && item.children.length"> ({{
+                            {{ $t('objects.tables') }}<template v-if="item.children && item.children.length"> ({{
                               item.children.filter(child => !search || child.name.toLowerCase().includes(search.toLowerCase())).length
                             }})</template></span>
                           <span v-else class="body-2 font-weight-medium" v-on="on">
@@ -174,7 +174,7 @@
                         v-else
                       >
                         <span v-if="item.type === 'tableDir'" class="body-2 font-weight-medium">
-                          Tables<template v-if="item.children && item.children.length"> ({{
+                          {{ $t('objects.tables') }}<template v-if="item.children && item.children.length"> ({{
                             item.children.filter(child => !search || child.name.toLowerCase().includes(search.toLowerCase())).length
                           }})</template></span>
                         <span v-else class="caption font-weight-regular">
diff --git a/packages/nc-gui/components/project/spreadsheet/components/columnFilter.vue b/packages/nc-gui/components/project/spreadsheet/components/columnFilter.vue
index eccd50df2c..81762ad4d2 100644
--- a/packages/nc-gui/components/project/spreadsheet/components/columnFilter.vue
+++ b/packages/nc-gui/components/project/spreadsheet/components/columnFilter.vue
@@ -20,7 +20,10 @@
           v-if="!i"
           :key="i + '_2'"
           class="caption d-flex align-center"
-        >where</span>
+        >
+        <!-- where -->
+        {{ $t('labels.where') }}
+        </span>
 
         <v-select
           v-else
@@ -126,7 +129,8 @@
       <v-icon small color="grey">
         mdi-plus
       </v-icon>
-      Add Filter
+      <!-- Add Filter -->
+      {{ $t('activity.addFilter') }}
     </v-btn>
     <slot />
   </div>
diff --git a/packages/nc-gui/components/project/spreadsheet/components/columnFilterMenu.vue b/packages/nc-gui/components/project/spreadsheet/components/columnFilterMenu.vue
index eda3abd5c8..2b41cd838e 100644
--- a/packages/nc-gui/components/project/spreadsheet/components/columnFilterMenu.vue
+++ b/packages/nc-gui/components/project/spreadsheet/components/columnFilterMenu.vue
@@ -19,7 +19,8 @@
           <v-icon small class="mr-1" color="grey  darken-3">
             mdi-filter-outline
           </v-icon>
-          Filter
+          <!-- Filter -->
+          {{ $t('activity.filter') }}
           <v-icon small color="#777">
             mdi-menu-down
           </v-icon>
@@ -38,7 +39,10 @@
           color="grey"
         >
           <template #label>
-            <span class="grey--text caption">Auto apply</span>
+            <span class="grey--text caption">
+              {{ $t('msg.info.filterAutoApply') }}
+              <!-- Auto apply -->
+              </span>
           </template>
         </v-checkbox>
 
diff --git a/packages/nc-gui/components/project/spreadsheet/components/fieldsMenu.vue b/packages/nc-gui/components/project/spreadsheet/components/fieldsMenu.vue
index d0288ac9c1..6970b1bd15 100644
--- a/packages/nc-gui/components/project/spreadsheet/components/fieldsMenu.vue
+++ b/packages/nc-gui/components/project/spreadsheet/components/fieldsMenu.vue
@@ -19,7 +19,8 @@
           <v-icon small class="mr-1" color="#777">
             mdi-eye-off-outline
           </v-icon>
-          Fields
+          <!-- Fields -->
+          {{ $t('objects.fields') }}
           <v-icon small color="#777">
             mdi-menu-down
           </v-icon>
@@ -137,16 +138,21 @@
           @click.stop
         >
           <template #label>
-            <span class="caption">Show System Fields</span>
+            <span class="caption">
+              <!-- Show System Fields -->
+              {{ $t('activity.showSystemFields') }}
+              </span>
           </template>
         </v-checkbox>
       </v-list-item>
       <v-list-item dense class="mt-2 list-btn mb-3">
         <v-btn small class="elevation-0 grey--text" @click.stop="showAll">
-          Show All
+          <!-- Show All -->
+          {{ $t('general.showAll') }}
         </v-btn>
         <v-btn small class="elevation-0 grey--text" @click.stop="hideAll">
-          Hide All
+          <!-- Hide All -->
+          {{ $t('general.hideAll') }}
         </v-btn>
       </v-list-item>
     </v-list>
diff --git a/packages/nc-gui/components/project/spreadsheet/components/moreActions.vue b/packages/nc-gui/components/project/spreadsheet/components/moreActions.vue
index ddff0cff23..84329f6a44 100644
--- a/packages/nc-gui/components/project/spreadsheet/components/moreActions.vue
+++ b/packages/nc-gui/components/project/spreadsheet/components/moreActions.vue
@@ -34,7 +34,8 @@
               mdi-download-outline
             </v-icon>
             <span class="caption">
-              Download as CSV
+              <!-- Download as CSV -->
+              {{ $t('activity.downloadCSV') }}
             </span>
           </v-list-item-title>
         </v-list-item>
@@ -48,7 +49,8 @@
               mdi-upload-outline
             </v-icon>
             <span class="caption ">
-              Upload CSV
+              <!-- Upload CSV -->
+              {{ $t('activity.uploadCSV') }}
             </span>
 
             <span class="caption grey--text">(<x-icon small color="grey lighten-2">
@@ -66,7 +68,8 @@
               mdi-view-list-outline
             </v-icon>
             <span class="caption ">
-              Shared View List
+              <!-- Shared View List -->
+              {{ $t('activity.listSharedView') }}
             </span>
           </v-list-item-title>
         </v-list-item>  <v-list-item
diff --git a/packages/nc-gui/components/project/spreadsheet/components/shareViewMenu.vue b/packages/nc-gui/components/project/spreadsheet/components/shareViewMenu.vue
index 12ab816f42..7f2e97e715 100644
--- a/packages/nc-gui/components/project/spreadsheet/components/shareViewMenu.vue
+++ b/packages/nc-gui/components/project/spreadsheet/components/shareViewMenu.vue
@@ -17,7 +17,8 @@
       <v-icon size="13" class="mr-1" color="#777">
         mdi-open-in-new
       </v-icon>
-      Share View
+      <!-- Share View -->
+      {{ $t('activity.shareView') }}
     </v-btn>
     <!--      </template>
 
diff --git a/packages/nc-gui/components/project/spreadsheet/components/sortListMenu.vue b/packages/nc-gui/components/project/spreadsheet/components/sortListMenu.vue
index d297f7c4a1..38e44f6357 100644
--- a/packages/nc-gui/components/project/spreadsheet/components/sortListMenu.vue
+++ b/packages/nc-gui/components/project/spreadsheet/components/sortListMenu.vue
@@ -19,7 +19,8 @@
           <v-icon small class="mr-1" color="#777">
             mdi-sort
           </v-icon>
-          Sort
+          <!-- Sort -->
+          {{ $t('activity.sort') }}
           <v-icon small color="#777">
             mdi-menu-down
           </v-icon>
@@ -71,7 +72,8 @@
         <v-icon small color="grey">
           mdi-plus
         </v-icon>
-        Add Sort Option
+        <!-- Add Sort Option -->
+        {{ $t('activity.addSort') }}
       </v-btn>
     </div>
   </v-menu>
diff --git a/packages/nc-gui/components/sponsorMini.vue b/packages/nc-gui/components/sponsorMini.vue
index cd9e56b66e..7532cd81e2 100644
--- a/packages/nc-gui/components/sponsorMini.vue
+++ b/packages/nc-gui/components/sponsorMini.vue
@@ -14,14 +14,16 @@
         />
       </template>
     </v-img>
+    <!-- You can help us! -->
     <v-card-title v-if="!nav" class="pb-2" :class="{'body-2 justify-center mt-n2' : nav}">
-      You can help us
+      {{ $t('msg.info.sponsor.header') }}
     </v-card-title>
     <v-card-text v-if="!nav" class="pb-0">
       <p class="caption text-left body-1 textColor--text text--lighten-1">
         <template>
-          We are a tiny team working full time to make NocoDB open source. We believe a tool like NocoDB should be
-          available freely to every problem solver on internet.
+          <!-- We are a tiny team working full time to make NocoDB open source. We believe a tool like NocoDB should be
+          available freely to every problem solver on internet. -->
+          {{ $t('msg.info.sponsor.message') }}
         </template>
       </p>
     </v-card-text>
@@ -30,7 +32,7 @@
         <v-icon small color="red" class="mr-2">
           mdi-cards-heart
         </v-icon>
-        Sponsor Us
+        {{ $t('activity.sponsorUs') }}
       </v-btn>
     </v-card-actions>
   </v-card>
diff --git a/packages/nc-gui/layouts/default.vue b/packages/nc-gui/layouts/default.vue
index a970fc6557..8fbcb8d2f0 100644
--- a/packages/nc-gui/layouts/default.vue
+++ b/packages/nc-gui/layouts/default.vue
@@ -22,7 +22,8 @@
               ><v-icon color="primary">alpha-c-circle </v-icon> -->
             </v-btn>
           </template>
-          Home
+          <!-- Home -->
+          {{ $t('general.home') }}
           <span
             class="caption ml-1 font-weight-light"
           >(v{{
@@ -67,7 +68,8 @@
               </template>
 
             </v-toolbar-items>-->
-      <span v-show="$nuxt.$loading.show" class="caption grey--text ml-3">Loading <v-icon small color="grey">mdi-spin mdi-loading</v-icon></span>
+            <!-- loading -->
+      <span v-show="$nuxt.$loading.show" class="caption grey--text ml-3">{{ $t('general.loading') }} <v-icon small color="grey">mdi-spin mdi-loading</v-icon></span>
 
       <span
         v-shortkey="[ 'ctrl','shift', 'd']"
@@ -121,7 +123,8 @@
               <v-icon small class="mr-1">
                 mdi-account-supervisor-outline
               </v-icon>
-              Share
+              <!-- Share -->
+              {{ $t('activity.share') }}
             </x-btn>
           </div>
 
@@ -236,7 +239,9 @@
               </v-icon>
             </template>
             <h3 class="pa-3">
-              {{ $vuetify.theme.dark ? 'It does come in Black (^⇧B)' : 'Does it come in Black ? (^⇧B)' }}
+              <!-- "dark": "It does come in Black (^⇧B)",
+              "light": "Does it come in Black ? (^⇧B)" -->
+              {{ $vuetify.theme.dark ? $t('tooltip.theme.dark') :  $t('tooltip.theme.light')  }}
               <i />
             </h3>
           </v-tooltip>
@@ -339,17 +344,19 @@
 
               <v-divider />
 
+              <!-- Copy Auth Token -->
+              <!-- "Auth token copied to clipboard" -->
               <v-list-item
                 v-if="isDashboard"
                 v-clipboard="$store.state.users.token"
                 dense
-                @click.stop="$toast.success('Auth token copied to clipboard').goAway(3000)"
+                @click.stop="$toast.success($t('msg.toast.authToken')).goAway(3000)"
               >
                 <v-list-item-title>
                   <v-icon key="terminal-dash" small>
                     mdi-content-copy
                   </v-icon>&nbsp;
-                  <span class="font-weight-regular caption">Copy auth token</span>
+                  <span class="font-weight-regular caption">{{ $t('activity.account.authToken') }}</span>
                 </v-list-item-title>
               </v-list-item>
 
@@ -374,7 +381,7 @@
                     {{ isGql ? 'mdi-graphql' : 'mdi-code-json' }}
                   </v-icon>&nbsp;
                   <span class="font-weight-regular caption">
-                    {{ isGql ? 'GraphQL APIs' : 'Swagger APIs Doc' }}</span>
+                    {{ isGql ? 'GraphQL APIs' : 'Swagger APIs' }}</span>
                 </v-list-item-title>
               </v-list-item>
               <v-divider />
@@ -382,7 +389,7 @@
                 <v-list-item-title>
                   <v-icon small>
                     mdi-information-outline
-                  </v-icon>&nbsp; <span class="font-weight-regular caption">Copy Project info</span>
+                  </v-icon>&nbsp; <span class="font-weight-regular caption">{{ $t('activity.account.projInfo') }}</span>
                 </v-list-item-title>
               </v-list-item>
 
@@ -391,7 +398,7 @@
                   <v-icon key="terminal-dash" small>
                     mdi-palette
                   </v-icon>&nbsp;
-                  <span class="font-weight-regular caption">Themes</span>
+                  <span class="font-weight-regular caption">{{ $t('activity.account.themes') }}</span>
                 </v-list-item-title>
               </v-list-item>
 
@@ -401,7 +408,7 @@
                 <v-list-item-title>
                   <v-icon small>
                     mdi-logout
-                  </v-icon>&nbsp; <span class="font-weight-regular caption">Sign Out</span>
+                  </v-icon>&nbsp; <span class="font-weight-regular caption">{{ $t('general.signOut') }}</span>
                 </v-list-item-title>
               </v-list-item>
             </template>
@@ -422,14 +429,14 @@
                   mdi-account-plus-outline
                 </v-icon> &nbsp; <span
                   class="font-weight-regular caption"
-                >Sign Up</span>
+                >{{ $t('general.signUp') }}</span>
               </v-list-item-title>
             </v-list-item>
             <v-list-item v-if="!user && !isThisMobile" dense to="/user/authentication/signin">
               <v-list-item-title>
                 <v-icon small>
                   mdi-login
-                </v-icon> &nbsp; <span class="font-weight-regular caption">Login</span>
+                </v-icon> &nbsp; <span class="font-weight-regular caption">{{ $t('general.signIn') }}</span>
               </v-list-item-title>
             </v-list-item>
             <!--            <v-list-item @click="openPricingPage">-->