Fix query params directly mutating the stored app definition

packages/builder/src/components/design/PropertiesPanel/PropertyControls/DataSourceSelect.svelte

@@ -31,6 +31,7 @@
   const arrayTypes = ["attachment", "array"]
   let anchorRight, dropdownRight
   let drawer
+  let tmpQueryParams
 
   $: text = value?.label ?? "Choose an option"
   $: tables = $tablesStore.list.map(m => ({
@@ -105,12 +106,12 @@
       }
     })
 
-  function handleSelected(selected) {
+  const handleSelected = selected => {
     dispatch("change", selected)
     dropdownRight.hide()
   }
 
-  function fetchQueryDefinition(query) {
+  const fetchQueryDefinition = query => {
     const source = $datasources.list.find(
       ds => ds._id === query.datasourceId
     ).source
@@ -124,6 +125,19 @@
   const getQueryDatasource = query => {
     return $datasources.list.find(ds => ds._id === query?.datasourceId)
   }
+
+  const openQueryParamsDrawer = () => {
+    tmpQueryParams = value.queryParams
+    drawer.show()
+  }
+
+  const saveQueryParams = () => {
+    handleSelected({
+      ...value,
+      queryParams: tmpQueryParams,
+    })
+    drawer.hide()
+  }
 </script>
 
 <div class="container" bind:this={anchorRight}>
@@ -134,24 +148,14 @@
     on:click={dropdownRight.show}
   />
   {#if value?.type === "query"}
-    <i class="ri-settings-5-line" on:click={drawer.show} />
+    <i class="ri-settings-5-line" on:click={openQueryParamsDrawer} />
     <Drawer title={"Query Parameters"} bind:this={drawer}>
-      <Button
-        slot="buttons"
-        cta
-        on:click={() => {
-          notifications.success("Query parameters saved.")
-          handleSelected(value)
-          drawer.hide()
-        }}
-      >
-        Save
-      </Button>
+      <Button slot="buttons" cta on:click={saveQueryParams}>Save</Button>
       <DrawerContent slot="body">
         <Layout noPadding>
           {#if getQueryParams(value).length > 0}
             <ParameterBuilder
-              bind:customParams={value.queryParams}
+              bind:customParams={tmpQueryParams}
               parameters={getQueryParams(value)}
               {bindings}
             />