Some UI tweaks.

This commit is contained in:
mike12345567 2021-11-30 18:11:29 +00:00
parent 9aba344a45
commit 7c5e2289ca
3 changed files with 15 additions and 8 deletions

View File

@ -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}

View File

@ -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)}>

View File

@ -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: {