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

buttons folder

Browse Source
This commit is contained in:
Jan Prochazka
2022-02-12 17:26:28 +01:00
parent 5a88423f62
commit e06b030707
74 changed files with 81 additions and 107 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
packages/web/src/widgets/AppFilesList.svelte
View File

@@ -20,10 +20,10 @@
import AppObjectList from '../appobj/AppObjectList.svelte';
import * as appFileAppObject from '../appobj/AppFileAppObject.svelte';
import CloseSearchButton from '../elements/CloseSearchButton.svelte';
import DropDownButton from '../elements/DropDownButton.svelte';
import CloseSearchButton from '../buttons/CloseSearchButton.svelte';
import DropDownButton from '../buttons/DropDownButton.svelte';
import InlineButton from '../elements/InlineButton.svelte';
import InlineButton from '../buttons/InlineButton.svelte';
import SearchBoxWrapper from '../elements/SearchBoxWrapper.svelte';
import SearchInput from '../elements/SearchInput.svelte';

4
packages/web/src/widgets/AppFolderList.svelte
View File

@@ -4,9 +4,9 @@
import AppObjectList from '../appobj/AppObjectList.svelte';
import * as appFolderAppObject from '../appobj/AppFolderAppObject.svelte';
import runCommand from '../commands/runCommand';
import CloseSearchButton from '../elements/CloseSearchButton.svelte';
import CloseSearchButton from '../buttons/CloseSearchButton.svelte';
import InlineButton from '../elements/InlineButton.svelte';
import InlineButton from '../buttons/InlineButton.svelte';
import SearchBoxWrapper from '../elements/SearchBoxWrapper.svelte';
import SearchInput from '../elements/SearchInput.svelte';

6
packages/web/src/widgets/ArchiveFilesList.svelte
View File

@@ -17,10 +17,10 @@
import AppObjectList from '../appobj/AppObjectList.svelte';
import * as archiveFileAppObject from '../appobj/ArchiveFileAppObject.svelte';
import CloseSearchButton from '../elements/CloseSearchButton.svelte';
import DropDownButton from '../elements/DropDownButton.svelte';
import CloseSearchButton from '../buttons/CloseSearchButton.svelte';
import DropDownButton from '../buttons/DropDownButton.svelte';
import InlineButton from '../elements/InlineButton.svelte';
import InlineButton from '../buttons/InlineButton.svelte';
import SearchBoxWrapper from '../elements/SearchBoxWrapper.svelte';
import SearchInput from '../elements/SearchInput.svelte';

4
packages/web/src/widgets/ArchiveFolderList.svelte
View File

@@ -4,9 +4,9 @@
import AppObjectList from '../appobj/AppObjectList.svelte';
import * as archiveFolderAppObject from '../appobj/ArchiveFolderAppObject.svelte';
import runCommand from '../commands/runCommand';
import CloseSearchButton from '../elements/CloseSearchButton.svelte';
import CloseSearchButton from '../buttons/CloseSearchButton.svelte';
import InlineButton from '../elements/InlineButton.svelte';
import InlineButton from '../buttons/InlineButton.svelte';
import SearchBoxWrapper from '../elements/SearchBoxWrapper.svelte';
import SearchInput from '../elements/SearchInput.svelte';

6
packages/web/src/widgets/ConnectionList.svelte
View File

@@ -1,6 +1,6 @@
<script lang="ts">
import _ from 'lodash';
import InlineButton from '../elements/InlineButton.svelte';
import InlineButton from '../buttons/InlineButton.svelte';
import SearchInput from '../elements/SearchInput.svelte';
import WidgetsInnerContainer from './WidgetsInnerContainer.svelte';
import { useConnectionList, useServerStatus } from '../utility/metadataLoaders';
@@ -9,12 +9,12 @@
import * as connectionAppObject from '../appobj/ConnectionAppObject.svelte';
import SubDatabaseList from '../appobj/SubDatabaseList.svelte';
import { commands, commandsCustomized, openedConnections } from '../stores';
import ToolbarButton from './ToolbarButton.svelte';
import ToolbarButton from '../buttons/ToolbarButton.svelte';
import runCommand from '../commands/runCommand';
import getConnectionLabel from '../utility/getConnectionLabel';
import { useConnectionColorFactory } from '../utility/useConnectionColor';
import FontIcon from '../icons/FontIcon.svelte';
import CloseSearchButton from '../elements/CloseSearchButton.svelte';
import CloseSearchButton from '../buttons/CloseSearchButton.svelte';
import { apiCall } from '../utility/api';
const connections = useConnectionList();

2
packages/web/src/widgets/QueryHistoryList.svelte
View File

@@ -7,7 +7,7 @@
import FontIcon from '../icons/FontIcon.svelte';
import { onMount } from 'svelte';
import openNewTab from '../utility/openNewTab';
import CloseSearchButton from '../elements/CloseSearchButton.svelte';
import CloseSearchButton from '../buttons/CloseSearchButton.svelte';
import { apiCall, apiOff, apiOn } from '../utility/api';
let filter = '';

2
packages/web/src/widgets/Snackbar.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import FontIcon from '../icons/FontIcon.svelte';
import { onMount } from 'svelte';
import FormStyledButton from '../elements/FormStyledButton.svelte';
import FormStyledButton from '../buttons/FormStyledButton.svelte';
import { openedSnackbars } from '../stores';
export let message;

6
packages/web/src/widgets/SqlObjectList.svelte
View File

@@ -13,7 +13,7 @@
</script>
<script lang="ts">
import InlineButton from '../elements/InlineButton.svelte';
import InlineButton from '../buttons/InlineButton.svelte';
import SearchInput from '../elements/SearchInput.svelte';
import WidgetsInnerContainer from './WidgetsInnerContainer.svelte';
import { useConnectionInfo, useDatabaseInfo, useDatabaseStatus } from '../utility/metadataLoaders';
@@ -26,9 +26,9 @@
import ErrorInfo from '../elements/ErrorInfo.svelte';
import LoadingInfo from '../elements/LoadingInfo.svelte';
import { getObjectTypeFieldLabel } from '../utility/common';
import DropDownButton from '../elements/DropDownButton.svelte';
import DropDownButton from '../buttons/DropDownButton.svelte';
import FontIcon from '../icons/FontIcon.svelte';
import CloseSearchButton from '../elements/CloseSearchButton.svelte';
import CloseSearchButton from '../buttons/CloseSearchButton.svelte';
import { findEngineDriver } from 'dbgate-tools';
import { extensions } from '../stores';
import newQuery from '../query/newQuery';

70
packages/web/src/widgets/ToolStripButton.svelte
View File

@@ -1,70 +0,0 @@
<script lang="ts">
import { createEventDispatcher } from 'svelte';
import FontIcon from '../icons/FontIcon.svelte';
export let disabled = false;
export let icon = null;
export let title = null;
export let externalImage = null;
const dispatch = createEventDispatcher();
function handleClick(e) {
if (disabled) return;
dispatch('click');
}
</script>
<div class="button" class:disabled {title}>
<div class="inner" class:disabled on:click={handleClick}>
{#if externalImage}
<img src={externalImage} />
{:else}
<span class="icon" class:disabled><FontIcon {icon} /></span>
<slot />
{/if}
</div>
</div>
<style>
.button {
/* padding: 5px 15px; */
padding-left: 5px;
padding-right: 5px;
color: var(--theme-font-1);
border: 0;
align-self: stretch;
display: flex;
user-select: none;
}
.button.disabled {
color: var(--theme-font-3);
}
.inner:hover:not(.disabled) {
background: var(--theme-bg-3);
}
.inner:active:hover:not(.disabled) {
background: var(--theme-bg-4);
}
.icon {
margin-right: 5px;
color: var(--theme-font-link);
}
.icon.disabled {
color: var(--theme-font-3);
}
.inner {
/* position: relative;
top: 2px; */
white-space: nowrap;
align-self: center;
background: var(--theme-bg-2);
padding: 3px 8px;
border-radius: 4px;
cursor: pointer;
}
img {
width: 20px;
height: 20px;
}
</style>

29
packages/web/src/widgets/ToolStripCommandButton.svelte
View File

@@ -1,29 +0,0 @@
<script context="module">
function getCommandTitle(command) {
let res = command.text;
if (command.keyText || command.keyTextFromGroup) res += ` (${command.keyText || command.keyTextFromGroup})`;
return res;
}
</script>
<script lang="ts">
import { commandsCustomized } from '../stores';
import ToolStripButton from './ToolStripButton.svelte';
export let command;
export let component = ToolStripButton;
$: cmd = Object.values($commandsCustomized).find((x: any) => x.id == command) as any;
</script>
{#if cmd}
<svelte:component
this={component}
title={getCommandTitle(cmd)}
icon={cmd.icon}
on:click={cmd.onClick}
disabled={!cmd.enabled}
>
{cmd.toolbarName || cmd.name}
</svelte:component>
{/if}

27
packages/web/src/widgets/ToolStripContainer.svelte
View File

@@ -1,27 +0,0 @@
<div class="toolstrip">
<slot name="toolstrip" />
</div>
<div class="content">
<slot />
</div>
<style>
.content {
position: absolute;
left: 0;
top: var(--dim-toolbar-height);
right: 0;
bottom: 0;
display: flex;
}
.toolstrip {
position: absolute;
left: 0;
height: var(--dim-toolbar-height);
right: 0;
display: flex;
background: var(--theme-bg-0);
}
</style>

22
packages/web/src/widgets/ToolStripDropDownButton.svelte
View File

@@ -1,22 +0,0 @@
<script lang="ts">
import { currentDropDownMenu } from '../stores';
import ToolStripButton from './ToolStripButton.svelte';
export let menu;
export let title;
export let label;
export let icon;
export let component = ToolStripButton;
function handleClick(e) {
const rect = e.target.getBoundingClientRect();
const left = rect.left;
const top = rect.bottom;
currentDropDownMenu.set({ left, top, items: menu });
}
</script>
<svelte:component this={component} {title} {icon} on:click={handleClick}>
{label}
</svelte:component>

2
packages/web/src/widgets/Toolbar.svelte
View File

@@ -14,7 +14,7 @@
import { activeTab, commands, commandsCustomized } from '../stores';
import getElectron from '../utility/getElectron';
import { useFavorites } from '../utility/metadataLoaders';
import ToolbarButton from './ToolbarButton.svelte';
import ToolbarButton from '../buttons/ToolbarButton.svelte';
const electron = getElectron();

67
packages/web/src/widgets/ToolbarButton.svelte
View File

@@ -1,67 +0,0 @@
<script lang="ts">
import { createEventDispatcher } from 'svelte';
import FontIcon from '../icons/FontIcon.svelte';
export let disabled = false;
export let icon = null;
export let title = null;
export let externalImage = null;
const dispatch = createEventDispatcher();
function handleClick(e) {
if (disabled) return;
dispatch('click');
}
</script>
<div class="button" on:click={handleClick} class:disabled {title}>
<div class="inner">
{#if externalImage}
<img src={externalImage} />
{:else}
<span class="icon" class:disabled><FontIcon {icon} /></span>
<slot />
{/if}
</div>
</div>
<style>
.button {
/* padding: 5px 15px; */
padding-left: 15px;
padding-right: 15px;
color: var(--theme-font-1);
border: 0;
border-right: 1px solid var(--theme-border);
align-self: stretch;
display: flex;
user-select: none;
}
.button.disabled {
color: var(--theme-font-3);
}
.button:hover:not(.disabled) {
background: var(--theme-bg-2);
}
.button:active:hover:not(.disabled) {
background: var(--theme-bg-3);
}
.icon {
margin-right: 5px;
color: var(--theme-font-link);
}
.icon.disabled {
color: var(--theme-font-3);
}
.inner {
/* position: relative;
top: 2px; */
white-space: nowrap;
align-self: center;
}
img {
width: 20px;
height: 20px;
}
</style>