diff --git a/packages/web/src/commands/CommandPalette.svelte b/packages/web/src/commands/CommandPalette.svelte index e24be7340..d14c4a8c8 100644 --- a/packages/web/src/commands/CommandPalette.svelte +++ b/packages/web/src/commands/CommandPalette.svelte @@ -18,7 +18,6 @@ import { filterName } from 'dbgate-datalib'; import _ from 'lodash'; - import { derived } from 'svelte/store'; import { onMount } from 'svelte'; import { commands, getVisibleCommandPalette, visibleCommandPalette } from '../stores'; import clickOutside from '../utility/clickOutside'; @@ -28,6 +27,7 @@ let domInput; let parentCommand; let filter = ''; + const domItems = {}; $: selectedIndex = true ? 0 : filter; @@ -65,7 +65,12 @@ if (e.keyCode == keycodes.downArrow && selectedIndex < filteredItems.length - 1) selectedIndex++; if (e.keyCode == keycodes.enter) handleCommand(filteredItems[selectedIndex]); if (e.keyCode == keycodes.escape) $visibleCommandPalette = false; + + if (e.keyCode == keycodes.pageDown) selectedIndex = Math.min(selectedIndex + 15, filteredItems.length - 1); + if (e.keyCode == keycodes.pageUp) selectedIndex = Math.max(selectedIndex - 15, 0); } + + $: if (domItems[selectedIndex]) domItems[selectedIndex].scrollIntoView({ block: 'nearest', inline: 'nearest' });
($visibleCommandPalette = false)}> @@ -80,7 +85,12 @@
{#each filteredItems as command, index} -
handleCommand(command)}> +
handleCommand(command)} + bind:this={domItems[index]} + >
{command.text}
{#if command.keyText}
{command.keyText}
diff --git a/packages/web/src/commands/recentDatabaseSwitch.ts b/packages/web/src/commands/recentDatabaseSwitch.ts new file mode 100644 index 000000000..06ed00814 --- /dev/null +++ b/packages/web/src/commands/recentDatabaseSwitch.ts @@ -0,0 +1,30 @@ +import _ from 'lodash'; +import { recentDatabases, currentDatabase, getRecentDatabases } from '../stores'; +import registerCommand from './registerCommand'; + +currentDatabase.subscribe(value => { + console.log('DB', value); + if (!value) return; + recentDatabases.update(list => { + const res = [ + value, + ..._.compact(list).filter(x => x.name != value.name || x.connection?._id != value.connection?.id), + ].slice(0, 10); + return res; + }); +}); + +function switchDatabaseCommand(db) { + return { + text: `${db.name} on ${db?.connection?.displayName || db?.connection?.server}`, + onClick: () => currentDatabase.set(db), + }; +} + +registerCommand({ + id: 'database.switch', + category: 'Database', + name: 'Change to recent', + keyText: 'Ctrl+D', + getSubCommands: () => getRecentDatabases().map(switchDatabaseCommand), +}); diff --git a/packages/web/src/commands/stdCommands.ts b/packages/web/src/commands/stdCommands.ts index 6a308a705..cf3678a46 100644 --- a/packages/web/src/commands/stdCommands.ts +++ b/packages/web/src/commands/stdCommands.ts @@ -13,6 +13,7 @@ import getElectron from '../utility/getElectron'; import { openElectronFile } from '../utility/openElectronFile'; import { getDefaultFileFormat } from '../plugins/fileformats'; import { getCurrentConfig } from '../stores'; +import './recentDatabaseSwitch'; const electron = getElectron(); diff --git a/packages/web/src/stores.ts b/packages/web/src/stores.ts index 42692c1a9..9a8ea8c80 100644 --- a/packages/web/src/stores.ts +++ b/packages/web/src/stores.ts @@ -4,6 +4,7 @@ import invalidateCommands from './commands/invalidateCommands'; import getElectron from './utility/getElectron'; import { GlobalCommand } from './commands/registerCommand'; import { useConfig } from './utility/metadataLoaders'; +import _ from 'lodash'; interface TabDefinition { title: string; @@ -39,6 +40,7 @@ export const commands = writable({}); export const currentTheme = writableWithStorage('theme-light', 'currentTheme'); export const activeTabId = derived([openedTabs], ([$openedTabs]) => $openedTabs.find(x => x.selected)?.tabid); export const activeTab = derived([openedTabs], ([$openedTabs]) => $openedTabs.find(x => x.selected)); +export const recentDatabases = writableWithStorage([], 'recentDatabases'); export const visibleToolbar = writableWithStorage(1, 'visibleToolbar'); export const leftPanelWidth = writable(300); @@ -111,3 +113,9 @@ currentConfigStore.subscribe(value => { invalidateCommands(); }); export const getCurrentConfig = () => currentConfigValue; + +let recentDatabasesValue = null; +recentDatabases.subscribe(value => { + recentDatabasesValue = value; +}); +export const getRecentDatabases = () => _.compact(recentDatabasesValue);