diff --git a/packages/web/src/modals/DropDownMenu.svelte b/packages/web/src/modals/DropDownMenu.svelte index 05f7ddcf4..aeacb017b 100644 --- a/packages/web/src/modals/DropDownMenu.svelte +++ b/packages/web/src/modals/DropDownMenu.svelte @@ -86,14 +86,26 @@ submenuKey += 1; return; } - if (item.switchStore && item.switchValue) { - item.switchStore.update(x => ({ - ...x, - [item.switchValue]: !x[item.switchValue], - })); + if (item.switchStore) { + if (item.switchValue) { + item.switchStore.update(x => ({ + ...x, + [item.switchValue]: !x[item.switchValue], + })); + } + + if (item.switchOption && item.switchOptionValue) { + item.switchStore.update(x => ({ + ...x, + [item.switchOption]: item.switchOptionValue, + })); + } switchIndex++; - return; + if (!item.closeOnSwitchClick) { + return; + } } + dispatchClose(); if (onCloseParent) onCloseParent(); if (item.onClick) item.onClick(); @@ -163,6 +175,16 @@ {/if} {/key} {/if} + {#if item.switchOption && item.switchStoreGetter} + {@const optionValue = item.switchStoreGetter()[item.switchOption]} + {#key switchIndex} + {#if optionValue === item.switchOptionValue || (item.switchOptionIsDefault && !optionValue)} + + {:else} + + {/if} + {/key} + {/if} {item.text || item.label} {#if item.keyText} diff --git a/packages/web/src/stores.ts b/packages/web/src/stores.ts index 6b169ef82..6b93b1147 100644 --- a/packages/web/src/stores.ts +++ b/packages/web/src/stores.ts @@ -200,6 +200,7 @@ export const DEFAULT_OBJECT_SEARCH_SETTINGS = { sqlObjectText: false, tableEngine: false, tablesWithRows: false, + sortBy: undefined as string }; export const DEFAULT_CONNECTION_SEARCH_SETTINGS = { diff --git a/packages/web/src/widgets/SqlObjectList.svelte b/packages/web/src/widgets/SqlObjectList.svelte index 338f692a7..cf9c2c81d 100644 --- a/packages/web/src/widgets/SqlObjectList.svelte +++ b/packages/web/src/widgets/SqlObjectList.svelte @@ -79,12 +79,30 @@ // $: console.log('OBJECTS', $objects); + $: sortArgs = + $databaseObjectAppObjectSearchSettings.sortBy == 'rowCount' + ? [ + ['rowCount', 'sizeBytes', 'schemaName', 'pureName'], + ['desc', 'desc', 'asc', 'asc'], + ] + : $databaseObjectAppObjectSearchSettings.sortBy == 'sizeBytes' + ? [ + ['sizeBytes', 'rowCount', 'schemaName', 'pureName'], + ['desc', 'desc', 'asc', 'asc'], + ] + : [ + ['schemaName', 'pureName'], + ['asc', 'asc'], + ]; + $: objectList = _.flatten([ ...['tables', 'collections', 'views', 'matviews', 'procedures', 'functions', 'triggers', 'schedulerEvents'].map( objectTypeField => - _.sortBy( + _.orderBy( (($objects || {})[objectTypeField] || []).map(obj => ({ ...obj, objectTypeField })), - ['schemaName', 'pureName'] + sortArgs[0], + // @ts-ignore + sortArgs[1] ) ), ...appsForDb.map(app => @@ -133,19 +151,62 @@ const res = []; res.push({ label: _t('sqlObject.searchBy', { defaultMessage: 'Search by:' }), isBold: true, disabled: true }); if (driver?.databaseEngineTypes?.includes('document')) { - res.push({ label: _t('sqlObject.collectionName', { defaultMessage: 'Collection name' }), switchValue: 'pureName' }); + res.push({ + label: _t('sqlObject.collectionName', { defaultMessage: 'Collection name' }), + switchValue: 'pureName', + }); } if (driver?.databaseEngineTypes?.includes('sql')) { - res.push({ label: _t('sqlObject.tableViewProcedureName', { defaultMessage: 'Table/view/procedure name' }), switchValue: 'pureName' }); + res.push({ + label: _t('sqlObject.tableViewProcedureName', { defaultMessage: 'Table/view/procedure name' }), + switchValue: 'pureName', + }); res.push({ label: _t('sqlObject.schemaName', { defaultMessage: 'Schema' }), switchValue: 'schemaName' }); res.push({ label: _t('sqlObject.columnName', { defaultMessage: 'Column name' }), switchValue: 'columnName' }); - res.push({ label: _t('sqlObject.columnDataType', { defaultMessage: 'Column data type' }), switchValue: 'columnDataType' }); - res.push({ label: _t('sqlObject.tableComment', { defaultMessage: 'Table comment' }), switchValue: 'tableComment' }); - res.push({ label: _t('sqlObject.columnComment', { defaultMessage: 'Column comment' }), switchValue: 'columnComment' }); - res.push({ label: _t('sqlObject.viewProcedureTriggerText', { defaultMessage: 'View/procedure/trigger text' }), switchValue: 'sqlObjectText' }); + res.push({ + label: _t('sqlObject.columnDataType', { defaultMessage: 'Column data type' }), + switchValue: 'columnDataType', + }); + res.push({ + label: _t('sqlObject.tableComment', { defaultMessage: 'Table comment' }), + switchValue: 'tableComment', + }); + res.push({ + label: _t('sqlObject.columnComment', { defaultMessage: 'Column comment' }), + switchValue: 'columnComment', + }); + res.push({ + label: _t('sqlObject.viewProcedureTriggerText', { defaultMessage: 'View/procedure/trigger text' }), + switchValue: 'sqlObjectText', + }); res.push({ label: _t('sqlObject.tableEngine', { defaultMessage: 'Table engine' }), switchValue: 'tableEngine' }); - res.push({ label: _t('sqlObject.tablesWithRows', { defaultMessage: 'Only tables with rows' }), switchValue: 'tablesWithRows' }); + res.push({ + label: _t('sqlObject.tablesWithRows', { defaultMessage: 'Only tables with rows' }), + switchValue: 'tablesWithRows', + }); } + + res.push({ label: _t('sqlObject.sortBy', { defaultMessage: 'Sort by:' }), isBold: true, disabled: true }); + res.push({ + label: _t('sqlObject.name', { defaultMessage: 'Name' }), + switchOption: 'sortBy', + switchOptionValue: 'name', + switchOptionIsDefault: true, + closeOnSwitchClick: true, + }); + res.push({ + label: _t('sqlObject.rowCount', { defaultMessage: 'Row count' }), + switchOption: 'sortBy', + switchOptionValue: 'rowCount', + closeOnSwitchClick: true, + }); + res.push({ + label: _t('sqlObject.sizeBytes', { defaultMessage: 'Size (bytes)' }), + switchOption: 'sortBy', + switchOptionValue: 'sizeBytes', + closeOnSwitchClick: true, + }); + return res.map(item => ({ ...item, switchStore: databaseObjectAppObjectSearchSettings, @@ -193,19 +254,25 @@
{_t('common.refresh', { defaultMessage: 'Refresh' })} {#if driver?.databaseEngineTypes?.includes('sql')}
- runCommand('new.table')}>{_t('database.newTable', { defaultMessage: 'New table' })} + runCommand('new.table')} + >{_t('database.newTable', { defaultMessage: 'New table' })} {/if} {#if driver?.databaseEngineTypes?.includes('document')}
runCommand('new.collection')} - >{_t('sqlObject.newCollection', { defaultMessage: 'New collection/container'})}{_t('sqlObject.newCollection', { defaultMessage: 'New collection/container' })} {/if} @@ -233,7 +300,7 @@ {/if} @@ -260,7 +327,10 @@ data-testid="SqlObjectList_container" > {#if ($status && ($status.name == 'pending' || $status.name == 'checkStructure' || $status.name == 'loadStructure') && $objects) || !$objects} - + {:else}