diff --git a/packages/web/src/appobj/AppObjectGroup.svelte b/packages/web/src/appobj/AppObjectGroup.svelte index 97d04a834..e7f791602 100644 --- a/packages/web/src/appobj/AppObjectGroup.svelte +++ b/packages/web/src/appobj/AppObjectGroup.svelte @@ -15,6 +15,7 @@ export let checkedObjectsStore = null; export let disableContextMenu = false; export let passProps; + export let onDropOnGroup = undefined; let isExpanded = true; @@ -36,7 +37,17 @@ } -
(isExpanded = !isExpanded)}> +
(isExpanded = !isExpanded)} + on:drop={e => { + var data = e.dataTransfer.getData('app_object_drag_data'); + if (data && onDropOnGroup) { + e.stopPropagation(); + onDropOnGroup(data, group); + } + }} +> diff --git a/packages/web/src/appobj/AppObjectList.svelte b/packages/web/src/appobj/AppObjectList.svelte index c301a168f..d95b14f23 100644 --- a/packages/web/src/appobj/AppObjectList.svelte +++ b/packages/web/src/appobj/AppObjectList.svelte @@ -21,6 +21,7 @@ export let groupIconFunc = plusExpandIcon; export let groupFunc = undefined; + export let onDropOnGroup = undefined; $: filtered = !groupFunc ? list.filter(data => { @@ -83,6 +84,7 @@ {passProps} {getIsExpanded} {setIsExpanded} + {onDropOnGroup} /> {/each} {:else} diff --git a/packages/web/src/widgets/ConnectionList.svelte b/packages/web/src/widgets/ConnectionList.svelte index 9e9a7d3cf..f6e5e5d25 100644 --- a/packages/web/src/widgets/ConnectionList.svelte +++ b/packages/web/src/widgets/ConnectionList.svelte @@ -26,6 +26,7 @@ import LargeButton from '../buttons/LargeButton.svelte'; import { matchingProps } from '../tabs/TableDataTab.svelte'; import { plusExpandIcon, chevronExpandIcon } from '../icons/expandIcons'; + import { safeJsonParse } from 'dbgate-tools'; const connections = useConnectionList(); const serverStatus = useServerStatus(); @@ -41,8 +42,12 @@ x => !x.unsaved || $openedConnections.includes(x._id) || $openedSingleDatabaseConnections.includes(x._id) ); - $: connectionsWithParent = connectionsWithStatusFiltered ? connectionsWithStatusFiltered?.filter((x) => x.parent !== undefined && x.parent !== null && x.parent.length !== 0) : []; - $: connectionsWithoutParent = connectionsWithStatusFiltered ? connectionsWithStatusFiltered?.filter((x) => x.parent === undefined || x.parent === null || x.parent.length === 0) : []; + $: connectionsWithParent = connectionsWithStatusFiltered + ? connectionsWithStatusFiltered?.filter(x => x.parent !== undefined && x.parent !== null && x.parent.length !== 0) + : []; + $: connectionsWithoutParent = connectionsWithStatusFiltered + ? connectionsWithStatusFiltered?.filter(x => x.parent === undefined || x.parent === null || x.parent.length === 0) + : []; const handleRefreshConnections = () => { for (const conid of $openedConnections) { @@ -50,6 +55,16 @@ } }; + const handleDropOnGroup = (data, group) => { + const json = safeJsonParse(data); + if (json?._id) { + apiCall('connections/update', { + _id: json?._id, + values: { parent: group }, + }); + } + }; + const connectionColorFactory = useConnectionColorFactory(3); @@ -65,7 +80,14 @@ - + { + var data = e.dataTransfer.getData('app_object_drag_data'); + if (data) { + handleDropOnGroup(data, ''); + } + }} +> (getConnectionLabel(connection) || '').toUpperCase())} module={connectionAppObject} @@ -81,9 +103,10 @@ groupIconFunc={chevronExpandIcon} groupFunc={data => data.parent} expandIconFunc={plusExpandIcon} + onDropOnGroup={handleDropOnGroup} /> {#if connectionsWithParent?.length > 0 && connectionsWithoutParent?.length > 0} -
+
{/if} (getConnectionLabel(connection) || '').toUpperCase())} @@ -108,8 +131,6 @@ {/if} - -