Merge branch 'master' into feat/pick-relationship-fields

.github/workflows/deploy-featurebranch.yml

@@ -22,6 +22,7 @@ jobs:
         env:
           PAYLOAD_BRANCH: ${{ github.head_ref }}
           PAYLOAD_PR_NUMBER: ${{ github.event.pull_request.number }}
+          PAYLOAD_LICENSE_TYPE: "free"
         with:
           repository: budibase/budibase-deploys
           event: featurebranch-qa-deploy

lerna.json

@@ -1,6 +1,6 @@
 {
   "$schema": "node_modules/lerna/schemas/lerna-schema.json",
-  "version": "2.31.3",
+  "version": "2.31.4",
   "npmClient": "yarn",
   "packages": [
     "packages/*",

packages/backend-core/src/features/index.ts

@@ -266,7 +266,7 @@ export class FlagSet<V extends Flag<any>, T extends { [key: string]: V }> {
 // All of the machinery in this file is to make sure that flags have their
 // default values set correctly and their types flow through the system.
 export const flags = new FlagSet({
-  DEFAULT_VALUES: Flag.boolean(false),
+  DEFAULT_VALUES: Flag.boolean(env.isDev()),
   SQS: Flag.boolean(env.isDev()),
   [FeatureFlag.ENRICHED_RELATIONSHIPS]: Flag.boolean(false),
 })

packages/builder/src/dataBinding.js

@@ -57,6 +57,7 @@ export const getBindableProperties = (asset, componentId) => {
   const stateBindings = getStateBindings()
   const selectedRowsBindings = getSelectedRowsBindings(asset)
   const roleBindings = getRoleBindings()
+  const embedBindings = getEmbedBindings()
   return [
     ...contextBindings,
     ...urlBindings,
@@ -65,6 +66,7 @@ export const getBindableProperties = (asset, componentId) => {
     ...deviceBindings,
     ...selectedRowsBindings,
     ...roleBindings,
+    ...embedBindings,
   ]
 }
 
@@ -813,6 +815,25 @@ export const getActionBindings = (actions, actionId) => {
   return bindings
 }
 
+/**
+ * Gets all device bindings for embeds.
+ */
+const getEmbedBindings = () => {
+  let bindings = []
+  const safeEmbed = makePropSafe("embed")
+
+  bindings = [
+    {
+      type: "context",
+      runtimeBinding: `${safeEmbed}`,
+      readableBinding: `ParentWindow`,
+      category: "Embed",
+      icon: "DistributeVertically",
+    },
+  ]
+  return bindings
+}
+
 /**
  * Gets the schema for a certain datasource plus.
  * The options which can be passed in are:

packages/builder/src/helpers/utils.js

@@ -7,10 +7,22 @@ import {
   FIELDS,
   isAutoColumnUserRelationship,
 } from "constants/backend"
+import { isEnabled } from "helpers/featureFlags"
 
 export function getAutoColumnInformation(enabled = true) {
   let info = {}
-  for (let [key, subtype] of Object.entries(AUTO_COLUMN_SUB_TYPES)) {
+  for (const [key, subtype] of Object.entries(AUTO_COLUMN_SUB_TYPES)) {
+    // Because it's possible to replicate the functionality of CREATED_AT and
+    // CREATED_BY columns, we disable their creation when the DEFAULT_VALUES
+    // feature flag is enabled.
+    if (isEnabled("DEFAULT_VALUES")) {
+      if (
+        subtype === AUTO_COLUMN_SUB_TYPES.CREATED_AT ||
+        subtype === AUTO_COLUMN_SUB_TYPES.CREATED_BY
+      ) {
+        continue
+      }
+    }
     info[subtype] = { enabled, name: AUTO_COLUMN_DISPLAY_NAMES[key] }
   }
   return info

packages/builder/src/pages/builder/app/[application]/_components/PreviewOverlay.svelte

@@ -49,7 +49,7 @@
     right: 0;
     left: 0;
     bottom: 0;
-    z-index: 999;
+    z-index: 9000;
     position: absolute;
     background: rgba(255, 255, 255, 0.1);
     display: flex;

packages/client/src/components/ClientApp.svelte

@@ -42,6 +42,7 @@
   import FreeFooter from "components/FreeFooter.svelte"
   import MaintenanceScreen from "components/MaintenanceScreen.svelte"
   import SnippetsProvider from "./context/SnippetsProvider.svelte"
+  import EmbedProvider from "./context/EmbedProvider.svelte"
 
   // Provide contexts
   setContext("sdk", SDK)
@@ -160,6 +161,7 @@
     {#if $environmentStore.maintenance.length > 0}
       <MaintenanceScreen maintenanceList={$environmentStore.maintenance} />
     {:else}
+      <EmbedProvider>
         <DeviceBindingsProvider>
           <UserBindingsProvider>
             <StateBindingsProvider>
@@ -212,7 +214,8 @@
                                   Something went wrong rendering your app
                                 </Heading>
                                 <Body size="S">
-                                Get in touch with support if this issue persists
+                                  Get in touch with support if this issue
+                                  persists
                                 </Body>
                               </Layout>
                             </div>
@@ -270,6 +273,7 @@
             </StateBindingsProvider>
           </UserBindingsProvider>
         </DeviceBindingsProvider>
+      </EmbedProvider>
     {/if}
   </div>
   <KeyboardManager />

packages/client/src/components/context/EmbedProvider.svelte

@@ -0,0 +1,43 @@
+<script>
+  import Provider from "./Provider.svelte"
+  import { onMount } from "svelte"
+
+  let data = {}
+
+  function extractDomainFromUrl(url) {
+    const { hostname } = new URL(url)
+    const parts = hostname.split(".")
+    const tld = parts.slice(-2).join(".")
+    return tld
+  }
+
+  function handleMessage(event) {
+    if (event.data?.type !== "bb-parent-window-event") {
+      return
+    }
+
+    // Validate the event origin to ensure it's coming from a trusted source
+    // Allow different subdomains but must match TLD
+    const appOrigin = extractDomainFromUrl(window.location.origin)
+    const eventOrigin = extractDomainFromUrl(event.origin)
+
+    if (appOrigin === eventOrigin) {
+      data = event.data
+    } else {
+      console.error(
+        `Embedded budibase app domain ${appOrigin} does not match origin of event ${eventOrigin}.
+        Top level domains must match`
+      )
+    }
+  }
+
+  onMount(() => {
+    window.addEventListener("message", handleMessage)
+
+    return () => window.removeEventListener("message", handleMessage)
+  })
+</script>
+
+<Provider key="embed" {data}>
+  <slot />
+</Provider>