From 7947984df6387d8e30aa50f801716a6a1502486d Mon Sep 17 00:00:00 2001
From: Wing-Kam Wong <wingkwong.code@gmail.com>
Date: Wed, 30 Mar 2022 19:35:13 +0800
Subject: [PATCH 1/4] feat: add important annoucement

Signed-off-by: Wing-Kam Wong <wingkwong.code@gmail.com>
---
 packages/nc-gui/layouts/default.vue | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/packages/nc-gui/layouts/default.vue b/packages/nc-gui/layouts/default.vue
index 27591a3377..8e021af902 100644
--- a/packages/nc-gui/layouts/default.vue
+++ b/packages/nc-gui/layouts/default.vue
@@ -110,6 +110,8 @@
           {{ ghStarText }}
         </gh-btns-star>
 
+        <important-announcement />
+
         <release-info />
 
         <template v-if="isDashboard">
@@ -581,6 +583,7 @@
 
 <script>
 import ReleaseInfo from '@/components/releaseInfo'
+import ImportantAnnouncement from '../components/importantAnnouncement.vue'
 import { mapGetters, mapActions, mapMutations } from 'vuex'
 import 'splitpanes/dist/splitpanes.css'
 import ChangeEnv from '../components/changeEnv'
@@ -602,6 +605,7 @@ export default {
     TemplatesModal,
     Loader,
     ReleaseInfo,
+    ImportantAnnouncement,
     Language,
     ChangeEnv,
     XBtn,
@@ -609,7 +613,7 @@ export default {
     dlgUnexpectedError,
     notification,
     settings,
-    xTerm
+    xTerm,
   },
   data: () => ({
     clickCount: true,

From 00926aefd5abf55f655c3c76d046972a9a73c614 Mon Sep 17 00:00:00 2001
From: Wing-Kam Wong <wingkwong.code@gmail.com>
Date: Wed, 30 Mar 2022 19:35:32 +0800
Subject: [PATCH 2/4] feat: add important annoucement

Signed-off-by: Wing-Kam Wong <wingkwong.code@gmail.com>
---
 .../components/importantAnnouncement.vue      | 87 +++++++++++++++++++
 1 file changed, 87 insertions(+)
 create mode 100644 packages/nc-gui/components/importantAnnouncement.vue

diff --git a/packages/nc-gui/components/importantAnnouncement.vue b/packages/nc-gui/components/importantAnnouncement.vue
new file mode 100644
index 0000000000..ae39efac28
--- /dev/null
+++ b/packages/nc-gui/components/importantAnnouncement.vue
@@ -0,0 +1,87 @@
+<template>
+  <v-menu bottom offset-y>
+    <template #activator="{on}">
+      <transition name="announcement">
+        <v-btn
+          v-if="!loading"
+          text
+          small
+          class="mb-0 mr-2 py-0 "
+          v-on="on"
+        >
+          🚨 Important Announcement
+          <v-icon small>
+            mdi-menu-down
+          </v-icon>
+        </v-btn>
+      </transition>
+    </template>
+    <v-list dense>
+      <v-list-item dense>
+        <span class="message">
+          Starting from v0.90.0, our API design will be changed <br/> and we are discontinuing GraphQL.
+        </span>
+      </v-list-item>
+      <!-- TODO: update link -->
+      <v-list-item dense href="#" target="_blank">
+        <v-icon small class="mr-2">
+          mdi-script-text-outline
+        </v-icon>
+        <span class="caption">
+          API Changes in v0.90.0
+        </span>
+      </v-list-item>
+      <!-- TODO: update link -->
+      <v-list-item dense href="#" target="_blank">
+        <v-icon small class="mr-2">
+          mdi-rocket-launch-outline
+        </v-icon>
+        <span class="caption">
+          Migration Guide
+        </span>
+      </v-list-item>
+      <v-list-item @click="announcementAlert = false">
+        <v-icon small class="mr-2">
+          mdi-close
+        </v-icon>
+
+        <span class="caption">
+          <!--Hide menu-->
+          {{ $t('general.hideMenu') }}
+        </span>
+      </v-list-item>
+    </v-list>
+  </v-menu>
+</template>
+
+<script>
+export default {
+  name: 'ImportantAnnouncement',
+  data: () => ({
+    loading: true
+  }),
+  computed: {
+  },
+  mounted() {
+    setTimeout(() => {
+      this.loading = false
+    }, 1000)
+  }
+}
+</script>
+
+<style scoped>
+.announcement-enter-active, .announcement-leave-active {
+  transition: opacity .5s;
+}
+
+.announcement-enter, .announcement-leave-to {
+  opacity: 0;
+}
+
+.message {
+  font-size: 0.80rem !important;
+  font-weight: bold;
+  margin: 10px;
+}
+</style>

From 95260f95b0696f7ee4b7e763844bc64644fe6404 Mon Sep 17 00:00:00 2001
From: Wing-Kam Wong <wingkwong.code@gmail.com>
Date: Thu, 31 Mar 2022 16:52:26 +0800
Subject: [PATCH 3/4] chore: update wordings

Signed-off-by: Wing-Kam Wong <wingkwong.code@gmail.com>
---
 packages/nc-gui/components/importantAnnouncement.vue | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/packages/nc-gui/components/importantAnnouncement.vue b/packages/nc-gui/components/importantAnnouncement.vue
index ae39efac28..1a7e6aa9a7 100644
--- a/packages/nc-gui/components/importantAnnouncement.vue
+++ b/packages/nc-gui/components/importantAnnouncement.vue
@@ -9,7 +9,7 @@
           class="mb-0 mr-2 py-0 "
           v-on="on"
         >
-          🚨 Important Announcement
+          Announcement
           <v-icon small>
             mdi-menu-down
           </v-icon>
@@ -19,7 +19,9 @@
     <v-list dense>
       <v-list-item dense>
         <span class="message">
-          Starting from v0.90.0, our API design will be changed <br/> and we are discontinuing GraphQL.
+          Starting from v0.90, <br/>
+          our API will undergo changes <br/>
+          and we are discontinuing GraphQL
         </span>
       </v-list-item>
       <!-- TODO: update link -->

From 724f135d2b9e73b7966627df2dad19cc4b1986d7 Mon Sep 17 00:00:00 2001
From: Wing-Kam Wong <wingkwong.code@gmail.com>
Date: Thu, 31 Mar 2022 17:15:56 +0800
Subject: [PATCH 4/4] chore: update link

Signed-off-by: Wing-Kam Wong <wingkwong.code@gmail.com>
---
 packages/nc-gui/components/importantAnnouncement.vue | 8 +++-----
 1 file changed, 3 insertions(+), 5 deletions(-)

diff --git a/packages/nc-gui/components/importantAnnouncement.vue b/packages/nc-gui/components/importantAnnouncement.vue
index 1a7e6aa9a7..2cf90bd0eb 100644
--- a/packages/nc-gui/components/importantAnnouncement.vue
+++ b/packages/nc-gui/components/importantAnnouncement.vue
@@ -24,8 +24,7 @@
           and we are discontinuing GraphQL
         </span>
       </v-list-item>
-      <!-- TODO: update link -->
-      <v-list-item dense href="#" target="_blank">
+      <v-list-item dense href="https://github.com/nocodb/nocodb/issues/1564" target="_blank">
         <v-icon small class="mr-2">
           mdi-script-text-outline
         </v-icon>
@@ -33,15 +32,14 @@
           API Changes in v0.90.0
         </span>
       </v-list-item>
-      <!-- TODO: update link -->
-      <v-list-item dense href="#" target="_blank">
+      <!-- <v-list-item dense href="#" target="_blank">
         <v-icon small class="mr-2">
           mdi-rocket-launch-outline
         </v-icon>
         <span class="caption">
           Migration Guide
         </span>
-      </v-list-item>
+      </v-list-item> -->
       <v-list-item @click="announcementAlert = false">
         <v-icon small class="mr-2">
           mdi-close