From 198a4af698e49bad300424de0909cee7d35d9907 Mon Sep 17 00:00:00 2001
From: braks <78412429+bcakmakoglu@users.noreply.github.com>
Date: Thu, 11 Aug 2022 15:26:47 +0200
Subject: [PATCH] feat(gui-v2): close dropdown menu on esc keydown

---
 .../nc-gui-v2/pages/nc/[projectId]/index.vue    | 17 ++++++++++++-----
 1 file changed, 12 insertions(+), 5 deletions(-)

diff --git a/packages/nc-gui-v2/pages/nc/[projectId]/index.vue b/packages/nc-gui-v2/pages/nc/[projectId]/index.vue
index aed18c85ed..453041763e 100644
--- a/packages/nc-gui-v2/pages/nc/[projectId]/index.vue
+++ b/packages/nc-gui-v2/pages/nc/[projectId]/index.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { navigateTo, provideSidebar, ref, useProject, useRoute, useSidebar, useTabs, useUIPermission } from '#imports'
+import { navigateTo, onKeyStroke, provideSidebar, ref, useProject, useRoute, useTabs, useUIPermission } from '#imports'
 import { TabType } from '~/composables'
 import { openLink } from '~/utils'
 
@@ -11,9 +11,6 @@ const { addTab, clearTabs } = useTabs()
 
 const { isUIAllowed } = useUIPermission()
 
-// set old sidebar state
-useSidebar({ isOpen: true })
-
 // create a new sidebar state
 const { isOpen, toggle } = provideSidebar({ isOpen: true })
 
@@ -21,6 +18,16 @@ const dialogOpen = ref(false)
 
 const openDialogKey = ref<string>()
 
+const dropdownOpen = ref(false)
+
+onKeyStroke(
+  'Escape',
+  () => {
+    dropdownOpen.value = false
+  },
+  { eventName: 'keydown' },
+)
+
 clearTabs()
 
 if (!route.params.type) {
@@ -58,7 +65,7 @@ await loadTables()
             <img alt="NocoDB" src="~/assets/img/icons/512x512-trans.png" />
           </div>
 
-          <a-dropdown :trigger="['click']">
+          <a-dropdown v-model:visible="dropdownOpen" :trigger="['click']">
             <div
               :style="{ width: isOpen ? 'calc(100% - 40px) pr-2' : '100%' }"
               :class="[isOpen ? '' : 'justify-center']"