87 lines
2.5 KiB
Svelte
87 lines
2.5 KiB
Svelte
<script>
|
|
import { onMount } from "svelte"
|
|
import { goto } from "@sveltech/routify"
|
|
import { backendUiStore } from "builderStore"
|
|
import { TableNames } from "constants"
|
|
import CreateDatasourceModal from "./modals/CreateDatasourceModal.svelte"
|
|
import EditDatasourcePopover from "./popovers/EditDatasourcePopover.svelte"
|
|
import { Modal, Switcher } from "@budibase/bbui"
|
|
import NavItem from "components/common/NavItem.svelte"
|
|
|
|
let modal
|
|
|
|
$: selectedView =
|
|
$backendUiStore.selectedView && $backendUiStore.selectedView.name
|
|
|
|
function selectDatasource(datasource) {
|
|
// You can't actually select a datasource, just edit it
|
|
backendUiStore.actions.datasources.select(datasource._id)
|
|
$goto(`./datasource/${datasource._id}`)
|
|
}
|
|
|
|
function onClickQuery(datasourceId, queryId) {
|
|
if ($backendUiStore.selectedQueryId === queryId) {
|
|
return
|
|
}
|
|
backendUiStore.actions.datasources.select(datasourceId)
|
|
backendUiStore.actions.queries.select(queryId)
|
|
$goto(`./datasource/${datasourceId}/${queryId}`)
|
|
}
|
|
|
|
onMount(() => {
|
|
backendUiStore.actions.datasources.fetch()
|
|
})
|
|
</script>
|
|
|
|
{#if $backendUiStore.selectedDatabase && $backendUiStore.selectedDatabase._id}
|
|
<div class="title">
|
|
<i
|
|
data-cy="new-datasource"
|
|
on:click={modal.show}
|
|
class="ri-add-circle-fill" />
|
|
</div>
|
|
<div class="hierarchy-items-container">
|
|
{#each $backendUiStore.datasources as datasource, idx}
|
|
<NavItem
|
|
border={idx > 0}
|
|
icon={'ri-database-2-line'}
|
|
text={datasource.name}
|
|
selected={$backendUiStore.selectedDatasourceId === datasource._id}
|
|
on:click={() => selectDatasource(datasource)}>
|
|
<EditDatasourcePopover {datasource} />
|
|
</NavItem>
|
|
{#each Object.keys(datasource.queries) as queryId}
|
|
<NavItem
|
|
indentLevel={1}
|
|
icon="ri-eye-line"
|
|
text={datasource.queries[queryId].name}
|
|
selected={$backendUiStore.selectedQueryId === queryId}
|
|
on:click={() => onClickQuery(datasource._id, queryId)}>
|
|
<!-- <EditViewPopover
|
|
view={{ name: viewName, ...table.views[viewName] }} /> -->
|
|
</NavItem>
|
|
{/each}
|
|
{/each}
|
|
</div>
|
|
{/if}
|
|
<Modal bind:this={modal}>
|
|
<CreateDatasourceModal />
|
|
</Modal>
|
|
|
|
<style>
|
|
.title {
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
}
|
|
|
|
.title i {
|
|
font-size: 20px;
|
|
}
|
|
.title i:hover {
|
|
cursor: pointer;
|
|
color: var(--blue);
|
|
}
|
|
</style>
|