diff --git a/packages/web/package.json b/packages/web/package.json index c974fd83e..023f10e33 100644 --- a/packages/web/package.json +++ b/packages/web/package.json @@ -13,7 +13,7 @@ ], "devDependencies": { "@ant-design/colors": "^5.0.0", - "@mdi/font": "^5.9.55", + "@mdi/font": "^7.1.96", "@rollup/plugin-commonjs": "^20.0.0", "@rollup/plugin-node-resolve": "^13.0.5", "@rollup/plugin-replace": "^3.0.0", diff --git a/packages/web/public/dimensions.css b/packages/web/public/dimensions.css index 7556a7532..bae4ed425 100644 --- a/packages/web/public/dimensions.css +++ b/packages/web/public/dimensions.css @@ -2,8 +2,8 @@ --dim-widget-icon-size: 60px; --dim-statusbar-height: 22px; --dim-left-panel-width: 300px; - --dim-tabs-panel-height: 53px; --dim-tabs-height: 33px; + --dim-tabs-panel-height: calc( var(--dim-visible-tabs-databases) * 20px + var(--dim-tabs-height) ); --dim-splitter-thickness: 3px; --dim-visible-left-panel: 1; /* set from JS */ diff --git a/packages/web/src/icons/FontIcon.svelte b/packages/web/src/icons/FontIcon.svelte index 6cd4061e1..2c5cc0bfb 100644 --- a/packages/web/src/icons/FontIcon.svelte +++ b/packages/web/src/icons/FontIcon.svelte @@ -40,6 +40,9 @@ 'icon columns': 'mdi mdi-view-column', 'icon columns-outline': 'mdi mdi-view-column-outline', + 'icon single-database-mode': 'mdi mdi-database-lock', + 'icon multi-database-mode': 'mdi mdi-database-eye', + 'icon database': 'mdi mdi-database', 'icon server': 'mdi mdi-server', 'icon table': 'mdi mdi-table', diff --git a/packages/web/src/settings/SettingsModal.svelte b/packages/web/src/settings/SettingsModal.svelte index 9879232ed..674774c90 100644 --- a/packages/web/src/settings/SettingsModal.svelte +++ b/packages/web/src/settings/SettingsModal.svelte @@ -3,6 +3,7 @@ import FormStyledButton from '../buttons/FormStyledButton.svelte'; import Link from '../elements/Link.svelte'; import TabControl from '../elements/TabControl.svelte'; + import CheckboxField from '../forms/CheckboxField.svelte'; import FormCheckboxField from '../forms/FormCheckboxField.svelte'; import FormFieldTemplateLarge from '../forms/FormFieldTemplateLarge.svelte'; @@ -23,6 +24,7 @@ currentEditorTheme, extensions, selectedWidget, + singleDatabaseMode, visibleWidgetSideBar, } from '../stores'; import { isMac } from '../utility/common'; @@ -107,6 +109,19 @@ ORDER BY />
Connection
+ + { + $singleDatabaseMode = !$singleDatabaseMode; + }, + }} + > + ($singleDatabaseMode = e.target.checked)} /> + + (false, 'singleDatabaseMode'); export const visibleWidgetSideBar = writableWithStorage(true, 'visibleWidgetSideBar'); export const visibleSelectedWidget = derived( [selectedWidget, visibleWidgetSideBar], @@ -137,6 +138,7 @@ subscribeCssVariable(visibleSelectedWidget, x => (x ? 1 : 0), '--dim-visible-lef // subscribeCssVariable(visibleToolbar, x => (x ? 1 : 0), '--dim-visible-toolbar'); subscribeCssVariable(leftPanelWidth, x => `${x}px`, '--dim-left-panel-width'); subscribeCssVariable(visibleTitleBar, x => (x ? 1 : 0), '--dim-visible-titlebar'); +subscribeCssVariable(singleDatabaseMode, x => (x ? 0 : 1), '--dim-visible-tabs-databases'); let activeTabIdValue = null; activeTabId.subscribe(value => { @@ -198,6 +200,12 @@ pinnedDatabases.subscribe(value => { }); export const getPinnedDatabases = () => _.compact(pinnedDatabasesValue); +let singleDatabaseModeValue = null; +singleDatabaseMode.subscribe(value => { + singleDatabaseModeValue = value; +}); +export const getSingleDatabaseMode = () => singleDatabaseModeValue; + let currentDatabaseValue = null; currentDatabase.subscribe(value => { currentDatabaseValue = value; diff --git a/packages/web/src/utility/changeCurrentDbByTab.ts b/packages/web/src/utility/changeCurrentDbByTab.ts index 0e3284ba6..46424320f 100644 --- a/packages/web/src/utility/changeCurrentDbByTab.ts +++ b/packages/web/src/utility/changeCurrentDbByTab.ts @@ -1,5 +1,6 @@ import _ from 'lodash'; -import { currentDatabase, openedTabs } from '../stores'; +import { currentDatabase, getCurrentDatabase, getSingleDatabaseMode, openedTabs } from '../stores'; +import { shouldShowTab } from '../widgets/TabsPanel.svelte'; import { callWhenAppLoaded } from './appLoadManager'; import { getConnectionInfo } from './metadataLoaders'; @@ -8,6 +9,7 @@ let lastCurrentTab = null; openedTabs.subscribe(value => { const newCurrentTab = (value || []).find(x => x.selected); if (newCurrentTab == lastCurrentTab) return; + if (getSingleDatabaseMode() && getCurrentDatabase()) return; const lastTab = lastCurrentTab; lastCurrentTab = newCurrentTab; @@ -27,3 +29,22 @@ openedTabs.subscribe(value => { } } }); + +currentDatabase.subscribe(currentDb => { + if (!getSingleDatabaseMode()) return; + openedTabs.update(tabs => { + const newTabs = tabs.map(tab => ({ + ...tab, + selected: tab.selected && shouldShowTab(tab, true, currentDb), + })); + + if (newTabs.find(x => x.selected)) return newTabs; + + const selectedIndex = _.findLastIndex(newTabs, x => shouldShowTab(x)); + + return newTabs.map((x, index) => ({ + ...x, + selected: index == selectedIndex, + })); + }); +}); diff --git a/packages/web/src/widgets/TabsPanel.svelte b/packages/web/src/widgets/TabsPanel.svelte index fe9ad5742..5df04a1d5 100644 --- a/packages/web/src/widgets/TabsPanel.svelte +++ b/packages/web/src/widgets/TabsPanel.svelte @@ -1,4 +1,23 @@
@@ -112,6 +110,15 @@
 
+
{ + $singleDatabaseMode = !$singleDatabaseMode; + }} + > + +
diff --git a/yarn.lock b/yarn.lock index 458b772ad..d62a3c6a9 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1069,10 +1069,10 @@ resolved "https://registry.yarnpkg.com/@js-joda/core/-/core-5.2.0.tgz#fcebb14cffbf25adaaeec20d4579530e896ecd4a" integrity sha512-0OriPYIaMLB3XiLQMe0BXKVIqeriTn3H7JMOzTsHEtt7Zqq+TetCu97KnAhU3ckiQZKBxfZshft+H1OC4D1lXw== -"@mdi/font@^5.9.55": - version "5.9.55" - resolved "https://registry.yarnpkg.com/@mdi/font/-/font-5.9.55.tgz#41acd50b88073ded7095fc3029d8712b6e12f38e" - integrity sha512-jswRF6q3eq8NWpWiqct6q+6Fg/I7nUhrxYJfiEM8JJpap0wVJLQdbKtyS65GdlK7S7Ytnx3TTi/bmw+tBhkGmg== +"@mdi/font@^7.1.96": + version "7.1.96" + resolved "https://registry.yarnpkg.com/@mdi/font/-/font-7.1.96.tgz#211ca4acfa31964278e5085de595e8c73967d400" + integrity sha512-Imag6npmfkBDi2Ze2jiZVAPTDIKLxhz2Sx82xJ2zctyAU5LYJejLI5ChnDwiD9bMkQfVuzEsI98Q8toHyC+HCg== "@mrmlnc/readdir-enhanced@^2.2.1": version "2.2.1"