From ce411f27e907fa4434bab67145bde74b2c2b5796 Mon Sep 17 00:00:00 2001
From: t8y2 <1156263951@qq.com>
Date: Mon, 1 Jun 2026 13:55:55 +0800
Subject: [PATCH] fix(sidebar): reorder connection toolbar actions

---
 .../src/components/layout/AppSidebar.vue      | 38 ++++++++++++-------
 .../src/components/sidebar/ConnectionTree.vue | 10 +----
 2 files changed, 26 insertions(+), 22 deletions(-)

diff --git a/apps/desktop/src/components/layout/AppSidebar.vue b/apps/desktop/src/components/layout/AppSidebar.vue
index a0a7f1212..ba6f39e42 100644
--- a/apps/desktop/src/components/layout/AppSidebar.vue
+++ b/apps/desktop/src/components/layout/AppSidebar.vue
@@ -2,7 +2,7 @@
 import { computed, ref } from "vue";
 import { useI18n } from "vue-i18n";
 import { translateBackendError } from "@/i18n/backend-errors";
-import { Upload, Download, RefreshCw } from "lucide-vue-next";
+import { Upload, Download, FolderPlus, RefreshCw } from "lucide-vue-next";
 import { Button } from "@/components/ui/button";
 import { Tooltip, TooltipTrigger, TooltipContent } from "@/components/ui/tooltip";
 import LightDropdown from "@/components/ui/LightDropdown.vue";
@@ -39,6 +39,10 @@ async function refreshTree() {
   }
 }
 
+function createNewGroup() {
+  void connectionTreeRef.value?.createNewGroup();
+}
+
 function focusSearch(): boolean {
   return connectionTreeRef.value?.focusSearch() ?? false;
 }
@@ -61,22 +65,14 @@ defineExpose({ focusSearch });
           t("sidebar.connections")
         }}</span>
         <span class="flex-1 self-stretch" data-tauri-drag-region />
-        <Tooltip>
-          <TooltipTrigger as-child>
-            <Button variant="ghost" size="icon" class="h-5 w-5" @click="refreshTree">
-              <RefreshCw class="h-3 w-3" />
-            </Button>
-          </TooltipTrigger>
-          <TooltipContent>{{ t("contextMenu.refreshChildren") }}</TooltipContent>
-        </Tooltip>
         <LightDropdown
           model-value=""
           :items="importSourceItems"
           :aria-label="t('sidebar.import')"
           :trigger-title="t('sidebar.import')"
           :trigger-icon="Upload"
-          trigger-class="inline-flex h-5 w-5 items-center justify-center rounded-md hover:bg-accent hover:text-accent-foreground"
-          trigger-icon-class="h-3 w-3"
+          trigger-class="inline-flex h-6 w-6 items-center justify-center rounded-md hover:bg-accent hover:text-accent-foreground"
+          trigger-icon-class="h-3.5 w-3.5"
           content-class="w-44"
           :show-trigger-label="false"
           :show-chevron="false"
@@ -87,12 +83,28 @@ defineExpose({ focusSearch });
         />
         <Tooltip>
           <TooltipTrigger as-child>
-            <Button variant="ghost" size="icon" class="h-5 w-5" @click="emit('export')">
-              <Download class="h-3 w-3" />
+            <Button variant="ghost" size="icon" class="h-6 w-6" @click="emit('export')">
+              <Download class="h-3.5 w-3.5" />
             </Button>
           </TooltipTrigger>
           <TooltipContent>{{ t("sidebar.export") }}</TooltipContent>
         </Tooltip>
+        <Tooltip>
+          <TooltipTrigger as-child>
+            <Button variant="ghost" size="icon" class="h-6 w-6" @click="createNewGroup">
+              <FolderPlus class="h-3.5 w-3.5" />
+            </Button>
+          </TooltipTrigger>
+          <TooltipContent>{{ t("connectionGroup.createGroup") }}</TooltipContent>
+        </Tooltip>
+        <Tooltip>
+          <TooltipTrigger as-child>
+            <Button variant="ghost" size="icon" class="h-6 w-6" @click="refreshTree">
+              <RefreshCw class="h-3.5 w-3.5" />
+            </Button>
+          </TooltipTrigger>
+          <TooltipContent>{{ t("contextMenu.refreshChildren") }}</TooltipContent>
+        </Tooltip>
       </div>
       <div class="flex-1 min-h-0">
         <ConnectionTree ref="connectionTreeRef" />
diff --git a/apps/desktop/src/components/sidebar/ConnectionTree.vue b/apps/desktop/src/components/sidebar/ConnectionTree.vue
index a157de73e..3fda46931 100644
--- a/apps/desktop/src/components/sidebar/ConnectionTree.vue
+++ b/apps/desktop/src/components/sidebar/ConnectionTree.vue
@@ -5,7 +5,6 @@ import {
   Search,
   X,
   ListFilter,
-  FolderPlus,
   Crosshair,
   Server,
   Database,
@@ -425,7 +424,7 @@ function onSearchKeydown(event: KeyboardEvent) {
   searchQuery.value = "";
 }
 
-defineExpose({ focusSearch });
+defineExpose({ focusSearch, createNewGroup });
 </script>
 
 <template>
@@ -459,13 +458,6 @@ defineExpose({ focusSearch });
         >
           <Crosshair class="h-3.5 w-3.5" />
         </button>
-        <button
-          class="shrink-0 h-6 w-6 flex items-center justify-center rounded border border-border text-muted-foreground hover:bg-accent hover:text-foreground"
-          :title="t('connectionGroup.createGroup')"
-          @click="createNewGroup"
-        >
-          <FolderPlus class="h-3.5 w-3.5" />
-        </button>
         <LightDropdown
           v-if="searchScopeOptions.length > 0"
           model-value=""