From adfb4300d40e6675b22f80d2602fc0a4944b5e8f Mon Sep 17 00:00:00 2001
From: Wing-Kam Wong <wingkwong.code@gmail.com>
Date: Fri, 23 Sep 2022 19:40:15 +0800
Subject: [PATCH] feat(nc-gui): add nc version

---
 .../nc-gui/components/general/MiniSidebar.vue    |  9 +++++++--
 packages/nc-gui/layouts/base.vue                 |  9 +++++++--
 packages/nc-gui/layouts/shared-view.vue          |  9 +++++++--
 .../pages/[projectType]/[projectId]/index.vue    | 16 +++++++++++++---
 4 files changed, 34 insertions(+), 9 deletions(-)

diff --git a/packages/nc-gui/components/general/MiniSidebar.vue b/packages/nc-gui/components/general/MiniSidebar.vue
index 6fb1056be5..c90c271cc5 100644
--- a/packages/nc-gui/components/general/MiniSidebar.vue
+++ b/packages/nc-gui/components/general/MiniSidebar.vue
@@ -2,7 +2,7 @@
 import { navigateTo } from '#app'
 import { computed, useGlobal, useProject, useRoute, useSidebar } from '#imports'
 
-const { signOut, signedIn, user } = useGlobal()
+const { signOut, signedIn, user, currentVersion } = useGlobal()
 
 const { isOpen } = useSidebar('nc-mini-sidebar', { isOpen: true })
 
@@ -30,7 +30,12 @@ const logout = () => {
   >
     <a-dropdown placement="bottom" :trigger="['click']" overlay-class-name="nc-dropdown">
       <div class="transition-all duration-200 p-2 cursor-pointer transform hover:scale-105 nc-noco-brand-icon">
-        <img width="35" alt="NocoDB" src="~/assets/img/icons/512x512-trans.png" />
+        <a-tooltip placement="bottom">
+          <template #title>
+            {{ currentVersion }}
+          </template>
+          <img width="35" alt="NocoDB" src="~/assets/img/icons/512x512-trans.png" />
+        </a-tooltip>
       </div>
 
       <template v-if="signedIn" #overlay>
diff --git a/packages/nc-gui/layouts/base.vue b/packages/nc-gui/layouts/base.vue
index df5e5cc39c..dab22ba952 100644
--- a/packages/nc-gui/layouts/base.vue
+++ b/packages/nc-gui/layouts/base.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import { computed, navigateTo, ref, useGlobal, useNuxtApp, useProject, useRoute } from '#imports'
 
-const { signOut, signedIn, isLoading, user } = useGlobal()
+const { signOut, signedIn, isLoading, user, currentVersion } = useGlobal()
 
 const { isSharedBase } = useProject()
 
@@ -45,7 +45,12 @@ hooks.hook('page:finish', () => {
           class="transition-all duration-200 p-2 cursor-pointer transform hover:scale-105 nc-noco-brand-icon"
           @click="navigateTo('/')"
         >
-          <img width="35" alt="NocoDB" src="~/assets/img/icons/512x512-trans.png" />
+          <a-tooltip placement="bottom">
+            <template #title>
+              {{ currentVersion }}
+            </template>
+            <img width="35" alt="NocoDB" src="~/assets/img/icons/512x512-trans.png" />
+          </a-tooltip>
         </div>
 
         <div class="!text-white flex justify-center">
diff --git a/packages/nc-gui/layouts/shared-view.vue b/packages/nc-gui/layouts/shared-view.vue
index 1a21ea1c7a..c510bc8325 100644
--- a/packages/nc-gui/layouts/shared-view.vue
+++ b/packages/nc-gui/layouts/shared-view.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
 import { navigateTo } from '#app'
-const { isLoading } = useGlobal()
+const { isLoading, currentVersion } = useGlobal()
 const { sharedView } = useSharedView()
 </script>
 
@@ -15,7 +15,12 @@ export default {
     <a-layout class="!flex-col bg-white">
       <a-layout-header class="flex !bg-primary items-center text-white pl-3 pr-4 shadow-lg">
         <div class="transition-all duration-200 p-2 cursor-pointer transform hover:scale-105" @click="navigateTo('/')">
-          <img width="35" alt="NocoDB" src="~/assets/img/icons/512x512-trans.png" />
+          <a-tooltip placement="bottom">
+            <template #title>
+              {{ currentVersion }}
+            </template>
+            <img width="35" alt="NocoDB" src="~/assets/img/icons/512x512-trans.png" />
+          </a-tooltip>
         </div>
         <div>
           <div class="flex justify-center items-center">
diff --git a/packages/nc-gui/pages/[projectType]/[projectId]/index.vue b/packages/nc-gui/pages/[projectType]/[projectId]/index.vue
index e73dc15bed..d7332bbf31 100644
--- a/packages/nc-gui/pages/[projectType]/[projectId]/index.vue
+++ b/packages/nc-gui/pages/[projectType]/[projectId]/index.vue
@@ -34,7 +34,7 @@ const route = useRoute()
 
 const router = useRouter()
 
-const { appInfo, token, signOut, signedIn, user } = useGlobal()
+const { appInfo, token, signOut, signedIn, user, currentVersion } = useGlobal()
 
 const { project, isSharedBase, loadProjectMetaInfo, projectMetaInfo, saveTheme, loadProject, reset } = useProject()
 
@@ -186,7 +186,12 @@ onBeforeUnmount(reset)
             class="w-[40px] min-w-[40px] transition-all duration-200 p-1 cursor-pointer transform hover:scale-105 nc-noco-brand-icon"
             @click="navigateTo('/')"
           >
-            <img alt="NocoDB" src="~/assets/img/icons/512x512-trans.png" />
+            <a-tooltip placement="bottom">
+              <template #title>
+                {{ currentVersion }}
+              </template>
+              <img width="35" alt="NocoDB" src="~/assets/img/icons/512x512-trans.png" />
+            </a-tooltip>
           </div>
 
           <a
@@ -195,7 +200,12 @@ onBeforeUnmount(reset)
             href="https://github.com/nocodb/nocodb"
             target="_blank"
           >
-            <img alt="NocoDB" src="~/assets/img/icons/512x512-trans.png" />
+            <a-tooltip placement="bottom">
+              <template #title>
+                {{ currentVersion }}
+              </template>
+              <img width="35" alt="NocoDB" src="~/assets/img/icons/512x512-trans.png" />
+            </a-tooltip>
           </a>
 
           <a-dropdown