Merge pull request #8886 from Budibase/bug/sev3/query-bindings-drawer

Query bindings drawer fixes

packages/builder/src/components/common/bindings/BindingPanel.svelte

@@ -39,6 +39,7 @@
   export let value = ""
   export let valid
   export let allowJS = false
+  export let allowHelpers = true
 
   let helpers = handlebarsCompletions()
   let getCaretPosition
@@ -85,7 +86,7 @@
     return helper.label.match(searchRgx) || helper.description.match(searchRgx)
   })
 
-  $: categoryNames = [...categories.map(cat => cat[0]), "Helpers"]
+  $: categoryNames = getCategoryNames(categories)
 
   $: codeMirrorHints = bindings?.map(x => `$("${x.readableBinding}")`)
 
@@ -96,6 +97,14 @@
     }
   }
 
+  const getCategoryNames = categories => {
+    let names = [...categories.map(cat => cat[0])]
+    if (allowHelpers) {
+      names.push("Helpers")
+    }
+    return names
+  }
+
   // Adds a JS/HBS helper to the expression
   const addHelper = (helper, js) => {
     let tempVal
@@ -343,7 +352,7 @@
               for more details.
             </p>
           {/if}
-          {#if $admin.isDev}
+          {#if $admin.isDev && allowJS}
             <div class="convert">
               <Button secondary on:click={convert}>Convert to JS</Button>
             </div>

packages/builder/src/components/common/bindings/ClientBindingPanel.svelte

@@ -5,6 +5,7 @@
   export let valid
   export let value = ""
   export let allowJS = false
+  export let allowHelpers = true
 
   $: enrichedBindings = enrichBindings(bindings)
 
@@ -25,5 +26,6 @@
   bindings={enrichedBindings}
   {value}
   {allowJS}
+  {allowHelpers}
   on:change
 />

packages/builder/src/components/common/bindings/DrawerBindableInput.svelte

@@ -17,6 +17,7 @@
   export let disabled = false
   export let fillWidth
   export let allowJS = true
+  export let allowHelpers = true
   export let updateOnChange = true
   export let drawerLeft
 
@@ -77,6 +78,7 @@
     on:change={event => (tempValue = event.detail)}
     {bindings}
     {allowJS}
+    {allowHelpers}
   />
 </Drawer>
 

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

@@ -33,6 +33,7 @@
   export let showMenu = false
   export let bindings = []
   export let bindingDrawerLeft
+  export let allowHelpers = true
 
   let fields = Object.entries(object || {}).map(([name, value]) => ({
     name,
@@ -122,6 +123,7 @@
           disabled={readOnly}
           value={field.value}
           allowJS={false}
+          {allowHelpers}
           fillWidth={true}
           drawerLeft={bindingDrawerLeft}
         />

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

@@ -223,6 +223,7 @@
   .config {
     display: grid;
     grid-gap: var(--spacing-s);
+    z-index: 1;
   }
 
   .config-field {

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

@@ -37,6 +37,7 @@
       valuePlaceholder="Default"
       bindings={[...userBindings]}
       bindingDrawerLeft="260px"
+      allowHelpers={false}
       on:change
     />
   </div>