fix: design reviews

src/components/common/TreeExplorerV2.vue

@@ -7,7 +7,7 @@
       :get-children="
         (item) => (item.children?.length ? item.children : undefined)
       "
-      class="m-0 p-0"
+      class="m-0 p-0 pb-3"
     >
       <TreeVirtualizer
         v-slot="{ item }"

src/components/sidebar/tabs/NodeLibrarySidebarTabV2.vue

@@ -1,10 +1,7 @@
 <template>
   <SidebarTabTemplate :title="$t('sideToolbar.nodes')">
     <template #header>
-      <TabsRoot
-        v-model="selectedTab"
-        class="flex flex-col"
-      >
+      <TabsRoot v-model="selectedTab" class="flex flex-col">
         <div class="flex items-center justify-between gap-2 px-2 pb-2 2xl:px-4">
           <SearchBox
             ref="searchBoxRef"
@@ -37,7 +34,7 @@
                     <DropdownMenuItemIndicator class="w-4">
                       <i class="icon-[lucide--check] size-4" />
                     </DropdownMenuItemIndicator>
-                    <span>{{ $t(option.label) }}</span>                  
+                    <span>{{ $t(option.label) }}</span>
                   </DropdownMenuRadioItem>
                 </DropdownMenuRadioGroup>
               </DropdownMenuContent>
@@ -71,10 +68,7 @@
     <template #body>
       <NodeDragPreview />
       <!-- Tab content (scrollable) -->
-      <TabsRoot
-        v-model="selectedTab"
-        class="flex min-h-0 flex-1 flex-col"
-      >
+      <TabsRoot v-model="selectedTab" class="h-full">
         <EssentialNodesPanel
           v-model:expanded-keys="expandedKeys"
           :root="renderedEssentialRoot"
@@ -154,7 +148,10 @@ const sortOrderByTab = useLocalStorage<Record<TabId, SortingStrategyId>>(
 const sortOrder = computed({
   get: () => sortOrderByTab.value[selectedTab.value],
   set: (value) => {
-    sortOrderByTab.value = { ...sortOrderByTab.value, [selectedTab.value]: value }
+    sortOrderByTab.value = {
+      ...sortOrderByTab.value,
+      [selectedTab.value]: value
+    }
   }
 })
 

src/components/sidebar/tabs/nodeLibrary/AllNodesPanel.vue

@@ -1,9 +1,9 @@
 <template>
-  <TabsContent value="all" class="min-h-0 flex-1 overflow-y-auto">
+  <TabsContent value="all" class="flex-1 overflow-y-auto h-full">
     <!-- Favorites section -->
     <template v-if="hasFavorites">
       <h3
-        class="px-4 py-2 text-xs font-medium uppercase tracking-wide text-muted-foreground"
+        class="px-4 py-2 text-xs font-medium uppercase tracking-wide text-muted-foreground mb-0"
       >
         {{ $t('sideToolbar.nodeLibraryTab.sections.favorites') }}
       </h3>
@@ -19,7 +19,7 @@
     <div v-for="(section, index) in sections" :key="section.title ?? index">
       <h3
         v-if="section.title"
-        class="px-4 py-2 text-xs font-medium tracking-wide text-muted-foreground"
+        class="px-4 py-2 text-xs font-medium tracking-wide text-muted-foreground mb-0"
       >
         {{ section.title }}
       </h3>

src/components/sidebar/tabs/nodeLibrary/CustomNodesPanel.vue

@@ -1,10 +1,14 @@
 <template>
-  <TabsContent value="custom" class="min-h-0 flex-1 overflow-y-auto">
-    <div v-for="(section, index) in sections" :key="section.title ?? index">
+  <TabsContent value="custom" class="flex-1 flex flex-col h-full">
+    <div
+      v-for="(section, index) in sections"
+      :key="section.title ?? index"
+      class="flex-1 overflow-y-auto h-full"
+    >
       <!-- Section header -->
       <h3
         v-if="section.title"
-        class="px-4 py-2 text-xs font-medium tracking-wide text-muted-foreground"
+        class="px-4 py-2 text-xs font-medium tracking-wide text-muted-foreground mb-0"
       >
         {{ section.title }}
       </h3>
@@ -16,14 +20,16 @@
         @node-click="(node) => emit('nodeClick', node)"
       />
     </div>
-    <Button
-      variant="secondary"
-      class="justify-start gap-3 ml-4 mt-2 px-4"
-      @click="handleOpenManager"
-    >
-      <i class="icon-[lucide--puzzle] size-5 text-muted-foreground" />
-      {{ $t('g.openManager') }}
-    </Button>
+    <div class="flex-none py-3 border-t border-border-default text-center">
+      <Button
+        variant="secondary"
+        class="justify-start gap-3"
+        @click="handleOpenManager"
+      >
+        <i class="icon-[lucide--blocks] size-5 text-muted-foreground" />
+        {{ $t('g.manageExtensions') }}
+      </Button>
+    </div>
   </TabsContent>
 </template>
 

src/components/sidebar/tabs/nodeLibrary/EssentialNodesPanel.vue

@@ -1,6 +1,6 @@
 <template>
-  <TabsContent value="essentials" class="min-h-0 flex-1 overflow-y-auto px-3">
-    <div class="flex flex-col gap-2">
+  <TabsContent value="essentials" class="flex-1 overflow-y-auto px-3 h-full">
+    <div class="flex flex-col gap-2 pb-3">
       <CollapsibleRoot
         v-for="folder in folders"
         :key="folder.key"
@@ -9,7 +9,7 @@
         @update:open="toggleFolder(folder.key, $event)"
       >
         <CollapsibleTrigger
-          class="group flex w-full cursor-pointer items-center justify-between border-0 bg-transparent py-3 text-xs font-medium tracking-wide text-muted-foreground h-8 box-content"
+          class="group flex w-full cursor-pointer items-center justify-between border-0 bg-transparent py-3 px-1 text-xs font-medium tracking-wide text-muted-foreground h-8 box-content"
         >
           <span class="uppercase">{{ folder.label }}</span>
           <i

src/locales/en/main.json

@@ -116,6 +116,7 @@
     "defaultBanner": "default banner",
     "enableOrDisablePack": "Enable or disable pack",
     "openManager": "Open Manager",
+    "manageExtensions": "Manage extensions",
     "graphNavigation": "Graph navigation",
     "dropYourFileOr": "Drop your file or",
     "back": "Back",