MirrorSave
/
budibase
mirror of https://github.com/Budibase/budibase.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Added fixes for query body binding. Query parameter fixes and pretty bindings added

This commit is contained in:
Dean 2022-07-03 17:33:25 +01:00
parent 8ea5e92553
commit e14289abee
6 changed files with 150 additions and 57 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
packages/builder/src/builderStore/dataBinding.js
View File

@ -97,13 +97,17 @@ export const toBindingsArray = (valueMap, prefix) => {
if (!valueMap) {
return []
}
return Object.keys(valueMap).map(binding => {
return {
return Object.keys(valueMap).reduce((acc, binding) => {
if (!binding || !valueMap[binding]) {
return acc
}
acc.push({
type: "context",
runtimeBinding: binding,
readableBinding: `${prefix}.${binding}`,
}
})
})
return acc
}, [])
}
/**

1
packages/builder/src/components/backend/DatasourceNavigator/TableIntegrationMenu/rest/RestExtraConfigForm.svelte
View File

@ -53,6 +53,7 @@
bind:object={parsedHeaders}
on:change={evt => onDefaultHeaderUpdate(evt.detail)}
noAddButton
bindings={getRestBindings()}
/>
<div>
<ActionButton icon="Add" on:click={() => addHeader.addEntry()}>

4
packages/builder/src/components/backend/DatasourceNavigator/TableIntegrationMenu/rest/auth/RestAuthenticationModal.svelte
View File

@ -2,7 +2,7 @@
import { onMount } from "svelte"
import { ModalContent, Layout, Select, Body, Input } from "@budibase/bbui"
import { AUTH_TYPE_LABELS, AUTH_TYPES } from "./authTypes"
import DrawerBindableCombobox from "components/common/bindings/DrawerBindableCombobox.svelte"
import BindableCombobox from "components/common/bindings/BindableCombobox.svelte"
import { getAuthBindings } from "builderStore/dataBinding"
export let configs
@ -205,7 +205,7 @@
/>
{/if}
{#if form.type === AUTH_TYPES.BEARER}
<DrawerBindableCombobox
<BindableCombobox
label="Token"
value={form.bearer.token}
bindings={getAuthBindings()}

68
packages/builder/src/components/common/bindings/BindableCombobox.svelte Normal file
View File

@ -0,0 +1,68 @@
<script>
import { Combobox } from "@budibase/bbui"
import {
readableToRuntimeBinding,
runtimeToReadableBinding,
} from "builderStore/dataBinding"
import { createEventDispatcher } from "svelte"
import { isJSBinding } from "@budibase/string-templates"
export let value = ""
export let bindings = []
export let placeholder
export let label
export let disabled = false
export let options
export let appendBindingsAsOptions = true
export let error
const dispatch = createEventDispatcher()
$: readableValue = runtimeToReadableBinding(bindings, value)
$: isJS = isJSBinding(value)
$: allOptions = buildOptions(options, bindings, appendBindingsAsOptions)
const onChange = (value, optionPicked) => {
// Add HBS braces if picking binding
if (optionPicked && !options?.includes(value)) {
value = `{{ ${value} }}`
}
dispatch("change", readableToRuntimeBinding(bindings, value))
}
const buildOptions = (options, bindings, appendBindingsAsOptions) => {
if (!appendBindingsAsOptions) {
return options
}
return []
.concat(options || [])
.concat(bindings?.map(binding => binding.readableBinding) || [])
}
</script>
<div class="control" class:disabled>
<Combobox
{label}
{disabled}
readonly={isJS}
value={isJS ? "(JavaScript function)" : readableValue}
on:type={e => onChange(e.detail, false)}
on:pick={e => onChange(e.detail, true)}
on:blur={() => dispatch("blur")}
{placeholder}
options={allOptions}
{error}
/>
</div>
<style>
.control {
flex: 1;
position: relative;
}
.control:not(.disabled) :global(.spectrum-Textfield-input) {
padding-right: 40px;
}
</style>

36
packages/builder/src/components/common/bindings/DrawerBindableCombobox.svelte
View File

@ -18,7 +18,6 @@
export let options
export let allowJS = true
export let appendBindingsAsOptions = true
export let drawerEnabled = false
export let error
const dispatch = createEventDispatcher()
@ -66,7 +65,7 @@
options={allOptions}
{error}
/>
{#if !disabled && drawerEnabled}
{#if !disabled}
<div
class="icon"
on:click={bindingDrawer.show}
@ -76,23 +75,22 @@
</div>
{/if}
</div>
{#if !drawerEnabled}
<Drawer bind:this={bindingDrawer} {title}>
<svelte:fragment slot="description">
Add the objects on the left to enrich your text.
</svelte:fragment>
<Button cta slot="buttons" on:click={handleClose}>Save</Button>
<svelte:component
this={panel}
slot="body"
value={readableValue}
close={handleClose}
on:change={event => (tempValue = event.detail)}
{bindings}
{allowJS}
/>
</Drawer>
{/if}
<Drawer bind:this={bindingDrawer} {title}>
<svelte:fragment slot="description">
Add the objects on the left to enrich your text.
</svelte:fragment>
<Button cta slot="buttons" on:click={handleClose}>Save</Button>
<svelte:component
this={panel}
slot="body"
value={readableValue}
close={handleClose}
on:change={event => (tempValue = event.detail)}
{bindings}
{allowJS}
/>
</Drawer>
<style>
.control {

86
packages/builder/src/pages/builder/app/[application]/data/datasource/[selectedDatasource]/rest/[query]/index.svelte
View File

@ -59,6 +59,7 @@
let restBindings = getRestBindings()
$: staticVariables = datasource?.config?.staticVariables || {}
$: customRequestBindings = toBindingsArray(requestBindings, "Binding")
$: dynamicRequestBindings = toBindingsArray(dynamicVariables, "Dynamic")
$: dataSourceStaticBindings = toBindingsArray(
@ -73,10 +74,6 @@
...dataSourceStaticBindings,
]
$: mergedAndCompleteBindings = mergedBindings.filter(binding => {
return binding.runtimeBinding && binding.readableBinding
})
$: datasourceType = datasource?.source
$: integrationInfo = $integrations[datasourceType]
$: queryConfig = integrationInfo?.query
@ -92,10 +89,7 @@
Object.keys(schema || {}).length !== 0 ||
Object.keys(query?.schema || {}).length !== 0
$: runtimeUrlQueries = readableToRuntimeMap(
mergedAndCompleteBindings,
breakQs
)
$: runtimeUrlQueries = readableToRuntimeMap(mergedBindings, breakQs)
function getSelectedQuery() {
const cloneQuery = cloneDeep(
@ -110,18 +104,6 @@
queryVerb: "read",
}
)
if (cloneQuery?.fields?.requestBody) {
cloneQuery.fields.requestBody =
typeof cloneQuery.fields.requestBody === "object"
? runtimeToReadableMap(
mergedAndCompleteBindings,
cloneQuery.fields.requestBody
)
: runtimeToReadableBinding(
mergedAndCompleteBindings,
cloneQuery.fields.requestBody
)
}
return cloneQuery
}
@ -137,7 +119,7 @@
return base
}
const qs = restUtils.buildQueryString(
runtimeToReadableMap(mergedAndCompleteBindings, qsObj)
runtimeToReadableMap(mergedBindings, qsObj)
)
let newUrl = base
if (base.includes("?")) {
@ -150,16 +132,11 @@
const newQuery = cloneDeep(query)
const queryString = restUtils.buildQueryString(runtimeUrlQueries)
newQuery.parameters = restUtils.keyValueToQueryParameters(requestBindings)
newQuery.fields.requestBody =
typeof newQuery.fields.requestBody === "object"
? readableToRuntimeMap(
mergedAndCompleteBindings,
newQuery.fields.requestBody
)
: readableToRuntimeBinding(
mergedAndCompleteBindings,
newQuery.fields.requestBody
)
? readableToRuntimeMap(mergedBindings, newQuery.fields.requestBody)
: readableToRuntimeBinding(mergedBindings, newQuery.fields.requestBody)
newQuery.fields.path = url.split("?")[0]
newQuery.fields.queryString = queryString
@ -181,6 +158,13 @@
datasource.config.dynamicVariables = rebuildVariables(saveId)
datasource = await datasources.save(datasource)
}
prettifyQueryRequestBody(
query,
requestBindings,
dynamicVariables,
staticVariables,
restBindings
)
} catch (err) {
notifications.error(`Error saving query`)
}
@ -297,6 +281,36 @@
}
}
const prettifyQueryRequestBody = (
query,
requestBindings,
dynamicVariables,
staticVariables,
restBindings
) => {
let customRequestBindings = toBindingsArray(requestBindings, "Binding")
let dynamicRequestBindings = toBindingsArray(dynamicVariables, "Dynamic")
let dataSourceStaticBindings = toBindingsArray(
staticVariables,
"Datasource.Static"
)
const prettyBindings = [
...restBindings,
...customRequestBindings,
...dynamicRequestBindings,
...dataSourceStaticBindings,
]
//Parse the body here as now all bindings have been updated.
if (query?.fields?.requestBody) {
query.fields.requestBody =
typeof query.fields.requestBody === "object"
? runtimeToReadableMap(prettyBindings, query.fields.requestBody)
: runtimeToReadableBinding(prettyBindings, query.fields.requestBody)
}
}
onMount(async () => {
query = getSelectedQuery()
@ -311,7 +325,7 @@
const datasourceUrl = datasource?.config.url
const qs = query?.fields.queryString
breakQs = restUtils.breakQueryString(qs)
breakQs = runtimeToReadableMap(restBindings, breakQs)
breakQs = runtimeToReadableMap(mergedBindings, breakQs)
const path = query.fields.path
if (
@ -354,6 +368,14 @@
query.fields.pagination = {}
}
dynamicVariables = getDynamicVariables(datasource, query._id)
prettifyQueryRequestBody(
query,
requestBindings,
dynamicVariables,
staticVariables,
restBindings
)
})
</script>
@ -425,7 +447,7 @@
bind:object={breakQs}
name="param"
headings
bindings={mergedAndCompleteBindings}
bindings={mergedBindings}
/>
</Tab>
<Tab title="Headers">
@ -435,7 +457,7 @@
toggle
name="header"
headings
bindings={mergedAndCompleteBindings}
bindings={mergedBindings}
/>
</Tab>
<Tab title="Body">