add environment bindings to rest query binding drawer

packages/builder/src/builderStore/dataBinding.js

@@ -21,6 +21,7 @@ import {
 import { TableNames } from "../constants"
 import { JSONUtils } from "@budibase/frontend-core"
 import ActionDefinitions from "components/design/settings/controls/ButtonActionEditor/manifest.json"
+import { environment } from "stores/portal"
 
 // Regex to match all instances of template strings
 const CAPTURE_VAR_INSIDE_TEMPLATE = /{{([^}]+)}}/g
@@ -54,7 +55,7 @@ export const getBindableProperties = (asset, componentId) => {
  */
 export const getRestBindings = () => {
   const userBindings = getUserBindings()
-  return [...userBindings, ...getAuthBindings()]
+  return [...userBindings, ...getAuthBindings(), ...getEnvironmentBindings()]
 }
 
 /**
@@ -89,6 +90,21 @@ export const getAuthBindings = () => {
   return bindings
 }
 
+export const getEnvironmentBindings = () => {
+  let envVars = get(environment).variables
+  let test = envVars.map(variable => {
+    return {
+      type: "context",
+      runtimeBinding: `env.${makePropSafe(variable.name)}`,
+      readableBinding: `env.${variable.name}`,
+      category: "Environment",
+      icon: "Key",
+      display: { type: "string", name: variable.name },
+    }
+  })
+  return test
+}
+
 /**
  * Utility - convert a key/value map to an array of custom 'context' bindings
  * @param {object} valueMap Key/value pairings

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

@@ -20,7 +20,7 @@
   export let allowHelpers = true
   export let updateOnChange = true
   export let drawerLeft
-  $: console.log(bindings)
+
   const dispatch = createEventDispatcher()
   let bindingDrawer
   let valid = true

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

@@ -1,6 +1,7 @@
 <script>
   import { goto, params } from "@roxi/routify"
   import { datasources, flags, integrations, queries } from "stores/backend"
+  import { environment } from "stores/portal"
   import {
     Banner,
     Body,
@@ -362,6 +363,13 @@
       notifications.error("Error getting datasources")
     }
 
+    try {
+      // load the environment variables
+      await environment.loadVariables()
+    } catch (error) {
+      notifications.error("Error getting environment variables")
+    }
+
     datasource = $datasources.list.find(ds => ds._id === query?.datasourceId)
     const datasourceUrl = datasource?.config.url
     const qs = query?.fields.queryString