From 19f138ad226302c8314ef591df36214ca626da1d Mon Sep 17 00:00:00 2001
From: t8y2 <1156263951@qq.com>
Date: Thu, 30 Apr 2026 12:32:53 +0800
Subject: [PATCH] feat: update version to 0.2.0 and enhance ConnectionTree
 component with search functionality

---
 src-tauri/Cargo.lock                      |  2 +-
 src/components/sidebar/ConnectionTree.vue | 44 ++++++++++++++++++++++-
 2 files changed, 44 insertions(+), 2 deletions(-)

diff --git a/src-tauri/Cargo.lock b/src-tauri/Cargo.lock
index 73e371175..220cecf8d 100644
--- a/src-tauri/Cargo.lock
+++ b/src-tauri/Cargo.lock
@@ -1111,7 +1111,7 @@ checksum = "a4ae5f15dda3c708c0ade84bfee31ccab44a3da4f88015ed22f63732abe300c8"
 
 [[package]]
 name = "dbx"
-version = "0.1.0"
+version = "0.2.0"
 dependencies = [
  "anyhow",
  "chrono",
diff --git a/src/components/sidebar/ConnectionTree.vue b/src/components/sidebar/ConnectionTree.vue
index 8c4bd54ec..2da4a9e43 100644
--- a/src/components/sidebar/ConnectionTree.vue
+++ b/src/components/sidebar/ConnectionTree.vue
@@ -1,15 +1,57 @@
 <script setup lang="ts">
+import { ref, computed } from "vue";
 import { useI18n } from "vue-i18n";
+import { Search, X } from "lucide-vue-next";
 import { useConnectionStore } from "@/stores/connectionStore";
+import type { TreeNode } from "@/types/database";
 import TreeItem from "./TreeItem.vue";
 
 const { t } = useI18n();
 const store = useConnectionStore();
+const searchQuery = ref("");
+
+function matchesQuery(node: TreeNode, q: string): boolean {
+  if (node.label.toLowerCase().includes(q)) return true;
+  return node.children?.some((child) => matchesQuery(child, q)) ?? false;
+}
+
+function filterTree(nodes: TreeNode[], q: string): TreeNode[] {
+  return nodes
+    .filter((node) => matchesQuery(node, q))
+    .map((node) => {
+      if (!node.children) return node;
+      const filtered = filterTree(node.children, q);
+      return { ...node, children: filtered, isExpanded: filtered.length > 0 };
+    });
+}
+
+const filteredNodes = computed(() => {
+  const q = searchQuery.value.trim().toLowerCase();
+  if (!q) return store.treeNodes;
+  return filterTree(store.treeNodes, q);
+});
 </script>
 
 <template>
   <div class="text-sm select-none">
-    <TreeItem v-for="node in store.treeNodes" :key="node.id" :node="node" :depth="0" />
+    <div v-if="store.treeNodes.length > 0" class="sticky top-0 z-10 bg-background px-2 py-1">
+      <div class="relative">
+        <Search class="absolute left-2 top-1/2 -translate-y-1/2 h-3 w-3 text-muted-foreground" />
+        <input
+          v-model="searchQuery"
+          class="w-full h-6 pl-7 pr-6 text-xs rounded border border-border bg-background focus:outline-none focus:ring-1 focus:ring-ring"
+          :placeholder="t('grid.search')"
+        />
+        <button
+          v-if="searchQuery"
+          class="absolute right-1.5 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground"
+          @click="searchQuery = ''"
+        >
+          <X class="h-3 w-3" />
+        </button>
+      </div>
+    </div>
+    <TreeItem v-for="node in filteredNodes" :key="node.id" :node="node" :depth="0" />
     <div v-if="store.treeNodes.length === 0" class="px-3 py-8 text-center text-muted-foreground text-xs">
       {{ t('sidebar.noConnections') }}
     </div>