Merge branch 'master' into develop

This commit is contained in:
Jan Prochazka
2021-09-30 08:28:25 +02:00
56 changed files with 752 additions and 225 deletions

View File

@@ -52,8 +52,9 @@
</div>
{/if}
{#each filtered as item}
{#each items as item}
<AppObjectListItem
isHidden={!item.isMatched}
{...$$restProps}
{module}
data={item.data}

View File

@@ -1,5 +1,6 @@
<script>
import _ from 'lodash';
import { asyncFilter } from '../utility/common';
import AppObjectGroup from './AppObjectGroup.svelte';
import AppObjectListItem from './AppObjectListItem.svelte';
@@ -16,11 +17,36 @@
export let groupFunc = undefined;
$: filtered = list.filter(data => {
const matcher = module.createMatcher && module.createMatcher(data);
if (matcher && !matcher(filter)) return false;
return true;
});
$: filtered = !groupFunc
? list.filter(data => {
const matcher = module.createMatcher && module.createMatcher(data);
if (matcher && !matcher(filter)) return false;
return true;
})
: null;
$: childrenMatched = !groupFunc
? list.filter(data => {
const matcher = module.createChildMatcher && module.createChildMatcher(data);
if (matcher && !matcher(filter)) return false;
return true;
})
: null;
// let filtered = [];
// $: {
// if (!groupFunc) {
// asyncFilter(list, async data => {
// const matcher = module.createMatcher && module.createMatcher(data);
// if (matcher && !(await matcher(filter))) return false;
// return true;
// }).then(res => {
// filtered = res;
// });
// }
// }
$: listGrouped = groupFunc
? _.compact(
@@ -34,7 +60,6 @@
: null;
$: groups = groupFunc ? _.groupBy(listGrouped, 'group') : null;
</script>
{#if groupFunc}
@@ -49,11 +74,13 @@
{checkedObjectsStore}
{groupFunc}
{disableContextMenu}
{filter}
/>
{/each}
{:else}
{#each filtered as data}
{#each list as data}
<AppObjectListItem
isHidden={!filtered.includes(data)}
{module}
{subItemsComponent}
{expandOnClick}
@@ -63,6 +90,8 @@
{expandIconFunc}
{checkedObjectsStore}
{disableContextMenu}
{filter}
isExpandedBySearch={childrenMatched.includes(data)}
/>
{/each}
{/if}

View File

@@ -10,6 +10,8 @@
import { tick } from 'svelte';
import { plusExpandIcon } from '../icons/expandIcons';
export let isHidden;
export let filter;
export let module;
export let data;
export let subItemsComponent;
@@ -18,6 +20,7 @@
export let expandIconFunc = plusExpandIcon;
export let checkedObjectsStore = null;
export let disableContextMenu = false;
export let isExpandedBySearch = false;
let isExpanded = false;
@@ -37,21 +40,23 @@
$: if (!expandable && isExpanded) isExpanded = false;
</script>
<svelte:component
this={module.default}
{data}
on:click={handleExpand}
on:expand={handleExpandButton}
expandIcon={getExpandIcon(expandable, subItemsComponent, isExpanded, expandIconFunc)}
{checkedObjectsStore}
{module}
{disableContextMenu}
/>
{#if !isHidden}
<svelte:component
this={module.default}
{data}
on:click={handleExpand}
on:expand={handleExpandButton}
expandIcon={getExpandIcon(!isExpandedBySearch && expandable, subItemsComponent, isExpanded, expandIconFunc)}
{checkedObjectsStore}
{module}
{disableContextMenu}
/>
{#if isExpanded && subItemsComponent}
<div class="subitems">
<svelte:component this={subItemsComponent} {data} />
</div>
{#if (isExpanded || isExpandedBySearch) && subItemsComponent}
<div class="subitems">
<svelte:component this={subItemsComponent} {data} {filter} />
</div>
{/if}
{/if}
<style>

View File

@@ -1,12 +1,22 @@
<script context="module">
export const extractKey = data => data._id;
export const createMatcher = ({ displayName, server }) => filter => filterName(filter, displayName, server);
export const createMatcher = props => filter => {
const { _id, displayName, server } = props;
const databases = getLocalStorage(`database_list_${_id}`) || [];
return filterName(filter, displayName, server, ...databases.map(x => x.name));
};
export const createChildMatcher = props => filter => {
if (!filter) return false;
const { _id } = props;
const databases = getLocalStorage(`database_list_${_id}`) || [];
return filterName(filter, ...databases.map(x => x.name));
};
</script>
<script lang="ts">
import _ from 'lodash';
import AppObjectCore from './AppObjectCore.svelte';
import { currentDatabase, extensions, getCurrentConfig, openedConnections } from '../stores';
import { currentDatabase, extensions, getCurrentConfig, getOpenedConnections, openedConnections } from '../stores';
import axiosInstance from '../utility/axiosInstance';
import { filterName } from 'dbgate-tools';
import { showModal } from '../modals/modalTools';
@@ -17,6 +27,8 @@
import { getDatabaseMenuItems } from './DatabaseAppObject.svelte';
import getElectron from '../utility/getElectron';
import getConnectionLabel from '../utility/getConnectionLabel';
import { getDatabaseList } from '../utility/metadataLoaders';
import { getLocalStorage } from '../utility/storageCache';
export let data;

View File

@@ -3,7 +3,7 @@
export const createMatcher = ({ pureName }) => filter => filterName(filter, pureName);
const electron = getElectron();
const icons = {
export const databaseObjectIcons = {
tables: 'img table',
collections: 'img collection',
views: 'img view',
@@ -337,7 +337,7 @@
{
title: scriptTemplate ? 'Query #' : pureName,
tooltip,
icon: scriptTemplate ? 'img sql-file' : icons[objectTypeField],
icon: scriptTemplate ? 'img sql-file' : databaseObjectIcons[objectTypeField],
tabComponent: scriptTemplate ? 'QueryTab' : tabComponent,
props: {
schemaName,
@@ -352,6 +352,24 @@
{ forceNewTab }
);
}
export function handleDatabaseObjectClick(data, forceNewTab = false) {
const { schemaName, pureName, conid, database, objectTypeField } = data;
openDatabaseObjectDetail(
defaultTabs[objectTypeField],
defaultTabs[objectTypeField] ? null : 'CREATE OBJECT',
{
schemaName,
pureName,
conid,
database,
objectTypeField,
},
forceNewTab,
null
);
}
</script>
<script lang="ts">
@@ -378,34 +396,7 @@
export let data;
function handleClick(forceNewTab = false) {
const { schemaName, pureName, conid, database, objectTypeField } = data;
openDatabaseObjectDetail(
defaultTabs[objectTypeField],
defaultTabs[objectTypeField] ? null : 'CREATE OBJECT',
{
schemaName,
pureName,
conid,
database,
objectTypeField,
},
forceNewTab,
null
);
// openNewTab({
// title: data.pureName,
// icon: 'img table',
// tabComponent: 'TableDataTab',
// props: {
// schemaName,
// pureName,
// conid,
// database,
// objectTypeField,
// },
// });
handleDatabaseObjectClick(data, forceNewTab);
}
const getDriver = async () => {
@@ -557,7 +548,7 @@
module={$$props.module}
{data}
title={data.schemaName ? `${data.schemaName}.${data.pureName}` : data.pureName}
icon={icons[data.objectTypeField]}
icon={databaseObjectIcons[data.objectTypeField]}
menu={createMenu}
on:click={() => handleClick()}
on:middleclick={() => handleClick(true)}

View File

@@ -1,11 +1,16 @@
<script lang="ts">
import { filterName } from 'dbgate-tools';
import { useDatabaseList } from '../utility/metadataLoaders';
import AppObjectList from './AppObjectList.svelte';
import * as databaseAppObject from './DatabaseAppObject.svelte';
export let filter;
export let data;
$: databases = useDatabaseList({ conid: data._id });
</script>
<AppObjectList list={($databases || []).map(db => ({ ...db, connection: data }))} module={databaseAppObject} />
<AppObjectList
list={($databases || []).filter(x => filterName(filter, x.name)).map(db => ({ ...db, connection: data }))}
module={databaseAppObject}
/>