mirror of
https://github.com/DeNNiiInc/dbgate.git
synced 2026-04-18 07:56:01 +00:00
connections UX
This commit is contained in:
@@ -35,7 +35,7 @@
|
||||
import DropDownButton from '../buttons/DropDownButton.svelte';
|
||||
import FontIcon from '../icons/FontIcon.svelte';
|
||||
import CloseSearchButton from '../buttons/CloseSearchButton.svelte';
|
||||
import { findEngineDriver } from 'dbgate-tools';
|
||||
import { findEngineDriver, getConnectionLabel } from 'dbgate-tools';
|
||||
import {
|
||||
currentDatabase,
|
||||
extensions,
|
||||
@@ -53,6 +53,7 @@
|
||||
import { matchDatabaseObjectAppObject } from '../appobj/appObjectTools';
|
||||
import FormStyledButton from '../buttons/FormStyledButton.svelte';
|
||||
import clickOutside from '../utility/clickOutside';
|
||||
import { openConnection } from '../appobj/ConnectionAppObject.svelte';
|
||||
|
||||
export let conid;
|
||||
export let database;
|
||||
@@ -135,8 +136,8 @@
|
||||
|
||||
$: differentFocusedDb =
|
||||
$focusedConnectionOrDatabase &&
|
||||
$focusedConnectionOrDatabase?.database &&
|
||||
($focusedConnectionOrDatabase.conid != conid || $focusedConnectionOrDatabase?.database != database);
|
||||
($focusedConnectionOrDatabase.conid != conid ||
|
||||
($focusedConnectionOrDatabase?.database && $focusedConnectionOrDatabase?.database != database));
|
||||
</script>
|
||||
|
||||
{#if $status && $status.name == 'error'}
|
||||
@@ -199,30 +200,52 @@
|
||||
|
||||
{#if differentFocusedDb}
|
||||
<div class="no-focused-info">
|
||||
<div class="m-1">Current database:</div>
|
||||
<div class="m-1 ml-3 mb-3">
|
||||
<b>{database}</b>
|
||||
</div>
|
||||
<FormStyledButton
|
||||
value={`Switch to ${$focusedConnectionOrDatabase?.database}`}
|
||||
skipWidth
|
||||
on:click={() =>
|
||||
switchCurrentDatabase({
|
||||
connection: $focusedConnectionOrDatabase?.connection,
|
||||
name: $focusedConnectionOrDatabase?.database,
|
||||
})}
|
||||
/>
|
||||
<FormStyledButton
|
||||
value={`Show ${database}`}
|
||||
skipWidth
|
||||
on:click={() => {
|
||||
$focusedConnectionOrDatabase = {
|
||||
conid,
|
||||
database,
|
||||
connection: $connection,
|
||||
};
|
||||
}}
|
||||
/>
|
||||
{#if $focusedConnectionOrDatabase?.database}
|
||||
<div class="m-1">Current database:</div>
|
||||
<div class="m-1 ml-3 mb-3">
|
||||
<b>{database}</b>
|
||||
</div>
|
||||
<FormStyledButton
|
||||
value={`Switch to ${$focusedConnectionOrDatabase?.database}`}
|
||||
skipWidth
|
||||
on:click={() =>
|
||||
switchCurrentDatabase({
|
||||
connection: $focusedConnectionOrDatabase?.connection,
|
||||
name: $focusedConnectionOrDatabase?.database,
|
||||
})}
|
||||
/>
|
||||
<FormStyledButton
|
||||
value={`Show ${database}`}
|
||||
skipWidth
|
||||
on:click={() => {
|
||||
$focusedConnectionOrDatabase = {
|
||||
conid,
|
||||
database,
|
||||
connection: $connection,
|
||||
};
|
||||
}}
|
||||
/>
|
||||
{:else}
|
||||
<div class="m-1">Current connection:</div>
|
||||
<div class="m-1 ml-3 mb-3">
|
||||
<b>{getConnectionLabel($connection)}</b>
|
||||
</div>
|
||||
<FormStyledButton
|
||||
value={`Connect to ${getConnectionLabel($focusedConnectionOrDatabase?.connection)}`}
|
||||
skipWidth
|
||||
on:click={() => openConnection($focusedConnectionOrDatabase?.connection)}
|
||||
/>
|
||||
<FormStyledButton
|
||||
value={`Show ${getConnectionLabel($connection)}`}
|
||||
skipWidth
|
||||
on:click={() => {
|
||||
$focusedConnectionOrDatabase = {
|
||||
conid,
|
||||
connection: $connection,
|
||||
};
|
||||
}}
|
||||
/>
|
||||
{/if}
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user