From e9b84659f420b20e367ebba20b6c6d46eea913b4 Mon Sep 17 00:00:00 2001
From: Mel O'Hagan <mel@budibase.com>
Date: Wed, 2 Nov 2022 11:22:48 +0000
Subject: [PATCH 1/2] Refresh BindingBuilder if query.parameters changes

---
 .../components/integration/QueryViewer.svelte   | 10 +++++++++-
 .../QueryViewerBindingBuilder.svelte            | 17 +++++++++++------
 2 files changed, 20 insertions(+), 7 deletions(-)

diff --git a/packages/builder/src/components/integration/QueryViewer.svelte b/packages/builder/src/components/integration/QueryViewer.svelte
index 87b3dee45d..00530b6819 100644
--- a/packages/builder/src/components/integration/QueryViewer.svelte
+++ b/packages/builder/src/components/integration/QueryViewer.svelte
@@ -132,7 +132,15 @@
           config={integrationInfo.extra}
         />
       {/if}
-      <BindingBuilder bind:queryBindings={query.parameters} bindable={false} />
+      {#key query.parameters}
+        <BindingBuilder
+          queryBindings={query.parameters}
+          bindable={false}
+          on:change={e => {
+            query.parameters = e.detail
+          }}
+        />
+      {/key}
     {/if}
   </div>
   {#if shouldShowQueryConfig}
diff --git a/packages/builder/src/components/integration/QueryViewerBindingBuilder.svelte b/packages/builder/src/components/integration/QueryViewerBindingBuilder.svelte
index 64736e5f78..57d3ec2359 100644
--- a/packages/builder/src/components/integration/QueryViewerBindingBuilder.svelte
+++ b/packages/builder/src/components/integration/QueryViewerBindingBuilder.svelte
@@ -2,6 +2,7 @@
   import { Body, Button, Heading, Layout } from "@budibase/bbui"
   import KeyValueBuilder from "components/integration/KeyValueBuilder.svelte"
   import { getUserBindings } from "builderStore/dataBinding"
+  import { createEventDispatcher } from "svelte"
   export let bindable = true
   export let queryBindings = []
 
@@ -11,6 +12,7 @@
     acc[binding.name] = binding.default
     return acc
   }, {})
+  let dispatch = createEventDispatcher()
 
   function newQueryBinding() {
     queryBindings = [...queryBindings, {}]
@@ -45,12 +47,15 @@
       bindings={[...userBindings]}
       bindingDrawerLeft="260px"
       on:change={e => {
-        queryBindings = e.detail.map(binding => {
-          return {
-            name: binding.name,
-            default: binding.value,
-          }
-        })
+        dispatch(
+          "change",
+          e.detail.map(binding => {
+            return {
+              name: binding.name,
+              default: binding.value,
+            }
+          })
+        )
       }}
     />
   </div>

From 3f28cfbed495ccf8fedb439d1ed8abfde8a8cece Mon Sep 17 00:00:00 2001
From: Mel O'Hagan <mel@budibase.com>
Date: Wed, 2 Nov 2022 12:10:38 +0000
Subject: [PATCH 2/2] Refactor

---
 .../src/components/integration/QueryViewer.svelte  |  7 ++++++-
 .../integration/QueryViewerBindingBuilder.svelte   | 14 +-------------
 2 files changed, 7 insertions(+), 14 deletions(-)

diff --git a/packages/builder/src/components/integration/QueryViewer.svelte b/packages/builder/src/components/integration/QueryViewer.svelte
index 00530b6819..e70cf8330e 100644
--- a/packages/builder/src/components/integration/QueryViewer.svelte
+++ b/packages/builder/src/components/integration/QueryViewer.svelte
@@ -137,7 +137,12 @@
           queryBindings={query.parameters}
           bindable={false}
           on:change={e => {
-            query.parameters = e.detail
+            query.parameters = e.detail.map(binding => {
+              return {
+                name: binding.name,
+                default: binding.value,
+              }
+            })
           }}
         />
       {/key}
diff --git a/packages/builder/src/components/integration/QueryViewerBindingBuilder.svelte b/packages/builder/src/components/integration/QueryViewerBindingBuilder.svelte
index 57d3ec2359..185d1876f9 100644
--- a/packages/builder/src/components/integration/QueryViewerBindingBuilder.svelte
+++ b/packages/builder/src/components/integration/QueryViewerBindingBuilder.svelte
@@ -2,7 +2,6 @@
   import { Body, Button, Heading, Layout } from "@budibase/bbui"
   import KeyValueBuilder from "components/integration/KeyValueBuilder.svelte"
   import { getUserBindings } from "builderStore/dataBinding"
-  import { createEventDispatcher } from "svelte"
   export let bindable = true
   export let queryBindings = []
 
@@ -12,7 +11,6 @@
     acc[binding.name] = binding.default
     return acc
   }, {})
-  let dispatch = createEventDispatcher()
 
   function newQueryBinding() {
     queryBindings = [...queryBindings, {}]
@@ -46,17 +44,7 @@
       valuePlaceholder="Default"
       bindings={[...userBindings]}
       bindingDrawerLeft="260px"
-      on:change={e => {
-        dispatch(
-          "change",
-          e.detail.map(binding => {
-            return {
-              name: binding.name,
-              default: binding.value,
-            }
-          })
-        )
-      }}
+      on:change
     />
   </div>
 </Layout>