dennii/dbgate
1
0
Fork 0
mirror of https://github.com/DeNNiiInc/dbgate.git synced 2026-04-18 00:56:02 +00:00
Code Issues Packages Projects Releases Wiki Activity

configurable search in connections

Browse Source
This commit is contained in:
SPRINX0\prochazka
2024-12-17 12:26:50 +01:00
parent f5733ea2d7
commit 7a5019164a
8 changed files with 78 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/web/src/appobj/ColumnAppObject.svelte
View File

@@ -2,7 +2,7 @@
export const extractKey = ({ columnName }) => columnName;
export const createMatcher =
(filter, cfg = DEFAULT_SEARCH_SETTINGS) =>
(filter, cfg = DEFAULT_OBJECT_SEARCH_SETTINGS) =>
data => {
const filterArgs = [];
if (cfg.columnName) filterArgs.push(data.columnName);
@@ -21,7 +21,7 @@
import { renameDatabaseObjectDialog, alterDatabaseDialog } from '../utility/alterDatabaseTools';
import AppObjectCore from './AppObjectCore.svelte';
import { DEFAULT_SEARCH_SETTINGS } from '../stores';
import { DEFAULT_OBJECT_SEARCH_SETTINGS } from '../stores';
import { filterName } from 'dbgate-tools';
export let data;

29
packages/web/src/appobj/ConnectionAppObject.svelte
View File

@@ -1,14 +1,24 @@
<script context="module">
export const extractKey = data => data._id;
export const createMatcher = filter => props => {
const { _id, displayName, server } = props;
const databases = getLocalStorage(`database_list_${_id}`) || [];
return filterNameCompoud(
filter,
[displayName, server],
databases.map(x => x.name)
);
};
export const createMatcher =
(filter, cfg = DEFAULT_CONNECTION_SEARCH_SETTINGS) =>
props => {
const { _id, displayName, server, user, engine } = props;
const databases = getLocalStorage(`database_list_${_id}`) || [];
const match = (engine || '').match(/^([^@]*)@/);
const engineDisplay = match ? match[1] : engine;
return filterNameCompoud(
filter,
[
cfg.displayName ? displayName : null,
cfg.server ? server : null,
cfg.user ? user : null,
cfg.engine ? engineDisplay : null,
],
cfg.database ? databases.map(x => x.name) : []
);
};
export function openConnection(connection, disableExpand = false) {
if (connection.singleDatabase) {
if (getOpenedSingleDatabaseConnections().includes(connection._id)) {
@@ -92,6 +102,7 @@
import AppObjectCore from './AppObjectCore.svelte';
import {
currentDatabase,
DEFAULT_CONNECTION_SEARCH_SETTINGS,
expandedConnections,
extensions,
focusedConnectionOrDatabase,

6
packages/web/src/appobj/DatabaseObjectAppObject.svelte
View File

@@ -3,7 +3,7 @@
export const extractKey = ({ schemaName, pureName }) => (schemaName ? `${schemaName}.${pureName}` : pureName);
export const createMatcher =
(filter, cfg = DEFAULT_SEARCH_SETTINGS) =>
(filter, cfg = DEFAULT_OBJECT_SEARCH_SETTINGS) =>
({ schemaName, pureName, objectComment, tableEngine, columns, objectTypeField, createSql }) => {
const mainArgs = [];
const childArgs = [];
@@ -18,6 +18,8 @@
if (cfg.columnComment) childArgs.push(column.columnComment);
if (cfg.columnDataType) childArgs.push(column.dataType);
}
} else if (objectTypeField == 'collections') {
if (cfg.collectionName) mainArgs.push(pureName);
} else {
if (cfg.sqlObjectName) mainArgs.push(pureName);
if (cfg.sqlObjectText) childArgs.push(createSql);
@@ -895,7 +897,7 @@
import AppObjectCore from './AppObjectCore.svelte';
import {
currentDatabase,
DEFAULT_SEARCH_SETTINGS,
DEFAULT_OBJECT_SEARCH_SETTINGS,
extensions,
getActiveTab,
getCurrentSettings,

4
packages/web/src/appobj/ProcedureLineAppObject.svelte
View File

@@ -2,7 +2,7 @@
export const extractKey = ({ columnName }) => columnName;
export const createMatcher =
(filter, cfg = DEFAULT_SEARCH_SETTINGS) =>
(filter, cfg = DEFAULT_OBJECT_SEARCH_SETTINGS) =>
data => {
const filterArgs = [];
if (cfg.sqlObjectText) filterArgs.push(data.lineData);
@@ -15,7 +15,7 @@
<script lang="ts">
import AppObjectCore from './AppObjectCore.svelte';
import { filterName } from 'dbgate-tools';
import { DEFAULT_SEARCH_SETTINGS } from '../stores';
import { DEFAULT_OBJECT_SEARCH_SETTINGS } from '../stores';
export let data;
</script>

5
packages/web/src/buttons/DropDownButton.svelte
View File

@@ -8,12 +8,13 @@
export let icon = 'icon chevron-down';
export let menu;
export let narrow = false;
export let square = true;
export let disabled = false;
let domButton;
function handleClick() {
if (disabled) return;
const rect = domButton.getBoundingClientRect();
const left = rect.left;
const top = rect.bottom;
@@ -21,6 +22,6 @@
}
</script>
<InlineButton square {narrow} on:click={handleClick} bind:this={domButton} {disabled}>
<InlineButton {square} {narrow} on:click={handleClick} bind:this={domButton} {disabled}>
<FontIcon {icon} />
</InlineButton>

29
packages/web/src/stores.ts
View File

@@ -161,7 +161,7 @@ export const lastUsedDefaultActions = writableWithStorage({}, 'lastUsedDefaultAc
export const selectedDatabaseObjectAppObject = writable(null);
export const focusedConnectionOrDatabase = writable<{ conid: string; database?: string; connection: any }>(null);
export const DEFAULT_SEARCH_SETTINGS = {
export const DEFAULT_OBJECT_SEARCH_SETTINGS = {
collectionName: true,
schemaName: false,
tableName: true,
@@ -175,11 +175,24 @@ export const DEFAULT_SEARCH_SETTINGS = {
tableEngine: false,
};
export const DEFAULT_CONNECTION_SEARCH_SETTINGS = {
displayName: true,
server: true,
user: false,
engine: false,
database: true,
};
export const databaseObjectAppObjectSearchSettings = writableWithStorage(
DEFAULT_SEARCH_SETTINGS,
DEFAULT_OBJECT_SEARCH_SETTINGS,
'databaseObjectAppObjectSearchSettings'
);
export const connectionAppObjectSearchSettings = writableWithStorage(
DEFAULT_CONNECTION_SEARCH_SETTINGS,
'connectionAppObjectSearchSettings'
);
export const currentThemeDefinition = derived([currentTheme, extensions], ([$currentTheme, $extensions]) =>
$extensions.themes.find(x => x.themeClassName == $currentTheme)
);
@@ -379,10 +392,18 @@ lastUsedDefaultActions.subscribe(value => {
});
export const getLastUsedDefaultActions = () => lastUsedDefaultActionsValue;
let databaseObjectAppObjectSearchSettingsValue: typeof DEFAULT_SEARCH_SETTINGS = {
...DEFAULT_SEARCH_SETTINGS,
let databaseObjectAppObjectSearchSettingsValue: typeof DEFAULT_OBJECT_SEARCH_SETTINGS = {
...DEFAULT_OBJECT_SEARCH_SETTINGS,
};
databaseObjectAppObjectSearchSettings.subscribe(value => {
databaseObjectAppObjectSearchSettingsValue = value;
});
export const getDatabaseObjectAppObjectSearchSettings = () => databaseObjectAppObjectSearchSettingsValue;
let connectionAppObjectSearchSettingsValue: typeof DEFAULT_CONNECTION_SEARCH_SETTINGS = {
...DEFAULT_CONNECTION_SEARCH_SETTINGS,
};
connectionAppObjectSearchSettings.subscribe(value => {
connectionAppObjectSearchSettingsValue = value;
});
export const getConnectionAppObjectSearchSettings = () => connectionAppObjectSearchSettingsValue;

20
packages/web/src/widgets/ConnectionList.svelte
View File

@@ -20,6 +20,8 @@
getFocusedConnectionOrDatabase,
currentDatabase,
getCurrentConfig,
connectionAppObjectSearchSettings,
getConnectionAppObjectSearchSettings,
} from '../stores';
import runCommand from '../commands/runCommand';
import { filterName, getConnectionLabel } from 'dbgate-tools';
@@ -39,6 +41,7 @@
import openNewTab from '../utility/openNewTab';
import { openConnection } from '../appobj/ConnectionAppObject.svelte';
import { getConnectionClickActionSetting } from '../settings/settingsTools';
import DropDownButton from '../buttons/DropDownButton.svelte';
const connections = useConnectionList();
const serverStatus = useServerStatus();
@@ -182,6 +185,20 @@
{ text: 'Delete', onClick: handleDelete },
];
}
function createSearchMenu() {
const res = [];
res.push({ label: 'Display name', switchValue: 'displayName' });
res.push({ label: 'Server', switchValue: 'server' });
res.push({ label: 'User', switchValue: 'user' });
res.push({ label: 'Database engine', switchValue: 'engine' });
res.push({ label: 'Database name', switchValue: 'database' });
return res.map(item => ({
...item,
switchStore: connectionAppObjectSearchSettings,
switchStoreGetter: getConnectionAppObjectSearchSettings,
}));
}
</script>
<SearchBoxWrapper>
@@ -194,6 +211,7 @@
}}
/>
<CloseSearchButton bind:filter />
<DropDownButton icon="icon filter" menu={createSearchMenu} square={!!filter} narrow={false} />
{#if $commandsCustomized['new.connection']?.enabled}
<InlineButton
on:click={() => runCommand('new.connection')}
@@ -289,6 +307,7 @@
...passProps,
connectionColorFactory: $connectionColorFactory,
showPinnedInsteadOfUnpin: true,
searchSettings: $connectionAppObjectSearchSettings,
}}
getIsExpanded={data => $expandedConnections.includes(data._id) && !data.singleDatabase}
setIsExpanded={(data, value) => {
@@ -316,6 +335,7 @@
passProps={{
connectionColorFactory: $connectionColorFactory,
showPinnedInsteadOfUnpin: true,
searchSettings: $connectionAppObjectSearchSettings,
}}
getIsExpanded={data => $expandedConnections.includes(data._id) && !data.singleDatabase}
setIsExpanded={(data, value) => {

4
packages/web/src/widgets/SqlObjectList.svelte
View File

@@ -130,7 +130,7 @@
function createSearchMenu() {
const res = [];
if (driver?.databaseEngineTypes?.includes('document')) {
res.push({ label: 'Collection names' });
res.push({ label: 'Collection names', switchValue: 'collectionName' });
}
if (driver?.databaseEngineTypes?.includes('sql')) {
res.push({ label: 'Schema name', switchValue: 'schemaName' });
@@ -216,7 +216,7 @@
}}
/>
<CloseSearchButton bind:filter />
<DropDownButton icon="icon filter" menu={createSearchMenu} />
<DropDownButton icon="icon filter" menu={createSearchMenu} square={!!filter} narrow={false} />
{#if !filter}
<DropDownButton icon="icon plus-thick" menu={createAddMenu} />
{/if}