diff --git a/packages/web/src/appobj/AppObjectGroup.svelte b/packages/web/src/appobj/AppObjectGroup.svelte index 82ddc457d..43eb3ad63 100644 --- a/packages/web/src/appobj/AppObjectGroup.svelte +++ b/packages/web/src/appobj/AppObjectGroup.svelte @@ -18,8 +18,9 @@ export let passProps; export let onDropOnGroup = undefined; export let groupContextMenu = null; + export let collapsedGroupNames; - let isExpanded = true; + $: isExpanded = !$collapsedGroupNames.includes(group); $: filtered = items.filter(x => x.isMatched); $: countText = filtered.length < items.length ? `${filtered.length}/${items.length}` : `${items.length}`; @@ -49,7 +50,11 @@
(isExpanded = !isExpanded)} + on:click={() => + collapsedGroupNames.update(names => { + if (names.includes(group)) return names.filter(x => x != group); + return [...names, group]; + })} on:drop={handleDrop} use:contextMenu={() => groupContextMenu(group)} > diff --git a/packages/web/src/appobj/AppObjectList.svelte b/packages/web/src/appobj/AppObjectList.svelte index 675f3ca1a..a289121a5 100644 --- a/packages/web/src/appobj/AppObjectList.svelte +++ b/packages/web/src/appobj/AppObjectList.svelte @@ -5,6 +5,7 @@ import { plusExpandIcon } from '../icons/expandIcons'; import AppObjectListItem from './AppObjectListItem.svelte'; + import { writable } from 'svelte/store'; export let list; export let module; @@ -26,6 +27,8 @@ export let onDropOnGroup = undefined; export let emptyGroupNames = []; + export let collapsedGroupNames = writable([]); + $: filtered = !groupFunc ? list.filter(data => { const matcher = module.createMatcher && module.createMatcher(data); @@ -100,6 +103,7 @@ {setIsExpanded} {onDropOnGroup} {groupContextMenu} + {collapsedGroupNames} /> {/each} {:else} diff --git a/packages/web/src/stores.ts b/packages/web/src/stores.ts index b68db116a..a45a9812c 100644 --- a/packages/web/src/stores.ts +++ b/packages/web/src/stores.ts @@ -57,6 +57,7 @@ export const visibleSelectedWidget = derived( ([$selectedWidget, $visibleWidgetSideBar]) => ($visibleWidgetSideBar ? $selectedWidget : null) ); export const emptyConnectionGroupNames = writableWithStorage([], 'emptyConnectionGroupNames'); +export const collapsedConnectionGroupNames = writableWithStorage([], 'collapsedConnectionGroupNames'); export const openedConnections = writable([]); export const openedSingleDatabaseConnections = writable([]); export const expandedConnections = writable([]); diff --git a/packages/web/src/widgets/ConnectionList.svelte b/packages/web/src/widgets/ConnectionList.svelte index c7be3892e..ff0073fea 100644 --- a/packages/web/src/widgets/ConnectionList.svelte +++ b/packages/web/src/widgets/ConnectionList.svelte @@ -15,6 +15,7 @@ openedSingleDatabaseConnections, openedTabs, emptyConnectionGroupNames, + collapsedConnectionGroupNames, } from '../stores'; import runCommand from '../commands/runCommand'; import getConnectionLabel from '../utility/getConnectionLabel'; @@ -149,6 +150,7 @@ emptyGroupNames={$emptyConnectionGroupNames} sortGroups groupContextMenu={createGroupContextMenu} + collapsedGroupNames={collapsedConnectionGroupNames} /> {#if (connectionsWithParent?.length > 0 && connectionsWithoutParent?.length > 0) || ($emptyConnectionGroupNames.length > 0 && connectionsWithoutParent?.length > 0)}