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

connection tabs - improved UX

Browse Source
This commit is contained in:
Jan Prochazka
2022-06-09 09:16:40 +02:00
parent 6f3076fddb
commit b54026b039
9 changed files with 183 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -31,7 +31,45 @@
expandedConnections.update(x => _.uniq([...x, connection._id]));
}
}
closeMultipleTabs(x => x.tabComponent == 'ConnectionTab' && x.props?.conid == connection._id, true);
// closeMultipleTabs(x => x.tabComponent == 'ConnectionTab' && x.props?.conid == connection._id, true);
}
export function disconnectServerConnection(conid, showConfirmation = true) {
const closeCondition = x => x.props?.conid == conid && x.tabComponent != 'ConnectionTab' && x.closedTime == null;
if (showConfirmation) {
const count = getOpenedTabs().filter(closeCondition).length;
if (count > 0) {
showModal(ConfirmModal, {
message: `Closing connection will close ${count} opened tabs, continue?`,
onConfirm: () => disconnectServerConnection(conid, false),
});
return;
}
}
const electron = getElectron();
const currentDb = getCurrentDatabase();
openedConnections.update(list => list.filter(x => x != conid));
if (electron) {
apiCall('server-connections/disconnect', { conid });
}
if (currentDb?.connection?._id == conid) {
if (electron) {
apiCall('database-connections/disconnect', { conid, database: currentDb.name });
}
currentDatabase.set(null);
}
closeMultipleTabs(closeCondition);
// if (data.unsaved) {
// openNewTab({
// title: 'New Connection',
// icon: 'img connection',
// tabComponent: 'ConnectionTab',
// props: {
// conid: data._id,
// },
// });
// }
}
</script>
@@ -43,7 +81,9 @@
expandedConnections,
extensions,
getCurrentConfig,
getCurrentDatabase,
getOpenedConnections,
getOpenedTabs,
openedConnections,
openedSingleDatabaseConnections,
} from '../stores';
@@ -118,27 +158,7 @@
apiCall('server-connections/refresh', { conid: data._id });
};
const handleDisconnect = () => {
openedConnections.update(list => list.filter(x => x != data._id));
if (electron) {
apiCall('server-connections/disconnect', { conid: data._id });
}
if (_.get($currentDatabase, 'connection._id') == data._id) {
if (electron) {
apiCall('database-connections/disconnect', { conid: data._id, database: $currentDatabase.name });
}
currentDatabase.set(null);
}
closeMultipleTabs(x => x.props.conid == data._id);
if (data.unsaved) {
openNewTab({
title: 'New Connection',
icon: 'img connection',
tabComponent: 'ConnectionTab',
props: {
conid: data._id,
},
});
}
disconnectServerConnection(data._id);
};
const handleDelete = () => {
showModal(ConfirmModal, {
@@ -180,8 +200,8 @@
return [
config.runAsPortal == false && [
!$openedConnections.includes(data._id) && {
text: 'Edit',
{
text: $openedConnections.includes(data._id) ? 'View details' : 'Edit',
onClick: handleOpenConnectionTab,
},
!$openedConnections.includes(data._id) && {

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

@@ -1,6 +1,35 @@
<script lang="ts" context="module">
export const extractKey = props => props.name;
export function disconnectDatabaseConnection(conid, database, showConfirmation = true) {
const closeCondition = x =>
x.props?.conid == conid &&
x.props?.database == database &&
x.tabComponent != 'ConnectionTab' &&
x.closedTime == null;
if (showConfirmation) {
const count = getOpenedTabs().filter(closeCondition).length;
if (count > 0) {
showModal(ConfirmModal, {
message: `Closing connection will close ${count} opened tabs, continue?`,
onConfirm: () => disconnectDatabaseConnection(conid, database, false),
});
return;
}
}
const electron = getElectron();
if (electron) {
apiCall('database-connections/disconnect', { conid, database });
}
if (getCurrentDatabase()?.connection?._id == conid && getCurrentDatabase()?.name == database) {
currentDatabase.set(null);
}
openedSingleDatabaseConnections.update(list => list.filter(x => x != conid));
closeMultipleTabs(closeCondition);
}
export function getDatabaseMenuItems(
connection,
name,
@@ -135,14 +164,7 @@
};
const handleDisconnect = () => {
const electron = getElectron();
if (electron) {
apiCall('database-connections/disconnect', { conid: connection._id, database: name });
}
if (getCurrentDatabase()?.connection?._id == connection._id && getCurrentDatabase()?.name == name) {
currentDatabase.set(null);
}
openedSingleDatabaseConnections.update(list => list.filter(x => x != connection._id));
disconnectDatabaseConnection(connection._id, name);
};
const handleExportModel = async () => {
@@ -279,6 +301,7 @@
extensions,
getCurrentDatabase,
getExtensions,
getOpenedTabs,
openedConnections,
openedSingleDatabaseConnections,
pinnedDatabases,
@@ -300,6 +323,8 @@
import { exportSqlDump } from '../utility/exportFileTools';
import ImportDatabaseDumpModal from '../modals/ImportDatabaseDumpModal.svelte';
import ExportDatabaseDumpModal from '../modals/ExportDatabaseDumpModal.svelte';
import ConfirmModal from '../modals/ConfirmModal.svelte';
import { closeMultipleTabs } from '../widgets/TabsPanel.svelte';
export let data;
export let passProps;