Some UI tweaks.
This commit is contained in:
parent
9aba344a45
commit
7c5e2289ca
|
@ -1,5 +1,5 @@
|
||||||
<script>
|
<script>
|
||||||
import { Divider, Heading, ActionButton, Badge } from "@budibase/bbui"
|
import { Divider, Heading, ActionButton, Badge, Body } from "@budibase/bbui"
|
||||||
import KeyValueBuilder from "components/integration/KeyValueBuilder.svelte"
|
import KeyValueBuilder from "components/integration/KeyValueBuilder.svelte"
|
||||||
|
|
||||||
export let datasource
|
export let datasource
|
||||||
|
@ -14,9 +14,13 @@
|
||||||
<Badge quiet grey>Optional</Badge>
|
<Badge quiet grey>Optional</Badge>
|
||||||
</div>
|
</div>
|
||||||
<ActionButton size="S" icon="Add" on:click={() => addHeader.addEntry()}
|
<ActionButton size="S" icon="Add" on:click={() => addHeader.addEntry()}
|
||||||
>Add Header</ActionButton
|
>Add header</ActionButton
|
||||||
>
|
>
|
||||||
</div>
|
</div>
|
||||||
|
<Body size="S">
|
||||||
|
Headers enable you to provide additional information about the request, such
|
||||||
|
as format.
|
||||||
|
</Body>
|
||||||
<KeyValueBuilder
|
<KeyValueBuilder
|
||||||
bind:this={addHeader}
|
bind:this={addHeader}
|
||||||
bind:object={datasource.config.defaultHeaders}
|
bind:object={datasource.config.defaultHeaders}
|
||||||
|
|
|
@ -34,8 +34,9 @@
|
||||||
$: hasChanged(baseDatasource, datasource)
|
$: hasChanged(baseDatasource, datasource)
|
||||||
|
|
||||||
function hasChanged(base, ds) {
|
function hasChanged(base, ds) {
|
||||||
if (base) {
|
if (base && ds) {
|
||||||
changed = !isEqual(base, ds)
|
changed = !isEqual(base, ds)
|
||||||
|
console.log(ds)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -81,9 +82,6 @@
|
||||||
<Button disabled={!changed} cta on:click={saveDatasource}>Save</Button
|
<Button disabled={!changed} cta on:click={saveDatasource}>Save</Button
|
||||||
>
|
>
|
||||||
</div>
|
</div>
|
||||||
<Body size="S">
|
|
||||||
Connect your data source to Budibase using the config below.
|
|
||||||
</Body>
|
|
||||||
<IntegrationConfigForm
|
<IntegrationConfigForm
|
||||||
on:change={hasChanged}
|
on:change={hasChanged}
|
||||||
schema={integration.datasource}
|
schema={integration.datasource}
|
||||||
|
@ -97,9 +95,14 @@
|
||||||
<div class="query-header">
|
<div class="query-header">
|
||||||
<Heading size="S">Queries</Heading>
|
<Heading size="S">Queries</Heading>
|
||||||
<ActionButton size="S" icon="Add" on:click={() => $goto("./new")}
|
<ActionButton size="S" icon="Add" on:click={() => $goto("./new")}
|
||||||
>Add Query
|
>Add query
|
||||||
</ActionButton>
|
</ActionButton>
|
||||||
</div>
|
</div>
|
||||||
|
<Body size="S">
|
||||||
|
To build an app using a datasource, you must first query the data. A
|
||||||
|
query is a request for data or information from a datasource, for
|
||||||
|
example a database table.
|
||||||
|
</Body>
|
||||||
<div class="query-list">
|
<div class="query-list">
|
||||||
{#each $queries.list.filter(query => query.datasourceId === datasource._id) as query}
|
{#each $queries.list.filter(query => query.datasourceId === datasource._id) as query}
|
||||||
<div class="query-list-item" on:click={() => onClickQuery(query)}>
|
<div class="query-list-item" on:click={() => onClickQuery(query)}>
|
||||||
|
|
|
@ -18,7 +18,7 @@ module RestModule {
|
||||||
const SCHEMA: Integration = {
|
const SCHEMA: Integration = {
|
||||||
docs: "https://github.com/node-fetch/node-fetch",
|
docs: "https://github.com/node-fetch/node-fetch",
|
||||||
description:
|
description:
|
||||||
"Representational state transfer (REST) is a de-facto standard for a software architecture for interactive applications that typically use multiple Web services. ",
|
"With the REST API datasource, you can connect, query and pull data from multiple REST APIs. You can then use the retrieved data to build apps.",
|
||||||
friendlyName: "REST API",
|
friendlyName: "REST API",
|
||||||
datasource: {
|
datasource: {
|
||||||
url: {
|
url: {
|
||||||
|
|
Loading…
Reference in New Issue