fix dynamic params

packages/builder/src/builderStore/store/backend.js

@@ -139,10 +139,10 @@ export const getBackendUiStore = () => {
         })
         return json
       },
-      select: queryId =>
+      select: query =>
         store.update(state => {
-          state.selectedDatasourceId = null
+          state.selectedDatasourceId = query.datasourceId
-          state.selectedQueryId = queryId
+          state.selectedQueryId = query._id
           return state
         }),
       delete: async query => {

packages/builder/src/components/backend/DatasourceNavigator/DatasourceNavigator.svelte

@@ -18,13 +18,12 @@
     $goto(`./datasource/${datasource._id}`)
   }
 
-  function onClickQuery(datasourceId, queryId) {
+  function onClickQuery(query) {
-    if ($backendUiStore.selectedQueryId === queryId) {
+    if ($backendUiStore.selectedQueryId === query._id) {
       return
     }
-    backendUiStore.actions.datasources.select(datasourceId)
+    backendUiStore.actions.queries.select(query)
-    backendUiStore.actions.queries.select(queryId)
+    $goto(`./datasource/${query.datasourceId}/${query._id}`)
-    $goto(`./datasource/${datasourceId}/${queryId}`)
   }
 
   onMount(() => {
@@ -55,7 +54,7 @@
           icon="ri-eye-line"
           text={query.name}
           selected={$backendUiStore.selectedQueryId === query._id}
-          on:click={() => onClickQuery(datasource._id, query._id)}>
+          on:click={() => onClickQuery(query)}>
           <EditQueryPopover {query} />
         </NavItem>
       {/each}

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

@@ -29,22 +29,24 @@
 <Spacer medium />
 
 {#if schema}
-  {#if schema.type === QueryTypes.SQL}
+  {#key query._id}
-    <Editor
+    {#if schema.type === QueryTypes.SQL}
-      label="Query"
+      <Editor
-      mode="sql"
+        label="Query"
-      on:change={updateQuery}
+        mode="sql"
-      readOnly={!editable}
+        on:change={updateQuery}
-      value={query.fields.sql} />
+        readOnly={!editable}
-  {:else if schema.type === QueryTypes.JSON}
+        value={query.fields.sql} />
-    <Spacer large />
+    {:else if schema.type === QueryTypes.JSON}
-    <Editor
+      <Spacer large />
-      label="Query"
+      <Editor
-      mode="json"
+        label="Query"
-      on:change={updateQuery}
+        mode="json"
-      readOnly={!editable}
+        on:change={updateQuery}
-      value={query.fields.json} />
+        readOnly={!editable}
-  {:else if schema.type === QueryTypes.FIELDS}
+        value={query.fields.json} />
-    <FieldsBuilder bind:fields={query.fields} {schema} {editable} />
+    {:else if schema.type === QueryTypes.FIELDS}
-  {/if}
+      <FieldsBuilder bind:fields={query.fields} {schema} {editable} />
+    {/if}
+  {/key}
 {/if}

packages/builder/src/components/userInterface/EventsEditor/actions/ExecuteQuery.svelte

@@ -51,7 +51,7 @@
 
   <Spacer medium />
 
-  {#if query?.parameters.length > 0}
+  {#if query?.parameters?.length > 0}
     <ParameterBuilder
       bind:customParams={parameters.queryParams}
       parameters={query.parameters}

packages/builder/src/components/userInterface/TableViewFieldSelect.svelte

@@ -9,17 +9,19 @@
   export let multiselect = false
 
   const tables = $backendUiStore.tables
+  const queries = $backendUiStore.queries
 
   let options = []
 
-  $: table = componentInstance.datasource
+  $: table = componentInstance.datasource?.type === "table"
     ? tables.find(m => m._id === componentInstance.datasource.tableId)
-    : null
+    : queries.find(query => query._id === componentInstance.datasource._id)
 
   $: type = componentInstance.datasource.type
+
   $: if (table) {
     options =
-      type === "table" || type === "link"
+      type === "table" || type === "link" || type === "query"
         ? Object.keys(table.schema)
         : Object.keys(table.views[componentInstance.datasource.name].schema)
   }

packages/builder/src/components/userInterface/TableViewSelect.svelte

@@ -122,7 +122,7 @@
         {#if value.parameters.length > 0}
           <ParameterBuilder
             bind:customParams={value.queryParams}
-            parameters={value.parameters}
+            parameters={queries.find(query => query._id === value._id).parameters}
             bindings={queryBindableProperties} />
         {/if}
       </div>

packages/client/src/api/datasources.js

@@ -25,7 +25,7 @@ export const fetchDatasource = async (datasource, dataContext) => {
   } else if (type === "query") {
     const bindings = get(bindingStore)
 
-    // TODO: refactor. Set these defaults up somewhere else
+    // Set the default query params
     let queryParams = datasource.queryParams || {}
     for (let param of datasource.parameters) {
       if (!queryParams[param.name]) {