diff --git a/packages/web/src/appobj/AppObjectCore.svelte b/packages/web/src/appobj/AppObjectCore.svelte index 0850a0004..dc82c4e3e 100644 --- a/packages/web/src/appobj/AppObjectCore.svelte +++ b/packages/web/src/appobj/AppObjectCore.svelte @@ -21,6 +21,9 @@ export let checkedObjectsStore = null; export let disableContextMenu = false; export let colorMark = null; + export let onPin = null; + export let onUnpin = null; + export let showPinnedInsteadOfUnpin = false; $: isChecked = checkedObjectsStore && $checkedObjectsStore.find(x => module.extractKey(data) == module.extractKey(x)); @@ -101,6 +104,36 @@ {extInfo} {/if} + {#if onPin} + { + e.preventDefault(); + e.stopPropagation(); + onPin(); + }} + > + + + {/if} + {#if onUnpin} + {#if showPinnedInsteadOfUnpin} + + + + {:else} + { + e.preventDefault(); + e.stopPropagation(); + onUnpin(); + }} + > + + + {/if} + {/if} @@ -128,4 +161,32 @@ .expand-icon { margin-right: 3px; } + + .pin { + float: right; + color: var(--theme-font-2); + } + .pin:hover { + color: var(--theme-font-hover); + } + .main .pin { + visibility: hidden; + } + .main:hover .pin { + visibility: visible; + } + + .unpin { + float: right; + color: var(--theme-font-2); + } + .unpin:hover { + color: var(--theme-font-hover); + } + + .pin-active { + float: right; + color: var(--theme-font-2); + } + diff --git a/packages/web/src/appobj/ConnectionAppObject.svelte b/packages/web/src/appobj/ConnectionAppObject.svelte index fe7c951e5..62c07f06e 100644 --- a/packages/web/src/appobj/ConnectionAppObject.svelte +++ b/packages/web/src/appobj/ConnectionAppObject.svelte @@ -199,7 +199,7 @@ statusIcon={statusIcon || engineStatusIcon} statusTitle={statusTitle || engineStatusTitle} {extInfo} - colorMark={passProps?.connectionColorFactory({ conid: data._id })} + colorMark={passProps?.connectionColorFactory && passProps?.connectionColorFactory({ conid: data._id })} menu={getContextMenu} on:click={handleConnect} on:click diff --git a/packages/web/src/appobj/DatabaseAppObject.svelte b/packages/web/src/appobj/DatabaseAppObject.svelte index da235b0f3..79463833d 100644 --- a/packages/web/src/appobj/DatabaseAppObject.svelte +++ b/packages/web/src/appobj/DatabaseAppObject.svelte @@ -162,7 +162,14 @@ import { showModal } from '../modals/modalTools'; import SqlGeneratorModal from '../modals/SqlGeneratorModal.svelte'; import { getDefaultFileFormat } from '../plugins/fileformats'; - import { currentArchive, currentDatabase, extensions, getExtensions, selectedWidget } from '../stores'; + import { + currentArchive, + currentDatabase, + extensions, + getExtensions, + pinnedDatabases, + selectedWidget, + } from '../stores'; import axiosInstance from '../utility/axiosInstance'; import getElectron from '../utility/getElectron'; import openNewTab from '../utility/openNewTab'; @@ -179,6 +186,8 @@ function createMenu() { return getDatabaseMenuItems(data.connection, data.name, $extensions, $currentDatabase); } + + $: isPinned = !!$pinnedDatabases.find(x => x.name == data.name && x.connection?._id == data.connection?._id); ($currentDatabase = data)} @@ -201,4 +206,12 @@ .onClick(); }} menu={createMenu} + showPinnedInsteadOfUnpin={passProps?.showPinnedInsteadOfUnpin} + onPin={isPinned ? null : () => pinnedDatabases.update(list => [...list, data])} + onUnpin={isPinned + ? () => + pinnedDatabases.update(list => + list.filter(x => x.name != data.name || x.connection?._id != data.connection?._id) + ) + : null} /> diff --git a/packages/web/src/commands/stdCommands.ts b/packages/web/src/commands/stdCommands.ts index 5932cff45..7f8e775b8 100644 --- a/packages/web/src/commands/stdCommands.ts +++ b/packages/web/src/commands/stdCommands.ts @@ -288,14 +288,20 @@ registerCommand({ 'zoomKoef', 'selectedWidget', 'currentTheme', + 'connectionsWidget', + 'pinnedItemsWidget', 'dbObjectsWidget', + 'favoritesWidget', 'savedFilesWidget', + 'closedTabsWidget', 'queryHistoryWidget', + 'archiveFoldersWidget', 'archiveFilesWidget', + 'installedPluginsWidget', 'allPluginsWidget', ]; diff --git a/packages/web/src/icons/FontIcon.svelte b/packages/web/src/icons/FontIcon.svelte index 85f753012..5953ff8ee 100644 --- a/packages/web/src/icons/FontIcon.svelte +++ b/packages/web/src/icons/FontIcon.svelte @@ -23,6 +23,7 @@ 'icon keyboard': 'mdi mdi-keyboard-settings', 'icon settings': 'mdi mdi-cog', 'icon version': 'mdi mdi-ticket-confirmation', + 'icon pin': 'mdi mdi-pin', 'icon columns': 'mdi mdi-view-column', 'icon columns-outline': 'mdi mdi-view-column-outline', diff --git a/packages/web/src/stores.ts b/packages/web/src/stores.ts index 9cad98d09..bda20ac62 100644 --- a/packages/web/src/stores.ts +++ b/packages/web/src/stores.ts @@ -42,6 +42,7 @@ 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 pinnedDatabases = writableWithStorage([], 'pinnedDatabases'); export const commandsSettings = derived(useSettings(), (config: any) => (config || {}).commands || {}); export const allResultsInOneTabDefault = writableWithStorage(false, 'allResultsInOneTabDefault'); export const commandsCustomized = derived([commands, commandsSettings], ([$commands, $commandsSettings]) => diff --git a/packages/web/src/widgets/ConnectionList.svelte b/packages/web/src/widgets/ConnectionList.svelte index 555db00f7..940dad69e 100644 --- a/packages/web/src/widgets/ConnectionList.svelte +++ b/packages/web/src/widgets/ConnectionList.svelte @@ -46,7 +46,7 @@ expandOnClick isExpandable={data => $openedConnections.includes(data._id) && !data.singleDatabase} {filter} - passProps={{ connectionColorFactory: $connectionColorFactory }} + passProps={{ connectionColorFactory: $connectionColorFactory, showPinnedInsteadOfUnpin: true }} /> {#if $connections && $connections.length == 0 && $commandsCustomized['new.connection']?.enabled} runCommand('new.connection')}> diff --git a/packages/web/src/widgets/DatabaseWidget.svelte b/packages/web/src/widgets/DatabaseWidget.svelte index fe9abb455..15a21261b 100644 --- a/packages/web/src/widgets/DatabaseWidget.svelte +++ b/packages/web/src/widgets/DatabaseWidget.svelte @@ -1,9 +1,10 @@ + + + +