From 16f7741cc070b606d27674e74eb899816de47617 Mon Sep 17 00:00:00 2001
From: Pranav C <pranavxc@gmail.com>
Date: Fri, 17 May 2024 09:35:50 +0000
Subject: [PATCH] fix: add missing scrollbar

---
 .../components/dashboard/settings/DataSources.vue   | 13 +++++++++----
 .../nc-gui/components/dashboard/settings/Modal.vue  |  1 +
 2 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/packages/nc-gui/components/dashboard/settings/DataSources.vue b/packages/nc-gui/components/dashboard/settings/DataSources.vue
index b9a2bfe9c2..d013c86b4c 100644
--- a/packages/nc-gui/components/dashboard/settings/DataSources.vue
+++ b/packages/nc-gui/components/dashboard/settings/DataSources.vue
@@ -309,11 +309,11 @@ const openedTab = ref('erd')
           </a-tab-pane>
           <a-tab-pane v-if="!activeSource.is_meta && !activeSource.is_local" key="audit">
             <template #tab>
-              <div class="tab" data-testid="nc-audit-tab">
+              <div class="tab" data-testid="nc-connection-tab">
                 <div>{{ $t('labels.connectionDetails') }}</div>
               </div>
             </template>
-            <div class="p-6 mt-4 flex h-full">
+            <div class="p-6 mt-4 h-full overflow-auto">
               <LazyDashboardSettingsDataSourcesEditBase
                 class="w-600px"
                 :source-id="activeSource.id"
@@ -329,7 +329,10 @@ const openedTab = ref('erd')
                 <div>{{ $t('labels.uiAcl') }}</div>
               </div>
             </template>
-            <LazyDashboardSettingsUIAcl class="mt-4" :source-id="activeSource.id" />
+
+            <div class="pt-4 h-full overflow-auto">
+              <LazyDashboardSettingsUIAcl :source-id="activeSource.id" />
+            </div>
           </a-tab-pane>
           <a-tab-pane key="meta-sync">
             <template #tab>
@@ -337,7 +340,9 @@ const openedTab = ref('erd')
                 <div>{{ $t('labels.metaSync') }}</div>
               </div>
             </template>
-            <LazyDashboardSettingsMetadata class="mt-4 w-full" :source-id="activeSource.id" @source-synced="loadBases(true)" />
+            <div class="pt-4 h-full overflow-auto">
+              <LazyDashboardSettingsMetadata :source-id="activeSource.id" @source-synced="loadBases(true)" />
+            </div>
           </a-tab-pane>
         </NcTabs>
       </template>
diff --git a/packages/nc-gui/components/dashboard/settings/Modal.vue b/packages/nc-gui/components/dashboard/settings/Modal.vue
index 710a09a736..83ad269ed4 100644
--- a/packages/nc-gui/components/dashboard/settings/Modal.vue
+++ b/packages/nc-gui/components/dashboard/settings/Modal.vue
@@ -185,6 +185,7 @@ watch(
           <template v-for="(tab, key) of tabsInfo" :key="key">
             <a-menu-item
               v-if="key !== 'dataSources' || isUIAllowed('sourceCreate')"
+              :key="key"
               class="active:(!ring-0) hover:(!bg-primary !bg-opacity-25)"
             >
               <div class="flex items-center space-x-2" @click="tab.onClick">