diff --git a/packages/web/src/appobj/AppObjectList.svelte b/packages/web/src/appobj/AppObjectList.svelte index a289121a5..29113585a 100644 --- a/packages/web/src/appobj/AppObjectList.svelte +++ b/packages/web/src/appobj/AppObjectList.svelte @@ -28,6 +28,7 @@ export let emptyGroupNames = []; export let collapsedGroupNames = writable([]); + export let onChangeFilteredList; $: filtered = !groupFunc ? list.filter(data => { diff --git a/packages/web/src/widgets/AppObjectListHandler.svelte b/packages/web/src/widgets/AppObjectListHandler.svelte index 92651215c..6bc6f2007 100644 --- a/packages/web/src/widgets/AppObjectListHandler.svelte +++ b/packages/web/src/widgets/AppObjectListHandler.svelte @@ -8,15 +8,31 @@ export let selectedObjectMatcher; export let module; + export let onScrollTop = null; + let isListFocused = false; function handleKeyDown(ev) { function selectByDiff(diff) { const selected = getSelectedObject(); const index = _.findIndex(list, x => selectedObjectMatcher(x, selected)); - if (index >= 0 && list[index + diff]) { - selectedObjectStore.set(list[index + diff]); - module.handleObjectClick(list[index + diff], { tabPreviewMode: true }); + if (index >= 0) { + let newIndex = index + diff; + if (newIndex >= list.length) { + newIndex = list.length - 1; + } + if (newIndex < 0) { + newIndex = 0; + } + + if (list[newIndex]) { + selectedObjectStore.set(list[newIndex]); + module.handleObjectClick(list[newIndex], { tabPreviewMode: true }); + } + + if (newIndex == 0 && onScrollTop) { + onScrollTop(); + } } } if (ev.keyCode == keycodes.upArrow) { @@ -31,6 +47,27 @@ module.handleObjectClick(getSelectedObject(), { tabPreviewMode: false, focusTab: true }); ev.preventDefault(); } + if (ev.keyCode == keycodes.pageDown) { + selectByDiff(10); + ev.preventDefault(); + } + if (ev.keyCode == keycodes.pageUp) { + selectByDiff(-10); + ev.preventDefault(); + } + if (ev.keyCode == keycodes.home) { + if (list[0]) { + selectedObjectStore.set(list[0]); + module.handleObjectClick(list[0], { tabPreviewMode: true }); + onScrollTop?.(); + } + } + if (ev.keyCode == keycodes.end) { + if (list[list.length - 1]) { + selectedObjectStore.set(list[list.length - 1]); + module.handleObjectClick(list[list.length - 1], { tabPreviewMode: true }); + } + } } diff --git a/packages/web/src/widgets/SqlObjectList.svelte b/packages/web/src/widgets/SqlObjectList.svelte index dbadc306b..39d8a269d 100644 --- a/packages/web/src/widgets/SqlObjectList.svelte +++ b/packages/web/src/widgets/SqlObjectList.svelte @@ -55,6 +55,7 @@ export let database; let filter = ''; + let domContainer = null; $: objects = useDatabaseInfo({ conid, database }); $: status = useDatabaseStatus({ conid, database }); @@ -175,18 +176,19 @@ negativeMarginTop /> - + {#if ($status && ($status.name == 'pending' || $status.name == 'checkStructure' || $status.name == 'loadStructure') && $objects) || !$objects} {:else} ($appliedCurrentSchema ? x.schemaName == $appliedCurrentSchema : true)) - .map(x => ({ ...x, conid, database }))} + list={flatFilteredList.map(x => ({ ...x, conid, database }))} selectedObjectStore={selectedDatabaseObjectAppObject} getSelectedObject={getSelectedDatabaseObjectAppObject} selectedObjectMatcher={matchDatabaseObjectAppObject} module={databaseObjectAppObject} + onScrollTop={() => { + domContainer?.scrollTop(); + }} > + + +