From d97c44725faa3e41e219cb76eb4da8265f2674ef Mon Sep 17 00:00:00 2001
From: Dean <deanhannigan@gmail.com>
Date: Mon, 24 Jul 2023 17:45:41 +0100
Subject: [PATCH] Stopped query binding value from being cleared. Shifted the
 bound value updated to an onChange handler

---
 .../ButtonActionEditor/actions/ExecuteQuery.svelte     |  5 ++++-
 .../design/settings/controls/DataSourceSelect.svelte   | 10 ++++++----
 .../components/integration/QueryBindingBuilder.svelte  |  8 +++++++-
 3 files changed, 17 insertions(+), 6 deletions(-)

diff --git a/packages/builder/src/components/design/settings/controls/ButtonActionEditor/actions/ExecuteQuery.svelte b/packages/builder/src/components/design/settings/controls/ButtonActionEditor/actions/ExecuteQuery.svelte
index ba72fd2ed7..a085d86507 100644
--- a/packages/builder/src/components/design/settings/controls/ButtonActionEditor/actions/ExecuteQuery.svelte
+++ b/packages/builder/src/components/design/settings/controls/ButtonActionEditor/actions/ExecuteQuery.svelte
@@ -73,9 +73,12 @@
       {#if query?.parameters?.length > 0}
         <div class="params">
           <BindingBuilder
-            bind:customParams={parameters.queryParams}
+            customParams={parameters.queryParams}
             queryBindings={query.parameters}
             bind:bindings
+            on:change={v => {
+              parameters.queryParams = { ...v.detail }
+            }}
           />
           <IntegrationQueryEditor
             height={200}
diff --git a/packages/builder/src/components/design/settings/controls/DataSourceSelect.svelte b/packages/builder/src/components/design/settings/controls/DataSourceSelect.svelte
index 6f0eb6f424..6da1bd6187 100644
--- a/packages/builder/src/components/design/settings/controls/DataSourceSelect.svelte
+++ b/packages/builder/src/components/design/settings/controls/DataSourceSelect.svelte
@@ -143,13 +143,12 @@
   }
 
   const openQueryParamsDrawer = () => {
-    tmpQueryParams = value.queryParams
+    tmpQueryParams = { ...value.queryParams }
     drawer.show()
   }
 
   const getQueryValue = queries => {
-    value = queries.find(q => q._id === value._id) || value
-    return value
+    return queries.find(q => q._id === value._id) || value
   }
 
   const saveQueryParams = () => {
@@ -176,7 +175,10 @@
         <Layout noPadding gap="XS">
           {#if getQueryParams(value).length > 0}
             <BindingBuilder
-              bind:customParams={tmpQueryParams}
+              customParams={tmpQueryParams}
+              on:change={v => {
+                tmpQueryParams = { ...v.detail }
+              }}
               queryBindings={getQueryParams(value)}
               bind:bindings
             />
diff --git a/packages/builder/src/components/integration/QueryBindingBuilder.svelte b/packages/builder/src/components/integration/QueryBindingBuilder.svelte
index 3a89c4b968..af890302b0 100644
--- a/packages/builder/src/components/integration/QueryBindingBuilder.svelte
+++ b/packages/builder/src/components/integration/QueryBindingBuilder.svelte
@@ -5,6 +5,9 @@
     runtimeToReadableBinding,
   } from "builderStore/dataBinding"
   import DrawerBindableInput from "components/common/bindings/DrawerBindableInput.svelte"
+  import { createEventDispatcher } from "svelte"
+
+  const dispatch = createEventDispatcher()
 
   export let bindable = true
   export let queryBindings = []
@@ -20,7 +23,10 @@
   // The readable binding in the UI gets converted to a UUID value that the client understands
   // for parsing, then converted back so we can display it the readable form in the UI
   function onBindingChange(param, valueToParse) {
-    customParams[param] = readableToRuntimeBinding(bindings, valueToParse)
+    dispatch("change", {
+      ...customParams,
+      [param]: readableToRuntimeBinding(bindings, valueToParse),
+    })
   }
 </script>