diff --git a/packages/web/src/appobj/DatabaseObjectAppObject.svelte b/packages/web/src/appobj/DatabaseObjectAppObject.svelte index c8c2760c8..028565f0f 100644 --- a/packages/web/src/appobj/DatabaseObjectAppObject.svelte +++ b/packages/web/src/appobj/DatabaseObjectAppObject.svelte @@ -3,7 +3,7 @@ export const createMatcher = ({ pureName }) => filter => filterName(filter, pureName); const electron = getElectron(); - const icons = { + export const databaseObjectIcons = { tables: 'img table', collections: 'img collection', views: 'img view', @@ -337,7 +337,7 @@ { title: scriptTemplate ? 'Query #' : pureName, tooltip, - icon: scriptTemplate ? 'img sql-file' : icons[objectTypeField], + icon: scriptTemplate ? 'img sql-file' : databaseObjectIcons[objectTypeField], tabComponent: scriptTemplate ? 'QueryTab' : tabComponent, props: { schemaName, @@ -548,7 +548,7 @@ module={$$props.module} {data} title={data.schemaName ? `${data.schemaName}.${data.pureName}` : data.pureName} - icon={icons[data.objectTypeField]} + icon={databaseObjectIcons[data.objectTypeField]} menu={createMenu} on:click={() => handleClick()} on:middleclick={() => handleClick(true)} diff --git a/packages/web/src/commands/CommandPalette.svelte b/packages/web/src/commands/CommandPalette.svelte index 284ac70e7..7f78b3c6a 100644 --- a/packages/web/src/commands/CommandPalette.svelte +++ b/packages/web/src/commands/CommandPalette.svelte @@ -11,8 +11,8 @@ toolbar: true, showDisabled: true, icon: 'icon menu', - onClick: () => visibleCommandPalette.set(true), - testEnabled: () => !getVisibleCommandPalette(), + onClick: () => visibleCommandPalette.set('menu'), + testEnabled: () => getVisibleCommandPalette() != 'menu', }); registerCommand({ @@ -20,12 +20,29 @@ category: 'Database', name: 'Search', keyText: electron ? 'Ctrl+P' : 'F3', - onClick: () => visibleCommandPalette.set(true), - testEnabled: () => !getVisibleCommandPalette(), + onClick: () => visibleCommandPalette.set('database'), + testEnabled: () => getVisibleCommandPalette() != 'database', }); - function extractDbItems(db) { - return db?.tables?.map(table => ({ text: table.pureName, onClick: () => handleDatabaseObjectClick(table) })); + function extractDbItems(db, dbConnectionInfo) { + const objectList = _.flatten( + ['tables', 'collections', 'views', 'matviews', 'procedures', 'functions'].map(objectTypeField => + _.sortBy( + ((db || {})[objectTypeField] || []).map(obj => ({ + text: obj.pureName, + onClick: () => handleDatabaseObjectClick({ objectTypeField, ...dbConnectionInfo, ...obj }), + icon: databaseObjectIcons[objectTypeField], + })), + ['schemaName', 'pureName'] + ) + ) + ); + return objectList; + + // return db?.tables?.map(table => ({ + // text: table.pureName, + // onClick: () => handleDatabaseObjectClick({ ...dbinfo, ...table }), + // })); } @@ -34,6 +51,7 @@ import _ from 'lodash'; import { onMount } from 'svelte'; + import { databaseObjectIcons, handleDatabaseObjectClick } from '../appobj/DatabaseObjectAppObject.svelte'; import FontIcon from '../icons/FontIcon.svelte'; import { commands, @@ -50,7 +68,6 @@ let domInput; let filter = ''; - let selectedPage = 'menu'; const domItems = {}; $: selectedIndex = true ? 0 : filter; @@ -73,8 +90,8 @@ $: database = _.get($currentDatabase, 'name'); $: databaseInfo = useDatabaseInfo({ conid, database }); - $: filteredItems = (selectedPage == 'database' - ? extractDbItems($databaseInfo) + $: filteredItems = ($visibleCommandPalette == 'database' + ? extractDbItems($databaseInfo, { conid, database }) : parentCommand ? parentCommand.getSubCommands() : sortedComands @@ -87,7 +104,7 @@ filter = ''; selectedIndex = 0; } else { - $visibleCommandPalette = false; + $visibleCommandPalette = null; command.onClick(); } } @@ -100,7 +117,7 @@ e.stopPropagation(); handleCommand(filteredItems[selectedIndex]); } - if (e.keyCode == keycodes.escape) $visibleCommandPalette = false; + if (e.keyCode == keycodes.escape) $visibleCommandPalette = null; if (e.keyCode == keycodes.pageDown) selectedIndex = Math.min(selectedIndex + 15, filteredItems.length - 1); if (e.keyCode == keycodes.pageUp) selectedIndex = Math.max(selectedIndex - 15, 0); @@ -109,13 +126,19 @@ $: if (domItems[selectedIndex]) domItems[selectedIndex].scrollIntoView({ block: 'nearest', inline: 'nearest' }); -
($visibleCommandPalette = false)}> +
{ + $visibleCommandPalette = null; + }} +>
{ - selectedPage = 'menu'; + $visibleCommandPalette = 'menu'; domInput.focus(); }} > @@ -123,9 +146,9 @@
{ - selectedPage = 'database'; + $visibleCommandPalette = 'database'; domInput.focus(); }} > @@ -150,7 +173,12 @@ on:click={() => handleCommand(command)} bind:this={domItems[index]} > -
{command.text}
+
+ {#if command.icon} + + {/if} + {command.text} +
{#if command.keyText}
{command.keyText}
{/if} diff --git a/packages/web/src/stores.ts b/packages/web/src/stores.ts index 861f6e789..849202883 100644 --- a/packages/web/src/stores.ts +++ b/packages/web/src/stores.ts @@ -35,7 +35,7 @@ export const openedConnections = writable([]); export const currentDatabase = writable(null); export const openedTabs = writableWithStorage([], 'openedTabs'); export const extensions = writable(null); -export const visibleCommandPalette = writable(false); +export const visibleCommandPalette = writable(null); export const commands = writable({}); export const currentTheme = writableWithStorage('theme-light', 'currentTheme'); export const activeTabId = derived([openedTabs], ([$openedTabs]) => $openedTabs.find(x => x.selected)?.tabid); diff --git a/packages/web/src/widgets/WidgetIconPanel.svelte b/packages/web/src/widgets/WidgetIconPanel.svelte index 41dd2e07a..440bca657 100644 --- a/packages/web/src/widgets/WidgetIconPanel.svelte +++ b/packages/web/src/widgets/WidgetIconPanel.svelte @@ -66,7 +66,7 @@
{#if !$visibleToolbar} -
($visibleCommandPalette = true)}> +
($visibleCommandPalette = 'menu')}>
{/if}