response parsing

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

@@ -1,5 +1,5 @@
 <script>
-  import { Input } from "@budibase/bbui"
+  import { Button, Input } from "@budibase/bbui"
 
   export let object = {}
 
@@ -28,7 +28,7 @@
     <i class="ri-close-circle-fill" on:click={() => deleteEntry(idx)} />
   {/each}
 </div>
-<i class="ri-add-circle-fill" on:click={addEntry} />
+<Button secondary thin outline on:click={addEntry}>Add</Button>
 
 <style>
   .container {
@@ -39,8 +39,7 @@
     margin-bottom: var(--spacing-m);
   }
 
-  .ri-close-circle-fill,
+  .ri-close-circle-fill {
-  .ri-add-circle-fill {
     cursor: pointer;
   }
 </style>

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

@@ -6,6 +6,7 @@
     Input,
     Heading,
     Select,
+    Spacer
   } from "@budibase/bbui"
   import Editor from "./QueryEditor.svelte"
   import KeyValueBuilder from "./KeyValueBuilder.svelte"
@@ -30,6 +31,7 @@
       {#if schema.fields[field]?.type === 'object'}
         <div>
           <Label small>{field}</Label>
+          <Spacer small />
           <KeyValueBuilder bind:object={fields[field]} />
         </div>
       {:else if schema.fields[field]?.type === 'json'}
@@ -57,6 +59,8 @@
   </div>
 </form>
 {#if schema.customisable}
+  <Label small>Query</Label>
+  <Spacer small />
   <Editor
     label="Query"
     mode="json"

packages/builder/src/pages/[application]/data/_layout.svelte

@@ -1,6 +1,6 @@
 <script>
   import { params } from "@sveltech/routify"
-  import { Switcher, Modal } from "@budibase/bbui"
+  import { Button, Switcher, Modal } from "@budibase/bbui"
   import TableNavigator from "components/backend/TableNavigator/TableNavigator.svelte"
   import DatasourceNavigator from "components/backend/DatasourceNavigator/DatasourceNavigator.svelte"
   import CreateDatasourceModal from "components/backend/DatasourceNavigator/modals/CreateDatasourceModal.svelte"
@@ -27,10 +27,9 @@
   <div class="nav">
     <Switcher headings={tabs} bind:value={tab}>
       <div class="title">
-        <i
+        <Button blue data-cy={`new-${tab}`} on:click={modal.show}>
-          data-cy={`new-${tab}`}
+          <i class="ri-add-fill" />
-          class="ri-add-circle-fill"
+        </Button>
-          on:click={modal.show} />
       </div>
       {#if tab === 'table'}
         <TableNavigator />
@@ -82,7 +81,7 @@
     position: relative;
   }
 
-  i {
+  .title {
     font-size: 20px;
     position: absolute;
     top: var(--spacing-l);

packages/server/src/integrations/rest.js

@@ -98,53 +98,72 @@ class RestIntegration {
     this.config = config
   }
 
+  async parseResponse(response) {
+    switch (this.headers.Accept) {
+      case "application/json":
+        return await response.json()
+      case "text/html":
+        return await response.text()
+      default:
+        return await response.json()
+    }
+  }
+
   async create({ path, queryString, headers = {}, json }) {
-    const response = await fetch(this.config.url + path + queryString, {
+    this.headers = {
-      method: "POST",
-      headers: {
       ...this.config.defaultHeaders,
       ...headers,
-      },
+    }
+
+    const response = await fetch(this.config.url + path + queryString, {
+      method: "POST",
+      headers: this.headers,
       body: JSON.stringify(json),
     })
 
-    return await response.json()
+    return await this.parseResponse(response)
   }
 
   async read({ path, queryString, headers = {} }) {
-    const response = await fetch(this.config.url + path + queryString, {
+    this.headers = {
-      headers: {
       ...this.config.defaultHeaders,
       ...headers,
-      },
+    }
+
+    const response = await fetch(this.config.url + path + queryString, {
+      headers: this.headers,
     })
 
-    return await response.json()
+    return await this.parseResponse(response)
   }
 
   async update({ path, queryString, headers = {}, json }) {
-    const response = await fetch(this.config.url + path + queryString, {
+    this.headers = {
-      method: "POST",
-      headers: {
       ...this.config.defaultHeaders,
       ...headers,
-      },
+    }
+
+    const response = await fetch(this.config.url + path + queryString, {
+      method: "POST",
+      headers: this.headers,
       body: JSON.stringify(json),
     })
 
-    return await response.json()
+    return await this.parseResponse(response)
   }
 
   async delete({ path, queryString, headers = {} }) {
-    const response = await fetch(this.config.url + path + queryString, {
+    this.headers = {
-      method: "DELETE",
-      headers: {
       ...this.config.defaultHeaders,
       ...headers,
-      },
+    }
+
+    const response = await fetch(this.config.url + path + queryString, {
+      method: "DELETE",
+      headers: this.headers,
     })
 
-    return await response.json()
+    return await this.parseResponse(response)
   }
 }