From a1e06f107463ea5ab8fc4c1a2eda0841339539f8 Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa@nocodb.com>
Date: Thu, 26 Oct 2023 17:05:38 +0000
Subject: [PATCH 01/13] fix: Added auto scrolling/auto hiding of create view
 btn in sidebar

---
 .../nc-gui/components/dashboard/Sidebar.vue   | 10 ++-
 .../dashboard/TreeView/ProjectNode.vue        | 12 +++-
 .../dashboard/TreeView/TableList.vue          |  9 +++
 .../dashboard/TreeView/TableNode.vue          | 21 +++++-
 .../dashboard/TreeView/ViewsList.vue          | 71 ++++++++++++++-----
 .../components/dashboard/TreeView/index.vue   | 10 ++-
 6 files changed, 108 insertions(+), 25 deletions(-)

diff --git a/packages/nc-gui/components/dashboard/Sidebar.vue b/packages/nc-gui/components/dashboard/Sidebar.vue
index 2b2c9a6551..ad3af0e9cf 100644
--- a/packages/nc-gui/components/dashboard/Sidebar.vue
+++ b/packages/nc-gui/components/dashboard/Sidebar.vue
@@ -31,6 +31,14 @@ onMounted(() => {
 onUnmounted(() => {
   treeViewDom.value?.removeEventListener('scroll', checkScrollTopMoreThanZero)
 })
+
+const onOpenTable = (scrollDown: boolean) => {
+  if (scrollDown && treeViewDom.value && !isMobileMode.value) {
+    nextTick(() => {
+      treeViewDom.value!.scrollTop = treeViewDom.value!.scrollTop - 8
+    })
+  }
+}
 </script>
 
 <template>
@@ -54,7 +62,7 @@ onUnmounted(() => {
         'pt-0.25': isSharedBase,
       }"
     >
-      <DashboardTreeView v-if="!isWorkspaceLoading" />
+      <DashboardTreeView v-if="!isWorkspaceLoading" @open-table="onOpenTable" />
     </div>
     <div v-if="!isSharedBase">
       <DashboardSidebarUserInfo />
diff --git a/packages/nc-gui/components/dashboard/TreeView/ProjectNode.vue b/packages/nc-gui/components/dashboard/TreeView/ProjectNode.vue
index 49bb750e80..ef258c2954 100644
--- a/packages/nc-gui/components/dashboard/TreeView/ProjectNode.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/ProjectNode.vue
@@ -35,6 +35,10 @@ import {
 import type { NcProject } from '#imports'
 import { useNuxtApp } from '#app'
 
+const emit = defineEmits<{
+  (event: 'openTable', scrollDown: boolean): void
+}>()
+
 const indicator = h(LoadingOutlined, {
   class: '!text-gray-400',
   style: {
@@ -361,6 +365,10 @@ const projectDelete = () => {
   isProjectDeleteDialogVisible.value = true
   $e('c:project:delete')
 }
+
+const onOpenTable = (scrollDown: boolean) => {
+  emit('openTable', scrollDown)
+}
 </script>
 
 <template>
@@ -580,7 +588,7 @@ const projectDelete = () => {
           <div class="flex-1 overflow-y-auto overflow-x-hidden flex flex-col" :class="{ 'mb-[20px]': isSharedBase }">
             <div v-if="base?.sources?.[0]?.enabled" class="flex-1">
               <div class="transition-height duration-200">
-                <DashboardTreeViewTableList :base="base" :source-index="0" />
+                <DashboardTreeViewTableList :base="base" :source-index="0" @open-table="onOpenTable" />
               </div>
             </div>
 
@@ -694,7 +702,7 @@ const projectDelete = () => {
                         :key="`sortable-${source.id}-${source.id && source.id in keys ? keys[source.id] : '0'}`"
                         :nc-source="source.id"
                       >
-                        <DashboardTreeViewTableList :base="base" :source-index="sourceIndex" />
+                        <DashboardTreeViewTableList :base="base" :source-index="sourceIndex" @open-table="onOpenTable" />
                       </div>
                     </a-collapse-panel>
                   </a-collapse>
diff --git a/packages/nc-gui/components/dashboard/TreeView/TableList.vue b/packages/nc-gui/components/dashboard/TreeView/TableList.vue
index 6ece28f941..f183314196 100644
--- a/packages/nc-gui/components/dashboard/TreeView/TableList.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/TableList.vue
@@ -16,6 +16,10 @@ const props = withDefaults(
   },
 )
 
+const emit = defineEmits<{
+  (event: 'openTable', scrollDown: boolean): void
+}>()
+
 const base = toRef(props, 'base')
 const sourceIndex = toRef(props, 'sourceIndex')
 
@@ -127,6 +131,10 @@ watchEffect(() => {
 const availableTables = computed(() => {
   return tables.value.filter((table) => table.source_id === base.value?.sources?.[sourceIndex.value].id)
 })
+
+const onOpenTable = (scrollDown: boolean) => {
+  emit('openTable', scrollDown)
+}
 </script>
 
 <template>
@@ -160,6 +168,7 @@ const availableTables = computed(() => {
           :data-title="table.title"
           :data-source-id="source?.id"
           :data-type="table.type"
+          @open-table="onOpenTable"
         >
         </TableNode>
       </div>
diff --git a/packages/nc-gui/components/dashboard/TreeView/TableNode.vue b/packages/nc-gui/components/dashboard/TreeView/TableNode.vue
index 35e2e65bc4..af6b05e45c 100644
--- a/packages/nc-gui/components/dashboard/TreeView/TableNode.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/TableNode.vue
@@ -16,6 +16,10 @@ const props = withDefaults(
   { sourceIndex: 0 },
 )
 
+const emit = defineEmits<{
+  (event: 'openTable', scrollDown: boolean): void
+}>()
+
 const base = toRef(props, 'base')
 const table = toRef(props, 'table')
 const sourceIndex = toRef(props, 'sourceIndex')
@@ -48,8 +52,12 @@ const { loadViews: _loadViews } = useViewsStore()
 const { activeView } = storeToRefs(useViewsStore())
 const { isLeftSidebarOpen } = storeToRefs(useSidebarStore())
 
+const { viewsByTable } = storeToRefs(useViewsStore())
+
+const views = computed(() => viewsByTable.value.get(table.value.id!)?.filter((v) => !v.is_default) ?? [])
+
 // todo: temp
-const { baseTables } = storeToRefs(useTablesStore())
+const { baseTables, activeTableId } = storeToRefs(useTablesStore())
 const tables = computed(() => baseTables.value.get(base.value.id!) ?? [])
 
 const openedTableId = computed(() => route.params.viewId)
@@ -113,6 +121,8 @@ const onOpenTable = async () => {
     if (isMobileMode.value) {
       isLeftSidebarOpen.value = false
     }
+
+    emit('openTable', true)
   } catch (e) {
     message.error(await extractSdkResponseErrorMsg(e))
   } finally {
@@ -138,6 +148,12 @@ watch(
 const isTableOpened = computed(() => {
   return openedTableId.value === table.value?.id && activeView.value?.is_default
 })
+
+watch(activeTableId, () => {
+  if (activeTableId.value !== table.value.id && views.value.length === 0) {
+    isExpanded.value = false
+  }
+})
 </script>
 
 <template>
@@ -169,7 +185,6 @@ const isTableOpened = computed(() => {
       >
         <div class="flex flex-row h-full items-center">
           <NcButton
-            v-if="(table.meta as any)?.hasNonDefaultViews"
             v-e="['c:table:toggle-expand']"
             type="text"
             size="xxsmall"
@@ -182,7 +197,7 @@ const isTableOpened = computed(() => {
               :class="{ '!rotate-180': isExpanded }"
             />
           </NcButton>
-          <div v-else class="sm:min-w-5.75 xs:min-w-7.5 h-2"></div>
+          <!-- <div v-else class="sm:min-w-5.75 xs:min-w-7.5 h-2"></div> -->
           <div class="flex w-auto" :data-testid="`tree-view-table-draggable-handle-${table.title}`">
             <div
               class="flex items-center nc-table-icon"
diff --git a/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue b/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue
index 3f440a3043..6423f3e1f3 100644
--- a/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue
@@ -5,6 +5,7 @@ import type { SortableEvent } from 'sortablejs'
 import Sortable from 'sortablejs'
 import type { Menu as AntMenu } from 'ant-design-vue'
 import {
+  isDefaultBase as _isDefaultBase,
   extractSdkResponseErrorMsg,
   message,
   onMounted,
@@ -32,6 +33,10 @@ const table = inject(SidebarTableInj)!
 
 const { isLeftSidebarOpen } = storeToRefs(useSidebarStore())
 
+const { activeTableId } = storeToRefs(useTablesStore())
+
+const { isUIAllowed } = useRoles()
+
 const { isMobileMode } = useGlobal()
 
 const { $e } = useNuxtApp()
@@ -77,6 +82,13 @@ function markItem(id: string) {
   }, 300)
 }
 
+const isDefaultSource = computed(() => {
+  const source = base.value?.sources?.find((b) => b.id === table.value.source_id)
+  if (!source) return false
+
+  return _isDefaultBase(source)
+})
+
 /** validate view title */
 function validate(view: ViewType) {
   if (!view.title || view.title.trim().length < 0) {
@@ -367,31 +379,54 @@ function onOpenModal({
 
 <template>
   <a-menu
-    v-if="views.length"
     ref="menuRef"
     :class="{ dragging }"
     class="nc-views-menu flex flex-col w-full !border-r-0 !bg-inherit"
     :selected-keys="selected"
   >
-    <DashboardTreeViewViewsNode
-      v-for="view of views"
-      :id="view.id"
-      :key="view.id"
-      :view="view"
-      :on-validate="validate"
-      class="nc-view-item !rounded-md !px-0.75 !py-0.5 w-full transition-all ease-in duration-100"
+    <DashboardTreeViewCreateViewBtn
+      v-if="isUIAllowed('viewCreateOrEdit')"
       :class="{
-        'bg-gray-200': isMarked === view.id,
-        'active': activeView?.id === view.id,
-        [`nc-${view.type ? viewTypeAlias[view.type] : undefined || view.type}-view-item`]: true,
+        'hidden': activeTableId !== table.id && views.length,
+        '!ml-18 !xs:(ml-19.75)': isDefaultSource,
+        '!ml-23.5 !xs:(ml-27)': !isDefaultSource,
       }"
-      :data-view-id="view.id"
-      @change-view="changeView"
-      @open-modal="onOpenModal"
-      @delete="openDeleteDialog"
-      @rename="onRename"
-      @select-icon="setIcon($event, view)"
-    />
+    >
+      <div class="flex flex-row items-center hover:text-brand-500 text-gray-500 cursor-pointer rounded-md">
+        <div class="flex flex-row items-center pl-1.25 !py-1.5 text-inherit">
+          <GeneralIcon icon="plus" />
+          <div class="pl-1.75">
+            {{
+              $t('general.createEntity', {
+                entity: $t('objects.view'),
+              })
+            }}
+          </div>
+        </div>
+      </div>
+    </DashboardTreeViewCreateViewBtn>
+
+    <template v-if="views.length">
+      <DashboardTreeViewViewsNode
+        v-for="view of views"
+        :id="view.id"
+        :key="view.id"
+        :view="view"
+        :on-validate="validate"
+        class="nc-view-item !rounded-md !px-0.75 !py-0.5 w-full transition-all ease-in duration-100"
+        :class="{
+          'bg-gray-200': isMarked === view.id,
+          'active': activeView?.id === view.id,
+          [`nc-${view.type ? viewTypeAlias[view.type] : undefined || view.type}-view-item`]: true,
+        }"
+        :data-view-id="view.id"
+        @change-view="changeView"
+        @open-modal="onOpenModal"
+        @delete="openDeleteDialog"
+        @rename="onRename"
+        @select-icon="setIcon($event, view)"
+      />
+    </template>
   </a-menu>
 </template>
 
diff --git a/packages/nc-gui/components/dashboard/TreeView/index.vue b/packages/nc-gui/components/dashboard/TreeView/index.vue
index 267434577e..1b2df7c4c4 100644
--- a/packages/nc-gui/components/dashboard/TreeView/index.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/index.vue
@@ -23,6 +23,10 @@ import {
 
 import { useRouter } from '#app'
 
+const emit = defineEmits<{
+  (event: 'openTable', scrollDown: boolean): void
+}>()
+
 const { isUIAllowed } = useRoles()
 
 const { $e } = useNuxtApp()
@@ -219,6 +223,10 @@ watch(
     immediate: true,
   },
 )
+
+const onOpenTable = (scrollDown: boolean) => {
+  emit('openTable', scrollDown)
+}
 </script>
 
 <template>
@@ -227,7 +235,7 @@ watch(
     <div mode="inline" class="nc-treeview pb-0.5 flex-grow min-h-50 overflow-x-hidden">
       <template v-if="basesList?.length">
         <ProjectWrapper v-for="base of basesList" :key="base.id" :base-role="base.project_role" :base="base">
-          <DashboardTreeViewProjectNode />
+          <DashboardTreeViewProjectNode @open-table="onOpenTable" />
         </ProjectWrapper>
       </template>
 

From 74ed70dc2a958672d884032cfe853efd9a1d9338 Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa@nocodb.com>
Date: Thu, 26 Oct 2023 17:05:38 +0000
Subject: [PATCH 02/13] fix: Added feature flag for create view btn

---
 .../components/dashboard/TreeView/TableNode.vue      |  5 ++++-
 .../components/dashboard/TreeView/ViewsList.vue      |  4 +++-
 packages/nc-gui/components/smartsheet/Toolbar.vue    | 12 ++++++++++++
 packages/nc-gui/store/config.ts                      |  4 ++++
 4 files changed, 23 insertions(+), 2 deletions(-)

diff --git a/packages/nc-gui/components/dashboard/TreeView/TableNode.vue b/packages/nc-gui/components/dashboard/TreeView/TableNode.vue
index af6b05e45c..9ba6b50641 100644
--- a/packages/nc-gui/components/dashboard/TreeView/TableNode.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/TableNode.vue
@@ -51,6 +51,7 @@ const { setMenuContext, openRenameTableDialog, duplicateTable } = inject(TreeVie
 const { loadViews: _loadViews } = useViewsStore()
 const { activeView } = storeToRefs(useViewsStore())
 const { isLeftSidebarOpen } = storeToRefs(useSidebarStore())
+const { showCreateViewAllTimes } = storeToRefs(useConfigStore())
 
 const { viewsByTable } = storeToRefs(useViewsStore())
 
@@ -122,7 +123,7 @@ const onOpenTable = async () => {
       isLeftSidebarOpen.value = false
     }
 
-    emit('openTable', true)
+    if (!showCreateViewAllTimes.value) emit('openTable', true)
   } catch (e) {
     message.error(await extractSdkResponseErrorMsg(e))
   } finally {
@@ -150,6 +151,8 @@ const isTableOpened = computed(() => {
 })
 
 watch(activeTableId, () => {
+  if (showCreateViewAllTimes.value) return
+
   if (activeTableId.value !== table.value.id && views.value.length === 0) {
     isExpanded.value = false
   }
diff --git a/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue b/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue
index 6423f3e1f3..9fcffd60be 100644
--- a/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue
@@ -33,6 +33,8 @@ const table = inject(SidebarTableInj)!
 
 const { isLeftSidebarOpen } = storeToRefs(useSidebarStore())
 
+const { showCreateViewAllTimes } = storeToRefs(useConfigStore())
+
 const { activeTableId } = storeToRefs(useTablesStore())
 
 const { isUIAllowed } = useRoles()
@@ -387,7 +389,7 @@ function onOpenModal({
     <DashboardTreeViewCreateViewBtn
       v-if="isUIAllowed('viewCreateOrEdit')"
       :class="{
-        'hidden': activeTableId !== table.id && views.length,
+        'hidden': activeTableId !== table.id && views.length && !showCreateViewAllTimes,
         '!ml-18 !xs:(ml-19.75)': isDefaultSource,
         '!ml-23.5 !xs:(ml-27)': !isDefaultSource,
       }"
diff --git a/packages/nc-gui/components/smartsheet/Toolbar.vue b/packages/nc-gui/components/smartsheet/Toolbar.vue
index b116c186a0..53410704a8 100644
--- a/packages/nc-gui/components/smartsheet/Toolbar.vue
+++ b/packages/nc-gui/components/smartsheet/Toolbar.vue
@@ -7,11 +7,21 @@ const isPublic = inject(IsPublicInj, ref(false))
 
 const { isViewsLoading } = storeToRefs(useViewsStore())
 
+const { showCreateViewAllTimes } = storeToRefs(useConfigStore())
+
 const { isMobileMode } = useGlobal()
 
 const { isUIAllowed } = useRoles()
 
 const { allowCSVDownload } = useSharedView()
+
+const toggleCreateViewAllTimes = () => {
+  showCreateViewAllTimes.value = !showCreateViewAllTimes.value
+
+  message.info({
+    content: showCreateViewAllTimes.value ? 'Create View All Times' : 'Create View Once',
+  })
+}
 </script>
 
 <template>
@@ -44,6 +54,8 @@ const { allowCSVDownload } = useSharedView()
         <div class="flex-1" />
       </template>
 
+      <div class="h-6 w-6 xs:hidden" @dblclick="toggleCreateViewAllTimes"></div>
+
       <LazySmartsheetToolbarSearchData
         v-if="(isGrid || isGallery || isKanban) && !isPublic"
         :class="{
diff --git a/packages/nc-gui/store/config.ts b/packages/nc-gui/store/config.ts
index 5c8cbcaa9b..eabec26bc2 100644
--- a/packages/nc-gui/store/config.ts
+++ b/packages/nc-gui/store/config.ts
@@ -21,6 +21,9 @@ export const useConfigStore = defineStore('configStore', () => {
     isMobileMode.value = isViewPortMobile()
   }
 
+  // Feature flag for create view all times
+  const showCreateViewAllTimes = ref(false)
+
   window.addEventListener('DOMContentLoaded', onViewPortResize)
   window.addEventListener('resize', onViewPortResize)
 
@@ -67,6 +70,7 @@ export const useConfigStore = defineStore('configStore', () => {
     isViewPortMobile,
     handleSidebarOpenOnMobileForNonViews,
     projectPageTab,
+    showCreateViewAllTimes,
   }
 })
 

From 349e0c64d22df769d259830d88ceb50615cfeeb9 Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa@nocodb.com>
Date: Thu, 26 Oct 2023 17:05:38 +0000
Subject: [PATCH 03/13] fix: Removed manual auto scrolling as its not required
 since browser list maintains its scroll position of item even if top items
 are removed if there space to scroll top

---
 packages/nc-gui/components/dashboard/Sidebar.vue       | 10 +---------
 .../components/dashboard/TreeView/ProjectNode.vue      |  8 ++------
 .../nc-gui/components/dashboard/TreeView/TableList.vue |  5 -----
 .../nc-gui/components/dashboard/TreeView/TableNode.vue |  2 --
 .../nc-gui/components/dashboard/TreeView/index.vue     |  6 +-----
 5 files changed, 4 insertions(+), 27 deletions(-)

diff --git a/packages/nc-gui/components/dashboard/Sidebar.vue b/packages/nc-gui/components/dashboard/Sidebar.vue
index ad3af0e9cf..2b2c9a6551 100644
--- a/packages/nc-gui/components/dashboard/Sidebar.vue
+++ b/packages/nc-gui/components/dashboard/Sidebar.vue
@@ -31,14 +31,6 @@ onMounted(() => {
 onUnmounted(() => {
   treeViewDom.value?.removeEventListener('scroll', checkScrollTopMoreThanZero)
 })
-
-const onOpenTable = (scrollDown: boolean) => {
-  if (scrollDown && treeViewDom.value && !isMobileMode.value) {
-    nextTick(() => {
-      treeViewDom.value!.scrollTop = treeViewDom.value!.scrollTop - 8
-    })
-  }
-}
 </script>
 
 <template>
@@ -62,7 +54,7 @@ const onOpenTable = (scrollDown: boolean) => {
         'pt-0.25': isSharedBase,
       }"
     >
-      <DashboardTreeView v-if="!isWorkspaceLoading" @open-table="onOpenTable" />
+      <DashboardTreeView v-if="!isWorkspaceLoading" />
     </div>
     <div v-if="!isSharedBase">
       <DashboardSidebarUserInfo />
diff --git a/packages/nc-gui/components/dashboard/TreeView/ProjectNode.vue b/packages/nc-gui/components/dashboard/TreeView/ProjectNode.vue
index ef258c2954..6333bc5513 100644
--- a/packages/nc-gui/components/dashboard/TreeView/ProjectNode.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/ProjectNode.vue
@@ -365,10 +365,6 @@ const projectDelete = () => {
   isProjectDeleteDialogVisible.value = true
   $e('c:project:delete')
 }
-
-const onOpenTable = (scrollDown: boolean) => {
-  emit('openTable', scrollDown)
-}
 </script>
 
 <template>
@@ -588,7 +584,7 @@ const onOpenTable = (scrollDown: boolean) => {
           <div class="flex-1 overflow-y-auto overflow-x-hidden flex flex-col" :class="{ 'mb-[20px]': isSharedBase }">
             <div v-if="base?.sources?.[0]?.enabled" class="flex-1">
               <div class="transition-height duration-200">
-                <DashboardTreeViewTableList :base="base" :source-index="0" @open-table="onOpenTable" />
+                <DashboardTreeViewTableList :base="base" :source-index="0" />
               </div>
             </div>
 
@@ -702,7 +698,7 @@ const onOpenTable = (scrollDown: boolean) => {
                         :key="`sortable-${source.id}-${source.id && source.id in keys ? keys[source.id] : '0'}`"
                         :nc-source="source.id"
                       >
-                        <DashboardTreeViewTableList :base="base" :source-index="sourceIndex" @open-table="onOpenTable" />
+                        <DashboardTreeViewTableList :base="base" :source-index="sourceIndex" />
                       </div>
                     </a-collapse-panel>
                   </a-collapse>
diff --git a/packages/nc-gui/components/dashboard/TreeView/TableList.vue b/packages/nc-gui/components/dashboard/TreeView/TableList.vue
index f183314196..dc0f3aebe8 100644
--- a/packages/nc-gui/components/dashboard/TreeView/TableList.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/TableList.vue
@@ -131,10 +131,6 @@ watchEffect(() => {
 const availableTables = computed(() => {
   return tables.value.filter((table) => table.source_id === base.value?.sources?.[sourceIndex.value].id)
 })
-
-const onOpenTable = (scrollDown: boolean) => {
-  emit('openTable', scrollDown)
-}
 </script>
 
 <template>
@@ -168,7 +164,6 @@ const onOpenTable = (scrollDown: boolean) => {
           :data-title="table.title"
           :data-source-id="source?.id"
           :data-type="table.type"
-          @open-table="onOpenTable"
         >
         </TableNode>
       </div>
diff --git a/packages/nc-gui/components/dashboard/TreeView/TableNode.vue b/packages/nc-gui/components/dashboard/TreeView/TableNode.vue
index 9ba6b50641..75fe2dca6f 100644
--- a/packages/nc-gui/components/dashboard/TreeView/TableNode.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/TableNode.vue
@@ -122,8 +122,6 @@ const onOpenTable = async () => {
     if (isMobileMode.value) {
       isLeftSidebarOpen.value = false
     }
-
-    if (!showCreateViewAllTimes.value) emit('openTable', true)
   } catch (e) {
     message.error(await extractSdkResponseErrorMsg(e))
   } finally {
diff --git a/packages/nc-gui/components/dashboard/TreeView/index.vue b/packages/nc-gui/components/dashboard/TreeView/index.vue
index 1b2df7c4c4..376a0222a6 100644
--- a/packages/nc-gui/components/dashboard/TreeView/index.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/index.vue
@@ -223,10 +223,6 @@ watch(
     immediate: true,
   },
 )
-
-const onOpenTable = (scrollDown: boolean) => {
-  emit('openTable', scrollDown)
-}
 </script>
 
 <template>
@@ -235,7 +231,7 @@ const onOpenTable = (scrollDown: boolean) => {
     <div mode="inline" class="nc-treeview pb-0.5 flex-grow min-h-50 overflow-x-hidden">
       <template v-if="basesList?.length">
         <ProjectWrapper v-for="base of basesList" :key="base.id" :base-role="base.project_role" :base="base">
-          <DashboardTreeViewProjectNode @open-table="onOpenTable" />
+          <DashboardTreeViewProjectNode />
         </ProjectWrapper>
       </template>
 

From 434d97dfe77aca67446a42fff7ce1ff3c7ab4c46 Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa@nocodb.com>
Date: Thu, 26 Oct 2023 17:05:38 +0000
Subject: [PATCH 04/13] fix: Removed manual auto scrolling as its not required
 since browser list maintains its scroll position of item even if top items
 are removed if there space to scroll top

---
 packages/nc-gui/components/dashboard/TreeView/ProjectNode.vue | 4 ----
 packages/nc-gui/components/dashboard/TreeView/TableList.vue   | 4 ----
 packages/nc-gui/components/dashboard/TreeView/TableNode.vue   | 4 ----
 packages/nc-gui/components/dashboard/TreeView/index.vue       | 4 ----
 4 files changed, 16 deletions(-)

diff --git a/packages/nc-gui/components/dashboard/TreeView/ProjectNode.vue b/packages/nc-gui/components/dashboard/TreeView/ProjectNode.vue
index 6333bc5513..49bb750e80 100644
--- a/packages/nc-gui/components/dashboard/TreeView/ProjectNode.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/ProjectNode.vue
@@ -35,10 +35,6 @@ import {
 import type { NcProject } from '#imports'
 import { useNuxtApp } from '#app'
 
-const emit = defineEmits<{
-  (event: 'openTable', scrollDown: boolean): void
-}>()
-
 const indicator = h(LoadingOutlined, {
   class: '!text-gray-400',
   style: {
diff --git a/packages/nc-gui/components/dashboard/TreeView/TableList.vue b/packages/nc-gui/components/dashboard/TreeView/TableList.vue
index dc0f3aebe8..6ece28f941 100644
--- a/packages/nc-gui/components/dashboard/TreeView/TableList.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/TableList.vue
@@ -16,10 +16,6 @@ const props = withDefaults(
   },
 )
 
-const emit = defineEmits<{
-  (event: 'openTable', scrollDown: boolean): void
-}>()
-
 const base = toRef(props, 'base')
 const sourceIndex = toRef(props, 'sourceIndex')
 
diff --git a/packages/nc-gui/components/dashboard/TreeView/TableNode.vue b/packages/nc-gui/components/dashboard/TreeView/TableNode.vue
index 75fe2dca6f..5bf2607584 100644
--- a/packages/nc-gui/components/dashboard/TreeView/TableNode.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/TableNode.vue
@@ -16,10 +16,6 @@ const props = withDefaults(
   { sourceIndex: 0 },
 )
 
-const emit = defineEmits<{
-  (event: 'openTable', scrollDown: boolean): void
-}>()
-
 const base = toRef(props, 'base')
 const table = toRef(props, 'table')
 const sourceIndex = toRef(props, 'sourceIndex')
diff --git a/packages/nc-gui/components/dashboard/TreeView/index.vue b/packages/nc-gui/components/dashboard/TreeView/index.vue
index 376a0222a6..267434577e 100644
--- a/packages/nc-gui/components/dashboard/TreeView/index.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/index.vue
@@ -23,10 +23,6 @@ import {
 
 import { useRouter } from '#app'
 
-const emit = defineEmits<{
-  (event: 'openTable', scrollDown: boolean): void
-}>()
-
 const { isUIAllowed } = useRoles()
 
 const { $e } = useNuxtApp()

From 56fa0f5ca78895a1b0761b88caa1d5b22102c301 Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa@nocodb.com>
Date: Thu, 26 Oct 2023 17:05:38 +0000
Subject: [PATCH 05/13] fix: Minor cleanup

---
 packages/nc-gui/components/dashboard/TreeView/ViewsList.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue b/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue
index 9fcffd60be..2d50998b33 100644
--- a/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue
@@ -394,7 +394,7 @@ function onOpenModal({
         '!ml-23.5 !xs:(ml-27)': !isDefaultSource,
       }"
     >
-      <div class="flex flex-row items-center hover:text-brand-500 text-gray-500 cursor-pointer rounded-md">
+      <div role="button" class="flex flex-row items-center hover:text-brand-500 text-gray-500 cursor-pointer rounded-md">
         <div class="flex flex-row items-center pl-1.25 !py-1.5 text-inherit">
           <GeneralIcon icon="plus" />
           <div class="pl-1.75">

From 41b1ecbdb7765b1a342cf8fef4760e3b3897f149 Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa@nocodb.com>
Date: Thu, 26 Oct 2023 17:05:38 +0000
Subject: [PATCH 06/13] fix: Minor styling issue

---
 packages/nc-gui/components/dashboard/TreeView/ViewsList.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue b/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue
index 2d50998b33..813c72727f 100644
--- a/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue
@@ -394,7 +394,7 @@ function onOpenModal({
         '!ml-23.5 !xs:(ml-27)': !isDefaultSource,
       }"
     >
-      <div role="button" class="flex flex-row items-center hover:text-brand-500 text-gray-500 cursor-pointer rounded-md">
+      <div role="button" class="flex flex-row items-center hover:text-brand-500 text-gray-500 cursor-pointer rounded-md max-w-40">
         <div class="flex flex-row items-center pl-1.25 !py-1.5 text-inherit">
           <GeneralIcon icon="plus" />
           <div class="pl-1.75">

From 52578f90aac71d4a70799a2ec27d9599675309f7 Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa@nocodb.com>
Date: Thu, 26 Oct 2023 17:05:39 +0000
Subject: [PATCH 07/13] fix: Removed create view ux feature flag

---
 .../components/dashboard/TreeView/TableNode.vue   | 15 +--------------
 .../components/dashboard/TreeView/ViewsList.vue   | 12 ++++++++----
 packages/nc-gui/components/smartsheet/Toolbar.vue | 12 ------------
 packages/nc-gui/store/config.ts                   |  4 ----
 4 files changed, 9 insertions(+), 34 deletions(-)

diff --git a/packages/nc-gui/components/dashboard/TreeView/TableNode.vue b/packages/nc-gui/components/dashboard/TreeView/TableNode.vue
index 5bf2607584..fc70762f61 100644
--- a/packages/nc-gui/components/dashboard/TreeView/TableNode.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/TableNode.vue
@@ -47,14 +47,9 @@ const { setMenuContext, openRenameTableDialog, duplicateTable } = inject(TreeVie
 const { loadViews: _loadViews } = useViewsStore()
 const { activeView } = storeToRefs(useViewsStore())
 const { isLeftSidebarOpen } = storeToRefs(useSidebarStore())
-const { showCreateViewAllTimes } = storeToRefs(useConfigStore())
-
-const { viewsByTable } = storeToRefs(useViewsStore())
-
-const views = computed(() => viewsByTable.value.get(table.value.id!)?.filter((v) => !v.is_default) ?? [])
 
 // todo: temp
-const { baseTables, activeTableId } = storeToRefs(useTablesStore())
+const { baseTables } = storeToRefs(useTablesStore())
 const tables = computed(() => baseTables.value.get(base.value.id!) ?? [])
 
 const openedTableId = computed(() => route.params.viewId)
@@ -143,14 +138,6 @@ watch(
 const isTableOpened = computed(() => {
   return openedTableId.value === table.value?.id && activeView.value?.is_default
 })
-
-watch(activeTableId, () => {
-  if (showCreateViewAllTimes.value) return
-
-  if (activeTableId.value !== table.value.id && views.value.length === 0) {
-    isExpanded.value = false
-  }
-})
 </script>
 
 <template>
diff --git a/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue b/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue
index 813c72727f..f972225c50 100644
--- a/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue
@@ -33,8 +33,6 @@ const table = inject(SidebarTableInj)!
 
 const { isLeftSidebarOpen } = storeToRefs(useSidebarStore())
 
-const { showCreateViewAllTimes } = storeToRefs(useConfigStore())
-
 const { activeTableId } = storeToRefs(useTablesStore())
 
 const { isUIAllowed } = useRoles()
@@ -389,12 +387,18 @@ function onOpenModal({
     <DashboardTreeViewCreateViewBtn
       v-if="isUIAllowed('viewCreateOrEdit')"
       :class="{
-        'hidden': activeTableId !== table.id && views.length && !showCreateViewAllTimes,
         '!ml-18 !xs:(ml-19.75)': isDefaultSource,
         '!ml-23.5 !xs:(ml-27)': !isDefaultSource,
       }"
     >
-      <div role="button" class="flex flex-row items-center hover:text-brand-500 text-gray-500 cursor-pointer rounded-md max-w-40">
+      <div
+        role="button"
+        class="flex flex-row items-center cursor-pointer rounded-md max-w-40"
+        :class="{
+          'text-brand-500 hover:text-brand-600': activeTableId === table.id,
+          'text-gray-500 hover:text-brand-500': activeTableId !== table.id,
+        }"
+      >
         <div class="flex flex-row items-center pl-1.25 !py-1.5 text-inherit">
           <GeneralIcon icon="plus" />
           <div class="pl-1.75">
diff --git a/packages/nc-gui/components/smartsheet/Toolbar.vue b/packages/nc-gui/components/smartsheet/Toolbar.vue
index 53410704a8..b116c186a0 100644
--- a/packages/nc-gui/components/smartsheet/Toolbar.vue
+++ b/packages/nc-gui/components/smartsheet/Toolbar.vue
@@ -7,21 +7,11 @@ const isPublic = inject(IsPublicInj, ref(false))
 
 const { isViewsLoading } = storeToRefs(useViewsStore())
 
-const { showCreateViewAllTimes } = storeToRefs(useConfigStore())
-
 const { isMobileMode } = useGlobal()
 
 const { isUIAllowed } = useRoles()
 
 const { allowCSVDownload } = useSharedView()
-
-const toggleCreateViewAllTimes = () => {
-  showCreateViewAllTimes.value = !showCreateViewAllTimes.value
-
-  message.info({
-    content: showCreateViewAllTimes.value ? 'Create View All Times' : 'Create View Once',
-  })
-}
 </script>
 
 <template>
@@ -54,8 +44,6 @@ const toggleCreateViewAllTimes = () => {
         <div class="flex-1" />
       </template>
 
-      <div class="h-6 w-6 xs:hidden" @dblclick="toggleCreateViewAllTimes"></div>
-
       <LazySmartsheetToolbarSearchData
         v-if="(isGrid || isGallery || isKanban) && !isPublic"
         :class="{
diff --git a/packages/nc-gui/store/config.ts b/packages/nc-gui/store/config.ts
index eabec26bc2..5c8cbcaa9b 100644
--- a/packages/nc-gui/store/config.ts
+++ b/packages/nc-gui/store/config.ts
@@ -21,9 +21,6 @@ export const useConfigStore = defineStore('configStore', () => {
     isMobileMode.value = isViewPortMobile()
   }
 
-  // Feature flag for create view all times
-  const showCreateViewAllTimes = ref(false)
-
   window.addEventListener('DOMContentLoaded', onViewPortResize)
   window.addEventListener('resize', onViewPortResize)
 
@@ -70,7 +67,6 @@ export const useConfigStore = defineStore('configStore', () => {
     isViewPortMobile,
     handleSidebarOpenOnMobileForNonViews,
     projectPageTab,
-    showCreateViewAllTimes,
   }
 })
 

From 92a892840cc81781da8fd6125d695c73d584ccd7 Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa@nocodb.com>
Date: Thu, 26 Oct 2023 17:05:39 +0000
Subject: [PATCH 08/13] fix: Fixed padding alignment of fields modal

---
 .../components/smartsheet/toolbar/FieldsMenu.vue       | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/packages/nc-gui/components/smartsheet/toolbar/FieldsMenu.vue b/packages/nc-gui/components/smartsheet/toolbar/FieldsMenu.vue
index 14747f82ef..99facdd7ee 100644
--- a/packages/nc-gui/components/smartsheet/toolbar/FieldsMenu.vue
+++ b/packages/nc-gui/components/smartsheet/toolbar/FieldsMenu.vue
@@ -316,7 +316,7 @@ useMenuCloseOnEsc(open)
       <div class="p-4 pr-0 bg-white w-90 rounded-2xl nc-table-toolbar-menu" data-testid="nc-fields-menu" @click.stop>
         <div
           v-if="!filterQuery && !isPublic && (activeView?.type === ViewTypes.GALLERY || activeView?.type === ViewTypes.KANBAN)"
-          class="flex flex-col gap-y-2 pr-6 mb-6"
+          class="flex flex-col gap-y-2 pr-4 mb-6"
         >
           <div class="flex text-sm select-none">Select cover image field</div>
           <a-select
@@ -330,17 +330,17 @@ useMenuCloseOnEsc(open)
           </a-select>
         </div>
 
-        <div class="pr-6" @click.stop>
+        <div class="pr-4" @click.stop>
           <a-input v-model:value="filterQuery" :placeholder="$t('placeholder.searchFields')" class="!rounded-lg">
             <template #prefix> <img src="~/assets/nc-icons/search.svg" class="h-3.5 w-3.5 mr-1" /> </template
           ></a-input>
         </div>
 
-        <div v-if="!filterQuery" class="pr-6">
+        <div v-if="!filterQuery" class="pr-4">
           <div class="pt-0.25 w-full bg-gray-50"></div>
         </div>
 
-        <div class="flex flex-col my-1.5 nc-scrollbar-md max-h-[47.5vh] pr-5">
+        <div class="flex flex-col my-1.5 nc-scrollbar-md max-h-[47.5vh] pr-3">
           <div class="nc-fields-list">
             <div
               v-if="!fields?.filter((el) => el.title.toLowerCase().includes(filterQuery.toLowerCase())).length"
@@ -421,7 +421,7 @@ useMenuCloseOnEsc(open)
             </Draggable>
           </div>
         </div>
-        <div class="flex pr-6 mt-1 gap-2">
+        <div class="flex pr-4 mt-1 gap-2">
           <NcButton
             v-if="!filterQuery"
             type="ghost"

From ef1f577d73851b70a399e3b6edaca1965280301d Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa@nocodb.com>
Date: Thu, 26 Oct 2023 17:05:39 +0000
Subject: [PATCH 09/13] fix: Removed Create View node in sidebar

---
 .../components/dashboard/TreeView/TableNode.vue     | 13 -------------
 1 file changed, 13 deletions(-)

diff --git a/packages/nc-gui/components/dashboard/TreeView/TableNode.vue b/packages/nc-gui/components/dashboard/TreeView/TableNode.vue
index fc70762f61..dc851e39d0 100644
--- a/packages/nc-gui/components/dashboard/TreeView/TableNode.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/TableNode.vue
@@ -295,19 +295,6 @@ const isTableOpened = computed(() => {
               </NcMenu>
             </template>
           </NcDropdown>
-          <DashboardTreeViewCreateViewBtn v-if="isUIAllowed('viewCreateOrEdit')">
-            <NcButton
-              v-e="['c:view:create']"
-              type="text"
-              size="xxsmall"
-              class="nc-create-view-btn nc-sidebar-node-btn"
-              :class="{
-                '!md:(visible opacity-100)': openedTableId === table.id,
-              }"
-            >
-              <GeneralIcon icon="plus" class="text-xl leading-5" style="-webkit-text-stroke: 0.15px" />
-            </NcButton>
-          </DashboardTreeViewCreateViewBtn>
         </div>
       </div>
       <DlgTableDelete

From 57fcbc718c52102d7bf1ef4029b6cf7027c3af15 Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa@nocodb.com>
Date: Thu, 26 Oct 2023 17:05:39 +0000
Subject: [PATCH 10/13] fix: Made the whole create view btn clickable

---
 .../dashboard/TreeView/CreateViewBtn.vue      | 31 ++++++++++++++++++-
 .../dashboard/TreeView/ViewsList.vue          |  7 +++--
 2 files changed, 34 insertions(+), 4 deletions(-)

diff --git a/packages/nc-gui/components/dashboard/TreeView/CreateViewBtn.vue b/packages/nc-gui/components/dashboard/TreeView/CreateViewBtn.vue
index df777a869e..34cb4118d5 100644
--- a/packages/nc-gui/components/dashboard/TreeView/CreateViewBtn.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/CreateViewBtn.vue
@@ -2,8 +2,15 @@
 import type { ViewType } from 'nocodb-sdk'
 import { ViewTypes } from 'nocodb-sdk'
 
+const props = defineProps<{
+  // Prop used to align the dropdown to the left in sidebar
+  alignLeftLevel: number | undefined
+}>()
+
 const { $e } = useNuxtApp()
 
+const alignLeftLevel = toRef(props, 'alignLeftLevel')
+
 const { refreshCommandPalette } = useCommandPalette()
 const viewsStore = useViewsStore()
 const { loadViews, navigateToView } = viewsStore
@@ -16,6 +23,14 @@ const toBeCreateType = ref<ViewTypes>()
 
 const isOpen = ref(false)
 
+const overlayClassName = computed(() => {
+  if (alignLeftLevel.value === 1) return 'nc-view-create-dropdown nc-view-create-dropdown-left-1'
+
+  if (alignLeftLevel.value === 2) return 'nc-view-create-dropdown nc-view-create-dropdown-left-2'
+
+  return 'nc-view-create-dropdown'
+})
+
 async function onOpenModal({
   title = '',
   type,
@@ -84,7 +99,7 @@ async function onOpenModal({
 </script>
 
 <template>
-  <NcDropdown v-model:visible="isOpen" destroy-popup-on-hide @click.stop="isOpen = true">
+  <NcDropdown v-model:visible="isOpen" destroy-popup-on-hide :overlay-class-name="overlayClassName" @click.stop="isOpen = true">
     <slot />
     <template #overlay>
       <NcMenu class="max-w-48">
@@ -151,3 +166,17 @@ async function onOpenModal({
   @apply text-brand-400;
 }
 </style>
+
+<style lang="scss">
+.nc-view-create-dropdown {
+  @apply !max-w-46 !min-w-46;
+}
+
+.nc-view-create-dropdown-left-1 {
+  @apply !left-18;
+}
+
+.nc-view-create-dropdown-left-2 {
+  @apply !left-23.5;
+}
+</style>
diff --git a/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue b/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue
index f972225c50..d0c0ea4326 100644
--- a/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue
@@ -387,13 +387,14 @@ function onOpenModal({
     <DashboardTreeViewCreateViewBtn
       v-if="isUIAllowed('viewCreateOrEdit')"
       :class="{
-        '!ml-18 !xs:(ml-19.75)': isDefaultSource,
-        '!ml-23.5 !xs:(ml-27)': !isDefaultSource,
+        '!pl-18 !xs:(pl-19.75)': isDefaultSource,
+        '!pl-23.5 !xs:(pl-27)': !isDefaultSource,
       }"
+      :align-left-level="isDefaultSource ? 1 : 2"
     >
       <div
         role="button"
-        class="flex flex-row items-center cursor-pointer rounded-md max-w-40"
+        class="flex flex-row items-center cursor-pointer rounded-md w-full"
         :class="{
           'text-brand-500 hover:text-brand-600': activeTableId === table.id,
           'text-gray-500 hover:text-brand-500': activeTableId !== table.id,

From d454264105781ea35aa7ba6ef9821efddce77d4c Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa@nocodb.com>
Date: Thu, 26 Oct 2023 17:05:39 +0000
Subject: [PATCH 11/13] fix: Typo

---
 packages/nc-gui/components/dashboard/TreeView/TableNode.vue | 1 -
 packages/nc-gui/components/dashboard/TreeView/ViewsList.vue | 4 ++--
 2 files changed, 2 insertions(+), 3 deletions(-)

diff --git a/packages/nc-gui/components/dashboard/TreeView/TableNode.vue b/packages/nc-gui/components/dashboard/TreeView/TableNode.vue
index dc851e39d0..73f730c894 100644
--- a/packages/nc-gui/components/dashboard/TreeView/TableNode.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/TableNode.vue
@@ -181,7 +181,6 @@ const isTableOpened = computed(() => {
               :class="{ '!rotate-180': isExpanded }"
             />
           </NcButton>
-          <!-- <div v-else class="sm:min-w-5.75 xs:min-w-7.5 h-2"></div> -->
           <div class="flex w-auto" :data-testid="`tree-view-table-draggable-handle-${table.title}`">
             <div
               class="flex items-center nc-table-icon"
diff --git a/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue b/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue
index d0c0ea4326..e6dbbad879 100644
--- a/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue
@@ -5,8 +5,8 @@ import type { SortableEvent } from 'sortablejs'
 import Sortable from 'sortablejs'
 import type { Menu as AntMenu } from 'ant-design-vue'
 import {
-  isDefaultBase as _isDefaultBase,
   extractSdkResponseErrorMsg,
+  isDefaultBase,
   message,
   onMounted,
   parseProp,
@@ -86,7 +86,7 @@ const isDefaultSource = computed(() => {
   const source = base.value?.sources?.find((b) => b.id === table.value.source_id)
   if (!source) return false
 
-  return _isDefaultBase(source)
+  return isDefaultBase(source)
 })
 
 /** validate view title */

From ad9a65820d38de74fa834993bbd83d5059f62243 Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa@nocodb.com>
Date: Thu, 26 Oct 2023 17:05:39 +0000
Subject: [PATCH 12/13] fix: Fixed test with new create view UX

---
 packages/nc-gui/components/dashboard/TreeView/ViewsList.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue b/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue
index e6dbbad879..25bb17641f 100644
--- a/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/ViewsList.vue
@@ -394,7 +394,7 @@ function onOpenModal({
     >
       <div
         role="button"
-        class="flex flex-row items-center cursor-pointer rounded-md w-full"
+        class="nc-create-view-btn flex flex-row items-center cursor-pointer rounded-md w-full"
         :class="{
           'text-brand-500 hover:text-brand-600': activeTableId === table.id,
           'text-gray-500 hover:text-brand-500': activeTableId !== table.id,

From 343246c7c78081568c46cab6e98e2c9ca9fb2675 Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa@nocodb.com>
Date: Thu, 26 Oct 2023 17:05:39 +0000
Subject: [PATCH 13/13] fix: Fixed ui of CreateView btn

---
 packages/nc-gui/components/dashboard/TreeView/CreateViewBtn.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/nc-gui/components/dashboard/TreeView/CreateViewBtn.vue b/packages/nc-gui/components/dashboard/TreeView/CreateViewBtn.vue
index 34cb4118d5..a70edb7d0c 100644
--- a/packages/nc-gui/components/dashboard/TreeView/CreateViewBtn.vue
+++ b/packages/nc-gui/components/dashboard/TreeView/CreateViewBtn.vue
@@ -169,7 +169,7 @@ async function onOpenModal({
 
 <style lang="scss">
 .nc-view-create-dropdown {
-  @apply !max-w-46 !min-w-46;
+  @apply !max-w-43 !min-w-43;
 }
 
 .nc-view-create-dropdown-left-1 {