refactor(gui-v2): make view list section grow

Signed-off-by: Pranav C <pranavxc@gmail.com>

packages/nc-gui-v2/components/smartsheet-toolbar/ViewActions.vue

@@ -44,6 +44,8 @@ const showWebhookDrawer = ref(false)
 
 const quickImportDialog = ref(false)
 
+const showApiSnippet = ref(false)
+
 const { isUIAllowed } = useUIPermission()
 
 const exportFile = async (exportType: ExportTypes) => {
@@ -151,7 +153,6 @@ async function changeLockType(type: LockType) {
             >
               <template #title>
                 <div v-t="['c:navdraw:preview-as']" class="nc-project-menu-item group px-0">
-
                   <SmartsheetToolbarLockType hide-tick :type="selectedView?.lock_type || LockType.Collaborative" />
 
                   <MaterialSymbolsChevronRightRounded
@@ -255,6 +256,17 @@ async function changeLockType(type: LockType) {
                 {{ $t('objects.webhooks') }}
               </div>
             </a-menu-item>
+            <a-menu-item>
+              <div
+                v-if="isUIAllowed('webhook') && !isView && !isPublicView"
+                v-t="['c:actions:webhook']"
+                class="py-2 flex gap-2"
+                @click="showWebhookDrawer = true"
+              >
+                <MdiHook class="text-gray-500" />
+                <mdi-hook />{{ $t('objects.webhooks') }}
+              </div>
+            </a-menu-item>
           </a-menu-item-group>
         </a-menu>
       </template>

packages/nc-gui-v2/components/smartsheet/sidebar/MenuBottom.vue

@@ -9,33 +9,19 @@ interface Emits {
 
 const emits = defineEmits<Emits>()
 
-const { $e } = useNuxtApp()
-
 const { isUIAllowed } = useUIPermission()
 
 const isView = ref(false)
 
-let showApiSnippet = $ref(false)
-
 const showWebhookDrawer = ref(false)
 
-function onApiSnippet() {
-  // get API snippet
-  showApiSnippet = true
-  $e('a:view:api-snippet')
-}
-
-function onWebhooks() {
-  showWebhookDrawer.value = true
-}
-
 function onOpenModal(type: ViewTypes, title = '') {
   emits('openModal', { type, title })
 }
 </script>
 
 <template>
-  <a-menu :selected-keys="[]" class="flex-1 flex flex-col">
+  <a-menu :selected-keys="[]" class="flex flex-col">
     <div class="flex-1"></div>
     <div v-if="isUIAllowed('virtualViewsCreateOrEdit')">
       <h3 class="px-3 py-1 text-xs font-semibold flex items-center gap-4 text-gray-500">
@@ -112,26 +98,9 @@ function onOpenModal(type: ViewTypes, title = '') {
       <div class="w-full h-4"></div>
     </div>
 
-    <!--    <SmartsheetSidebarMenuApiSnippet v-model="showApiSnippet" /> -->
-
-    <!--    <div class="flex-auto justify-end flex flex-col gap-3 mt-3"> -->
-    <!--      <button -->
-    <!--        v-if="isUIAllowed('virtualViewsCreateOrEdit')" -->
-    <!--        class="flex items-center gap-2 w-full mx-3 px-4 py-3 rounded border transform translate-x-4 hover:(translate-x-0 shadow-lg) transition duration-150 ease !text-xs nc-webhook-btn" -->
-    <!--        @click="onWebhooks" -->
-    <!--      > -->
-    <!--        <mdi-hook />{{ $t('objects.webhooks') }} -->
-    <!--      </button> -->
-
-    <!--      <button -->
-    <!--        class="flex items-center gap-2 w-full mx-3 px-4 py-3 rounded border transform translate-x-4 hover:(translate-x-0 shadow-lg) transition duration-150 ease !text-xs" -->
-    <!--        @click="onApiSnippet" -->
-    <!--      > -->
-    <!--        <mdi-xml />Get API Snippet -->
-    <!--      </button> -->
-    <!--    </div> -->
-
-    <!--    <general-flipping-card class="my-4 lg:my-6 min-h-[100px]" :triggers="['click', { duration: 15000 }]">
+    <!--
+       todo: bring back later
+       <general-flipping-card class="my-4 lg:my-6 min-h-[100px]" :triggers="['click', { duration: 15000 }]">
       <template #front>
         <div class="flex h-full w-full gap-6 flex-col">
           <general-social />

packages/nc-gui-v2/components/smartsheet/sidebar/MenuTop.vue

@@ -197,7 +197,7 @@ function onDeleted() {
 
 <style lang="scss">
 .nc-views-menu {
-  @apply flex-1 max-h-[30vh] overflow-y-scroll scrollbar-thin-dull;
+  @apply flex-1 overflow-y-scroll scrollbar-thin-dull;
 
   .ghost,
   .ghost > * {

packages/nc-gui-v2/components/smartsheet/sidebar/index.vue

@@ -131,7 +131,7 @@ function onCreate(view: GridType | FormType | KanbanType | GalleryType) {
     </Toolbar>
 -->
     <div v-if="isOpen" class="flex-1 flex flex-col">
-      <MenuTop @open-modal="openModal" @deleted="loadViews" @sorted="loadViews" />
+      <MenuTop class="flex-1" @open-modal="openModal" @deleted="loadViews" @sorted="loadViews" />
 
       <a-divider v-if="isUIAllowed('virtualViewsCreateOrEdit')" class="my-2" />