mirror of https://github.com/Budibase/budibase.git
Martin McKeaveney
5 years ago
25 changed files with 224 additions and 189 deletions
@ -1,15 +1,33 @@ |
|||
<script> |
|||
import { Input, TextArea, Spacer } from "@budibase/bbui" |
|||
import { Label, Input, TextArea, Spacer } from "@budibase/bbui" |
|||
import KeyValueBuilder from "components/integration/KeyValueBuilder.svelte" |
|||
|
|||
export let integration |
|||
</script> |
|||
|
|||
<form> |
|||
{#each Object.keys(integration) as configKey} |
|||
<Input |
|||
type={integration[configKey].type} |
|||
label={configKey} |
|||
bind:value={integration[configKey]} /> |
|||
<Spacer large /> |
|||
<div class="form-row"> |
|||
{#if typeof integration[configKey] === 'object'} |
|||
<Label small>{configKey}</Label> |
|||
<KeyValueBuilder bind:object={integration[configKey]} /> |
|||
{:else} |
|||
<Label small>{configKey}</Label> |
|||
<Input |
|||
outline |
|||
type={integration[configKey].type} |
|||
bind:value={integration[configKey]} /> |
|||
{/if} |
|||
</div> |
|||
{/each} |
|||
</form> |
|||
|
|||
<style> |
|||
.form-row { |
|||
display: grid; |
|||
grid-template-columns: 20% 1fr; |
|||
grid-gap: var(--spacing-l); |
|||
align-items: center; |
|||
margin-bottom: var(--spacing-m); |
|||
} |
|||
</style> |
|||
|
|||
@ -1,61 +0,0 @@ |
|||
<script> |
|||
import { goto, params } from "@sveltech/routify" |
|||
import { backendUiStore, store } from "builderStore" |
|||
import { notifier } from "builderStore/store/notifications" |
|||
import { Input, Label, ModalContent, Button, Spacer } from "@budibase/bbui" |
|||
import TableIntegrationMenu from "../TableIntegrationMenu/index.svelte" |
|||
import analytics from "analytics" |
|||
|
|||
let modal |
|||
let error = "" |
|||
|
|||
let name |
|||
let source |
|||
let integration |
|||
let datasource |
|||
|
|||
function checkValid(evt) { |
|||
const datasourceName = evt.target.value |
|||
if ( |
|||
$backendUiStore.datasources?.some( |
|||
datasource => datasource.name === datasourceName |
|||
) |
|||
) { |
|||
error = `Datasource with name ${tableName} already exists. Please choose another name.` |
|||
return |
|||
} |
|||
error = "" |
|||
} |
|||
|
|||
async function saveDatasource() { |
|||
const { type, ...config } = integration |
|||
|
|||
// Create datasource |
|||
await backendUiStore.actions.datasources.save({ |
|||
name, |
|||
source: type, |
|||
config, |
|||
}) |
|||
notifier.success(`Datasource ${name} created successfully.`) |
|||
analytics.captureEvent("Datasource Created", { name }) |
|||
|
|||
// Navigate to new datasource |
|||
$goto(`./datasource/${datasource._id}`) |
|||
} |
|||
</script> |
|||
|
|||
<ModalContent |
|||
title="Create Datasource" |
|||
confirmText="Create" |
|||
onConfirm={saveDatasource} |
|||
disabled={error || !name}> |
|||
<Input |
|||
data-cy="datasource-name-input" |
|||
thin |
|||
label="Datasource Name" |
|||
on:input={checkValid} |
|||
bind:value={name} |
|||
{error} /> |
|||
<Label grey extraSmall>Create Integrated Table from External Source</Label> |
|||
<TableIntegrationMenu bind:integration /> |
|||
</ModalContent> |
|||
Loading…
Reference in new issue