mirror of
https://github.com/t8y2/dbx.git
synced 2026-10-30 08:20:33 +00:00
fix(sidebar): allow collapsing search results
This commit is contained in:
@@ -21,6 +21,7 @@ const store = useConnectionStore();
|
||||
const searchQuery = ref("");
|
||||
const deferredSearchQuery = ref("");
|
||||
const selectedTypes = ref<string[]>([]);
|
||||
const searchCollapsedIds = ref<Set<string>>(new Set());
|
||||
let searchTimer: number | undefined;
|
||||
|
||||
watch(
|
||||
@@ -41,6 +42,7 @@ watch(
|
||||
{ flush: "sync" },
|
||||
);
|
||||
|
||||
const isSearching = computed(() => !!deferredSearchQuery.value);
|
||||
const isFiltering = computed(() => !!searchQuery.value.trim() || hasTypeFilter.value);
|
||||
|
||||
const typeStats = computed(() => {
|
||||
@@ -100,7 +102,11 @@ function filterTree(nodes: TreeNode[], q: string): TreeNode[] {
|
||||
filteredNodes.push(node);
|
||||
} else {
|
||||
const children = filteredChildren ?? [];
|
||||
filteredNodes.push({ ...node, children, isExpanded: children.length > 0 });
|
||||
filteredNodes.push({
|
||||
...node,
|
||||
children,
|
||||
isExpanded: children.length > 0 && !searchCollapsedIds.value.has(node.id),
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -145,6 +151,14 @@ function createNewGroup() {
|
||||
const groupId = store.createConnectionGroup(t("connectionGroup.newGroupDefault"));
|
||||
pendingRenameGroupId.value = groupId;
|
||||
}
|
||||
|
||||
function onSearchToggle(node: TreeNode) {
|
||||
if (!isSearching.value || !node.children) return;
|
||||
const next = new Set(searchCollapsedIds.value);
|
||||
if (node.isExpanded) next.add(node.id);
|
||||
else next.delete(node.id);
|
||||
searchCollapsedIds.value = next;
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -219,6 +233,7 @@ function createNewGroup() {
|
||||
:depth="0"
|
||||
:drag-disabled="isFiltering"
|
||||
:pending-rename="pendingRenameGroupId === node.id"
|
||||
@search-toggle="onSearchToggle"
|
||||
@rename-started="pendingRenameGroupId = null"
|
||||
/>
|
||||
<div v-if="store.treeNodes.length === 0" class="px-3 py-8 text-center text-muted-foreground text-xs">
|
||||
|
||||
@@ -106,6 +106,7 @@ const props = defineProps<{
|
||||
|
||||
const emit = defineEmits<{
|
||||
"rename-started": [];
|
||||
"search-toggle": [node: TreeNode];
|
||||
}>();
|
||||
|
||||
const isExportingDatabase = ref(false);
|
||||
@@ -212,6 +213,7 @@ function isGroupLabel(node: TreeNode): boolean {
|
||||
async function toggle() {
|
||||
const node = props.node;
|
||||
if (node.isLoading) return;
|
||||
emit("search-toggle", node);
|
||||
|
||||
if (node.type === "connection-group") {
|
||||
node.isExpanded = !node.isExpanded;
|
||||
@@ -1396,6 +1398,7 @@ const isDragging = computed(() => dragState.active && dragState.draggedId === pr
|
||||
:node="child"
|
||||
:depth="depth + 1"
|
||||
:drag-disabled="dragDisabled"
|
||||
@search-toggle="emit('search-toggle', $event)"
|
||||
/>
|
||||
<div
|
||||
v-if="hasMoreChildren"
|
||||
|
||||
Reference in New Issue
Block a user