diff --git a/packages/bbui/src/Form/Combobox.svelte b/packages/bbui/src/Form/Combobox.svelte index 83927b05db..343af559cb 100644 --- a/packages/bbui/src/Form/Combobox.svelte +++ b/packages/bbui/src/Form/Combobox.svelte @@ -40,5 +40,6 @@ on:change={onChange} on:pick on:type + on:blur /> diff --git a/packages/bbui/src/Form/Core/Combobox.svelte b/packages/bbui/src/Form/Core/Combobox.svelte index 2a4bac4a2c..2835b3cd40 100644 --- a/packages/bbui/src/Form/Core/Combobox.svelte +++ b/packages/bbui/src/Form/Core/Combobox.svelte @@ -52,7 +52,10 @@ {id} type="text" on:focus={() => (focus = true)} - on:blur={() => (focus = false)} + on:blur={() => { + focus = false + dispatch("blur") + }} on:change={onType} value={value || ""} placeholder={placeholder || ""} diff --git a/packages/builder/src/builderStore/dataBinding.js b/packages/builder/src/builderStore/dataBinding.js index cddb061e24..05d17ecf38 100644 --- a/packages/builder/src/builderStore/dataBinding.js +++ b/packages/builder/src/builderStore/dataBinding.js @@ -54,7 +54,56 @@ export const getBindableProperties = (asset, componentId) => { */ export const getRestBindings = () => { const userBindings = getUserBindings() - return [...userBindings] + return [...userBindings, ...getAuthBindings()] +} + +/** + * Gets all rest bindable auth fields + */ +export const getAuthBindings = () => { + let bindings = [] + const safeUser = makePropSafe("user") + const safeOAuth2 = makePropSafe("oauth2") + const safeAccessToken = makePropSafe("accessToken") + + const authBindings = [ + { + runtime: `${safeUser}.${safeOAuth2}.${safeAccessToken}`, + readable: `Current User.OAuthToken`, + key: "accessToken", + }, + ] + + bindings = Object.keys(authBindings).map(key => { + const fieldBinding = authBindings[key] + return { + type: "context", + runtimeBinding: fieldBinding.runtime, + readableBinding: fieldBinding.readable, + fieldSchema: { type: "string", name: fieldBinding.key }, + providerId: "user", + } + }) + return bindings +} + +/** + * Utility - convert a key/value map to an array of custom 'context' bindings + * @param {object} valueMap Key/value pairings + * @param {string} prefix A contextual string prefix/path for a user readable binding + * @return {object[]} An array containing readable/runtime binding objects + */ +export const toBindingsArray = (valueMap, prefix) => { + if (!valueMap) { + return [] + } + return Object.keys(valueMap).map(binding => { + return { + type: "context", + runtimeBinding: binding, + readableBinding: `${prefix}.${binding}`, + } + }) } /** diff --git a/packages/builder/src/components/backend/DatasourceNavigator/TableIntegrationMenu/rest/auth/RestAuthenticationModal.svelte b/packages/builder/src/components/backend/DatasourceNavigator/TableIntegrationMenu/rest/auth/RestAuthenticationModal.svelte index 7f0cc7357b..d80b60e96c 100644 --- a/packages/builder/src/components/backend/DatasourceNavigator/TableIntegrationMenu/rest/auth/RestAuthenticationModal.svelte +++ b/packages/builder/src/components/backend/DatasourceNavigator/TableIntegrationMenu/rest/auth/RestAuthenticationModal.svelte @@ -2,6 +2,8 @@ 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 { getAuthBindings } from "builderStore/dataBinding" export let configs export let currentConfig @@ -203,11 +205,23 @@ /> {/if} {#if form.type === AUTH_TYPES.BEARER} - (blurred.bearer.token = true)} + value={form.bearer.token} + bindings={getAuthBindings()} + on:change={e => { + form.bearer.token = e.detail + console.log(e.detail) + onFieldChange() + }} + on:blur={() => { + blurred.bearer.token = true + onFieldChange() + }} + allowJS={false} + placeholder="Token" + appendBindingsAsOptions={true} + drawerEnabled={false} error={blurred.bearer.token ? errors.bearer.token : null} /> {/if} diff --git a/packages/builder/src/components/common/bindings/DrawerBindableCombobox.svelte b/packages/builder/src/components/common/bindings/DrawerBindableCombobox.svelte index 44f88e841a..2d235c8026 100644 --- a/packages/builder/src/components/common/bindings/DrawerBindableCombobox.svelte +++ b/packages/builder/src/components/common/bindings/DrawerBindableCombobox.svelte @@ -18,6 +18,8 @@ export let options export let allowJS = true export let appendBindingsAsOptions = true + export let drawerEnabled = false + export let error const dispatch = createEventDispatcher() let bindingDrawer @@ -59,10 +61,12 @@ 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} /> - {#if !disabled} + {#if !disabled && drawerEnabled}
{/if}
- - - Add the objects on the left to enrich your text. - - - (tempValue = event.detail)} - {bindings} - {allowJS} - /> - +{#if !drawerEnabled} + + + Add the objects on the left to enrich your text. + + + (tempValue = event.detail)} + {bindings} + {allowJS} + /> + +{/if}