Getting REST UI to work with full schema objects.

packages/bbui/src/Form/Core/Select.svelte

@@ -12,6 +12,7 @@
   export let getOptionIcon = () => null
   export let getOptionColour = () => null
   export let getOptionSubtitle = () => null
+  export let compare = (option, value) => option === value
   export let useOptionIconImage = false
   export let isOptionEnabled
   export let readonly = false
@@ -39,8 +40,8 @@
     if (!options?.length) {
       return ""
     }
-    const index = options.findIndex(
-      (option, idx) => getOptionValue(option, idx) === value
+    const index = options.findIndex((option, idx) =>
+      compare(getOptionValue(option, idx), value)
     )
     return index !== -1 ? getAttribute(options[index], index) : null
   }
@@ -94,7 +95,7 @@
   {customPopoverMaxHeight}
   isPlaceholder={value == null || value === ""}
   placeholderOption={placeholder === false ? null : placeholder}
-  isOptionSelected={option => option === value}
+  isOptionSelected={option => compare(option, value)}
   onSelectOption={selectOption}
   {loading}
 />

packages/bbui/src/Form/Select.svelte

@@ -28,6 +28,7 @@
   export let footer = null
   export let tag = null
   export let helpText = null
+  export let compare
   const dispatch = createEventDispatcher()
   const onChange = e => {
     value = e.detail
@@ -65,6 +66,7 @@
     {autocomplete}
     {customPopoverHeight}
     {tag}
+    {compare}
     on:change={onChange}
     on:click
   />

packages/builder/src/components/integration/KeyValueBuilder.svelte

@@ -35,6 +35,7 @@
   export let bindingDrawerLeft
   export let allowHelpers = true
   export let customButtonText = null
+  export let compare = (option, value) => option === value
 
   let fields = Object.entries(object || {}).map(([name, value]) => ({
     name,
@@ -112,7 +113,12 @@
         on:blur={changed}
       />
       {#if options}
-        <Select bind:value={field.value} on:change={changed} {options} />
+        <Select
+          bind:value={field.value}
+          {compare}
+          on:change={changed}
+          {options}
+        />
       {:else if bindings && bindings.length}
         <DrawerBindableInput
           {bindings}

packages/builder/src/components/integration/RestQueryViewer.svelte

@@ -33,7 +33,7 @@
     PaginationTypes,
     RawRestBodyTypes,
     RestBodyTypes as bodyTypes,
-    SchemaTypeOptions,
+    SchemaTypeOptionsExpanded,
   } from "constants/backend"
   import JSONPreview from "components/integration/JSONPreview.svelte"
   import AccessLevelSelect from "components/integration/AccessLevelSelect.svelte"
@@ -161,7 +161,7 @@
     newQuery.fields.queryString = queryString
     newQuery.fields.authConfigId = authConfigId
     newQuery.fields.disabledHeaders = restUtils.flipHeaderState(enabledHeaders)
-    newQuery.schema = restUtils.fieldsToSchema(schema)
+    newQuery.schema = schema
 
     return newQuery
   }
@@ -231,7 +231,14 @@
         notifications.info("Request did not return any data")
       } else {
         response.info = response.info || { code: 200 }
-        console.log(response)
+        // if existing schema, copy over what it is
+        if (schema) {
+          for (let [name, field] of Object.entries(schema)) {
+            if (response.schema[name]) {
+              response.schema[name] = field
+            }
+          }
+        }
         schema = response.schema
         notifications.success("Request sent successfully")
       }
@@ -387,6 +394,7 @@
 
   onMount(async () => {
     query = getSelectedQuery()
+    schema = query.schema
 
     try {
       // Clear any unsaved changes to the datasource
@@ -417,7 +425,6 @@
       query.fields.path = `${datasource.config.url}/${path ? path : ""}`
     }
     url = buildUrl(query.fields.path, breakQs)
-    schema = restUtils.schemaToFields(query.schema)
     requestBindings = restUtils.queryParametersToKeyValue(query.parameters)
     authConfigId = getAuthConfigId()
     if (!query.fields.disabledHeaders) {
@@ -683,10 +690,11 @@
                   bind:object={schema}
                   name="schema"
                   headings
-                  options={SchemaTypeOptions}
+                  options={SchemaTypeOptionsExpanded}
                   menuItems={schemaMenuItems}
                   showMenu={!schemaReadOnly}
                   readOnly={schemaReadOnly}
+                  compare={(option, value) => option.type === value.type}
                 />
               </Tab>
             {/if}

packages/builder/src/constants/backend/index.js

@@ -271,6 +271,11 @@ export const SchemaTypeOptions = [
   { label: "Datetime", value: "datetime" },
 ]
 
+export const SchemaTypeOptionsExpanded = SchemaTypeOptions.map(el => ({
+  ...el,
+  value: { type: el.value },
+}))
+
 export const RawRestBodyTypes = {
   NONE: "none",
   FORM: "form",

packages/builder/src/helpers/data/utils.js

@@ -1,26 +1,6 @@
 import { IntegrationTypes } from "constants/backend"
 import { findHBSBlocks } from "@budibase/string-templates"
 
-export function schemaToFields(schema) {
-  const response = {}
-  if (schema && typeof schema === "object") {
-    for (let [field, value] of Object.entries(schema)) {
-      response[field] = value?.type || "string"
-    }
-  }
-  return response
-}
-
-export function fieldsToSchema(fields) {
-  const response = {}
-  if (fields && typeof fields === "object") {
-    for (let [name, type] of Object.entries(fields)) {
-      response[name] = { name, type }
-    }
-  }
-  return response
-}
-
 export function breakQueryString(qs) {
   if (!qs) {
     return {}
@@ -184,10 +164,8 @@ export const parseToCsv = (headers, rows) => {
 export default {
   breakQueryString,
   buildQueryString,
-  fieldsToSchema,
   flipHeaderState,
   keyValueToQueryParameters,
   parseToCsv,
   queryParametersToKeyValue,
-  schemaToFields,
 }