dennii/dbgate
1
0
Fork 0
mirror of https://github.com/DeNNiiInc/dbgate.git synced 2026-05-01 22:33:59 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor

Browse Source
This commit is contained in:
Jan Prochazka
2022-05-19 13:12:11 +02:00
parent 1d013f96fb
commit 00c9ac61c4
7 changed files with 7 additions and 177 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -44,10 +44,9 @@
} from '../stores';
import { filterName } from 'dbgate-tools';
import { showModal } from '../modals/modalTools';
import ConnectionModal from '../modals/ConnectionModal.svelte';
import ConfirmModal from '../modals/ConfirmModal.svelte';
import InputTextModal from '../modals/InputTextModal.svelte';
import openNewTab, { closeTabWithNoHistory } from '../utility/openNewTab';
import openNewTab from '../utility/openNewTab';
import { getDatabaseMenuItems } from './DatabaseAppObject.svelte';
import getElectron from '../utility/getElectron';
import getConnectionLabel from '../utility/getConnectionLabel';
@@ -122,9 +121,6 @@
});
}
};
// const handleEdit = () => {
// showModal(ConnectionModal, { connection: data });
// };
const handleDelete = () => {
showModal(ConfirmModal, {
message: `Really delete connection ${getConnectionLabel(data)}?`,

3
packages/web/src/commands/stdCommands.ts
View File

@@ -1,10 +1,7 @@
import { currentDatabase, currentTheme, extensions, getExtensions, getVisibleToolbar, visibleToolbar } from '../stores';
import registerCommand from './registerCommand';
import { get } from 'svelte/store';
import { ThemeDefinition } from 'dbgate-types';
import ConnectionModal from '../modals/ConnectionModal.svelte';
import AboutModal from '../modals/AboutModal.svelte';
import AddDbKeyModal from '../modals/AddDbKeyModal.svelte';
import SettingsModal from '../settings/SettingsModal.svelte';
import ImportExportModal from '../modals/ImportExportModal.svelte';
import SqlGeneratorModal from '../modals/SqlGeneratorModal.svelte';

163
packages/web/src/modals/ConnectionModal.svelte
View File

@@ -1,163 +0,0 @@
<script lang="ts">
import registerCommand from '../commands/registerCommand';
import FormButton from '../forms/FormButton.svelte';
import FormProvider from '../forms/FormProvider.svelte';
import FormSubmit from '../forms/FormSubmit.svelte';
import FontIcon from '../icons/FontIcon.svelte';
import TabControl from '../elements/TabControl.svelte';
import ConnectionModalDriverFields from './ConnectionModalDriverFields.svelte';
import ConnectionModalSshTunnelFields from './ConnectionModalSshTunnelFields.svelte';
import ConnectionModalSslFields from './ConnectionModalSslFields.svelte';
import FormFieldTemplateLarge from '../forms/FormFieldTemplateLarge.svelte';
import ModalBase from './ModalBase.svelte';
import { closeCurrentModal, closeModal, showModal } from './modalTools';
import createRef from '../utility/createRef';
import Link from '../elements/Link.svelte';
import ErrorMessageModal from './ErrorMessageModal.svelte';
import { writable } from 'svelte/store';
import FormProviderCore from '../forms/FormProviderCore.svelte';
import { extensions, getCurrentConfig } from '../stores';
import _ from 'lodash';
import { getDatabaseFileLabel } from '../utility/getConnectionLabel';
import { apiCall } from '../utility/api';
export let connection;
let isTesting;
let sqlConnectResult;
const values = writable(
connection || {
server: getCurrentConfig().isDocker ? 'dockerhost' : 'localhost',
engine: '',
}
);
$: engine = $values.engine;
$: driver = $extensions.drivers.find(x => x.engine == engine);
const testIdRef = createRef(0);
async function handleTest(e) {
isTesting = true;
testIdRef.update(x => x + 1);
const testid = testIdRef.get();
const resp = await apiCall('connections/test', e.detail);
if (testIdRef.get() != testid) return;
isTesting = false;
sqlConnectResult = resp;
}
function handleCancelTest() {
testIdRef.update(x => x + 1); // invalidate current test
isTesting = false;
}
async function handleSubmit(e) {
const allProps = [
'databaseFile',
'useDatabaseUrl',
'databaseUrl',
'authType',
'server',
'port',
'user',
'password',
'defaultDatabase',
'singleDatabase',
];
const visibleProps = allProps.filter(x => driver?.showConnectionField(x, $values));
const omitProps = _.difference(allProps, visibleProps);
if (!$values.defaultDatabase) omitProps.push('singleDatabase');
let connection = _.omit(e.detail, omitProps);
if (driver?.beforeConnectionSave) connection = driver?.beforeConnectionSave(connection);
apiCall('connections/save', connection);
closeCurrentModal();
}
</script>
<FormProviderCore template={FormFieldTemplateLarge} {values}>
<ModalBase {...$$restProps} noPadding>
<div slot="header">Add connection</div>
<TabControl
isInline
tabs={[
{
label: 'Main',
component: ConnectionModalDriverFields,
},
(!driver?.showConnectionTab || driver?.showConnectionTab('sshTunnel', $values)) && {
label: 'SSH Tunnel',
component: ConnectionModalSshTunnelFields,
},
(!driver?.showConnectionTab || driver?.showConnectionTab('ssl', $values)) && {
label: 'SSL',
component: ConnectionModalSslFields,
},
]}
/>
<div slot="footer" class="flex">
<div class="buttons">
{#if isTesting}
<FormButton value="Cancel test" on:click={handleCancelTest} />
{:else}
<FormButton value="Test" on:click={handleTest} />
{/if}
<FormSubmit value="Save" on:click={handleSubmit} />
</div>
<div class="test-result">
{#if !isTesting && sqlConnectResult && sqlConnectResult.msgtype == 'connected'}
<div>
Connected: <FontIcon icon="img ok" />
{sqlConnectResult.version}
</div>
{/if}
{#if !isTesting && sqlConnectResult && sqlConnectResult.msgtype == 'error'}
<div class="error-result">
Connect failed: <FontIcon icon="img error" />
{sqlConnectResult.error}
<Link
onClick={() =>
showModal(ErrorMessageModal, {
message: sqlConnectResult.detail,
showAsCode: true,
title: 'Database connection error',
})}
>
Show detail
</Link>
</div>
{/if}
{#if isTesting}
<div>
<FontIcon icon="icon loading" /> Testing connection
</div>
{/if}
</div>
</div>
</ModalBase>
</FormProviderCore>
<style>
.buttons {
flex-shrink: 0;
}
.test-result {
margin-left: 10px;
align-self: center;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.error-result {
white-space: normal;
}
</style>

0
packages/web/src/modals/ConnectionModalDriverFields.svelte → packages/web/src/settings/ConnectionDriverFields.svelte
View File

0
packages/web/src/modals/ConnectionModalSshTunnelFields.svelte → packages/web/src/settings/ConnectionSshTunnelFields.svelte
View File

0
packages/web/src/modals/ConnectionModalSslFields.svelte → packages/web/src/settings/ConnectionSslFields.svelte
View File

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

@@ -6,9 +6,9 @@
import FormButton from '../forms/FormButton.svelte';
import FontIcon from '../icons/FontIcon.svelte';
import TabControl from '../elements/TabControl.svelte';
import ConnectionModalDriverFields from '../modals/ConnectionModalDriverFields.svelte';
import ConnectionModalSshTunnelFields from '../modals/ConnectionModalSshTunnelFields.svelte';
import ConnectionModalSslFields from '../modals/ConnectionModalSslFields.svelte';
import ConnectionDriverFields from '../settings/ConnectionDriverFields.svelte';
import ConnectionSshTunnelFields from '../settings/ConnectionSshTunnelFields.svelte';
import ConnectionSslFields from '../settings/ConnectionSslFields.svelte';
import FormFieldTemplateLarge from '../forms/FormFieldTemplateLarge.svelte';
import { showModal } from '../modals/modalTools';
@@ -155,15 +155,15 @@
tabs={[
{
label: 'General',
component: ConnectionModalDriverFields,
component: ConnectionDriverFields,
},
driver?.showConnectionTab('sshTunnel', $values) && {
label: 'SSH Tunnel',
component: ConnectionModalSshTunnelFields,
component: ConnectionSshTunnelFields,
},
driver?.showConnectionTab('ssl', $values) && {
label: 'SSL',
component: ConnectionModalSslFields,
component: ConnectionSslFields,
},
]}
/>