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

Merge branch 'develop'

Browse Source
This commit is contained in:
Jan Prochazka
2023-03-12 09:08:40 +01:00
parent a64e42f1c2 66d1b4ca49
commit f83c4ef799
39 changed files with 385 additions and 193 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
.github/workflows/build-app-beta.yaml vendored
View File

@@ -12,7 +12,7 @@ jobs:
strategy:
fail-fast: false
matrix:
os: [macOS-10.15, windows-2022, ubuntu-18.04]
os: [macOS-10.15, windows-2022, ubuntu-22.04]
# os: [macOS-10.15]
steps:
@@ -46,7 +46,7 @@ jobs:
run: |
yarn fillPackagedPlugins
- name: Install Snapcraft
if: matrix.os == 'ubuntu-18.04'
if: matrix.os == 'ubuntu-22.04'
uses: samuelmeuli/action-snapcraft@v1
- name: Publish
run: |
@@ -66,7 +66,7 @@ jobs:
APPLE_ID_PASSWORD: ${{ secrets.APPLE_ID_PASSWORD }}
- name: publishSnap
if: matrix.os == 'ubuntu-18.04'
if: matrix.os == 'ubuntu-22.04'
run: |
snapcraft upload --release=beta app/dist/*.snap
env:

10
.github/workflows/build-app.yaml vendored
View File

@@ -16,8 +16,8 @@ jobs:
strategy:
fail-fast: false
matrix:
# os: [ubuntu-18.04, windows-2016]
os: [macOS-10.15, windows-2022, ubuntu-18.04]
# os: [ubuntu-22.04, windows-2016]
os: [macOS-10.15, windows-2022, ubuntu-22.04]
steps:
- name: Context
@@ -52,7 +52,7 @@ jobs:
run: |
yarn fillPackagedPlugins
- name: Install Snapcraft
if: matrix.os == 'ubuntu-18.04'
if: matrix.os == 'ubuntu-22.04'
uses: samuelmeuli/action-snapcraft@v1
- name: Publish
run: |
@@ -76,7 +76,7 @@ jobs:
yarn generatePadFile
- name: publishSnap
if: matrix.os == 'ubuntu-18.04'
if: matrix.os == 'ubuntu-22.04'
run: |
snapcraft upload --release=stable app/dist/*.snap
env:
@@ -134,7 +134,7 @@ jobs:
mv app/dist/dbgate-pad.xml artifacts/ || true
- name: Copy latest-linux.yml
if: matrix.os == 'ubuntu-18.04'
if: matrix.os == 'ubuntu-22.04'
run: |
mv app/dist/latest-linux.yml artifacts/latest-linux.yml || true

2
.github/workflows/build-docker.yaml vendored
View File

@@ -14,7 +14,7 @@ jobs:
strategy:
matrix:
os: [ubuntu-18.04]
os: [ubuntu-22.04]
steps:
- name: Context

2
.github/workflows/build-npm.yaml vendored
View File

@@ -20,7 +20,7 @@ jobs:
strategy:
matrix:
os: [ubuntu-18.04]
os: [ubuntu-22.04]
steps:
- name: Context

BIN
app/icon512-mac.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 89 KiB

2
app/package.json
View File

@@ -21,7 +21,7 @@
"afterSign": "electron-builder-notarize",
"mac": {
"category": "database",
"icon": "icon512.png",
"icon": "icon512-mac.png",
"hardenedRuntime": true,
"entitlements": "entitlements.mac.plist",
"entitlementsInherit": "entitlements.mac.plist",

3
misc/convert-icons.sh
View File

@@ -104,3 +104,6 @@ magick icon.png -resize 16x16! ../app/icons/16x16.png
magick icon.png -resize 192x192! ../packages/web/public/logo192.png
magick icon.png -resize 512x512! ../packages/web/public/logo512.png
magick icon.png -define icon:auto-resize="256,128,96,64,48,32,16" ../packages/web/public/favicon.ico
convert icon.png -resize 800x800 -background transparent -gravity center -extent 1000x1000 iconmac.png
magick composite iconmac.png macbg.png -resize 600x600! ../app/icon512-mac.png

BIN
misc/iconmac.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 211 KiB

BIN
misc/macbg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 177 KiB

2
package.json
View File

@@ -1,6 +1,6 @@
{
"private": true,
"version": "5.2.4",
"version": "5.2.5-beta.14",
"name": "dbgate-all",
"workspaces": [
"packages/*",

1
packages/web/public/dimensions.css
View File

@@ -22,7 +22,6 @@
--dim-header-top: calc(
var(--dim-titlebar-height) * var(--dim-visible-titlebar) + var(--dim-toolbar-height) * var(--dim-visible-toolbar)
);
--dim-content-top: calc(var(--dim-header-top) + var(--dim-tabs-panel-height));
--dim-large-form-margin: 20px;
}

39
packages/web/src/Screen.svelte
View File

@@ -13,8 +13,8 @@
visibleTitleBar,
visibleToolbar,
} from './stores';
import TabsPanel from './widgets/TabsPanel.svelte';
import TabRegister from './TabRegister.svelte';
import TabsPanel from './tabpanel/TabsPanel.svelte';
import TabRegister from './tabpanel/TabRegister.svelte';
import CommandPalette from './commands/CommandPalette.svelte';
import Toolbar from './widgets/Toolbar.svelte';
import splitterDrag from './utility/splitterDrag';
@@ -27,6 +27,8 @@
import TitleBar from './widgets/TitleBar.svelte';
import FontIcon from './icons/FontIcon.svelte';
import getElectron from './utility/getElectron';
import TabsContainer from './tabpanel/TabsContainer.svelte';
import MultiTabsContainer from './tabpanel/MultiTabsContainer.svelte';
$: currentThemeType = $currentThemeDefinition?.themeType == 'dark' ? 'theme-type-dark' : 'theme-type-light';
@@ -69,11 +71,8 @@
<WidgetContainer />
</div>
{/if}
<div class="tabs">
<TabsPanel />
</div>
<div class="content">
<TabRegister />
<div class="tabs-container">
<MultiTabsContainer />
</div>
{#if $selectedWidget && $visibleWidgetSideBar}
<div
@@ -135,23 +134,6 @@
background-color: var(--theme-bg-1);
display: flex;
}
.tabs {
position: fixed;
top: var(--dim-header-top);
left: var(--dim-content-left);
height: var(--dim-tabs-panel-height);
right: 0;
background-color: var(--theme-bg-1);
border-top: 1px solid var(--theme-border);
}
.content {
position: fixed;
top: var(--dim-content-top);
left: var(--dim-content-left);
bottom: var(--dim-statusbar-height);
right: 0;
background-color: var(--theme-bg-1);
}
.commads {
position: fixed;
top: var(--dim-header-top);
@@ -207,4 +189,13 @@
.big-icon {
font-size: 20pt;
}
.tabs-container {
position: fixed;
top: var(--dim-header-top);
left: var(--dim-content-left);
bottom: var(--dim-statusbar-height);
right: 0;
background-color: var(--theme-bg-1);
}
</style>

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

@@ -103,7 +103,7 @@
import { getLocalStorage } from '../utility/storageCache';
import { apiCall, removeVolatileMapping } from '../utility/api';
import ImportDatabaseDumpModal from '../modals/ImportDatabaseDumpModal.svelte';
import { closeMultipleTabs } from '../widgets/TabsPanel.svelte';
import { closeMultipleTabs } from '../tabpanel/TabsPanel.svelte';
import AboutModal from '../modals/AboutModal.svelte';
import { tick } from 'svelte';

2
packages/web/src/appobj/DatabaseAppObject.svelte
View File

@@ -371,7 +371,7 @@
import ImportDatabaseDumpModal from '../modals/ImportDatabaseDumpModal.svelte';
import ExportDatabaseDumpModal from '../modals/ExportDatabaseDumpModal.svelte';
import ConfirmModal from '../modals/ConfirmModal.svelte';
import { closeMultipleTabs } from '../widgets/TabsPanel.svelte';
import { closeMultipleTabs } from '../tabpanel/TabsPanel.svelte';
export let data;
export let passProps;

1
packages/web/src/buttons/ToolStripButton.svelte
View File

@@ -31,6 +31,7 @@
align-self: stretch;
display: flex;
user-select: none;
margin: 2px 0px;
}
.button.disabled {
color: var(--theme-font-3);

34
packages/web/src/buttons/ToolStripContainer.svelte
View File

@@ -1,29 +1,29 @@
<div class="toolstrip">
<slot name="toolstrip" />
</div>
<div class="wrapper">
<div class="content">
<slot />
</div>
<div class="content">
<slot />
<div class="toolstrip">
<slot name="toolstrip" />
</div>
</div>
<style>
.content {
position: absolute;
left: 0;
top: 0;
border-bottom: 1px solid var(--theme-border);
right: 0;
bottom: var(--dim-toolstrip-height);
.wrapper {
flex: 1;
display: flex;
flex-direction: column;
}
.content {
border-bottom: 1px solid var(--theme-border);
display: flex;
flex: 1;
position: relative;
}
.toolstrip {
position: absolute;
left: 0;
height: var(--dim-toolstrip-height);
right: 0;
bottom: 0;
display: flex;
flex-wrap: wrap;
background: var(--theme-bg-1);
}
</style>

1
packages/web/src/buttons/ToolStripSplitButton.svelte
View File

@@ -39,6 +39,7 @@
align-self: stretch;
display: flex;
user-select: none;
margin: 2px 0px;
}
.button.disabled {
color: var(--theme-font-3);

13
packages/web/src/elements/HorizontalSplitter.svelte
View File

@@ -1,5 +1,8 @@
<script context="module">
export function computeSplitterSize(initialValue, clientSize) {
export function computeSplitterSize(initialValue, clientSize, customRatio) {
if (customRatio != null) {
return clientSize * customRatio;
}
if (_.isString(initialValue) && initialValue.startsWith('~') && initialValue.endsWith('px'))
return clientSize - parseInt(initialValue.slice(1, -2));
if (_.isString(initialValue) && initialValue.endsWith('px')) return parseInt(initialValue.slice(0, -2));
@@ -27,8 +30,9 @@
export let size = 0;
let clientWidth;
let customRatio = null;
$: size = computeSplitterSize(initialValue, clientWidth);
$: size = computeSplitterSize(initialValue, clientWidth, customRatio);
</script>
<div class="container" bind:clientWidth>
@@ -52,7 +56,10 @@
class="horizontal-split-handle"
style={collapsed1 || collapsed2 ? 'display:none' : ''}
use:splitterDrag={'clientX'}
on:resizeSplitter={e => (size += e.detail)}
on:resizeSplitter={e => {
size += e.detail;
if (clientWidth > 0) customRatio = size / clientWidth;
}}
/>
{/if}
<div

8
packages/web/src/elements/VerticalSplitter.svelte
View File

@@ -16,8 +16,9 @@
let collapsed1 = false;
let collapsed2 = false;
let customRatio = null;
$: size = computeSplitterSize(initialValue, clientHeight);
$: size = computeSplitterSize(initialValue, clientHeight, customRatio);
</script>
<div class="container" bind:clientHeight>
@@ -38,7 +39,10 @@
class={'vertical-split-handle'}
style={collapsed1 || collapsed2 ? 'display:none' : ''}
use:splitterDrag={'clientY'}
on:resizeSplitter={e => (size += e.detail)}
on:resizeSplitter={e => {
size += e.detail;
if (clientHeight > 0) customRatio = size / clientHeight;
}}
/>
<div
class={collapsed1 ? 'child1' : 'child2'}

1
packages/web/src/icons/FontIcon.svelte
View File

@@ -127,6 +127,7 @@
'icon compare': 'mdi mdi-compare',
'icon no-color': 'mdi mdi-format-color-marker-cancel',
'icon palette': 'mdi mdi-palette',
'icon split': 'mdi mdi-view-split-vertical',
'icon num-0': 'mdi mdi-numeric-0-circle',
'icon num-1': 'mdi mdi-numeric-1-circle',

11
packages/web/src/query/newQuery.ts
View File

@@ -1,6 +1,5 @@
import _ from 'lodash';
import { get } from 'svelte/store';
import { currentDatabase } from '../stores';
import { getCurrentDatabase } from '../stores';
import getConnectionLabel from '../utility/getConnectionLabel';
import openNewTab from '../utility/openNewTab';
@@ -9,11 +8,12 @@ export default function newQuery({
icon = 'img sql-file',
title = undefined,
initialData = undefined,
multiTabIndex = undefined,
...props
} = {}) {
const $currentDatabase = get(currentDatabase);
const connection = _.get($currentDatabase, 'connection') || {};
const database = _.get($currentDatabase, 'name');
const currentDb = getCurrentDatabase();
const connection = currentDb?.connection || {};
const database = currentDb?.name;
const tooltip = `${getConnectionLabel(connection)}\n${database}`;
@@ -23,6 +23,7 @@ export default function newQuery({
icon,
tooltip,
tabComponent,
multiTabIndex,
props: {
...props,
conid: connection._id,

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

@@ -1,4 +1,5 @@
import { writable, derived, readable } from 'svelte/store';
import localforage from 'localforage';
import type { ExtensionsDirectory } from 'dbgate-types';
import invalidateCommands from './commands/invalidateCommands';
import getElectron from './utility/getElectron';
@@ -17,6 +18,7 @@ export interface TabDefinition {
tabid: string;
tabComponent: string;
tabOrder?: number;
multiTabIndex?: number;
}
export function writableWithStorage<T>(defaultValue: T, storageName) {
@@ -28,6 +30,27 @@ export function writableWithStorage<T>(defaultValue: T, storageName) {
return res;
}
export function writableWithForage<T>(defaultValue: T, storageName) {
const res = writable<T>(defaultValue);
res.subscribe(value => {
localforage.setItem(storageName, value);
});
localforage.getItem(storageName).then(value => {
if (value == null) {
const migrated = localStorage.getItem(storageName);
if (migrated) {
localStorage.removeItem(storageName);
const parsed = safeJsonParse(migrated, defaultValue, true);
localforage.setItem(storageName, parsed);
res.set(parsed as T);
}
} else {
res.set(value as T);
}
});
return res;
}
export function writableSettingsValue<T>(defaultValue: T, storageName) {
const res = derived(useSettings(), $settings => {
const obj = $settings || {};
@@ -62,7 +85,7 @@ export const openedConnections = writable([]);
export const openedSingleDatabaseConnections = writable([]);
export const expandedConnections = writable([]);
export const currentDatabase = writable(null);
export const openedTabs = writableWithStorage<TabDefinition[]>([], 'openedTabs');
export const openedTabs = writableWithForage<TabDefinition[]>([], 'openedTabs');
export const copyRowsFormat = writableWithStorage('textWithoutHeaders', 'copyRowsFormat');
export const extensions = writable<ExtensionsDirectory>(null);
export const visibleCommandPalette = writable(null);
@@ -92,6 +115,11 @@ export const commandsCustomized = derived([commands, commandsSettings], ([$comma
}))
);
export const draggingTab = writable(null);
export const draggingTabTarget = writable(null);
export const draggingDbGroup = writable(null);
export const draggingDbGroupTarget = writable(null);
// export const visibleToolbar = writableWithStorage(true, 'visibleToolbar');
export const visibleToolbar = writable(false);
export const leftPanelWidth = writableWithStorage(300, 'leftPanelWidth');

19
packages/web/src/tabpanel/MultiTabsContainer.svelte Normal file
View File

@@ -0,0 +1,19 @@
<script>
import HorizontalSplitter from '../elements/HorizontalSplitter.svelte';
import { currentDatabase, lockedDatabaseMode, openedTabs } from '../stores';
import TabsContainer from './TabsContainer.svelte';
import { shouldShowTab } from './TabsPanel.svelte';
$: filteredTabsFromAllParts = $openedTabs.filter(x => shouldShowTab(x, $lockedDatabaseMode, $currentDatabase));
$: isLeft = !!filteredTabsFromAllParts.find(x => !x.multiTabIndex);
$: isRight = !!filteredTabsFromAllParts.find(x => x.multiTabIndex == 1);
</script>
<HorizontalSplitter hideFirst={!isLeft && isRight} isSplitter={isRight} allowCollapseChild1 allowCollapseChild2>
<div class="container" slot="1">
<TabsContainer multiTabIndex={0} />
</div>
<div class="container" slot="2">
<TabsContainer multiTabIndex={1} />
</div>
</HorizontalSplitter>

0
packages/web/src/TabContent.svelte → packages/web/src/tabpanel/TabContent.svelte
View File

22
packages/web/src/TabRegister.svelte → packages/web/src/tabpanel/TabRegister.svelte
View File

@@ -1,11 +1,13 @@
<script lang="ts">
import _ from 'lodash';
import { openedTabs } from './stores';
import { openedTabs } from '../stores';
import TabContent from './TabContent.svelte';
import tabs from './tabs';
import tabs from '../tabs';
export let multiTabIndex;
export let shownTab;
let mountedTabs = {};
$: selectedTab = $openedTabs.find(x => x.selected && x.closedTime == null);
// cleanup closed tabs
$: {
@@ -13,21 +15,23 @@
_.difference(
_.keys(mountedTabs),
_.map(
$openedTabs.filter(x => x.closedTime == null),
$openedTabs.filter(x => x.closedTime == null && (x.multiTabIndex || 0) == multiTabIndex),
'tabid'
)
).length > 0
) {
mountedTabs = _.pickBy(mountedTabs, (v, k) => $openedTabs.find(x => x.tabid == k && x.closedTime == null));
mountedTabs = _.pickBy(mountedTabs, (v, k) =>
$openedTabs.find(x => x.tabid == k && x.closedTime == null && (x.multiTabIndex || 0) == multiTabIndex)
);
}
}
// open missing tabs
$: {
if (selectedTab) {
const { tabid } = selectedTab;
if (shownTab) {
const { tabid } = shownTab;
if (tabid && !mountedTabs[tabid]) {
const newTab = tabs[selectedTab.tabComponent]?.default;
const newTab = tabs[shownTab.tabComponent]?.default;
if (newTab) {
mountedTabs = {
...mountedTabs,
@@ -46,6 +50,6 @@
tabComponent={mountedTabs[tabid]}
{...openedTabsByTabId[tabid]?.props}
{tabid}
tabVisible={tabid == (selectedTab && selectedTab.tabid)}
tabVisible={tabid == shownTab?.tabid}
/>
{/each}

58
packages/web/src/tabpanel/TabsContainer.svelte Normal file
View File

@@ -0,0 +1,58 @@
<script lang="ts">
import TabRegister from './TabRegister.svelte';
import TabsPanel from './TabsPanel.svelte';
import _ from 'lodash';
import { currentDatabase, lockedDatabaseMode, openedTabs, TabDefinition } from '../stores';
import { shouldShowTab } from './TabsPanel.svelte';
export let multiTabIndex;
function findShownTab(tabs: TabDefinition[], multiTabIndex, lockedDbMode, currentDb) {
const selectedTab = tabs.find(
x =>
x.selected &&
x.closedTime == null &&
(x.multiTabIndex || 0) == multiTabIndex &&
shouldShowTab(x, lockedDbMode, currentDb)
);
if (selectedTab) {
return selectedTab;
}
const selectedIndex = _.findLastIndex(
tabs,
x => (x.multiTabIndex || 0) == multiTabIndex && shouldShowTab(x, lockedDbMode, currentDb)
);
return tabs[selectedIndex];
}
$: shownTab = findShownTab($openedTabs, multiTabIndex, $lockedDatabaseMode, $currentDatabase);
</script>
<div class="tabs">
<TabsPanel {multiTabIndex} {shownTab} />
</div>
<div class="content">
<TabRegister {multiTabIndex} {shownTab} />
</div>
<style>
.tabs {
position: absolute;
top: 0;
left: 0;
height: var(--dim-tabs-panel-height);
right: 0;
background-color: var(--theme-bg-1);
border-top: 1px solid var(--theme-border);
}
.content {
position: absolute;
top: var(--dim-tabs-panel-height);
left: 0;
bottom: 0;
right: 0;
background-color: var(--theme-bg-1);
}
</style>

144
packages/web/src/widgets/TabsPanel.svelte → packages/web/src/tabpanel/TabsPanel.svelte
View File

@@ -43,6 +43,7 @@
const newFiles = files.map(x => ({
...x,
closedTime: shouldShowTab(x) && closeCondition(x, active) ? new Date().getTime() : x.closedTime,
selected: false,
}));
if (newFiles.find(x => x.selected && shouldShowTab(x))) {
@@ -72,6 +73,7 @@
: files.map(x => ({
...x,
closedTime: shouldShowTab(x) && closeCondition(x) ? new Date().getTime() : x.closedTime,
selected: false,
}));
if (newFiles.find(x => x.selected && shouldShowTab(x))) {
@@ -87,8 +89,26 @@
});
};
function splitTab(multiTabIndex) {
openedTabs.update(tabs =>
tabs.map(x => ({
...x,
multiTabIndex: x.selected ? 1 - multiTabIndex : x.multiTabIndex,
}))
);
}
function splitTabGroup(tabGroupTabs, multiTabIndex) {
openedTabs.update(tabs =>
tabs.map(x => ({
...x,
multiTabIndex: tabGroupTabs.find(y => x.tabid == y.tabid) ? 1 - multiTabIndex : x.multiTabIndex,
}))
);
}
const closeTab = closeTabFunc((x, active) => x.tabid == active.tabid);
const closeAll = async () => {
const closeAll = async multiTabIndex => {
const closeCandidates = getOpenedTabs()
.filter(x => x.unsaved)
.filter(x => shouldShowTab(x));
@@ -99,8 +119,12 @@
openedTabs.update(tabs =>
tabs.map(tab => ({
...tab,
closedTime: shouldShowTab(tab) ? closedTime : tab.closedTime,
closedTime:
shouldShowTab(tab) && (multiTabIndex == null || multiTabIndex == (tab.multiTabIndex || 0))
? closedTime
: tab.closedTime,
selected: false,
visibleSecondary: false,
}))
);
};
@@ -129,7 +153,8 @@
_.get(x, 'props.conid') != _.get(active, 'props.conid') ||
_.get(x, 'props.database') != _.get(active, 'props.database')
);
const closeOthers = closeTabFunc((x, active) => x.tabid != active.tabid);
const closeOthersInMultiTab = multiTabIndex =>
closeTabFunc((x, active) => x.tabid != active.tabid && (x.multiTabIndex || 0) == multiTabIndex);
function getTabDbName(tab, connectionList) {
if (tab.tabComponent == 'ConnectionTab') return 'Connections';
@@ -252,6 +277,10 @@
getCurrentDatabase,
lockedDatabaseMode,
getLockedDatabaseMode,
draggingDbGroup,
draggingDbGroupTarget,
draggingTab,
draggingTabTarget,
} from '../stores';
import tabs from '../tabs';
import { setSelectedTab } from '../utility/common';
@@ -264,7 +293,11 @@
import TabCloseButton from '../elements/TabCloseButton.svelte';
import CloseTabModal from '../modals/CloseTabModal.svelte';
$: showTabFilterFunc = tab => shouldShowTab(tab, $lockedDatabaseMode, $currentDatabase);
export let multiTabIndex;
export let shownTab;
$: showTabFilterFunc = tab =>
shouldShowTab(tab, $lockedDatabaseMode, $currentDatabase) && (tab.multiTabIndex || 0) == multiTabIndex;
$: connectionList = useConnectionList();
$: currentDbKey =
@@ -287,10 +320,9 @@
$: scrollInViewTab($activeTabId);
let draggingTab = null;
let draggingTabTarget = null;
let draggingDbGroup = null;
let draggingDbGroupTarget = null;
$: filteredTabsFromAllParts = $openedTabs.filter(x => shouldShowTab(x, $lockedDatabaseMode, $currentDatabase));
$: allowSplitTab =
_.uniq(filteredTabsFromAllParts.map(x => x.multiTabIndex || 0)).length == 1 && filteredTabsFromAllParts.length >= 2;
const connectionColorFactory = useConnectionColorFactory(3, null, true);
@@ -320,11 +352,11 @@
},
{
text: 'Close all',
onClick: closeAll,
onClick: () => closeAll(multiTabIndex),
},
{
text: 'Close others',
onClick: () => closeOthers(tabid),
onClick: () => closeOthersInMultiTab(multiTabIndex)(tabid),
},
{
text: 'Duplicate',
@@ -390,7 +422,7 @@
}
}
function dragDropTabs(draggingTabs, targetTabs) {
function dragDropTabs(draggingTabs, targetTabs, multiTabIndex) {
if (draggingTabs.find(x => targetTabs.find(y => x.tabid == y.tabid))) return;
const items = sortTabs($openedTabs.filter(x => x.closedTime == null));
@@ -422,11 +454,17 @@
return {
...x,
tabOrder: index + 1,
multiTabIndex: draggingTabs.find(y => y.tabid == x.tabid) ? multiTabIndex : x.multiTabIndex,
};
}
return x;
})
);
draggingDbGroup.set(null);
draggingDbGroupTarget.set(null);
draggingTab.set(null);
draggingTabTarget.set(null);
}
let domTabs;
@@ -440,14 +478,14 @@
</script>
<div class="root">
<div class="tabs" on:wheel={handleTabsWheel} bind:this={domTabs}>
<div class="tabs" class:can-split={allowSplitTab} on:wheel={handleTabsWheel} bind:this={domTabs}>
{#each groupedTabs as tabGroup}
<div class="db-wrapper">
{#if !$lockedDatabaseMode}
<div
class="db-name"
class:selected={draggingDbGroup
? tabGroup.grpid == draggingDbGroupTarget?.grpid
class:selected={$draggingDbGroup
? tabGroup.grpid == $draggingDbGroupTarget?.grpid
: tabGroup.tabDbKey == currentDbKey}
on:mouseup={e => {
if (e.button == 1) {
@@ -459,23 +497,23 @@
use:contextMenu={getDatabaseContextMenu(tabGroup.tabs)}
style={$connectionColorFactory(
tabGroup.tabs[0].props,
(draggingDbGroup ? tabGroup.grpid == draggingDbGroupTarget?.grpid : tabGroup.tabDbKey == currentDbKey)
($draggingDbGroup ? tabGroup.grpid == $draggingDbGroupTarget?.grpid : tabGroup.tabDbKey == currentDbKey)
? 2
: 3
)}
draggable={true}
on:dragstart={e => {
draggingDbGroup = tabGroup;
$draggingDbGroup = tabGroup;
}}
on:dragenter={e => {
draggingDbGroupTarget = tabGroup;
$draggingDbGroupTarget = tabGroup;
}}
on:drop={e => {
dragDropTabs(draggingDbGroup.tabs, tabGroup.tabs);
dragDropTabs($draggingDbGroup.tabs, tabGroup.tabs, multiTabIndex);
}}
on:dragend={e => {
draggingDbGroup = null;
draggingDbGroupTarget = null;
$draggingDbGroup = null;
$draggingDbGroupTarget = null;
}}
>
<div class="db-name-inner">
@@ -485,11 +523,21 @@
<FontIcon icon="icon lock" />
{/if}
</div>
<div
class="close-button-right tabCloseButton"
on:click={e => closeMultipleTabs(tab => tabGroup.tabs.find(x => x.tabid == tab.tabid))}
>
<FontIcon icon="icon close" />
<div class="tab-group-buttons">
{#if allowSplitTab && groupedTabs.length > 1}
<div
class="tab-group-button tabCloseButton"
on:click={e => splitTabGroup(tabGroup.tabs, multiTabIndex)}
>
<FontIcon icon="icon split" />
</div>
{/if}
<div
class="tab-group-button tabCloseButton"
on:click={e => closeMultipleTabs(tab => tabGroup.tabs.find(x => x.tabid == tab.tabid))}
>
<FontIcon icon="icon close" />
</div>
</div>
</div>
{/if}
@@ -498,32 +546,34 @@
<div
id={`file-tab-item-${tab.tabid}`}
class="file-tab-item"
class:selected={draggingTab || draggingDbGroup ? tab.tabid == draggingTabTarget?.tabid : tab.selected}
class:selected={$draggingTab || $draggingDbGroup
? tab.tabid == $draggingTabTarget?.tabid
: tab.tabid == shownTab?.tabid}
on:click={e => handleTabClick(e, tab.tabid)}
on:mouseup={e => handleMouseUp(e, tab.tabid)}
use:contextMenu={getContextMenu(tab)}
draggable={true}
on:dragstart={async e => {
draggingTab = tab;
$draggingTab = tab;
await tick();
setSelectedTab(tab.tabid);
// console.log('START', tab.tabid);
// e.dataTransfer.setData('tab_drag_data', tab.tabid);
}}
on:dragenter={e => {
draggingTabTarget = tab;
$draggingTabTarget = tab;
}}
on:drop={e => {
if (draggingTab) {
dragDropTabs([draggingTab], [tab]);
if ($draggingTab) {
dragDropTabs([$draggingTab], [tab], multiTabIndex);
}
if (draggingDbGroup) {
dragDropTabs(draggingDbGroup.tabs, [tab]);
if ($draggingDbGroup) {
dragDropTabs($draggingDbGroup.tabs, [tab], multiTabIndex);
}
}}
on:dragend={e => {
draggingTab = null;
draggingTabTarget = null;
$draggingTab = null;
$draggingTabTarget = null;
}}
>
<FontIcon icon={tab.busy ? 'icon loading' : tab.icon} />
@@ -540,7 +590,16 @@
</div>
{/each}
</div>
<div class="add-icon" on:click={() => newQuery({})} title="New query"><FontIcon icon="icon add" /></div>
<div class="icons-wrapper">
{#if allowSplitTab}
<div class="icon-button" on:click={() => splitTab(multiTabIndex)} title="Split window">
<FontIcon icon="icon split" />
</div>
{/if}
<div class="icon-button" on:click={() => newQuery({ multiTabIndex })} title="New query">
<FontIcon icon="icon add" />
</div>
</div>
</div>
<style>
@@ -551,7 +610,7 @@
right: 0;
bottom: 0;
}
.add-icon {
.icons-wrapper {
position: absolute;
right: 5px;
font-size: 20pt;
@@ -559,10 +618,13 @@
bottom: 0;
display: flex;
align-items: center;
display: flex;
}
.icon-button {
color: var(--theme-font-2);
cursor: pointer;
}
.add-icon:hover {
.icon-button:hover {
color: var(--theme-font-1);
}
.tabs {
@@ -575,6 +637,9 @@
right: 35px;
bottom: 0;
}
.tabs.can-split {
right: 60px;
}
.tabs::-webkit-scrollbar {
height: 7px;
}
@@ -634,13 +699,14 @@
white-space: nowrap;
flex-grow: 1;
}
.close-button-right {
.tab-group-buttons {
margin-left: 5px;
margin-right: 5px;
color: var(--theme-font-3);
display: flex;
}
.close-button-right:hover {
.tab-group-button:hover {
color: var(--theme-font-1);
}
</style>

1
packages/web/src/tabs/ConnectionTab.svelte
View File

@@ -31,7 +31,6 @@
import getConnectionLabel from '../utility/getConnectionLabel';
import { onMount } from 'svelte';
import { disconnectServerConnection, openConnection } from '../appobj/ConnectionAppObject.svelte';
import { closeMultipleTabs } from '../widgets/TabsPanel.svelte';
import { disconnectDatabaseConnection } from '../appobj/DatabaseAppObject.svelte';
export let connection;

51
packages/web/src/tabs/TableDataTab.svelte
View File

@@ -101,6 +101,7 @@
import { getBoolSettingsValue, getIntSettingsValue } from '../settings/settingsTools';
import useEditorData from '../query/useEditorData';
import { markTabSaved, markTabUnsaved } from '../utility/common';
import ToolStripButton from '../buttons/ToolStripButton.svelte';
export let tabid;
export let conid;
@@ -281,32 +282,28 @@
<ToolStripCommandButton command="dataGrid.switchToForm" hideDisabled />
<ToolStripCommandButton command="dataGrid.switchToTable" hideDisabled />
<ToolStripExportButton {quickExportHandlerRef} />
<ToolStripButton
icon="icon structure"
on:click={() => {
openNewTab({
title: pureName,
icon: 'img table-structure',
tabComponent: 'TableStructureTab',
props: {
schemaName,
pureName,
conid,
database,
objectTypeField: 'tables',
},
});
}}>Open structure</ToolStripButton
>
<ToolStripButton
icon={$collapsedLeftColumnStore ? 'icon columns-outline' : 'icon columns'}
on:click={() => collapsedLeftColumnStore.update(x => !x)}>View columns</ToolStripButton
>
</svelte:fragment>
</ToolStripContainer>
<StatusBarTabItem
text="Open structure"
icon="icon structure"
clickable
onClick={() => {
openNewTab({
title: pureName,
icon: 'img table-structure',
tabComponent: 'TableStructureTab',
props: {
schemaName,
pureName,
conid,
database,
objectTypeField: 'tables',
},
});
}}
/>
<StatusBarTabItem
text="View columns"
icon={$collapsedLeftColumnStore ? 'icon columns-outline' : 'icon columns'}
clickable
onClick={() => collapsedLeftColumnStore.update(x => !x)}
/>

43
packages/web/src/tabs/TableStructureTab.svelte
View File

@@ -60,6 +60,7 @@
import { apiCall } from '../utility/api';
import ToolStripContainer from '../buttons/ToolStripContainer.svelte';
import ToolStripCommandButton from '../buttons/ToolStripCommandButton.svelte';
import ToolStripButton from '../buttons/ToolStripButton.svelte';
export let tabid;
export let conid;
@@ -190,27 +191,25 @@
<ToolStripCommandButton command="tableStructure.reset" />
<ToolStripCommandButton command="tableEditor.addColumn" />
<ToolStripCommandButton command="tableEditor.addIndex" />
{#if objectTypeField == 'tables'}
<ToolStripButton
icon="icon table"
on:click={() => {
openNewTab({
title: pureName,
icon: 'img table',
tabComponent: 'TableDataTab',
props: {
schemaName,
pureName,
conid,
database,
objectTypeField: 'tables',
},
});
}}>Open data</ToolStripButton
>
{/if}
</svelte:fragment>
</ToolStripContainer>
{#if objectTypeField == 'tables'}
<StatusBarTabItem
text="Open data"
icon="icon table"
clickable
onClick={() => {
openNewTab({
title: pureName,
icon: 'img table',
tabComponent: 'TableDataTab',
props: {
schemaName,
pureName,
conid,
database,
objectTypeField: 'tables',
},
});
}}
/>
{/if}

10
packages/web/src/utility/ErrorHandler.svelte
View File

@@ -1,8 +1,8 @@
<script lang="ts">
import localforage from 'localforage';
import _ from 'lodash';
import { TabDefinition } from '../stores';
import getElectron from './getElectron';
import { getLocalStorage, setLocalStorage } from './storageCache';
let counter = 0;
$: counterCopy = counter;
@@ -26,15 +26,15 @@
)
) {
try {
let openedTabs = getLocalStorage('openedTabs') || [];
let openedTabs = (await localforage.getItem<TabDefinition[]>('openedTabs')) || [];
if (!_.isArray(openedTabs)) openedTabs = [];
openedTabs = openedTabs
.map(tab => (tab.closedTime ? tab : { ...tab, closedTime: new Date().getTime() }))
.map(tab => ({ ...tab, selected: false }));
setLocalStorage('openedTabs', openedTabs);
setLocalStorage('selectedWidget', 'history');
await localforage.setItem('openedTabs', openedTabs);
await localStorage.setItem('selectedWidget', 'history');
} catch (err) {
localStorage.removeItem('openedTabs');
localforage.removeItem('openedTabs');
}
// try {
// await localforage.clear();

2
packages/web/src/utility/changeCurrentDbByTab.ts
View File

@@ -1,6 +1,6 @@
import _ from 'lodash';
import { currentDatabase, getCurrentDatabase, getLockedDatabaseMode, openedTabs } from '../stores';
import { shouldShowTab } from '../widgets/TabsPanel.svelte';
import { shouldShowTab } from '../tabpanel/TabsPanel.svelte';
import { callWhenAppLoaded, getAppLoaded } from './appLoadManager';
import { getConnectionInfo } from './metadataLoaders';

4
packages/web/src/utility/localStorageGarbageCollector.js
View File

@@ -2,13 +2,13 @@ import moment from 'moment';
import localforage from 'localforage';
export default async function localStorageGarbageCollector() {
const openedTabsJson = localStorage.getItem('openedTabs');
const openedTabsJson = await localforage.getItem('openedTabs');
let openedTabs = openedTabsJson ? JSON.parse(openedTabsJson) : [];
const closeLimit = moment().add(-7, 'day').valueOf();
openedTabs = openedTabs.filter(x => !x.closedTime || x.closedTime > closeLimit);
localStorage.setItem('openedTabs', JSON.stringify(openedTabs));
await localforage.setItem('openedTabs', JSON.stringify(openedTabs));
const toRemove = [];
for (const key in localStorage) {

7
packages/web/src/utility/openNewTab.ts
View File

@@ -1,7 +1,6 @@
import _ from 'lodash';
import uuidv1 from 'uuid/v1';
import { get } from 'svelte/store';
import { getOpenedTabs, openedTabs } from '../stores';
import { getActiveTab, getOpenedTabs, openedTabs } from '../stores';
import tabs from '../tabs';
import { setSelectedTabFunc } from './common';
import localforage from 'localforage';
@@ -17,7 +16,8 @@ function findFreeNumber(numbers: number[]) {
}
export default async function openNewTab(newTab, initialData = undefined, options = undefined) {
const oldTabs = get(openedTabs);
const oldTabs = getOpenedTabs();
const activeTab = getActiveTab();
let existing = null;
@@ -98,6 +98,7 @@ export default async function openNewTab(newTab, initialData = undefined, option
...newTab,
tabid,
selected: true,
multiTabIndex: newTab?.multiTabIndex ?? activeTab?.multiTabIndex ?? 0,
tabOrder: _.findIndex(items, y => y.tabid == tabid),
},
];

3
packages/web/src/widgets/WidgetColumnBar.svelte
View File

@@ -26,10 +26,11 @@
$: computeDynamicProps(definitions);
function computeDynamicProps(defs: any[]) {
const visibleItemsCount = defs.filter(x => !x.collapsed && !x.skip).length;
for (let index = 0; index < defs.length; index++) {
const definition = defs[index];
const splitterVisible = !!defs.slice(index + 1).find(x => x && !x.collapsed && !x.skip);
dynamicPropsCollection[index].set({ splitterVisible });
dynamicPropsCollection[index].set({ splitterVisible, visibleItemsCount });
}
}
</script>

5
packages/web/src/widgets/WidgetColumnBarItem.svelte
View File

@@ -22,6 +22,7 @@
const dynamicProps = writable({
splitterVisible: false,
visibleItemsCount: 0,
});
const pushWidgetItemDefinition = getContext('pushWidgetItemDefinition') as any;
@@ -62,10 +63,12 @@
storageName && getLocalStorage(storageName) && getLocalStorage(storageName).visible != null
? getLocalStorage(storageName).visible
: !collapsed;
$: collapsible = $dynamicProps.visibleItemsCount != 1 || !visible;
</script>
{#if !skip && show}
<WidgetTitle on:click={() => (visible = !visible)}>{title}</WidgetTitle>
<WidgetTitle clickable={collapsible} on:click={collapsible ? () => (visible = !visible) : null}>{title}</WidgetTitle>
{#if visible}
<div class="wrapper" style={$dynamicProps.splitterVisible ? `height:${size}px` : 'flex: 1 1 0'}>

8
packages/web/src/widgets/WidgetTitle.svelte
View File

@@ -1,4 +1,8 @@
<div on:click>
<script lang="ts">
export let clickable = false;
</script>
<div on:click class:clickable>
<slot />
</div>
@@ -10,7 +14,7 @@
background-color: var(--theme-bg-1);
border: 2px solid var(--theme-border);
}
div:hover {
div.clickable:hover {
background-color: var(--theme-bg-2);
}
</style>

30
plugins/dbgate-plugin-postgres/src/backend/Analyser.js
View File

@@ -199,19 +199,23 @@ class Analyser extends DatabaseAnalyser {
x.schema_name == table.schema_name &&
!uniqueNames.rows.find(y => y.constraint_name == x.index_name)
)
.map(idx => ({
constraintName: idx.index_name,
isUnique: idx.is_unique,
columns: _.compact(
idx.indkey
.split(' ')
.map(colid => indexcols.rows.find(col => col.oid == idx.oid && col.attnum == colid))
.filter(col => col != null)
.map(col => ({
columnName: col.column_name,
}))
),
})),
.map(idx => {
const indOptionSplit = idx.indoption.split(' ');
return {
constraintName: idx.index_name,
isUnique: idx.is_unique,
columns: _.compact(
idx.indkey
.split(' ')
.map(colid => indexcols.rows.find(col => col.oid == idx.oid && col.attnum == colid))
.filter(col => col != null)
.map((col, colIndex) => ({
columnName: col.column_name,
isDescending: parseInt(indOptionSplit[colIndex]) > 0,
}))
),
};
}),
uniques: indexes.rows
.filter(
x =>

1
plugins/dbgate-plugin-postgres/src/backend/sql/indexes.js
View File

@@ -6,6 +6,7 @@ module.exports = `
ix.indisprimary as "is_primary",
ix.indisunique as "is_unique",
ix.indkey as "indkey",
ix.indoption as "indoption",
t.oid as "oid"
from
pg_class t,