Merge branch 'master' of github.com:Budibase/budibase into grid-layout-expansion

2024-08-20 10:26:39 +01:00 · 2024-08-20 10:26:39 +01:00 · 346f55691b
parent 48775b8397 760be9d6af
commit 346f55691b
100 changed files with 3463 additions and 1191 deletions
--- a/.eslintrc.json
+++ b/.eslintrc.json
@ -43,6 +43,7 @@
      },
      "rules": {
        "no-unused-vars": "off",
+        "local-rules/no-barrel-imports": "error",
        "local-rules/no-budibase-imports": "error",
        "local-rules/no-console-error": "error",
        "@typescript-eslint/no-unused-vars": [
--- a/charts/budibase/README.md
+++ b/charts/budibase/README.md
@ -139,7 +139,7 @@ $ helm install --create-namespace --namespace budibase budibase . -f values.yaml
 | globals.smtp.user | string | `""` | The username to use when authenticating with your SMTP server. |
 | globals.sqs.enabled | bool | `false` | Whether to use the CouchDB "structured query service" or not. This is disabled by default for now, but will become the default in a future release. |
 | globals.tempBucketName | string | `""` |  |
-| globals.tenantFeatureFlags | string | `"*:LICENSING,*:USER_GROUPS,*:ONBOARDING_TOUR"` | Sets what feature flags are enabled and for which tenants. Should not ordinarily need to be changed. |
+| globals.tenantFeatureFlags | string | `` | Sets what feature flags are enabled and for which tenants. Should not ordinarily need to be changed. |
 | imagePullSecrets | list | `[]` | Passed to all pods created by this chart. Should not ordinarily need to be changed. |
 | ingress.className | string | `""` | What ingress class to use. |
 | ingress.enabled | bool | `true` | Whether to create an Ingress resource pointing to the Budibase proxy. |
--- a/charts/budibase/templates/app-service-deployment.yaml
+++ b/charts/budibase/templates/app-service-deployment.yaml
@ -65,7 +65,10 @@ spec:
        - name: ENABLE_ANALYTICS
          value: {{ .Values.globals.enableAnalytics | quote }}
        - name: API_ENCRYPTION_KEY
-          value: {{ .Values.globals.apiEncryptionKey | quote }}
+          valueFrom:
+            secretKeyRef:
+              name: {{ template "budibase.fullname" . }}
+              key: apiEncryptionKey
        - name: HTTP_LOGGING
          value: {{ .Values.services.apps.httpLogging | quote }}
        - name: INTERNAL_API_KEY
@ -161,7 +164,10 @@ spec:
        - name: TENANT_FEATURE_FLAGS
          value: {{ .Values.globals.tenantFeatureFlags | quote }}
        - name: ENCRYPTION_KEY
-          value: {{ .Values.globals.bbEncryptionKey | quote }}
+          valueFrom:
+            secretKeyRef:
+              name: {{ template "budibase.fullname" . }}
+              key: bbEncryptionKey
        {{ if .Values.globals.bbAdminUserEmail }}
        - name: BB_ADMIN_USER_EMAIL
          value: {{ .Values.globals.bbAdminUserEmail | quote }}
@ -221,7 +227,7 @@ spec:
              name: {{ .secretName }}
              key: {{ .secretKey | quote }}
        {{- end}}
-        image: budibase/apps:{{ .Values.globals.appVersion | default .Chart.AppVersion }}
+        image: {{ .Values.globals.dockerRegistry }}budibase/apps:{{ .Values.globals.appVersion | default .Chart.AppVersion }}
        imagePullPolicy: Always
        {{- if .Values.services.apps.startupProbe }}
        {{- with .Values.services.apps.startupProbe }}
--- a/charts/budibase/templates/automation-worker-service-deployment.yaml
+++ b/charts/budibase/templates/automation-worker-service-deployment.yaml
@ -58,7 +58,10 @@ spec:
        - name: ENABLE_ANALYTICS
          value: {{ .Values.globals.enableAnalytics | quote }}
        - name: API_ENCRYPTION_KEY
-          value: {{ .Values.globals.apiEncryptionKey | quote }}
+          valueFrom:
+            secretKeyRef:
+              name: {{ template "budibase.fullname" . }}
+              key: apiEncryptionKey
        - name: HTTP_LOGGING
          value: {{ .Values.services.automationWorkers.httpLogging | quote }}
        - name: INTERNAL_API_KEY
@ -154,7 +157,10 @@ spec:
        - name: TENANT_FEATURE_FLAGS
          value: {{ .Values.globals.tenantFeatureFlags | quote }}
        - name: ENCRYPTION_KEY
-          value: {{ .Values.globals.bbEncryptionKey | quote }}
+          valueFrom:
+            secretKeyRef:
+              name: {{ template "budibase.fullname" . }}
+              key: bbEncryptionKey
        {{ if .Values.globals.bbAdminUserEmail }}
        - name: BB_ADMIN_USER_EMAIL
          value: {{ .Values.globals.bbAdminUserEmail | quote }}
@ -209,7 +215,7 @@ spec:
              key: {{ .secretKey | quote }}
        {{- end}}

-        image: budibase/apps:{{ .Values.globals.appVersion | default .Chart.AppVersion }}
+        image: {{ .Values.globals.dockerRegistry }}budibase/apps:{{ .Values.globals.appVersion | default .Chart.AppVersion }}
        imagePullPolicy: Always
        {{- if .Values.services.automationWorkers.startupProbe }}
        {{- with .Values.services.automationWorkers.startupProbe }}
--- a/charts/budibase/templates/minio-service-deployment.yaml
+++ b/charts/budibase/templates/minio-service-deployment.yaml
@ -35,7 +35,7 @@ spec:
              name: {{ template "budibase.fullname" . }}
              key: objectStoreSecret

-        image: minio/minio
+        image: {{ .Values.globals.dockerRegistry }}minio/minio
        imagePullPolicy: ""
        livenessProbe:
          httpGet:
--- a/charts/budibase/templates/proxy-service-deployment.yaml
+++ b/charts/budibase/templates/proxy-service-deployment.yaml
@ -32,7 +32,7 @@ spec:
 {{ end }}
    spec:
      containers:
-      - image: budibase/proxy:{{ .Values.globals.appVersion | default .Chart.AppVersion }}
+      - image: {{ .Values.globals.dockerRegistry }}budibase/proxy:{{ .Values.globals.appVersion | default .Chart.AppVersion }}
        imagePullPolicy: Always
        name: proxy-service
        {{- if .Values.services.proxy.startupProbe }}
--- a/charts/budibase/templates/redis-service-deployment.yaml
+++ b/charts/budibase/templates/redis-service-deployment.yaml
@ -22,7 +22,7 @@ spec:
        - redis-server 
        - --requirepass 
        - {{ .Values.services.redis.password }}
-        image: {{ .Values.services.redis.image }}
+        image: {{ .Values.globals.dockerRegistry }}{{ .Values.services.redis.image }}
        imagePullPolicy: ""
        name: redis-service
        ports:
--- a/charts/budibase/templates/secrets.yaml
+++ b/charts/budibase/templates/secrets.yaml
@ -16,10 +16,14 @@ data:
  jwtSecret: {{ index $existingSecret.data "jwtSecret" }}
  objectStoreAccess: {{ index $existingSecret.data "objectStoreAccess" }}
  objectStoreSecret: {{ index $existingSecret.data "objectStoreSecret" }}
+  bbEncryptionKey: {{ index $existingSecret.data "bbEncryptionKey" }}
+  apiEncryptionKey: {{ index $existingSecret.data "apiEncryptionKey" }}
  {{- else }}
  internalApiKey: {{ template "budibase.defaultsecret" .Values.globals.internalApiKey }}
  jwtSecret: {{ template "budibase.defaultsecret" .Values.globals.jwtSecret }}
  objectStoreAccess: {{ template "budibase.defaultsecret" .Values.services.objectStore.accessKey }}
  objectStoreSecret: {{ template "budibase.defaultsecret" .Values.services.objectStore.secretKey }}
+  bbEncryptionKey: {{ template "budibase.defaultsecret" .Values.globals.bbEncryptionKey }}
+  apiEncryptionKey: {{ template "budibase.defaultsecret" .Values.globals.apiEncryptionKey }}
  {{- end }}
 {{- end }}
--- a/charts/budibase/templates/worker-service-deployment.yaml
+++ b/charts/budibase/templates/worker-service-deployment.yaml
@ -65,7 +65,10 @@ spec:
        {{ end }}
        {{ end }}
        - name: API_ENCRYPTION_KEY
-          value: {{ .Values.globals.apiEncryptionKey | quote }}
+          valueFrom:
+            secretKeyRef:
+              name: {{ template "budibase.fullname" . }}
+              key: apiEncryptionKey
        - name: HTTP_LOGGING
          value: {{ .Values.services.worker.httpLogging | quote }}
        - name: INTERNAL_API_KEY
@ -167,7 +170,10 @@ spec:
        - name: TENANT_FEATURE_FLAGS
          value: {{ .Values.globals.tenantFeatureFlags | quote }}
        - name: ENCRYPTION_KEY
-          value: {{ .Values.globals.bbEncryptionKey | quote }}
+          valueFrom:
+            secretKeyRef:
+              name: {{ template "budibase.fullname" . }}
+              key: bbEncryptionKey
        {{ if .Values.globals.datadogApmEnabled }}
        - name: DD_LOGS_INJECTION
          value: {{ .Values.globals.datadogApmEnabled | quote }}
@ -207,7 +213,7 @@ spec:
              name: {{ .secretName }}
              key: {{ .secretKey | quote }}
        {{- end}}
-        image: budibase/worker:{{ .Values.globals.appVersion | default .Chart.AppVersion }}
+        image: {{ .Values.globals.dockerRegistry }}budibase/worker:{{ .Values.globals.appVersion | default .Chart.AppVersion }}
        imagePullPolicy: Always
        {{- if .Values.services.worker.startupProbe }}
        {{- with .Values.services.worker.startupProbe }}
--- a/charts/budibase/values.yaml
+++ b/charts/budibase/values.yaml
@ -62,7 +62,7 @@ globals:
  budibaseEnv: PRODUCTION
  # -- Sets what feature flags are enabled and for which tenants. Should not ordinarily need to be
  # changed.
-  tenantFeatureFlags: "*:LICENSING,*:USER_GROUPS,*:ONBOARDING_TOUR"
+  tenantFeatureFlags: ""
  # -- Whether to enable analytics or not. You can read more about our analytics here:
  # <https://docs.budibase.com/docs/analytics>.
  enableAnalytics: "1"
--- a/eslint-local-rules/index.js
+++ b/eslint-local-rules/index.js
@ -1,3 +1,14 @@
+const path = require("path")
+
+const makeBarrelPath = finalPath => {
+  return path.resolve(__dirname, "..", finalPath)
+}
+const backendCoreBarrelPaths = [
+  makeBarrelPath(path.join("packages", "backend-core", "src", "index.ts")),
+  makeBarrelPath(path.join("packages", "backend-core", "src")),
+  makeBarrelPath(path.join("packages", "backend-core")),
+]
+
 module.exports = {
  "no-console-error": {
    create: function (context) {
@ -13,11 +24,12 @@ module.exports = {
          ) {
            context.report({
              node,
-              message: 'Using console.error(err) on its own is not allowed. Either provide context to the error (console.error(msg, err)) or throw it.',
+              message:
+                "Using console.error(err) on its own is not allowed. Either provide context to the error (console.error(msg, err)) or throw it.",
            })
          }
        },
-      };
+      }
    },
  },
  "no-budibase-imports": {
@ -106,4 +118,42 @@ module.exports = {
      }
    },
  },
+  "no-barrel-imports": {
+    meta: {
+      type: "problem",
+      docs: {
+        description:
+          "Disallow imports from the top-level backend-core barrel file",
+        category: "Best Practices",
+        recommended: false,
+      },
+      schema: [], // no options
+      messages: {
+        noBarrelImport:
+          "Avoid importing from the top-level barrel file 'backend-core/src/index.ts'. Import directly from the specific module instead.",
+      },
+    },
+    create(context) {
+      return {
+        ImportDeclaration(node) {
+          const importPath = node.source.value
+          const importFullPath = path.resolve(
+            context.getFilename(),
+            "..",
+            importPath
+          )
+
+          if (backendCoreBarrelPaths.includes(importFullPath)) {
+            context.report({
+              node,
+              messageId: "noBarrelImport",
+              data: {
+                importFullPath,
+              },
+            })
+          }
+        },
+      }
+    },
+  },
 }
--- a/hosting/single/runner.sh
+++ b/hosting/single/runner.sh
@ -10,7 +10,6 @@ declare -a DOCKER_VARS=("APP_PORT" "APPS_URL" "ARCHITECTURE" "BUDIBASE_ENVIRONME
 [[ -z "${MINIO_URL}" ]] && [[ -z "${USE_S3}" ]] && export MINIO_URL=http://127.0.0.1:9000
 [[ -z "${NODE_ENV}" ]] && export NODE_ENV=production
 [[ -z "${POSTHOG_TOKEN}" ]] && export POSTHOG_TOKEN=phc_bIjZL7oh2GEUd2vqvTBH8WvrX0fWTFQMs6H5KQxiUxU
-[[ -z "${TENANT_FEATURE_FLAGS}" ]] && export TENANT_FEATURE_FLAGS="*:LICENSING,*:USER_GROUPS,*:ONBOARDING_TOUR"
 [[ -z "${ACCOUNT_PORTAL_URL}" ]] && export ACCOUNT_PORTAL_URL=https://account.budibase.app
 [[ -z "${REDIS_URL}" ]] && export REDIS_URL=127.0.0.1:6379
 [[ -z "${SELF_HOSTED}" ]] && export SELF_HOSTED=1
@ -45,8 +44,7 @@ fi
 # randomise any unset environment variables
 for ENV_VAR in "${ENV_VARS[@]}"
 do
-    temp=$(eval "echo \$$ENV_VAR")
-    if [[ -z "${temp}" ]]; then
+    if [[ -z "${!ENV_VAR}" ]]; then
        eval "export $ENV_VAR=$(uuidgen | sed -e 's/-//g')"
    fi
 done
--- a/lerna.json
+++ b/lerna.json
@ -1,6 +1,6 @@
 {
  "$schema": "node_modules/lerna/schemas/lerna-schema.json",
-  "version": "2.30.3",
+  "version": "2.30.7",
  "npmClient": "yarn",
  "packages": [
    "packages/*",
--- a/packages/backend-core/src/context/tests/index.spec.ts
+++ b/packages/backend-core/src/context/tests/index.spec.ts
@ -2,7 +2,7 @@ import { testEnv } from "../../../tests/extra"
 import * as context from "../"
 import { DEFAULT_TENANT_ID } from "../../constants"
 import { structures } from "../../../tests"
-import { db } from "../.."
+import * as db from "../../db"
 import Context from "../Context"
 import { ContextMap } from "../types"
 import { IdentityType } from "@budibase/types"
--- a/packages/backend-core/src/features/index.ts
+++ b/packages/backend-core/src/features/index.ts
@ -159,8 +159,9 @@ export class FlagSet<V extends Flag<any>, T extends { [key: string]: V }> {
            specificallySetFalse.add(feature)
          }

+          // ignore unknown flags
          if (!this.isFlagName(feature)) {
-            throw new Error(`Feature: ${feature} is not an allowed option`)
+            continue
          }

          if (typeof flagValues[feature] !== "boolean") {
@ -169,7 +170,7 @@ export class FlagSet<V extends Flag<any>, T extends { [key: string]: V }> {

          // @ts-expect-error - TS does not like you writing into a generic type,
          // but we know that it's okay in this case because it's just an object.
-          flagValues[feature] = value
+          flagValues[feature as keyof FlagValues] = value
          tags[`flags.${feature}.source`] = "environment"
        }
      }
@ -265,9 +266,5 @@ 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({
-  LICENSING: Flag.boolean(false),
-  GOOGLE_SHEETS: Flag.boolean(false),
-  USER_GROUPS: Flag.boolean(false),
-  ONBOARDING_TOUR: Flag.boolean(false),
  DEFAULT_VALUES: Flag.boolean(false),
 })
--- a/packages/backend-core/src/features/tests/features.spec.ts
+++ b/packages/backend-core/src/features/tests/features.spec.ts
@ -1,6 +1,6 @@
 import { IdentityContext, IdentityType, UserCtx } from "@budibase/types"
 import { Flag, FlagSet, FlagValues, init, shutdown } from "../"
-import { context } from "../.."
+import * as context from "../../context"
 import environment, { withEnv } from "../../environment"
 import nodeFetch from "node-fetch"
 import nock from "nock"
@ -67,9 +67,9 @@ describe("feature flags", () => {
      expected: flags.defaults(),
    },
    {
-      it: "should fail when an environment flag is not recognised",
+      it: "should ignore unknown feature flags",
      environmentFlags: "default:TEST_BOOLEAN,default:FOO",
-      errorMessage: "Feature: FOO is not an allowed option",
+      expected: { TEST_BOOLEAN: true },
    },
    {
      it: "should be able to read boolean flags from PostHog",
--- a/packages/backend-core/src/redis/tests/redis.spec.ts
+++ b/packages/backend-core/src/redis/tests/redis.spec.ts
@ -1,7 +1,7 @@
 import { GenericContainer, StartedTestContainer } from "testcontainers"
 import { generator, structures } from "../../../tests"
 import RedisWrapper, { closeAll } from "../redis"
-import { env } from "../.."
+import env from "../../environment"
 import { randomUUID } from "crypto"

 jest.setTimeout(30000)
--- a/packages/builder/src/components/backend/DataTable/modals/CreateEditColumn.svelte
+++ b/packages/builder/src/components/backend/DataTable/modals/CreateEditColumn.svelte
@ -46,7 +46,7 @@
  import { RowUtils } from "@budibase/frontend-core"
  import ServerBindingPanel from "components/common/bindings/ServerBindingPanel.svelte"
  import OptionsEditor from "./OptionsEditor.svelte"
-  import { isEnabled, TENANT_FEATURE_FLAGS } from "helpers/featureFlags"
+  import { isEnabled } from "helpers/featureFlags"

  const AUTO_TYPE = FieldType.AUTO
  const FORMULA_TYPE = FieldType.FORMULA
@ -168,8 +168,7 @@
  $: canBeDisplay =
    canBeDisplayColumn(editableColumn.type) && !editableColumn.autocolumn
  $: canHaveDefault =
-    isEnabled(TENANT_FEATURE_FLAGS.DEFAULT_VALUES) &&
-    canHaveDefaultColumn(editableColumn.type)
+    isEnabled("DEFAULT_VALUES") && canHaveDefaultColumn(editableColumn.type)
  $: canBeRequired =
    editableColumn?.type !== LINK_TYPE &&
    !uneditable &&
--- a/packages/builder/src/components/common/HelpMenu.svelte
+++ b/packages/builder/src/components/common/HelpMenu.svelte
@ -1,7 +1,6 @@
 <script>
  import FontAwesomeIcon from "./FontAwesomeIcon.svelte"
  import { Popover, Heading, Body } from "@budibase/bbui"
-  import { isEnabled, TENANT_FEATURE_FLAGS } from "helpers/featureFlags"
  import { licensing } from "stores/portal"
  import { isPremiumOrAbove } from "helpers/planTitle"
  import { ChangelogURL } from "constants"
@ -62,16 +61,12 @@
        <Body size="S">Budibase University</Body>
      </a>
      <div class="divider" />
-      {#if isEnabled(TENANT_FEATURE_FLAGS.LICENSING)}
      <a
        href={premiumOrAboveLicense
          ? "mailto:support@budibase.com"
          : "/builder/portal/account/usage"}
      >
-          <div
-            class="premiumLinkContent"
-            class:disabled={!premiumOrAboveLicense}
-          >
+        <div class="premiumLinkContent" class:disabled={!premiumOrAboveLicense}>
          <div class="icon">
            <FontAwesomeIcon name="fa-solid fa-envelope" />
          </div>
@ -86,7 +81,6 @@
          </div>
        {/if}
      </a>
-      {/if}
    </nav>
  </Popover>
 </div>
--- a/packages/builder/src/components/design/ScreenDetailsModal.svelte
+++ b/packages/builder/src/components/design/ScreenDetailsModal.svelte
@ -6,8 +6,8 @@

  export let onConfirm
  export let onCancel
-  export let screenUrl
-  export let screenRole
+  export let route
+  export let role
  export let confirmText = "Continue"

  const appPrefix = "/app"
@ -15,17 +15,17 @@
  let error
  let modal

-  $: appUrl = screenUrl
-    ? `${window.location.origin}${appPrefix}${screenUrl}`
+  $: appUrl = route
+    ? `${window.location.origin}${appPrefix}${route}`
    : `${window.location.origin}${appPrefix}`

  const routeChanged = event => {
    if (!event.detail.startsWith("/")) {
-      screenUrl = "/" + event.detail
+      route = "/" + event.detail
    }
    touched = true
-    screenUrl = sanitizeUrl(screenUrl)
-    if (routeExists(screenUrl)) {
+    route = sanitizeUrl(route)
+    if (routeExists(route)) {
      error = "This URL is already taken for this access role"
    } else {
      error = null
@ -33,19 +33,19 @@
  }

  const routeExists = url => {
-    if (!screenRole) {
+    if (!role) {
      return false
    }
    return get(screenStore).screens.some(
      screen =>
        screen.routing.route.toLowerCase() === url.toLowerCase() &&
-        screen.routing.roleId === screenRole
+        screen.routing.roleId === role
    )
  }

  const confirmScreenDetails = async () => {
    await onConfirm({
-      screenUrl,
+      route,
    })
  }
 </script>
@ -58,13 +58,13 @@
  onConfirm={confirmScreenDetails}
  {onCancel}
  cancelText={"Back"}
-  disabled={!screenUrl || error || !touched}
+  disabled={!route || error || !touched}
 >
  <form on:submit|preventDefault={() => modal.confirm()}>
    <Input
      label="Enter a URL for the new screen"
      {error}
-      bind:value={screenUrl}
+      bind:value={route}
      on:change={routeChanged}
    />
    <div class="app-server" title={appUrl}>
--- a/packages/builder/src/components/design/settings/controls/DataSourceSelect/DataSourceSelect.svelte
+++ b/packages/builder/src/components/design/settings/controls/DataSourceSelect/DataSourceSelect.svelte
@ -34,6 +34,7 @@
  import ClientBindingPanel from "components/common/bindings/ClientBindingPanel.svelte"
  import DataSourceCategory from "components/design/settings/controls/DataSourceSelect/DataSourceCategory.svelte"
  import { API } from "api"
+  import { datasourceSelect as format } from "helpers/data/format"

  export let value = {}
  export let otherSources
@ -51,24 +52,15 @@
  let modal

  $: text = value?.label ?? "Choose an option"
-  $: tables = $tablesStore.list.map(m => ({
-    label: m.name,
-    tableId: m._id,
-    type: "table",
-    datasource: $datasources.list.find(
-      ds => ds._id === m.sourceId || m.datasourceId
-    ),
-  }))
+  $: tables = $tablesStore.list.map(table =>
+    format.table(table, $datasources.list)
+  )
  $: viewsV1 = $viewsStore.list.map(view => ({
    ...view,
    label: view.name,
    type: "view",
  }))
-  $: viewsV2 = $viewsV2Store.list.map(view => ({
-    ...view,
-    label: view.name,
-    type: "viewV2",
-  }))
+  $: viewsV2 = $viewsV2Store.list.map(format.viewV2)
  $: views = [...(viewsV1 || []), ...(viewsV2 || [])]
  $: queries = $queriesStore.list
    .filter(q => showAllQueries || q.queryVerb === "read" || q.readable)
--- a/packages/builder/src/components/design/settings/controls/TableSelect.svelte
+++ b/packages/builder/src/components/design/settings/controls/TableSelect.svelte
@ -2,24 +2,14 @@
  import { Select } from "@budibase/bbui"
  import { createEventDispatcher, onMount } from "svelte"
  import { tables as tablesStore, viewsV2 } from "stores/builder"
+  import { tableSelect as format } from "helpers/data/format"

  export let value

  const dispatch = createEventDispatcher()

-  $: tables = $tablesStore.list.map(table => ({
-    type: "table",
-    label: table.name,
-    tableId: table._id,
-    resourceId: table._id,
-  }))
-  $: views = $viewsV2.list.map(view => ({
-    type: "viewV2",
-    id: view.id,
-    label: view.name,
-    tableId: view.tableId,
-    resourceId: view.id,
-  }))
+  $: tables = $tablesStore.list.map(format.table)
+  $: views = $viewsV2.list.map(format.viewV2)
  $: options = [...(tables || []), ...(views || [])]

  const onChange = e => {
--- a/packages/builder/src/components/portal/licensing/LicensingOverlays.svelte
+++ b/packages/builder/src/components/portal/licensing/LicensingOverlays.svelte
@ -7,7 +7,6 @@
  import { ExpiringKeys } from "./constants"
  import { getBanners } from "./licensingBanners"
  import { banner } from "@budibase/bbui"
-  import { TENANT_FEATURE_FLAGS, isEnabled } from "helpers/featureFlags"

  const oneDayInSeconds = 86400

@ -89,8 +88,7 @@
    userLoaded &&
    $licensing.usageMetrics &&
    domLoaded &&
-    !licensingLoaded &&
-    isEnabled(TENANT_FEATURE_FLAGS.LICENSING)
+    !licensingLoaded
  ) {
    licensingLoaded = true
    queuedModals = processModals()
--- a/packages/builder/src/helpers/data/format.js
+++ b/packages/builder/src/helpers/data/format.js
@ -0,0 +1,31 @@
+export const datasourceSelect = {
+  table: (table, datasources) => ({
+    label: table.name,
+    tableId: table._id,
+    type: "table",
+    datasource: datasources.find(
+      datasource => datasource._id === table.sourceId || table.datasourceId
+    ),
+  }),
+  viewV2: view => ({
+    ...view,
+    label: view.name,
+    type: "viewV2",
+  }),
+}
+
+export const tableSelect = {
+  table: table => ({
+    type: "table",
+    label: table.name,
+    tableId: table._id,
+    resourceId: table._id,
+  }),
+  viewV2: view => ({
+    type: "viewV2",
+    id: view.id,
+    label: view.name,
+    tableId: view.tableId,
+    resourceId: view.id,
+  }),
+}
--- a/packages/builder/src/helpers/featureFlags.js
+++ b/packages/builder/src/helpers/featureFlags.js
@ -1,14 +1,6 @@
 import { auth } from "../stores/portal"
 import { get } from "svelte/store"

-export const TENANT_FEATURE_FLAGS = {
-  LICENSING: "LICENSING",
-  USER_GROUPS: "USER_GROUPS",
-  ONBOARDING_TOUR: "ONBOARDING_TOUR",
-  GOOGLE_SHEETS: "GOOGLE_SHEETS",
-  DEFAULT_VALUES: "DEFAULT_VALUES",
-}
-
 export const isEnabled = featureFlag => {
  const user = get(auth).user
  return !!user?.flags?.[featureFlag]
--- a/packages/builder/src/pages/builder/app/[application]/_layout.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/_layout.svelte
@ -9,7 +9,6 @@
    deploymentStore,
  } from "stores/builder"
  import { auth, appsStore } from "stores/portal"
-  import { TENANT_FEATURE_FLAGS, isEnabled } from "helpers/featureFlags"
  import {
    Icon,
    Tabs,
@ -90,7 +89,6 @@

  const initTour = async () => {
    // Check if onboarding is enabled.
-    if (isEnabled(TENANT_FEATURE_FLAGS.ONBOARDING_TOUR)) {
    if (!$auth.user?.onboardedAt) {
      builderStore.startBuilderOnboarding()
    } else {
@ -102,7 +100,6 @@
      }
    }
  }
-  }

  onMount(async () => {
    if (!hasSynced && application) {
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/ScreenList/ScreenNavItem.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/ScreenList/ScreenNavItem.svelte
@ -20,7 +20,7 @@
  let confirmDeleteDialog
  let screenDetailsModal

-  const createDuplicateScreen = async ({ screenName, screenUrl }) => {
+  const createDuplicateScreen = async ({ route }) => {
    // Create a dupe and ensure it is unique
    let duplicateScreen = Helpers.cloneDeep(screen)
    delete duplicateScreen._id
@ -28,9 +28,8 @@
    duplicateScreen.props = makeComponentUnique(duplicateScreen.props)

    // Attach the new name and URL
-    duplicateScreen.routing.route = sanitizeUrl(screenUrl)
+    duplicateScreen.routing.route = sanitizeUrl(route)
    duplicateScreen.routing.homeScreen = false
-    duplicateScreen.props._instanceName = screenName

    try {
      // Create the screen
@ -136,8 +135,8 @@
 <Modal bind:this={screenDetailsModal}>
  <ScreenDetailsModal
    onConfirm={createDuplicateScreen}
-    screenUrl={screen?.routing.route}
-    screenRole={screen?.routing.roleId}
+    route={screen?.routing.route}
+    role={screen?.routing.roleId}
    confirmText="Duplicate"
  />
 </Modal>
--- a/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/CreateScreenModal.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/CreateScreenModal.svelte
@ -1,8 +1,9 @@
 <script>
  import ScreenDetailsModal from "components/design/ScreenDetailsModal.svelte"
  import DatasourceModal from "./DatasourceModal.svelte"
-  import sanitizeUrl from "helpers/sanitizeUrl"
-  import FormTypeModal from "./FormTypeModal.svelte"
+  import TypeModal from "./TypeModal.svelte"
+  import tableTypes from "./tableTypes"
+  import formTypes from "./formTypes"
  import { Modal, notifications } from "@budibase/bbui"
  import {
    screenStore,
@ -11,14 +12,9 @@
    builderStore,
  } from "stores/builder"
  import { auth } from "stores/portal"
-  import { get } from "svelte/store"
-  import { capitalise } from "helpers"
  import { goto } from "@roxi/routify"
  import { TOUR_KEYS } from "components/portal/onboarding/tours.js"
-  import blankScreen from "templates/blankScreen"
-  import formScreen from "templates/formScreen"
-  import gridScreen from "templates/gridScreen"
-  import gridDetailsScreen from "templates/gridDetailsScreen"
+  import * as screenTemplating from "templates/screenTemplating"
  import { Roles } from "constants/backend"

  let mode
@ -26,16 +22,19 @@
  let screenDetailsModal
  let datasourceModal
  let formTypeModal
+  let tableTypeModal

  let selectedTablesAndViews = []
  let permissions = {}

+  $: screens = $screenStore.screens
+
  export const show = newMode => {
    mode = newMode
    selectedTablesAndViews = []
    permissions = {}

-    if (mode === "grid" || mode === "gridDetails" || mode === "form") {
+    if (mode === "table" || mode === "form") {
      datasourceModal.show()
    } else if (mode === "blank") {
      screenDetailsModal.show()
@ -44,136 +43,83 @@
    }
  }

-  const createScreen = async screen => {
+  const createScreen = async screenTemplate => {
    try {
-      // Check we aren't clashing with an existing URL
-      if (hasExistingUrl(screen.routing.route, screen.routing.roleId)) {
-        let suffix = 2
-        let candidateUrl = makeCandidateUrl(screen, suffix)
-        while (hasExistingUrl(candidateUrl, screen.routing.roleId)) {
-          candidateUrl = makeCandidateUrl(screen, ++suffix)
-        }
-        screen.routing.route = candidateUrl
-      }
-
-      screen.routing.route = sanitizeUrl(screen.routing.route)
-
-      return await screenStore.save(screen)
+      return await screenStore.save(screenTemplate)
    } catch (error) {
      console.error(error)
      notifications.error("Error creating screens")
    }
  }

-  const addNavigationLink = async screen =>
+  const createScreens = async screenTemplates => {
+    const newScreens = []
+
+    for (let screenTemplate of screenTemplates) {
+      await addNavigationLink(
+        screenTemplate.data,
+        screenTemplate.navigationLinkLabel
+      )
+      newScreens.push(await createScreen(screenTemplate.data))
+    }
+
+    return newScreens
+  }
+
+  const addNavigationLink = async (screen, linkLabel) => {
+    if (linkLabel == null) return
+
    await navigationStore.saveLink(
      screen.routing.route,
-      capitalise(screen.routing.route.split("/")[1]),
+      linkLabel,
      screen.routing.roleId
    )
-
-  // Checks if any screens exist in the store with the given route and
-  // currently selected role
-  const hasExistingUrl = (url, screenAccessRole) => {
-    const screens = get(screenStore).screens.filter(
-      s => s.routing.roleId === screenAccessRole
-    )
-    return !!screens.find(s => s.routing?.route === url)
-  }
-
-  // Constructs a candidate URL for a new screen, appending a given suffix to the
-  // screen's URL
-  // e.g. "/sales/:id" => "/sales-1/:id"
-  const makeCandidateUrl = (screen, suffix) => {
-    let url = screen.routing?.route || ""
-    if (url.startsWith("/")) {
-      url = url.slice(1)
-    }
-    if (!url.includes("/")) {
-      return `/${url}-${suffix}`
-    } else {
-      const split = url.split("/")
-      return `/${split[0]}-${suffix}/${split.slice(1).join("/")}`
-    }
  }

  const onSelectDatasources = async () => {
    if (mode === "form") {
      formTypeModal.show()
-    } else if (mode === "grid") {
-      await createGridScreen()
-    } else if (mode === "gridDetails") {
-      await createGridDetailsScreen()
+    } else if (mode === "table") {
+      tableTypeModal.show()
    }
  }

-  const createBlankScreen = async ({ screenUrl }) => {
-    const screenTemplate = blankScreen(screenUrl)
-    const screen = await createScreen(screenTemplate)
-    await addNavigationLink(screenTemplate)
+  const createBlankScreen = async ({ route }) => {
+    const screenTemplates = screenTemplating.blank({ route, screens })

-    loadNewScreen(screen)
+    const newScreens = await createScreens(screenTemplates)
+    loadNewScreen(newScreens[0])
  }

-  const createGridScreen = async () => {
-    let firstScreen = null
-
-    for (let tableOrView of selectedTablesAndViews) {
-      const screenTemplate = gridScreen(
+  const createTableScreen = async type => {
+    const screenTemplates = selectedTablesAndViews.flatMap(tableOrView =>
+      screenTemplating.table({
+        screens,
        tableOrView,
-        permissions[tableOrView.id]
+        type,
+        permissions: permissions[tableOrView.id],
+      })
    )

-      const screen = await createScreen(screenTemplate)
-      await addNavigationLink(screen)
-
-      firstScreen ??= screen
+    const newScreens = await createScreens(screenTemplates)
+    loadNewScreen(newScreens[0])
  }

-    loadNewScreen(firstScreen)
-  }
-
-  const createGridDetailsScreen = async () => {
-    let firstScreen = null
-
-    for (let tableOrView of selectedTablesAndViews) {
-      const screenTemplate = gridDetailsScreen(
+  const createFormScreen = async type => {
+    const screenTemplates = selectedTablesAndViews.flatMap(tableOrView =>
+      screenTemplating.form({
+        screens,
        tableOrView,
-        permissions[tableOrView.id]
+        type,
+        permissions: permissions[tableOrView.id],
+      })
    )

-      const screen = await createScreen(screenTemplate)
-      await addNavigationLink(screen)
+    const newScreens = await createScreens(screenTemplates)

-      firstScreen ??= screen
-    }
-
-    loadNewScreen(firstScreen)
-  }
-
-  const createFormScreen = async formType => {
-    let firstScreen = null
-
-    for (let tableOrView of selectedTablesAndViews) {
-      const screenTemplate = formScreen(
-        tableOrView,
-        formType,
-        permissions[tableOrView.id]
-      )
-
-      const screen = await createScreen(screenTemplate)
-      // Only add a navigation link for `Create`, as both `Update` and `View`
-      // require an `id` in their URL in order to function.
-      if (formType === "Create") {
-        await addNavigationLink(screen)
-      }
-
-      firstScreen ??= screen
-    }
-
-    if (formType === "Update" || formType === "Create") {
+    if (type === "update" || type === "create") {
      const associatedTour =
-        formType === "Update"
+        type === "update"
          ? TOUR_KEYS.BUILDER_FORM_VIEW_UPDATE
          : TOUR_KEYS.BUILDER_FORM_CREATE

@ -183,7 +129,7 @@
      }
    }

-    loadNewScreen(firstScreen)
+    loadNewScreen(newScreens[0])
  }

  const loadNewScreen = screen => {
@ -199,7 +145,11 @@
  }

  const fetchPermission = resourceId => {
-    permissions[resourceId] = { loading: true, read: null, write: null }
+    permissions[resourceId] = {
+      loading: true,
+      read: Roles.BASIC,
+      write: Roles.BASIC,
+    }

    permissionsStore
      .forResource(resourceId)
@ -218,8 +168,8 @@
        if (permissions[resourceId]?.loading) {
          permissions[resourceId] = {
            loading: false,
-            read: Roles.PUBLIC,
-            write: Roles.PUBLIC,
+            read: Roles.BASIC,
+            write: Roles.BASIC,
          }
        }
      })
@ -250,18 +200,31 @@
 <Modal bind:this={datasourceModal} autoFocus={false}>
  <DatasourceModal
    {selectedTablesAndViews}
-    {permissions}
    onConfirm={onSelectDatasources}
    on:toggle={handleTableOrViewToggle}
  />
 </Modal>

+<Modal bind:this={tableTypeModal}>
+  <TypeModal
+    title="Choose how you want to manage rows"
+    types={tableTypes}
+    onConfirm={createTableScreen}
+    onCancel={() => {
+      tableTypeModal.hide()
+      datasourceModal.show()
+    }}
+  />
+</Modal>
+
 <Modal bind:this={screenDetailsModal}>
  <ScreenDetailsModal onConfirm={createBlankScreen} />
 </Modal>

 <Modal bind:this={formTypeModal}>
-  <FormTypeModal
+  <TypeModal
+    title="Select form type"
+    types={formTypes}
    onConfirm={createFormScreen}
    onCancel={() => {
      formTypeModal.hide()
--- a/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/DatasourceModal.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/DatasourceModal.svelte
@ -1,14 +1,14 @@
 <script>
-  import { ModalContent, Layout, notifications, Body } from "@budibase/bbui"
+  import { Body, ModalContent, Layout, notifications } from "@budibase/bbui"
  import { datasources as datasourcesStore } from "stores/builder"
  import ICONS from "components/backend/DatasourceNavigator/icons"
  import { IntegrationNames } from "constants"
  import { createEventDispatcher, onMount } from "svelte"
  import TableOrViewOption from "./TableOrViewOption.svelte"
+  import * as format from "helpers/data/format"

  export let onConfirm
  export let selectedTablesAndViews
-  export let permissions

  const dispatch = createEventDispatcher()

@ -21,38 +21,37 @@
      icon: "Remove",
      name: view.name,
      id: view.id,
-      clientData: {
-        ...view,
-        type: "viewV2",
-        label: view.name,
-      },
+      tableSelectFormat: format.tableSelect.viewV2(view),
+      datasourceSelectFormat: format.datasourceSelect.viewV2(view),
    }))
  }

  const getTablesAndViews = datasource => {
    let tablesAndViews = []
-    const rawTables = Array.isArray(datasource.entities)
+    const tables = Array.isArray(datasource.entities)
      ? datasource.entities
      : Object.values(datasource.entities ?? {})

-    for (const rawTable of rawTables) {
-      if (rawTable._id === "ta_users") {
+    for (const table of tables) {
+      if (table._id === "ta_users") {
        continue
      }

-      const table = {
+      const formattedTable = {
        icon: "Table",
-        name: rawTable.name,
-        id: rawTable._id,
-        clientData: {
-          ...rawTable,
-          label: rawTable.name,
-          tableId: rawTable._id,
-          type: "table",
-        },
+        name: table.name,
+        id: table._id,
+        tableSelectFormat: format.tableSelect.table(table),
+        datasourceSelectFormat: format.datasourceSelect.table(
+          table,
+          $datasourcesStore.list
+        ),
      }

-      tablesAndViews = tablesAndViews.concat([table, ...getViews(rawTable)])
+      tablesAndViews = tablesAndViews.concat([
+        formattedTable,
+        ...getViews(table),
+      ])
    }

    return tablesAndViews
@ -96,11 +95,10 @@
  })
 </script>

-<span>
 <ModalContent
  title="Autogenerated screens"
-    confirmText="Confirm"
-    cancelText="Back"
+  confirmText="Next"
+  cancelText="Cancel"
  {onConfirm}
  disabled={!selectedTablesAndViews.length}
  size="L"
@ -110,14 +108,14 @@
  </Body>
  <Layout noPadding gap="S">
    {#each datasources as datasource}
-        <div class="data-source-wrap">
-          <div class="data-source-header">
+      <div class="datasource">
+        <div class="header">
          <svelte:component
            this={datasource.iconComponent}
-              height="24"
-              width="24"
+            height="18"
+            width="18"
          />
-            <div class="data-source-name">{datasource.name}</div>
+          <h2>{datasource.name}</h2>
        </div>
        <!-- List all tables -->
        {#each datasource.tablesAndViews as tableOrView}
@ -125,7 +123,6 @@
            selected => selected.id === tableOrView.id
          )}
          <TableOrViewOption
-              roles={permissions[tableOrView.id]}
            on:click={() => toggleSelection(tableOrView)}
            {selected}
            {tableOrView}
@ -135,21 +132,39 @@
    {/each}
  </Layout>
 </ModalContent>
-</span>

 <style>
-  .data-source-wrap {
-    padding-bottom: var(--spectrum-alias-item-padding-s);
+  .datasource {
+    padding-bottom: 15px;
    display: flex;
    flex-direction: column;
    grid-gap: var(--spacing-s);
    max-width: 100%;
    min-width: 0;
  }
-  .data-source-header {
+
+  .datasource:last-child {
+    padding-bottom: 0;
+  }
+
+  .header {
    display: flex;
    align-items: center;
-    gap: var(--spacing-m);
-    padding-bottom: var(--spacing-xs);
+    padding-bottom: var(--spacing-m);
+  }
+
+  .header :global(svg) {
+    flex-shrink: 0;
+  }
+
+  .header h2 {
+    padding-top: 1px;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    font-size: 14px;
+    font-weight: 400;
+    margin: 0;
+    margin-left: 10px;
  }
 </style>
--- a/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/FormTypeModal.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/FormTypeModal.svelte
@ -1,115 +0,0 @@
-<script>
-  import { ModalContent, Layout, Body, Icon } from "@budibase/bbui"
-
-  let type = null
-
-  export let onCancel = () => {}
-  export let onConfirm = () => {}
-</script>
-
-<span>
-  <ModalContent
-    title="Select form type"
-    confirmText="Done"
-    cancelText="Back"
-    onConfirm={() => onConfirm(type)}
-    {onCancel}
-    disabled={!type}
-    size="L"
-  >
-    <!-- svelte-ignore a11y-click-events-have-key-events -->
-    <!-- svelte-ignore a11y-no-static-element-interactions -->
-    <Layout noPadding gap="S">
-      <div
-        class="form-type"
-        class:selected={type === "Create"}
-        on:click={() => (type = "Create")}
-      >
-        <div class="form-type-wrap">
-          <div class="form-type-content">
-            <Body noPadding>Create a new row</Body>
-            <Body size="S">
-              For capturing and storing new data from your users
-            </Body>
-          </div>
-          {#if type === "Create"}
-            <span class="form-type-check">
-              <Icon size="S" name="CheckmarkCircle" />
-            </span>
-          {/if}
-        </div>
-      </div>
-      <div
-        class="form-type"
-        class:selected={type === "Update"}
-        on:click={() => (type = "Update")}
-      >
-        <div class="form-type-wrap">
-          <div class="form-type-content">
-            <Body noPadding>Update an existing row</Body>
-            <Body size="S">For viewing and updating existing data</Body>
-          </div>
-          {#if type === "Update"}
-            <span class="form-type-check">
-              <Icon size="S" name="CheckmarkCircle" />
-            </span>
-          {/if}
-        </div>
-      </div>
-      <div
-        class="form-type"
-        class:selected={type === "View"}
-        on:click={() => (type = "View")}
-      >
-        <div class="form-type-wrap">
-          <div class="form-type-content">
-            <Body noPadding>View an existing row</Body>
-            <Body size="S">For a read only view of your data</Body>
-          </div>
-          {#if type === "View"}
-            <span class="form-type-check">
-              <Icon size="S" name="CheckmarkCircle" />
-            </span>
-          {/if}
-        </div>
-      </div>
-    </Layout>
-  </ModalContent>
-</span>
-
-<style>
-  .form-type {
-    cursor: pointer;
-    gap: var(--spacing-s);
-    padding: var(--spacing-m) var(--spacing-xl);
-    background: var(--spectrum-alias-background-color-secondary);
-    transition: 0.3s all;
-    border: 1px solid var(--spectrum-global-color-gray-300);
-    border-radius: 4px;
-    display: flex;
-    flex-direction: column;
-  }
-  .selected,
-  .form-type:hover {
-    background: var(--spectrum-alias-background-color-tertiary);
-  }
-  .form-type-wrap {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-  }
-  .form-type :global(p:nth-child(2)) {
-    color: var(--grey-6);
-  }
-  .form-type-check {
-    margin-left: auto;
-  }
-  .form-type-check :global(.spectrum-Icon) {
-    color: var(--spectrum-global-color-green-600);
-  }
-  .form-type-content {
-    gap: var(--spacing-s);
-    display: flex;
-    flex-direction: column;
-  }
-</style>
--- a/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/TableOrViewOption.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/TableOrViewOption.svelte
@ -1,69 +1,24 @@
 <script>
-  import { Icon, AbsTooltip } from "@budibase/bbui"
-  import RoleIcon from "components/common/RoleIcon.svelte"
+  import { Icon } from "@budibase/bbui"

  export let tableOrView
-  export let roles
  export let selected = false
-
-  $: hideRoles = roles == undefined || roles?.loading
 </script>

 <!-- svelte-ignore a11y-click-events-have-key-events -->
 <div role="button" tabindex="0" class="datasource" class:selected on:click>
-  <div class="content">
  <Icon name={tableOrView.icon} />
  <span>{tableOrView.name}</span>
 </div>

-  <div class:hideRoles class="roles">
-    <AbsTooltip
-      type="info"
-      text={`Screens that only read data will be generated with access "${roles?.read?.toLowerCase()}"`}
-    >
-      <div class="role">
-        <span>read</span>
-        <RoleIcon
-          size="XS"
-          id={roles?.read}
-          disabled={roles?.loading !== false}
-        />
-      </div>
-    </AbsTooltip>
-    <AbsTooltip
-      type="info"
-      text={`Screens that write data will be generated with access "${roles?.write?.toLowerCase()}"`}
-    >
-      <div class="role">
-        <span>write</span>
-        <RoleIcon
-          size="XS"
-          id={roles?.write}
-          disabled={roles?.loading !== false}
-        />
-      </div>
-    </AbsTooltip>
-  </div>
-</div>
-
 <style>
  .datasource {
    cursor: pointer;
    border: 1px solid var(--spectrum-global-color-gray-300);
    transition: 160ms all;
    border-radius: 4px;
-    display: flex;
-    align-items: center;
    user-select: none;
-    background-color: var(--background);
-  }

-  .datasource :global(svg) {
-    transition: 160ms all;
-    color: var(--spectrum-global-color-gray-600);
-  }
-
-  .content {
    padding: var(--spectrum-alias-item-padding-s);
    display: flex;
    align-items: center;
@ -71,7 +26,12 @@
    min-width: 0;
  }

-  .content span {
+  .datasource :global(svg) {
+    transition: 160ms all;
+    color: var(--spectrum-global-color-gray-600);
+  }
+
+  .datasource span {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
@ -84,29 +44,4 @@
  .selected {
    border: 1px solid var(--blue) !important;
  }
-
-  .roles {
-    margin-left: auto;
-    display: flex;
-    flex-direction: column;
-    align-items: end;
-    padding-right: var(--spectrum-alias-item-padding-s);
-    opacity: 0.5;
-    transition: opacity 160ms;
-  }
-
-  .hideRoles {
-    opacity: 0;
-    pointer-events: none;
-  }
-
-  .role {
-    display: flex;
-    align-items: center;
-  }
-
-  .role span {
-    font-size: 11px;
-    margin-right: 5px;
-  }
 </style>
--- a/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/TypeModal.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/TypeModal.svelte
@ -0,0 +1,82 @@
+<script>
+  import { ModalContent, Layout, Body } from "@budibase/bbui"
+
+  let selectedType = null
+
+  export let title
+  export let types
+  export let onCancel = () => {}
+  export let onConfirm = () => {}
+</script>
+
+<ModalContent
+  {title}
+  confirmText="Done"
+  cancelText="Back"
+  onConfirm={() => onConfirm(selectedType)}
+  {onCancel}
+  disabled={!selectedType}
+  size="L"
+>
+  <!-- svelte-ignore a11y-click-events-have-key-events -->
+  <!-- svelte-ignore a11y-no-static-element-interactions -->
+  <Layout noPadding gap="S">
+    {#each types as type}
+      <div
+        class="type"
+        class:selected={selectedType === type.id}
+        on:click={() => (selectedType = type.id)}
+      >
+        <div class="image">
+          <img alt={type.img.alt} src={type.img.src} />
+        </div>
+        <div class="typeContent">
+          <Body noPadding>{type.title}</Body>
+          <Body size="S">{type.description}</Body>
+        </div>
+      </div>
+    {/each}
+  </Layout>
+</ModalContent>
+
+<style>
+  .type {
+    cursor: pointer;
+    gap: var(--spacing-s);
+    background: var(--spectrum-alias-background-color-secondary);
+    transition: 0.3s all;
+    border: 1px solid var(--spectrum-global-color-gray-300);
+    border-radius: 4px;
+    display: flex;
+    overflow: hidden;
+  }
+
+  .type:hover {
+    border: 1px solid var(--grey-5);
+  }
+
+  .type.selected {
+    border: 1px solid var(--blue);
+  }
+  .type :global(p:nth-child(2)) {
+    color: var(--grey-6);
+  }
+  .typeContent {
+    box-sizing: border-box;
+    padding: var(--spacing-m) var(--spacing-xl);
+    flex-grow: 1;
+    gap: var(--spacing-s);
+    display: flex;
+    flex-direction: column;
+  }
+
+  .image {
+    min-width: 133px;
+    height: 73px;
+    background-color: var(--grey-2);
+  }
+
+  .image img {
+    height: 100%;
+  }
+</style>
--- a/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/formTypes.js
+++ b/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/formTypes.js
@ -0,0 +1,35 @@
+import formView from "./images/formView.svg"
+import formUpdate from "./images/formUpdate.svg"
+import formCreate from "./images/formCreate.svg"
+
+const tableTypes = [
+  {
+    id: "create",
+    img: {
+      alt: "A form containing new data",
+      src: formCreate,
+    },
+    title: "Create a new row",
+    description: "For capturing and storing new data from your users",
+  },
+  {
+    id: "update",
+    img: {
+      alt: "A form containing edited data",
+      src: formUpdate,
+    },
+    title: "Update an existing row",
+    description: "For viewing and updating existing data",
+  },
+  {
+    id: "view",
+    img: {
+      alt: "A form containing read-only data",
+      src: formView,
+    },
+    title: "View an existing row",
+    description: "For a read only view of your data",
+  },
+]
+
+export default tableTypes
--- a/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/blank.png
+++ b/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/blank.png
--- a/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/blank.svg
+++ b/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/blank.svg
@ -0,0 +1,15 @@
+<svg width="118" height="65" viewBox="0 0 118 65" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="118" height="65" fill="#34BB84"/>
+<rect width="118" height="65" fill="#34BB84"/>
+<mask id="path-3-inside-1_51_2" fill="white">
+<path d="M22 12H94V65H22V12Z"/>
+</mask>
+<path d="M22 12H94V65H22V12Z" fill="url(#paint0_linear_51_2)"/>
+<path d="M22 12V11H21V12H22ZM94 12H95V11H94V12ZM22 13H94V11H22V13ZM93 12V65H95V12H93ZM23 65V12H21V65H23Z" fill="white" fill-opacity="0.2" mask="url(#path-3-inside-1_51_2)"/>
+<defs>
+<linearGradient id="paint0_linear_51_2" x1="22" y1="12" x2="92.4561" y2="66.9785" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.8"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+</defs>
+</svg>
--- a/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/form.png
+++ b/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/form.png
--- a/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/formCreate.svg
+++ b/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/formCreate.svg
@ -0,0 +1,20 @@
+<svg width="118" height="65" viewBox="0 0 118 65" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="118" height="65" fill="#FD4F01"/>
+<rect width="118" height="65" fill="#FD4F01"/>
+<mask id="path-3-inside-1_49_949" fill="white">
+<path d="M22 12H94V65H22V12Z"/>
+</mask>
+<path d="M22 12H94V65H22V12Z" fill="url(#paint0_linear_49_949)"/>
+<path d="M22 12V11H21V12H22ZM94 12H95V11H94V12ZM22 13H94V11H22V13ZM93 12V65H95V12H93ZM23 65V12H21V65H23Z" fill="white" fill-opacity="0.2" mask="url(#path-3-inside-1_49_949)"/>
+<rect x="46" y="29" width="15" height="4" fill="white" fill-opacity="0.97"/>
+<rect x="46" y="45" width="15" height="4" fill="white" fill-opacity="0.97"/>
+<rect x="46" y="35" width="25" height="6" fill="white" fill-opacity="0.97"/>
+<rect x="46" y="51" width="25" height="6" fill="white" fill-opacity="0.97"/>
+<path d="M46 21H71V25H46V21Z" fill="white" fill-opacity="0.97"/>
+<defs>
+<linearGradient id="paint0_linear_49_949" x1="22" y1="12" x2="92.4561" y2="66.9785" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.6"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+</defs>
+</svg>
--- a/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/formUpdate.svg
+++ b/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/formUpdate.svg
@ -0,0 +1,20 @@
+<svg width="118" height="65" viewBox="0 0 118 65" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="118" height="65" fill="#FD4F01"/>
+<rect width="118" height="65" fill="#FD4F01"/>
+<mask id="path-3-inside-1_49_940" fill="white">
+<path d="M22 12H94V65H22V12Z"/>
+</mask>
+<path d="M22 12H94V65H22V12Z" fill="url(#paint0_linear_49_940)"/>
+<path d="M22 12V11H21V12H22ZM94 12H95V11H94V12ZM22 13H94V11H22V13ZM93 12V65H95V12H93ZM23 65V12H21V65H23Z" fill="white" fill-opacity="0.2" mask="url(#path-3-inside-1_49_940)"/>
+<rect x="46" y="29" width="15" height="4" fill="white" fill-opacity="0.97"/>
+<rect x="46" y="45" width="15" height="4" fill="white" fill-opacity="0.5"/>
+<rect x="46" y="35" width="25" height="6" fill="white" fill-opacity="0.97"/>
+<path d="M46 21H71V25H46V21Z" fill="white" fill-opacity="0.5"/>
+<rect x="46" y="51" width="25" height="6" fill="white" fill-opacity="0.5"/>
+<defs>
+<linearGradient id="paint0_linear_49_940" x1="22" y1="12" x2="92.4561" y2="66.9785" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.6"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+</defs>
+</svg>
--- a/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/formView.svg
+++ b/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/formView.svg
@ -0,0 +1,20 @@
+<svg width="118" height="65" viewBox="0 0 118 65" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="118" height="65" fill="#FD4F01"/>
+<rect width="118" height="65" fill="#FD4F01"/>
+<mask id="path-3-inside-1_49_931" fill="white">
+<path d="M22 12H94V65H22V12Z"/>
+</mask>
+<path d="M22 12H94V65H22V12Z" fill="url(#paint0_linear_49_931)"/>
+<path d="M22 12V11H21V12H22ZM94 12H95V11H94V12ZM22 13H94V11H22V13ZM93 12V65H95V12H93ZM23 65V12H21V65H23Z" fill="white" fill-opacity="0.2" mask="url(#path-3-inside-1_49_931)"/>
+<rect x="46" y="29" width="15" height="4" fill="white" fill-opacity="0.5"/>
+<rect x="46" y="45" width="15" height="4" fill="white" fill-opacity="0.5"/>
+<rect x="46" y="35" width="25" height="6" fill="white" fill-opacity="0.5"/>
+<path d="M46 21H71V25H46V21Z" fill="white" fill-opacity="0.5"/>
+<rect x="46" y="51" width="25" height="6" fill="white" fill-opacity="0.5"/>
+<defs>
+<linearGradient id="paint0_linear_49_931" x1="22" y1="12" x2="92.4561" y2="66.9785" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.6"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+</defs>
+</svg>
--- a/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/grid.png
+++ b/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/grid.png
--- a/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/table.png
+++ b/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/table.png
--- a/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/tableDetails.png
+++ b/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/tableDetails.png
--- a/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/tableInline.png
+++ b/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/tableInline.png
--- a/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/tableInline.svg
+++ b/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/tableInline.svg
@ -0,0 +1,44 @@
+<svg width="118" height="65" viewBox="0 0 118 65" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="118" height="65" fill="#765FFE"/>
+<mask id="path-2-inside-1_4_100" fill="white">
+<path d="M22 12H94V65H22V12Z"/>
+</mask>
+<path d="M22 12H94V65H22V12Z" fill="url(#paint0_linear_4_100)"/>
+<path d="M22 12V11H21V12H22ZM94 12H95V11H94V12ZM22 13H94V11H22V13ZM93 12V65H95V12H93ZM23 65V12H21V65H23Z" fill="white" fill-opacity="0.2" mask="url(#path-2-inside-1_4_100)"/>
+<path d="M35.6901 23.0003H44.8169V28.0003H35.6901V23.0003Z" fill="white" fill-opacity="0.9"/>
+<path d="M35.6901 28.5004H44.8169V33.5004H35.6901V28.5004Z" fill="white" fill-opacity="0.5"/>
+<path d="M35.6901 34H44.8169V39H35.6901V34Z" fill="white" fill-opacity="0.5"/>
+<path d="M35.6901 39.5002H44.8169V44.5002H35.6901V39.5002Z" fill="white" fill-opacity="0.5"/>
+<path d="M35.6901 45.0003H44.8169V50.0003H35.6901V45.0003Z" fill="white" fill-opacity="0.5"/>
+<path d="M35.6901 50.5004H44.8169V55.5004H35.6901V50.5004Z" fill="white" fill-opacity="0.5"/>
+<path d="M45.3234 23.0003H54.4502V28.0003H45.3234V23.0003Z" fill="white" fill-opacity="0.9"/>
+<path d="M45.3234 28.5004H54.4502V33.5004H45.3234V28.5004Z" fill="white" fill-opacity="0.5"/>
+<path d="M45.3234 34H54.4502V39H45.3234V34Z" fill="white" fill-opacity="0.5"/>
+<path d="M45.3234 39.5002H54.4502V44.5002H45.3234V39.5002Z" fill="white" fill-opacity="0.5"/>
+<path d="M45.3234 45.0003H54.4502V50.0003H45.3234V45.0003Z" fill="white" fill-opacity="0.5"/>
+<path d="M45.3234 50.5004H54.4502V55.5004H45.3234V50.5004Z" fill="white" fill-opacity="0.5"/>
+<path d="M54.9576 23.0003H64.0844V28.0003H54.9576V23.0003Z" fill="white" fill-opacity="0.9"/>
+<path d="M54.9576 28.5004H64.0844V33.5004H54.9576V28.5004Z" fill="white" fill-opacity="0.5"/>
+<path d="M54.9576 34H64.0844V39H54.9576V34Z" fill="white" fill-opacity="0.5"/>
+<path d="M54.9576 39.5002H64.0844V44.5002H54.9576V39.5002Z" fill="white" fill-opacity="0.5"/>
+<path d="M54.9576 45.0003H64.0844V50.0003H54.9576V45.0003Z" fill="white" fill-opacity="0.5"/>
+<path d="M54.9576 50.5004H64.0844V55.5004H54.9576V50.5004Z" fill="white" fill-opacity="0.5"/>
+<path d="M64.5915 23.0003H73.7183V28.0003H64.5915V23.0003Z" fill="white" fill-opacity="0.9"/>
+<path d="M64.5915 28.5004H73.7183V33.5004H64.5915V28.5004Z" fill="white" fill-opacity="0.5"/>
+<path d="M64.5915 34H73.7183V39H64.5915V34Z" fill="white" fill-opacity="0.5"/>
+<path d="M64.5915 39.5002H73.7183V44.5002H64.5915V39.5002Z" fill="white" fill-opacity="0.5"/>
+<path d="M64.5915 45.0003H73.7183V50.0003H64.5915V45.0003Z" fill="white" fill-opacity="0.5"/>
+<path d="M64.5915 50.5004H73.7183V55.5004H64.5915V50.5004Z" fill="white" fill-opacity="0.5"/>
+<path d="M74.2253 23.0003H83.3521V28.0003H74.2253V23.0003Z" fill="white" fill-opacity="0.9"/>
+<path d="M74.2253 28.5004H83.3521V33.5004H74.2253V28.5004Z" fill="white" fill-opacity="0.5"/>
+<path d="M74.2253 34H83.3521V39H74.2253V34Z" fill="white" fill-opacity="0.5"/>
+<path d="M74.2253 39.5002H83.3521V44.5002H74.2253V39.5002Z" fill="white" fill-opacity="0.5"/>
+<path d="M74.2253 45.0003H83.3521V50.0003H74.2253V45.0003Z" fill="white" fill-opacity="0.5"/>
+<path d="M74.2253 50.5004H83.3521V55.5004H74.2253V50.5004Z" fill="white" fill-opacity="0.5"/>
+<defs>
+<linearGradient id="paint0_linear_4_100" x1="22" y1="12" x2="92.4561" y2="66.9785" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.6"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+</defs>
+</svg>
--- a/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/tableModal.svg
+++ b/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/tableModal.svg
@ -0,0 +1,28 @@
+<svg width="118" height="65" viewBox="0 0 118 65" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="118" height="65" fill="#765FFE"/>
+<mask id="path-2-inside-1_4_138" fill="white">
+<path d="M22 12H94V65H22V12Z"/>
+</mask>
+<path d="M22 12H94V65H22V12Z" fill="url(#paint0_linear_4_138)"/>
+<path d="M22 12V11H21V12H22ZM94 12H95V11H94V12ZM22 13H94V11H22V13ZM93 12V65H95V12H93ZM23 65V12H21V65H23Z" fill="white" fill-opacity="0.2" mask="url(#path-2-inside-1_4_138)"/>
+<g filter="url(#filter0_d_4_138)">
+<rect x="42" y="17" width="33" height="44" fill="white" fill-opacity="0.4" shape-rendering="crispEdges"/>
+<rect x="42.5" y="17.5" width="32" height="43" stroke="white" stroke-opacity="0.3" shape-rendering="crispEdges"/>
+</g>
+<defs>
+<filter id="filter0_d_4_138" x="39" y="15" width="39" height="50" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dy="1"/>
+<feGaussianBlur stdDeviation="1.5"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.2 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_4_138"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_4_138" result="shape"/>
+</filter>
+<linearGradient id="paint0_linear_4_138" x1="22" y1="12" x2="92.4561" y2="66.9785" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.6"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+</defs>
+</svg>
--- a/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/tableNewScreen.svg
+++ b/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/tableNewScreen.svg
@ -0,0 +1,20 @@
+<svg width="118" height="65" viewBox="0 0 118 65" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="118" height="65" fill="#765FFE"/>
+<rect width="118" height="65" fill="#765FFE"/>
+<mask id="path-3-inside-1_56_20" fill="white">
+<path d="M22 12H94V65H22V12Z"/>
+</mask>
+<path d="M22 12H94V65H22V12Z" fill="url(#paint0_linear_56_20)"/>
+<path d="M22 12V11H21V12H22ZM94 12H95V11H94V12ZM22 13H94V11H22V13ZM93 12V65H95V12H93ZM23 65V12H21V65H23Z" fill="white" fill-opacity="0.2" mask="url(#path-3-inside-1_56_20)"/>
+<rect x="46" y="29" width="15" height="4" fill="white" fill-opacity="0.97"/>
+<rect x="46" y="45" width="15" height="4" fill="white" fill-opacity="0.5"/>
+<rect x="46" y="35" width="25" height="6" fill="white" fill-opacity="0.97"/>
+<path d="M46 21H71V25H46V21Z" fill="white" fill-opacity="0.5"/>
+<rect x="46" y="51" width="25" height="6" fill="white" fill-opacity="0.5"/>
+<defs>
+<linearGradient id="paint0_linear_56_20" x1="22" y1="12" x2="92.4561" y2="66.9785" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.6"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+</defs>
+</svg>
--- a/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/tableSidePanel.svg
+++ b/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/images/tableSidePanel.svg
@ -0,0 +1,28 @@
+<svg width="118" height="65" viewBox="0 0 118 65" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="118" height="65" fill="#765FFE"/>
+<mask id="path-2-inside-1_4_103" fill="white">
+<path d="M22 12H94V65H22V12Z"/>
+</mask>
+<path d="M22 12H94V65H22V12Z" fill="url(#paint0_linear_4_103)"/>
+<path d="M22 12V11H21V12H22ZM94 12H95V11H94V12ZM22 13H94V11H22V13ZM93 12V65H95V12H93ZM23 65V12H21V65H23Z" fill="white" fill-opacity="0.2" mask="url(#path-2-inside-1_4_103)"/>
+<g filter="url(#filter0_d_4_103)">
+<rect x="70" y="17" width="20" height="44" fill="white" fill-opacity="0.4" shape-rendering="crispEdges"/>
+<rect x="70.5" y="17.5" width="19" height="43" stroke="white" stroke-opacity="0.3" shape-rendering="crispEdges"/>
+</g>
+<defs>
+<filter id="filter0_d_4_103" x="67" y="15" width="26" height="50" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dy="1"/>
+<feGaussianBlur stdDeviation="1.5"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_4_103"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_4_103" result="shape"/>
+</filter>
+<linearGradient id="paint0_linear_4_103" x1="22" y1="12" x2="92.4561" y2="66.9785" gradientUnits="userSpaceOnUse">
+<stop stop-color="white" stop-opacity="0.6"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+</defs>
+</svg>
--- a/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/index.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/index.svelte
@ -1,10 +1,9 @@
 <script>
  import { Body } from "@budibase/bbui"
  import CreationPage from "components/common/CreationPage.svelte"
-  import blankImage from "./images/blank.png"
-  import tableInline from "./images/tableInline.png"
-  import tableDetails from "./images/tableDetails.png"
-  import formImage from "./images/form.png"
+  import blank from "./images/blank.svg"
+  import table from "./images/tableInline.svg"
+  import form from "./images/formUpdate.svg"
  import CreateScreenModal from "./CreateScreenModal.svelte"
  import { screenStore } from "stores/builder"

@ -30,37 +29,27 @@
    <div class="cards">
      <div class="card" on:click={() => createScreenModal.show("blank")}>
        <div class="image">
-          <img alt="" src={blankImage} />
+          <img alt="A blank screen" src={blank} />
        </div>
        <div class="text">
-          <Body size="S">Blank screen</Body>
+          <Body size="S">Blank</Body>
          <Body size="XS">Add an empty blank screen</Body>
        </div>
      </div>

-      <div class="card" on:click={() => createScreenModal.show("grid")}>
+      <div class="card" on:click={() => createScreenModal.show("table")}>
        <div class="image">
-          <img alt="" src={tableInline} />
+          <img alt="A table of data" src={table} />
        </div>
        <div class="text">
-          <Body size="S">Table with inline editing</Body>
-          <Body size="XS">View, edit and delete rows inline</Body>
-        </div>
-      </div>
-
-      <div class="card" on:click={() => createScreenModal.show("gridDetails")}>
-        <div class="image">
-          <img alt="" src={tableDetails} />
-        </div>
-        <div class="text">
-          <Body size="S">Table with details panel</Body>
-          <Body size="XS">Manage your row details in a side panel</Body>
+          <Body size="S">Table</Body>
+          <Body size="XS">List rows in a table</Body>
        </div>
      </div>

      <div class="card" on:click={() => createScreenModal.show("form")}>
        <div class="image">
-          <img alt="" src={formImage} />
+          <img alt="A form containing data" src={form} />
        </div>
        <div class="text">
          <Body size="S">Form</Body>
@ -114,8 +103,9 @@
  }

  .card .image {
-    min-height: 130px;
    min-width: 235px;
+    height: 127px;
+    background-color: var(--grey-2);
  }

  .text {
--- a/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/tableTypes.js
+++ b/packages/builder/src/pages/builder/app/[application]/design/_components/NewScreen/tableTypes.js
@ -0,0 +1,45 @@
+import tableInline from "./images/tableInline.svg"
+import tableSidePanel from "./images/tableSidePanel.svg"
+import tableModal from "./images/tableModal.svg"
+import tableNewScreen from "./images/tableNewScreen.svg"
+
+const tableTypes = [
+  {
+    id: "inline",
+    img: {
+      alt: "A table of data",
+      src: tableInline,
+    },
+    title: "Inline",
+    description: "Manage data directly on your table",
+  },
+  {
+    id: "sidePanel",
+    img: {
+      alt: "A side panel",
+      src: tableSidePanel,
+    },
+    title: "Side panel",
+    description: "Open row details in a side panel",
+  },
+  {
+    id: "modal",
+    img: {
+      alt: "A modal",
+      src: tableModal,
+    },
+    title: "Modal",
+    description: "Open row details in a modal",
+  },
+  {
+    id: "newScreen",
+    img: {
+      alt: "A new screen",
+      src: tableNewScreen,
+    },
+    title: "New screen",
+    description: "View row details on a separate screen",
+  },
+]
+
+export default tableTypes
--- a/packages/builder/src/pages/builder/portal/_components/UpgradeButton.svelte
+++ b/packages/builder/src/pages/builder/portal/_components/UpgradeButton.svelte
@ -2,11 +2,10 @@
  import { Button } from "@budibase/bbui"
  import { goto } from "@roxi/routify"
  import { auth, admin, licensing } from "stores/portal"
-  import { isEnabled, TENANT_FEATURE_FLAGS } from "helpers/featureFlags"
  import { sdk } from "@budibase/shared-core"
 </script>

-{#if isEnabled(TENANT_FEATURE_FLAGS.LICENSING) && !$licensing.isEnterprisePlan && !$licensing.isEnterpriseTrial}
+{#if !$licensing.isEnterprisePlan && !$licensing.isEnterpriseTrial}
  {#if $admin.cloud && $auth?.user?.accountPortalAccess}
    <Button
      cta
--- a/packages/builder/src/stores/builder/tests/fixtures/index.js
+++ b/packages/builder/src/stores/builder/tests/fixtures/index.js
@ -1,6 +1,6 @@
 import { v4 } from "uuid"
 import { Component } from "templates/Component"
-import { Screen } from "templates/Screen"
+import { Screen } from "templates/screenTemplating/Screen"
 import { get } from "svelte/store"
 import {
  BUDIBASE_INTERNAL_DB_ID,
--- a/packages/builder/src/stores/portal/licensing.js
+++ b/packages/builder/src/stores/portal/licensing.js
@ -3,7 +3,6 @@ import { API } from "api"
 import { auth, admin } from "stores/portal"
 import { Constants } from "@budibase/frontend-core"
 import { StripeStatus } from "components/portal/licensing/constants"
-import { TENANT_FEATURE_FLAGS, isEnabled } from "helpers/featureFlags"
 import { PlanModel } from "@budibase/types"

 const UNLIMITED = -1
@ -183,7 +182,6 @@ export const createLicensingStore = () => {
      return usersLimitExceeded(userCount, get(store).userLimit)
    },
    setUsageMetrics: async () => {
-      if (isEnabled(TENANT_FEATURE_FLAGS.LICENSING)) {
      const usage = get(store).quotaUsage
      const license = get(auth).user.license
      const now = new Date()
@ -269,7 +267,6 @@ export const createLicensingStore = () => {
          errUserLimit,
        }
      })
-      }
    },
  }

--- a/packages/builder/src/stores/portal/menu.js
+++ b/packages/builder/src/stores/portal/menu.js
@ -1,5 +1,4 @@
 import { derived } from "svelte/store"
-import { isEnabled, TENANT_FEATURE_FLAGS } from "helpers/featureFlags"
 import { admin } from "./admin"
 import { auth } from "./auth"
 import { sdk } from "@budibase/shared-core"
@ -15,12 +14,10 @@ export const menu = derived([admin, auth], ([$admin, $auth]) => {
      href: "/builder/portal/users/users",
    },
  ]
-  if (isEnabled(TENANT_FEATURE_FLAGS.USER_GROUPS)) {
  userSubPages.push({
    title: "Groups",
    href: "/builder/portal/users/groups",
  })
-  }

  // Pages that all devs and admins can access
  let menu = [
@ -83,7 +80,6 @@ export const menu = derived([admin, auth], ([$admin, $auth]) => {
  }

  // Add account page
-  if (isEnabled(TENANT_FEATURE_FLAGS.LICENSING)) {
  let accountSubPages = [
    {
      title: "Usage",
@ -126,7 +122,6 @@ export const menu = derived([admin, auth], ([$admin, $auth]) => {
    href: "/builder/portal/account",
    subPages: accountSubPages,
  })
-  }

  return menu
 })
--- a/packages/builder/src/templates/Component.js
+++ b/packages/builder/src/templates/Component.js
@ -2,11 +2,11 @@ import { Helpers } from "@budibase/bbui"
 import { BaseStructure } from "./BaseStructure"

 export class Component extends BaseStructure {
-  constructor(name) {
+  constructor(name, _id = Helpers.uuid()) {
    super(false)
    this._children = []
    this._json = {
-      _id: Helpers.uuid(),
+      _id,
      _component: name,
      _styles: {
        normal: {},
@ -50,4 +50,8 @@ export class Component extends BaseStructure {
    this._json.text = text
    return this
  }
+
+  getId() {
+    return this._json._id
+  }
 }
--- a/packages/builder/src/templates/blankScreen.js
+++ b/packages/builder/src/templates/blankScreen.js
@ -1,11 +0,0 @@
-import { Screen } from "./Screen"
-
-const blankScreen = route => {
-  return new Screen()
-    .instanceName("New Screen")
-    .customProps({ layout: "grid" })
-    .route(route)
-    .json()
-}
-
-export default blankScreen
--- a/packages/builder/src/templates/formScreen.js
+++ b/packages/builder/src/templates/formScreen.js
@ -1,49 +0,0 @@
-import { Screen } from "./Screen"
-import { Component } from "./Component"
-import sanitizeUrl from "helpers/sanitizeUrl"
-
-export const FORM_TEMPLATE = "FORM_TEMPLATE"
-export const formUrl = (tableOrView, actionType) => {
-  if (actionType === "Create") {
-    return sanitizeUrl(`/${tableOrView.name}/new`)
-  } else if (actionType === "Update") {
-    return sanitizeUrl(`/${tableOrView.name}/edit/:id`)
-  } else if (actionType === "View") {
-    return sanitizeUrl(`/${tableOrView.name}/view/:id`)
-  }
-}
-
-export const getRole = (permissions, actionType) => {
-  if (actionType === "View") {
-    return permissions.read
-  }
-
-  return permissions.write
-}
-
-const generateMultistepFormBlock = (tableOrView, actionType) => {
-  const multistepFormBlock = new Component(
-    "@budibase/standard-components/multistepformblock"
-  )
-  multistepFormBlock
-    .customProps({
-      actionType,
-      dataSource: tableOrView.clientData,
-      steps: [{}],
-      rowId: actionType === "new" ? undefined : `{{ url.id }}`,
-    })
-    .instanceName(`${tableOrView.name} - Multistep Form block`)
-  return multistepFormBlock
-}
-
-const createScreen = (tableOrView, actionType, permissions) => {
-  return new Screen()
-    .route(formUrl(tableOrView, actionType))
-    .instanceName(`${tableOrView.name} - Form`)
-    .role(getRole(permissions, actionType))
-    .autoTableId(tableOrView.id)
-    .addChild(generateMultistepFormBlock(tableOrView, actionType))
-    .json()
-}
-
-export default createScreen
--- a/packages/builder/src/templates/gridScreen.js
+++ b/packages/builder/src/templates/gridScreen.js
@ -1,30 +0,0 @@
-import sanitizeUrl from "helpers/sanitizeUrl"
-import { Screen } from "./Screen"
-import { Component } from "./Component"
-
-const gridUrl = tableOrView => sanitizeUrl(`/${tableOrView.name}`)
-
-const createScreen = (tableOrView, permissions) => {
-  const heading = new Component("@budibase/standard-components/heading")
-    .instanceName("Table heading")
-    .customProps({
-      text: tableOrView.name,
-    })
-
-  const gridBlock = new Component("@budibase/standard-components/gridblock")
-    .instanceName(`${tableOrView.name} - Table`)
-    .customProps({
-      table: tableOrView.clientData,
-    })
-
-  return new Screen()
-    .route(gridUrl(tableOrView))
-    .instanceName(`${tableOrView.name} - List`)
-    .role(permissions.write)
-    .autoTableId(tableOrView.id)
-    .addChild(heading)
-    .addChild(gridBlock)
-    .json()
-}
-
-export default createScreen
--- a/packages/builder/src/templates/screenTemplating/Screen.js
+++ b/packages/builder/src/templates/screenTemplating/Screen.js
@ -1,4 +1,4 @@
-import { BaseStructure } from "./BaseStructure"
+import { BaseStructure } from "../BaseStructure"
 import { Helpers } from "@budibase/bbui"

 export class Screen extends BaseStructure {
--- a/packages/builder/src/templates/screenTemplating/blank.js
+++ b/packages/builder/src/templates/screenTemplating/blank.js
@ -0,0 +1,25 @@
+import { Screen } from "./Screen"
+import { capitalise } from "helpers"
+import getValidRoute from "./getValidRoute"
+import { Roles } from "constants/backend"
+
+const blank = ({ route, screens }) => {
+  const validRoute = getValidRoute(screens, route, Roles.BASIC)
+
+  const template = new Screen()
+    .instanceName("Blank screen")
+    .customProps({ layout: "grid" })
+    .role(Roles.BASIC)
+    .route(validRoute)
+    .json()
+
+  return [
+    {
+      data: template,
+      navigationLinkLabel:
+        validRoute === "/" ? null : capitalise(validRoute.split("/")[1]),
+    },
+  ]
+}
+
+export default blank
--- a/packages/builder/src/templates/screenTemplating/form.js
+++ b/packages/builder/src/templates/screenTemplating/form.js
@ -0,0 +1,67 @@
+import { Screen } from "./Screen"
+import { Component } from "../Component"
+import getValidRoute from "./getValidRoute"
+
+export const getTypeSpecificRoute = (tableOrView, type) => {
+  if (type === "create") {
+    return `/${tableOrView.name}/new`
+  } else if (type === "update") {
+    return `/${tableOrView.name}/edit/:id`
+  } else if (type === "view") {
+    return `/${tableOrView.name}/view/:id`
+  }
+}
+
+const getRole = (permissions, type) => {
+  if (type === "view") {
+    return permissions.read
+  }
+
+  return permissions.write
+}
+
+const getActionType = type => {
+  if (type === "create") {
+    return "Create"
+  }
+  if (type === "update") {
+    return "Update"
+  }
+  if (type === "view") {
+    return "View"
+  }
+}
+
+const form = ({ tableOrView, type, permissions, screens }) => {
+  const typeSpecificRoute = getTypeSpecificRoute(tableOrView, type)
+  const role = getRole(permissions, type)
+
+  const multistepFormBlock = new Component(
+    "@budibase/standard-components/multistepformblock"
+  )
+    .customProps({
+      actionType: getActionType(type),
+      dataSource: tableOrView.tableSelectFormat,
+      steps: [{}],
+      rowId: type === "new" ? undefined : `{{ url.id }}`,
+    })
+    .instanceName(`${tableOrView.name} - Multistep Form block`)
+
+  const template = new Screen()
+    .route(getValidRoute(screens, typeSpecificRoute, role))
+    .instanceName(`${tableOrView.name} - Form`)
+    .role(role)
+    .autoTableId(tableOrView.id)
+    .addChild(multistepFormBlock)
+    .json()
+
+  return [
+    {
+      data: template,
+      navigationLinkLabel:
+        type === "create" ? `Create ${tableOrView.name}` : null,
+    },
+  ]
+}
+
+export default form
--- a/packages/builder/src/templates/screenTemplating/getValidRoute.js
+++ b/packages/builder/src/templates/screenTemplating/getValidRoute.js
@ -0,0 +1,35 @@
+import sanitizeUrl from "helpers/sanitizeUrl"
+
+const arbitraryMax = 10000
+
+const isScreenUrlValid = (screens, url, role) => {
+  return !screens.some(
+    screen => screen.routing?.route === url && screen.routing?.roleId === role
+  )
+}
+
+const getValidScreenUrl = (screens, url, role) => {
+  const [firstPathSegment = "", ...restPathSegments] = url
+    .split("/")
+    .filter(segment => segment !== "")
+
+  const restOfPath =
+    restPathSegments.length > 0 ? `/${restPathSegments.join("/")}` : ""
+
+  const naiveUrl = sanitizeUrl(`/${firstPathSegment}${restOfPath}`)
+  if (isScreenUrlValid(screens, naiveUrl, role)) {
+    return naiveUrl
+  }
+
+  for (let suffix = 2; suffix < arbitraryMax; suffix++) {
+    const suffixedUrl = sanitizeUrl(
+      `/${firstPathSegment}-${suffix}${restOfPath}`
+    )
+
+    if (isScreenUrlValid(screens, suffixedUrl, role)) {
+      return suffixedUrl
+    }
+  }
+}
+
+export default getValidScreenUrl
--- a/packages/builder/src/templates/screenTemplating/index.js
+++ b/packages/builder/src/templates/screenTemplating/index.js
@ -0,0 +1,3 @@
+export { default as blank } from "./blank"
+export { default as form } from "./form"
+export { default as table } from "./table"
--- a/packages/builder/src/templates/screenTemplating/table/index.js
+++ b/packages/builder/src/templates/screenTemplating/table/index.js
@ -0,0 +1,25 @@
+import inline from "./inline"
+import modal from "./modal"
+import sidePanel from "./sidePanel"
+import newScreen from "./newScreen"
+
+const createScreen = ({ tableOrView, type, permissions, screens }) => {
+  if (type === "inline") {
+    return inline({ tableOrView, permissions, screens })
+  }
+  if (type === "modal") {
+    return modal({ tableOrView, permissions, screens })
+  }
+
+  if (type === "sidePanel") {
+    return sidePanel({ tableOrView, permissions, screens })
+  }
+
+  if (type === "newScreen") {
+    return newScreen({ tableOrView, permissions, screens })
+  }
+
+  throw new Error(`Unrecognized table type ${type}`)
+}
+
+export default createScreen
--- a/packages/builder/src/templates/screenTemplating/table/inline.js
+++ b/packages/builder/src/templates/screenTemplating/table/inline.js
@ -0,0 +1,36 @@
+import { Screen } from "../Screen"
+import { Component } from "../../Component"
+import { capitalise } from "helpers"
+import getValidRoute from "../getValidRoute"
+
+const inline = ({ tableOrView, permissions, screens }) => {
+  const heading = new Component("@budibase/standard-components/heading")
+    .instanceName("Table heading")
+    .customProps({
+      text: tableOrView.name,
+    })
+
+  const tableBlock = new Component("@budibase/standard-components/gridblock")
+    .instanceName(`${tableOrView.name} - Table`)
+    .customProps({
+      table: tableOrView.datasourceSelectFormat,
+    })
+
+  const screenTemplate = new Screen()
+    .route(getValidRoute(screens, tableOrView.name, permissions.write))
+    .instanceName(`${tableOrView.name} - List`)
+    .role(permissions.write)
+    .autoTableId(tableOrView.id)
+    .addChild(heading)
+    .addChild(tableBlock)
+    .json()
+
+  return [
+    {
+      data: screenTemplate,
+      navigationLinkLabel: capitalise(tableOrView.name),
+    },
+  ]
+}
+
+export default inline
--- a/packages/builder/src/templates/screenTemplating/table/modal.js
+++ b/packages/builder/src/templates/screenTemplating/table/modal.js
@ -0,0 +1,157 @@
+import { Screen } from "../Screen"
+import { Component } from "../../Component"
+import { generate } from "shortid"
+import { makePropSafe as safe } from "@budibase/string-templates"
+import { Utils } from "@budibase/frontend-core"
+import { capitalise } from "helpers"
+import getValidRoute from "../getValidRoute"
+
+const modal = ({ tableOrView, permissions, screens }) => {
+  /*
+    Create Row
+   */
+  const createRowModal = new Component("@budibase/standard-components/modal")
+    .instanceName("New row modal")
+    .customProps({
+      size: "large",
+    })
+
+  const buttonGroup = new Component("@budibase/standard-components/buttongroup")
+  const createButton = new Component("@budibase/standard-components/button")
+
+  createButton.customProps({
+    onClick: [
+      {
+        id: 0,
+        "##eventHandlerType": "Open Modal",
+        parameters: {
+          id: createRowModal._json._id,
+        },
+      },
+    ],
+    text: "Create row",
+    type: "cta",
+  })
+
+  buttonGroup.instanceName(`${tableOrView.name} - Create`).customProps({
+    hAlign: "right",
+    buttons: [createButton.json()],
+  })
+
+  const tableHeader = new Component("@budibase/standard-components/container")
+    .instanceName("Heading container")
+    .customProps({
+      direction: "row",
+      hAlign: "stretch",
+    })
+
+  const heading = new Component("@budibase/standard-components/heading")
+    .instanceName("Table heading")
+    .customProps({
+      text: tableOrView.name,
+    })
+
+  tableHeader.addChild(heading)
+  tableHeader.addChild(buttonGroup)
+
+  const createFormBlock = new Component(
+    "@budibase/standard-components/formblock"
+  )
+  createFormBlock.instanceName("Create row form block").customProps({
+    dataSource: tableOrView.tableSelectFormat,
+    labelPosition: "left",
+    buttonPosition: "top",
+    actionType: "Create",
+    title: "Create row",
+    buttons: Utils.buildFormBlockButtonConfig({
+      _id: createFormBlock._json._id,
+      showDeleteButton: false,
+      showSaveButton: true,
+      saveButtonLabel: "Save",
+      actionType: "Create",
+      dataSource: tableOrView.tableSelectFormat,
+    }),
+  })
+
+  createRowModal.addChild(createFormBlock)
+
+  /*
+    Edit Row
+   */
+  const stateKey = `ID_${generate()}`
+  const detailsModal = new Component("@budibase/standard-components/modal")
+    .instanceName("Edit row modal")
+    .customProps({
+      size: "large",
+    })
+
+  const editFormBlock = new Component("@budibase/standard-components/formblock")
+  editFormBlock.instanceName("Edit row form block").customProps({
+    dataSource: tableOrView.tableSelectFormat,
+    labelPosition: "left",
+    buttonPosition: "top",
+    actionType: "Update",
+    title: "Edit",
+    rowId: `{{ ${safe("state")}.${safe(stateKey)} }}`,
+    buttons: Utils.buildFormBlockButtonConfig({
+      _id: editFormBlock._json._id,
+      showDeleteButton: true,
+      showSaveButton: true,
+      saveButtonLabel: "Save",
+      deleteButtonLabel: "Delete",
+      actionType: "Update",
+      dataSource: tableOrView.tableSelectFormat,
+    }),
+  })
+
+  detailsModal.addChild(editFormBlock)
+
+  const tableBlock = new Component("@budibase/standard-components/gridblock")
+  tableBlock
+    .customProps({
+      table: tableOrView.datasourceSelectFormat,
+      allowAddRows: false,
+      allowEditRows: false,
+      allowDeleteRows: false,
+      onRowClick: [
+        {
+          id: 0,
+          "##eventHandlerType": "Update State",
+          parameters: {
+            key: stateKey,
+            type: "set",
+            persist: false,
+            value: `{{ ${safe("eventContext")}.${safe("row")}._id }}`,
+          },
+        },
+        {
+          id: 1,
+          "##eventHandlerType": "Open Modal",
+          parameters: {
+            id: detailsModal._json._id,
+          },
+        },
+      ],
+    })
+    .instanceName(`${tableOrView.name} - Table`)
+
+  const template = new Screen()
+    .route(getValidRoute(screens, tableOrView.name, permissions.write))
+    .instanceName(`${tableOrView.name} - List and details`)
+    .role(permissions.write)
+    .autoTableId(tableOrView.id)
+    .addChild(tableHeader)
+    .addChild(tableBlock)
+    .addChild(createRowModal)
+    .addChild(detailsModal)
+    .json()
+
+  return [
+    {
+      data: template,
+      navigationLinkLabel: capitalise(tableOrView.name),
+    },
+  ]
+}
+
+export default modal
--- a/packages/builder/src/templates/screenTemplating/table/newScreen.js
+++ b/packages/builder/src/templates/screenTemplating/table/newScreen.js
@ -0,0 +1,322 @@
+import { Screen } from "../Screen"
+import { Component } from "../../Component"
+import { capitalise } from "helpers"
+import { makePropSafe as safe } from "@budibase/string-templates"
+import getValidRoute from "../getValidRoute"
+import { Helpers } from "@budibase/bbui"
+
+const getTableScreenTemplate = ({
+  route,
+  updateScreenRoute,
+  createScreenRoute,
+  tableOrView,
+  permissions,
+}) => {
+  const newButton = new Component("@budibase/standard-components/button")
+    .instanceName("New button")
+    .customProps({
+      text: "Create row",
+      onClick: [
+        {
+          "##eventHandlerType": "Navigate To",
+          parameters: {
+            type: "url",
+            url: createScreenRoute,
+          },
+        },
+      ],
+    })
+
+  const heading = new Component("@budibase/standard-components/heading")
+    .instanceName("Table heading")
+    .customProps({
+      text: tableOrView.name,
+    })
+
+  const tableHeader = new Component("@budibase/standard-components/container")
+    .instanceName("Heading container")
+    .customProps({
+      direction: "row",
+      hAlign: "stretch",
+    })
+    .addChild(heading)
+    .addChild(newButton)
+
+  const updateScreenRouteSegments = updateScreenRoute.split(":id")
+  if (updateScreenRouteSegments.length !== 2) {
+    throw new Error("Provided edit screen route is invalid")
+  }
+
+  const tableBlock = new Component("@budibase/standard-components/gridblock")
+    .instanceName(`${tableOrView.name} - Table`)
+    .customProps({
+      table: tableOrView.datasourceSelectFormat,
+      allowAddRows: false,
+      allowEditRows: false,
+      allowDeleteRows: false,
+      onRowClick: [
+        {
+          id: 0,
+          "##eventHandlerType": "Navigate To",
+          parameters: {
+            type: "url",
+            url: `${updateScreenRouteSegments[0]}{{ ${safe(
+              "eventContext"
+            )}.${safe("row")}._id }}${updateScreenRouteSegments[1]}`,
+          },
+        },
+      ],
+    })
+
+  const template = new Screen()
+    .route(route)
+    .instanceName(`${tableOrView.name} - List`)
+    .role(permissions.write)
+    .autoTableId(tableOrView.id)
+    .addChild(tableHeader)
+    .addChild(tableBlock)
+    .json()
+
+  return {
+    data: template,
+    navigationLinkLabel: capitalise(tableOrView.name),
+  }
+}
+
+const getUpdateScreenTemplate = ({
+  route,
+  tableScreenRoute,
+  tableOrView,
+  permissions,
+}) => {
+  const formBlockId = Helpers.uuid()
+  const formId = `${formBlockId}-form`
+  const repeaterId = `${formBlockId}-repeater`
+
+  const backButton = new Component("@budibase/standard-components/button")
+    .instanceName("Back button")
+    .customProps({
+      type: "primary",
+      icon: "ri-arrow-go-back-fill",
+      text: "Back",
+      onClick: [
+        {
+          "##eventHandlerType": "Navigate To",
+          parameters: {
+            type: "url",
+            url: tableScreenRoute,
+          },
+        },
+      ],
+    })
+
+  const deleteButton = new Component("@budibase/standard-components/button")
+    .instanceName("Delete button")
+    .customProps({
+      type: "secondary",
+      text: "Delete",
+      onClick: [
+        {
+          "##eventHandlerType": "Delete Row",
+          parameters: {
+            confirm: true,
+            tableId: tableOrView.id,
+            rowId: `{{ ${safe(repeaterId)}.${safe("_id")} }}`,
+            revId: `{{ ${safe(repeaterId)}.${safe("_rev")} }}`,
+          },
+        },
+        {
+          "##eventHandlerType": "Navigate To",
+          parameters: {
+            type: "url",
+            url: tableScreenRoute,
+          },
+        },
+      ],
+    })
+
+  const saveButton = new Component("@budibase/standard-components/button")
+    .instanceName("Save button")
+    .customProps({
+      type: "cta",
+      text: "Save",
+      onClick: [
+        {
+          "##eventHandlerType": "Validate Form",
+          parameters: {
+            componentId: formId,
+          },
+        },
+        {
+          "##eventHandlerType": "Save Row",
+          parameters: {
+            providerId: formId,
+            tableId: tableOrView.id,
+          },
+        },
+        {
+          "##eventHandlerType": "Navigate To",
+          parameters: {
+            type: "url",
+            url: tableScreenRoute,
+          },
+        },
+      ],
+    })
+
+  const updateFormBlock = new Component(
+    "@budibase/standard-components/formblock",
+    formBlockId
+  )
+    .instanceName("Update row form block")
+    .customProps({
+      dataSource: tableOrView.tableSelectFormat,
+      labelPosition: "left",
+      buttonPosition: "top",
+      actionType: "Update",
+      title: `Update ${tableOrView.name} row`,
+      buttons: [backButton.json(), saveButton.json(), deleteButton.json()],
+    })
+
+  const template = new Screen()
+    .route(route)
+    .instanceName(`Update row`)
+    .role(permissions.write)
+    .autoTableId(tableOrView.id)
+    .addChild(updateFormBlock)
+    .json()
+
+  return {
+    data: template,
+    navigationLinkLabel: null,
+  }
+}
+
+const getCreateScreenTemplate = ({
+  route,
+  tableScreenRoute,
+  tableOrView,
+  permissions,
+}) => {
+  const formBlockId = Helpers.uuid()
+  const formId = `${formBlockId}-form`
+
+  const backButton = new Component("@budibase/standard-components/button")
+    .instanceName("Back button")
+    .customProps({
+      type: "primary",
+      icon: "ri-arrow-go-back-fill",
+      text: "Back",
+      onClick: [
+        {
+          "##eventHandlerType": "Navigate To",
+          parameters: {
+            type: "url",
+            url: tableScreenRoute,
+          },
+        },
+      ],
+    })
+
+  const saveButton = new Component("@budibase/standard-components/button")
+    .instanceName("Save button")
+    .customProps({
+      type: "cta",
+      text: "Save",
+      onClick: [
+        {
+          "##eventHandlerType": "Validate Form",
+          parameters: {
+            componentId: formId,
+          },
+        },
+        {
+          "##eventHandlerType": "Save Row",
+          parameters: {
+            providerId: formId,
+            tableId: tableOrView.id,
+          },
+        },
+        {
+          "##eventHandlerType": "Navigate To",
+          parameters: {
+            type: "url",
+            url: tableScreenRoute,
+          },
+        },
+      ],
+    })
+
+  const createFormBlock = new Component(
+    "@budibase/standard-components/formblock",
+    formBlockId
+  )
+    .instanceName("Create row form block")
+    .customProps({
+      dataSource: tableOrView.tableSelectFormat,
+      labelPosition: "left",
+      buttonPosition: "top",
+      actionType: "Create",
+      title: `Create ${tableOrView.name} row`,
+      buttons: [backButton.json(), saveButton.json()],
+    })
+
+  const template = new Screen()
+    .route(route)
+    .instanceName("Create row")
+    .role(permissions.write)
+    .autoTableId(tableOrView.id)
+    .addChild(createFormBlock)
+    .json()
+
+  return {
+    data: template,
+    navigationLinkLabel: null,
+  }
+}
+
+const newScreen = ({ tableOrView, permissions, screens }) => {
+  const tableScreenRoute = getValidRoute(
+    screens,
+    tableOrView.name,
+    permissions.write
+  )
+
+  const updateScreenRoute = getValidRoute(
+    screens,
+    `/${tableOrView.name}/edit/:id`,
+    permissions.write
+  )
+
+  const createScreenRoute = getValidRoute(
+    screens,
+    `/${tableOrView.name}/new`,
+    permissions.write
+  )
+
+  const tableScreenTemplate = getTableScreenTemplate({
+    route: tableScreenRoute,
+    updateScreenRoute,
+    createScreenRoute,
+    permissions,
+    tableOrView,
+  })
+
+  const updateScreenTemplate = getUpdateScreenTemplate({
+    route: updateScreenRoute,
+    tableScreenRoute,
+    tableOrView,
+    permissions,
+  })
+
+  const createScreenTemplate = getCreateScreenTemplate({
+    route: createScreenRoute,
+    tableScreenRoute,
+    tableOrView,
+    permissions,
+  })
+
+  return [tableScreenTemplate, updateScreenTemplate, createScreenTemplate]
+}
+
+export default newScreen
--- a/packages/builder/src/templates/screenTemplating/table/sidePanel.js
+++ b/packages/builder/src/templates/screenTemplating/table/sidePanel.js
@ -1,13 +1,12 @@
-import sanitizeUrl from "helpers/sanitizeUrl"
-import { Screen } from "./Screen"
-import { Component } from "./Component"
+import { Screen } from "../Screen"
+import { Component } from "../../Component"
 import { generate } from "shortid"
 import { makePropSafe as safe } from "@budibase/string-templates"
 import { Utils } from "@budibase/frontend-core"
+import { capitalise } from "helpers"
+import getValidRoute from "../getValidRoute"

-const gridDetailsUrl = tableOrView => sanitizeUrl(`/${tableOrView.name}`)
-
-const createScreen = (tableOrView, permissions) => {
+const sidePanel = ({ tableOrView, permissions, screens }) => {
  /*
    Create Row
   */
@ -37,7 +36,7 @@ const createScreen = (tableOrView, permissions) => {
    buttons: [createButton.json()],
  })

-  const gridHeader = new Component("@budibase/standard-components/container")
+  const tableHeader = new Component("@budibase/standard-components/container")
    .instanceName("Heading container")
    .customProps({
      layout: "flex",
@ -51,14 +50,14 @@ const createScreen = (tableOrView, permissions) => {
      text: tableOrView.name,
    })

-  gridHeader.addChild(heading)
-  gridHeader.addChild(buttonGroup)
+  tableHeader.addChild(heading)
+  tableHeader.addChild(buttonGroup)

  const createFormBlock = new Component(
    "@budibase/standard-components/formblock"
  )
  createFormBlock.instanceName("Create row form block").customProps({
-    dataSource: tableOrView.clientData,
+    dataSource: tableOrView.tableSelectFormat,
    labelPosition: "left",
    buttonPosition: "top",
    actionType: "Create",
@ -69,7 +68,7 @@ const createScreen = (tableOrView, permissions) => {
      showSaveButton: true,
      saveButtonLabel: "Save",
      actionType: "Create",
-      dataSource: tableOrView.clientData,
+      dataSource: tableOrView.tableSelectFormat,
    }),
  })

@ -85,7 +84,7 @@ const createScreen = (tableOrView, permissions) => {

  const editFormBlock = new Component("@budibase/standard-components/formblock")
  editFormBlock.instanceName("Edit row form block").customProps({
-    dataSource: tableOrView.clientData,
+    dataSource: tableOrView.tableSelectFormat,
    labelPosition: "left",
    buttonPosition: "top",
    actionType: "Update",
@ -98,16 +97,16 @@ const createScreen = (tableOrView, permissions) => {
      saveButtonLabel: "Save",
      deleteButtonLabel: "Delete",
      actionType: "Update",
-      dataSource: tableOrView.clientData,
+      dataSource: tableOrView.tableSelectFormat,
    }),
  })

  detailsSidePanel.addChild(editFormBlock)

-  const gridBlock = new Component("@budibase/standard-components/gridblock")
-  gridBlock
+  const tableBlock = new Component("@budibase/standard-components/gridblock")
+  tableBlock
    .customProps({
-      table: tableOrView.clientData,
+      table: tableOrView.datasourceSelectFormat,
      allowAddRows: false,
      allowEditRows: false,
      allowDeleteRows: false,
@ -133,16 +132,23 @@ const createScreen = (tableOrView, permissions) => {
    })
    .instanceName(`${tableOrView.name} - Table`)

-  return new Screen()
-    .route(gridDetailsUrl(tableOrView))
+  const template = new Screen()
+    .route(getValidRoute(screens, tableOrView.name, permissions.write))
    .instanceName(`${tableOrView.name} - List and details`)
    .role(permissions.write)
-    .autoTableId(tableOrView.resourceId)
-    .addChild(gridHeader)
-    .addChild(gridBlock)
+    .autoTableId(tableOrView.id)
+    .addChild(tableHeader)
+    .addChild(tableBlock)
    .addChild(createRowSidePanel)
    .addChild(detailsSidePanel)
    .json()
+
+  return [
+    {
+      data: template,
+      navigationLinkLabel: capitalise(tableOrView.name),
+    },
+  ]
 }

-export default createScreen
+export default sidePanel
--- a/packages/frontend-core/src/components/grid/controls/ColumnsSettingButton.svelte
+++ b/packages/frontend-core/src/components/grid/controls/ColumnsSettingButton.svelte
@ -1,95 +1,17 @@
 <script>
  import { getContext } from "svelte"
-  import { ActionButton, Popover, Icon, notifications } from "@budibase/bbui"
-  import { getColumnIcon } from "../lib/utils"
-  import ToggleActionButtonGroup from "./ToggleActionButtonGroup.svelte"
-  import { helpers } from "@budibase/shared-core"
+  import { ActionButton, Popover } from "@budibase/bbui"
+  import ColumnsSettingContent from "./ColumnsSettingContent.svelte"

  export let allowViewReadonlyColumns = false

-  const { columns, datasource, dispatch } = getContext("grid")
+  const { columns } = getContext("grid")

  let open = false
  let anchor

-  $: restrictedColumns = $columns.filter(col => !col.visible || col.readonly)
-  $: anyRestricted = restrictedColumns.length
+  $: anyRestricted = $columns.filter(col => !col.visible || col.readonly).length
  $: text = anyRestricted ? `Columns (${anyRestricted} restricted)` : "Columns"
-
-  const toggleColumn = async (column, permission) => {
-    const visible = permission !== PERMISSION_OPTIONS.HIDDEN
-    const readonly = permission === PERMISSION_OPTIONS.READONLY
-
-    await datasource.actions.addSchemaMutation(column.name, {
-      visible,
-      readonly,
-    })
-    try {
-      await datasource.actions.saveSchemaMutations()
-    } catch (e) {
-      notifications.error(e.message)
-    } finally {
-      await datasource.actions.resetSchemaMutations()
-      await datasource.actions.refreshDefinition()
-    }
-    dispatch(visible ? "show-column" : "hide-column")
-  }
-
-  const PERMISSION_OPTIONS = {
-    WRITABLE: "writable",
-    READONLY: "readonly",
-    HIDDEN: "hidden",
-  }
-
-  $: displayColumns = $columns.map(c => {
-    const isRequired = helpers.schema.isRequired(c.schema.constraints)
-    const requiredTooltip = isRequired && "Required columns must be writable"
-    const editEnabled =
-      !isRequired ||
-      columnToPermissionOptions(c) !== PERMISSION_OPTIONS.WRITABLE
-    const options = [
-      {
-        icon: "Edit",
-        value: PERMISSION_OPTIONS.WRITABLE,
-        tooltip: (!editEnabled && requiredTooltip) || "Writable",
-        disabled: !editEnabled,
-      },
-    ]
-    if ($datasource.type === "viewV2") {
-      options.push({
-        icon: "Visibility",
-        value: PERMISSION_OPTIONS.READONLY,
-        tooltip: allowViewReadonlyColumns
-          ? requiredTooltip || "Read only"
-          : "Read only (premium feature)",
-        disabled: !allowViewReadonlyColumns || isRequired,
-      })
-    }
-
-    options.push({
-      icon: "VisibilityOff",
-      value: PERMISSION_OPTIONS.HIDDEN,
-      disabled: c.primaryDisplay || isRequired,
-      tooltip:
-        (c.primaryDisplay && "Display column cannot be hidden") ||
-        requiredTooltip ||
-        "Hidden",
-    })
-
-    return { ...c, options }
-  })
-
-  function columnToPermissionOptions(column) {
-    if (!column.schema.visible) {
-      return PERMISSION_OPTIONS.HIDDEN
-    }
-
-    if (column.schema.readonly) {
-      return PERMISSION_OPTIONS.READONLY
-    }
-
-    return PERMISSION_OPTIONS.WRITABLE
-  }
 </script>

 <div bind:this={anchor}>
@ -106,51 +28,5 @@
 </div>

 <Popover bind:open {anchor} align="left">
-  <div class="content">
-    <div class="columns">
-      {#each displayColumns as column}
-        <div class="column">
-          <Icon size="S" name={getColumnIcon(column)} />
-          <div class="column-label" title={column.label}>
-            {column.label}
-          </div>
-        </div>
-        <ToggleActionButtonGroup
-          on:click={e => toggleColumn(column, e.detail)}
-          value={columnToPermissionOptions(column)}
-          options={column.options}
-        />
-      {/each}
-    </div>
-  </div>
+  <ColumnsSettingContent columns={$columns} {allowViewReadonlyColumns} />
 </Popover>
-
-<style>
-  .content {
-    padding: 12px 12px;
-    display: flex;
-    flex-direction: column;
-    gap: 12px;
-  }
-  .columns {
-    display: grid;
-    align-items: center;
-    grid-template-columns: 1fr auto;
-    grid-row-gap: 8px;
-    grid-column-gap: 24px;
-  }
-  .columns :global(.spectrum-Switch) {
-    margin-right: 0;
-  }
-  .column {
-    display: flex;
-    gap: 8px;
-  }
-  .column-label {
-    min-width: 80px;
-    max-width: 200px;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    overflow: hidden;
-  }
-</style>
--- a/packages/frontend-core/src/components/grid/controls/ColumnsSettingContent.svelte
+++ b/packages/frontend-core/src/components/grid/controls/ColumnsSettingContent.svelte
@ -0,0 +1,134 @@
+<script>
+  import { getContext } from "svelte"
+  import { Icon, notifications } from "@budibase/bbui"
+  import { getColumnIcon } from "../lib/utils"
+  import ToggleActionButtonGroup from "./ToggleActionButtonGroup.svelte"
+  import { helpers } from "@budibase/shared-core"
+
+  export let allowViewReadonlyColumns = false
+
+  const { columns, datasource, dispatch } = getContext("grid")
+
+  const toggleColumn = async (column, permission) => {
+    const visible = permission !== PERMISSION_OPTIONS.HIDDEN
+    const readonly = permission === PERMISSION_OPTIONS.READONLY
+
+    await datasource.actions.addSchemaMutation(column.name, {
+      visible,
+      readonly,
+    })
+    try {
+      await datasource.actions.saveSchemaMutations()
+    } catch (e) {
+      notifications.error(e.message)
+    } finally {
+      await datasource.actions.resetSchemaMutations()
+      await datasource.actions.refreshDefinition()
+    }
+    dispatch(visible ? "show-column" : "hide-column")
+  }
+
+  const PERMISSION_OPTIONS = {
+    WRITABLE: "writable",
+    READONLY: "readonly",
+    HIDDEN: "hidden",
+  }
+
+  $: displayColumns = $columns.map(c => {
+    const isRequired = helpers.schema.isRequired(c.schema.constraints)
+    const requiredTooltip = isRequired && "Required columns must be writable"
+    const editEnabled =
+      !isRequired ||
+      columnToPermissionOptions(c) !== PERMISSION_OPTIONS.WRITABLE
+    const options = [
+      {
+        icon: "Edit",
+        value: PERMISSION_OPTIONS.WRITABLE,
+        tooltip: (!editEnabled && requiredTooltip) || "Writable",
+        disabled: !editEnabled,
+      },
+    ]
+    if ($datasource.type === "viewV2") {
+      options.push({
+        icon: "Visibility",
+        value: PERMISSION_OPTIONS.READONLY,
+        tooltip: allowViewReadonlyColumns
+          ? requiredTooltip || "Read only"
+          : "Read only (premium feature)",
+        disabled: !allowViewReadonlyColumns || isRequired,
+      })
+    }
+
+    options.push({
+      icon: "VisibilityOff",
+      value: PERMISSION_OPTIONS.HIDDEN,
+      disabled: c.primaryDisplay || isRequired,
+      tooltip:
+        (c.primaryDisplay && "Display column cannot be hidden") ||
+        requiredTooltip ||
+        "Hidden",
+    })
+
+    return { ...c, options }
+  })
+
+  function columnToPermissionOptions(column) {
+    if (column.schema.visible === false) {
+      return PERMISSION_OPTIONS.HIDDEN
+    }
+
+    if (column.schema.readonly) {
+      return PERMISSION_OPTIONS.READONLY
+    }
+
+    return PERMISSION_OPTIONS.WRITABLE
+  }
+</script>
+
+<div class="content">
+  <div class="columns">
+    {#each displayColumns as column}
+      <div class="column">
+        <Icon size="S" name={getColumnIcon(column)} />
+        <div class="column-label" title={column.label}>
+          {column.label}
+        </div>
+      </div>
+      <ToggleActionButtonGroup
+        on:click={e => toggleColumn(column, e.detail)}
+        value={columnToPermissionOptions(column)}
+        options={column.options}
+      />
+    {/each}
+  </div>
+</div>
+
+<style>
+  .content {
+    padding: 12px 12px;
+    display: flex;
+    flex-direction: column;
+    gap: 12px;
+  }
+  .columns {
+    display: grid;
+    align-items: center;
+    grid-template-columns: 1fr auto;
+    grid-row-gap: 8px;
+    grid-column-gap: 24px;
+  }
+  .columns :global(.spectrum-Switch) {
+    margin-right: 0;
+  }
+  .column {
+    display: flex;
+    gap: 8px;
+  }
+  .column-label {
+    min-width: 80px;
+    max-width: 200px;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    overflow: hidden;
+  }
+</style>
--- a/packages/frontend-core/src/utils/utils.js
+++ b/packages/frontend-core/src/utils/utils.js
@ -155,6 +155,7 @@ export const buildFormBlockButtonConfig = props => {
        providerId: formId,
        tableId: resourceId,
        notificationOverride,
+        confirm: null,
      },
    },
    {
--- a/packages/server/Dockerfile
+++ b/packages/server/Dockerfile
@ -12,7 +12,6 @@ ENV COUCH_DB_URL=https://couchdb.budi.live:5984
 ENV BUDIBASE_ENVIRONMENT=PRODUCTION
 ENV SERVICE=app-service
 ENV POSTHOG_TOKEN=phc_bIjZL7oh2GEUd2vqvTBH8WvrX0fWTFQMs6H5KQxiUxU
-ENV TENANT_FEATURE_FLAGS=*:LICENSING,*:USER_GROUPS,*:ONBOARDING_TOUR
 ENV ACCOUNT_PORTAL_URL=https://account.budibase.app
 ENV TOP_LEVEL_PATH=/

--- a/packages/server/scripts/dev/manage.js
+++ b/packages/server/scripts/dev/manage.js
@ -43,7 +43,6 @@ async function init() {
    BB_ADMIN_USER_EMAIL: "",
    BB_ADMIN_USER_PASSWORD: "",
    PLUGINS_DIR: "",
-    TENANT_FEATURE_FLAGS: "*:LICENSING,*:USER_GROUPS,*:ONBOARDING_TOUR",
    HTTP_MIGRATIONS: "0",
    HTTP_LOGGING: "0",
    VERSION: "0.0.0+local",
--- a/packages/server/src/api/controllers/row/index.ts
+++ b/packages/server/src/api/controllers/row/index.ts
@ -308,16 +308,21 @@ export async function downloadAttachment(ctx: UserCtx) {
  if (attachments.length === 1) {
    const attachment = attachments[0]
    ctx.attachment(attachment.name)
+    if (attachment.key) {
      ctx.body = await objectStore.getReadStream(
        objectStore.ObjectStoreBuckets.APPS,
        attachment.key
      )
+    }
  } else {
    const passThrough = new stream.PassThrough()
    const archive = archiver.create("zip")
    archive.pipe(passThrough)

    for (const attachment of attachments) {
+      if (!attachment.key) {
+        continue
+      }
      const attachmentStream = await objectStore.getReadStream(
        objectStore.ObjectStoreBuckets.APPS,
        attachment.key
--- a/packages/server/src/api/controllers/row/utils/sqlUtils.ts
+++ b/packages/server/src/api/controllers/row/utils/sqlUtils.ts
@ -151,7 +151,10 @@ export function buildExternalRelationships(
  return relationships
 }

-export function buildInternalRelationships(table: Table): RelationshipsJson[] {
+export function buildInternalRelationships(
+  table: Table,
+  allTables: Table[]
+): RelationshipsJson[] {
  const relationships: RelationshipsJson[] = []
  const links = Object.values(table.schema).filter(
    column => column.type === FieldType.LINK
@ -164,6 +167,10 @@ export function buildInternalRelationships(table: Table): RelationshipsJson[] {
    const linkTableId = link.tableId!
    const junctionTableId = generateJunctionTableID(tableId, linkTableId)
    const isFirstTable = tableId > linkTableId
+    // skip relationships with missing table definitions
+    if (!allTables.find(table => table._id === linkTableId)) {
+      continue
+    }
    relationships.push({
      through: junctionTableId,
      column: link.name,
@ -192,10 +199,10 @@ export function buildSqlFieldList(
  function extractRealFields(table: Table, existing: string[] = []) {
    return Object.entries(table.schema)
      .filter(
-        column =>
-          column[1].type !== FieldType.LINK &&
-          column[1].type !== FieldType.FORMULA &&
-          !existing.find((field: string) => field === column[0])
+        ([columnName, column]) =>
+          column.type !== FieldType.LINK &&
+          column.type !== FieldType.FORMULA &&
+          !existing.find((field: string) => field === columnName)
      )
      .map(column => `${table.name}.${column[0]}`)
  }
--- a/packages/server/src/api/routes/tests/row.spec.ts
+++ b/packages/server/src/api/routes/tests/row.spec.ts
@ -1664,7 +1664,7 @@ describe.each([
  isInternal &&
    describe("attachments and signatures", () => {
      const coreAttachmentEnrichment = async (
-        schema: any,
+        schema: TableSchema,
        field: string,
        attachmentCfg: string | string[]
      ) => {
@ -1691,7 +1691,7 @@ describe.each([

        await withEnv({ SELF_HOSTED: "true" }, async () => {
          return context.doInAppContext(config.getAppId(), async () => {
-            const enriched: Row[] = await outputProcessing(table, [row])
+            const enriched: Row[] = await outputProcessing(testTable, [row])
            const [targetRow] = enriched
            const attachmentEntries = Array.isArray(targetRow[field])
              ? targetRow[field]
--- a/packages/server/src/api/routes/tests/viewV2.spec.ts
+++ b/packages/server/src/api/routes/tests/viewV2.spec.ts
@ -30,6 +30,7 @@ import {
  withEnv as withCoreEnv,
  setEnv as setCoreEnv,
 } from "@budibase/backend-core"
+import sdk from "../../../sdk"

 describe.each([
  ["lucene", undefined],
@ -120,6 +121,7 @@ describe.each([
  })

  beforeEach(() => {
+    jest.clearAllMocks()
    mocks.licenses.useCloudFree()
  })

@ -1602,6 +1604,28 @@ describe.each([
          })
          expect(response.rows).toHaveLength(0)
        })
+
+      it("queries the row api passing the view fields only", async () => {
+        const searchSpy = jest.spyOn(sdk.rows, "search")
+
+        const view = await config.api.viewV2.create({
+          tableId: table._id!,
+          name: generator.guid(),
+          schema: {
+            id: { visible: true },
+            one: { visible: false },
+          },
+        })
+
+        await config.api.viewV2.search(view.id, { query: {} })
+        expect(searchSpy).toHaveBeenCalledTimes(1)
+
+        expect(searchSpy).toHaveBeenCalledWith(
+          expect.objectContaining({
+            fields: ["id"],
+          })
+        )
+      })
    })

    describe("permissions", () => {
--- a/packages/server/src/automations/steps/branch.ts
+++ b/packages/server/src/automations/steps/branch.ts
@ -0,0 +1,51 @@
+import {
+  AutomationActionStepId,
+  AutomationCustomIOType,
+  AutomationIOType,
+  AutomationStepDefinition,
+  AutomationStepType,
+} from "@budibase/types"
+
+export const definition: AutomationStepDefinition = {
+  name: "Branch",
+  icon: "Branch3",
+  tagline: "Branch from this step",
+  description: "Branching",
+  stepId: AutomationActionStepId.BRANCH,
+  internal: true,
+  features: {},
+  inputs: {},
+  schema: {
+    inputs: {
+      properties: {
+        branches: {
+          properties: {
+            name: {
+              type: AutomationIOType.STRING,
+            },
+            condition: {
+              customType: AutomationCustomIOType.FILTERS,
+            },
+          },
+        },
+        children: {
+          type: AutomationIOType.ARRAY,
+        },
+      },
+      required: ["conditions"],
+    },
+    outputs: {
+      properties: {
+        branchName: {
+          type: AutomationIOType.STRING,
+        },
+        result: {
+          type: AutomationIOType.BOOLEAN,
+          description: "Whether the condition was met",
+        },
+      },
+      required: ["output"],
+    },
+  },
+  type: AutomationStepType.LOGIC,
+}
--- a/packages/server/src/automations/tests/scenarios/scenarios.spec.ts
+++ b/packages/server/src/automations/tests/scenarios/scenarios.spec.ts
@ -7,7 +7,7 @@ import {
  ServerLogStepOutputs,
  FieldType,
 } from "@budibase/types"
-import { createAutomationBuilder } from "../utilities/AutomationBuilder"
+import { createAutomationBuilder } from "../utilities/AutomationTestBuilder"
 import { DatabaseName } from "../../../integrations/tests/utils"

 describe("Automation Scenarios", () => {
@ -23,6 +23,43 @@ describe("Automation Scenarios", () => {

  afterAll(setup.afterAll)

+  // eslint-disable-next-line jest/no-commented-out-tests
+  // describe("Branching automations", () => {
+  // eslint-disable-next-line jest/no-commented-out-tests
+  // it("should run an automation with a trigger, loop, and create row step", async () => {
+  //   const builder = createAutomationBuilder({
+  //     name: "Test Trigger with Loop and Create Row",
+  //   })
+
+  //   builder
+  //     .serverLog({ text: "Starting automation" })
+  //     .branch({
+  //       topLevelBranch1: {
+  //         steps: stepBuilder =>
+  //           stepBuilder.serverLog({ text: "Branch 1" }).branch({
+  //             branch1: {
+  //               steps: stepBuilder =>
+  //                 stepBuilder.serverLog({ text: "Branch 1.1" }),
+  //               condition: { notEmpty: { column: 10 } },
+  //             },
+  //             branch2: {
+  //               steps: stepBuilder =>
+  //                 stepBuilder.serverLog({ text: "Branch 1.2" }),
+  //               condition: { fuzzy: { column: "sadsd" } },
+  //             },
+  //           }),
+  //         condition: { equal: { column: 10 } },
+  //       },
+  //       topLevelBranch2: {
+  //         steps: stepBuilder => stepBuilder.serverLog({ text: "Branch 2" }),
+  //         condition: { equal: { column: 20 } },
+  //       },
+  //     })
+  //     .run()
+  // })
+
+  // })
+
  describe("Loop automations", () => {
    it("should run an automation with a trigger, loop, and create row step", async () => {
      const builder = createAutomationBuilder({
--- a/packages/server/src/automations/tests/utilities/AutomationTestBuilder.ts
+++ b/packages/server/src/automations/tests/utilities/AutomationTestBuilder.ts
@ -30,10 +30,13 @@ import {
  AutomationStepInputs,
  AutomationTriggerInputs,
  ServerLogStepInputs,
+  BranchStepInputs,
+  SearchFilters,
+  Branch,
 } from "@budibase/types"
-import {} from "../../steps/loop"
 import TestConfiguration from "../../../tests/utilities/TestConfiguration"
 import * as setup from "../utilities"
+import { definition } from "../../../automations/steps/branch"

 type TriggerOutputs =
  | RowCreatedTriggerOutputs
@ -43,69 +46,56 @@ type TriggerOutputs =
  | CronTriggerOutputs
  | undefined

-class AutomationBuilder {
-  private automationConfig: Automation = {
-    name: "",
-    definition: {
-      steps: [],
-      trigger: {} as AutomationTrigger,
-    },
-    type: "automation",
-    appId: setup.getConfig().getAppId(),
-  }
-  private config: TestConfiguration = setup.getConfig()
-  private triggerOutputs: TriggerOutputs
-  private triggerSet: boolean = false
+type StepBuilderFunction = (stepBuilder: StepBuilder) => void

-  constructor(options: { name?: string } = {}) {
-    this.automationConfig.name = options.name || `Test Automation ${uuidv4()}`
+type BranchConfig = {
+  [key: string]: {
+    steps: StepBuilderFunction
+    condition: SearchFilters
+  }
 }

-  // TRIGGERS
-  rowSaved(inputs: RowCreatedTriggerInputs, outputs: RowCreatedTriggerOutputs) {
-    this.triggerOutputs = outputs
-    return this.trigger(
-      TRIGGER_DEFINITIONS.ROW_SAVED,
-      AutomationTriggerStepId.ROW_SAVED,
-      inputs,
-      outputs
-    )
+class BaseStepBuilder {
+  protected steps: AutomationStep[] = []
+
+  protected step<TStep extends AutomationActionStepId>(
+    stepId: TStep,
+    stepSchema: Omit<AutomationStep, "id" | "stepId" | "inputs">,
+    inputs: AutomationStepInputs<TStep>
+  ): this {
+    this.steps.push({
+      ...stepSchema,
+      inputs: inputs as any,
+      id: uuidv4(),
+      stepId,
+    })
+    return this
  }

-  rowUpdated(
-    inputs: RowUpdatedTriggerInputs,
-    outputs: RowUpdatedTriggerOutputs
-  ) {
-    this.triggerOutputs = outputs
-    return this.trigger(
-      TRIGGER_DEFINITIONS.ROW_UPDATED,
-      AutomationTriggerStepId.ROW_UPDATED,
-      inputs,
-      outputs
-    )
+  protected addBranchStep(branchConfig: BranchConfig): void {
+    const branchStepInputs: BranchStepInputs = {
+      branches: [] as Branch[],
+      children: {},
    }

-  rowDeleted(
-    inputs: RowDeletedTriggerInputs,
-    outputs: RowDeletedTriggerOutputs
-  ) {
-    this.triggerOutputs = outputs
-    return this.trigger(
-      TRIGGER_DEFINITIONS.ROW_DELETED,
-      AutomationTriggerStepId.ROW_DELETED,
-      inputs,
-      outputs
-    )
-  }
+    Object.entries(branchConfig).forEach(([key, branch]) => {
+      const stepBuilder = new StepBuilder()
+      branch.steps(stepBuilder)

-  appAction(outputs: AppActionTriggerOutputs, inputs?: AppActionTriggerInputs) {
-    this.triggerOutputs = outputs
-    return this.trigger(
-      TRIGGER_DEFINITIONS.APP,
-      AutomationTriggerStepId.APP,
-      inputs,
-      outputs
-    )
+      branchStepInputs.branches.push({
+        name: key,
+        condition: branch.condition,
+      })
+      branchStepInputs.children![key] = stepBuilder.build()
+    })
+
+    const branchStep: AutomationStep = {
+      ...definition,
+      id: uuidv4(),
+      stepId: AutomationActionStepId.BRANCH,
+      inputs: branchStepInputs,
+    }
+    this.steps.push(branchStep)
  }

  // STEPS
@ -171,6 +161,84 @@ class AutomationBuilder {
      input
    )
  }
+}
+class StepBuilder extends BaseStepBuilder {
+  build(): AutomationStep[] {
+    return this.steps
+  }
+
+  branch(branchConfig: BranchConfig): this {
+    this.addBranchStep(branchConfig)
+    return this
+  }
+}
+
+class AutomationBuilder extends BaseStepBuilder {
+  private automationConfig: Automation
+  private config: TestConfiguration
+  private triggerOutputs: any
+  private triggerSet: boolean = false
+
+  constructor(options: { name?: string } = {}) {
+    super()
+    this.automationConfig = {
+      name: options.name || `Test Automation ${uuidv4()}`,
+      definition: {
+        steps: [],
+        trigger: {} as AutomationTrigger,
+      },
+      type: "automation",
+      appId: setup.getConfig().getAppId(),
+    }
+    this.config = setup.getConfig()
+  }
+
+  // TRIGGERS
+  rowSaved(inputs: RowCreatedTriggerInputs, outputs: RowCreatedTriggerOutputs) {
+    this.triggerOutputs = outputs
+    return this.trigger(
+      TRIGGER_DEFINITIONS.ROW_SAVED,
+      AutomationTriggerStepId.ROW_SAVED,
+      inputs,
+      outputs
+    )
+  }
+
+  rowUpdated(
+    inputs: RowUpdatedTriggerInputs,
+    outputs: RowUpdatedTriggerOutputs
+  ) {
+    this.triggerOutputs = outputs
+    return this.trigger(
+      TRIGGER_DEFINITIONS.ROW_UPDATED,
+      AutomationTriggerStepId.ROW_UPDATED,
+      inputs,
+      outputs
+    )
+  }
+
+  rowDeleted(
+    inputs: RowDeletedTriggerInputs,
+    outputs: RowDeletedTriggerOutputs
+  ) {
+    this.triggerOutputs = outputs
+    return this.trigger(
+      TRIGGER_DEFINITIONS.ROW_DELETED,
+      AutomationTriggerStepId.ROW_DELETED,
+      inputs,
+      outputs
+    )
+  }
+
+  appAction(outputs: AppActionTriggerOutputs, inputs?: AppActionTriggerInputs) {
+    this.triggerOutputs = outputs
+    return this.trigger(
+      TRIGGER_DEFINITIONS.APP,
+      AutomationTriggerStepId.APP,
+      inputs,
+      outputs
+    )
+  }

  private trigger<TStep extends AutomationTriggerStepId>(
    triggerSchema: AutomationTriggerDefinition,
@ -181,7 +249,6 @@ class AutomationBuilder {
    if (this.triggerSet) {
      throw new Error("Only one trigger can be set for an automation.")
    }
-
    this.automationConfig.definition.trigger = {
      ...triggerSchema,
      stepId,
@ -194,21 +261,20 @@ class AutomationBuilder {
    return this
  }

-  private step<TStep extends AutomationActionStepId>(
-    stepId: TStep,
-    stepSchema: Omit<AutomationStep, "id" | "stepId" | "inputs">,
-    inputs: AutomationStepInputs<TStep>
-  ): this {
-    this.automationConfig.definition.steps.push({
-      ...stepSchema,
-      inputs: inputs as any,
-      id: uuidv4(),
-      stepId,
-    })
-    return this
+  branch(branchConfig: BranchConfig): {
+    run: () => Promise<AutomationResults>
+  } {
+    this.addBranchStep(branchConfig)
+    return {
+      run: () => this.run(),
+    }
  }

  async run() {
+    if (!Object.keys(this.automationConfig.definition.trigger).length) {
+      throw new Error("Please add a trigger to this automation test")
+    }
+    this.automationConfig.definition.steps = this.steps
    const automation = await this.config.createAutomation(this.automationConfig)
    const results = await testAutomation(
      this.config,
@ -218,7 +284,9 @@ class AutomationBuilder {
    return this.processResults(results)
  }

-  private processResults(results: { body: AutomationResults }) {
+  private processResults(results: {
+    body: AutomationResults
+  }): AutomationResults {
    results.body.steps.shift()
    return {
      trigger: results.body.trigger,
--- a/packages/server/src/sdk/app/backups/imports.ts
+++ b/packages/server/src/sdk/app/backups/imports.ts
@ -34,7 +34,7 @@ type TemplateType = {

 function rewriteAttachmentUrl(appId: string, attachment: RowAttachment) {
  // URL looks like: /prod-budi-app-assets/appId/attachments/file.csv
-  const urlParts = attachment.key.split("/")
+  const urlParts = attachment.key?.split("/") || []
  // remove the app ID
  urlParts.shift()
  // add new app ID
--- a/packages/server/src/sdk/app/rows/queryUtils.ts
+++ b/packages/server/src/sdk/app/rows/queryUtils.ts
@ -0,0 +1,109 @@
+import { db } from "@budibase/backend-core"
+import {
+  FieldType,
+  isLogicalSearchOperator,
+  SearchFilters,
+  Table,
+} from "@budibase/types"
+import { cloneDeep } from "lodash/fp"
+import sdk from "../../../sdk"
+
+export const removeInvalidFilters = (
+  filters: SearchFilters,
+  validFields: string[]
+) => {
+  const result = cloneDeep(filters)
+
+  validFields = validFields.map(f => f.toLowerCase())
+  for (const filterKey of Object.keys(result) as (keyof SearchFilters)[]) {
+    if (typeof result[filterKey] !== "object") {
+      continue
+    }
+    if (isLogicalSearchOperator(filterKey)) {
+      const resultingConditions: SearchFilters[] = []
+      for (const condition of result[filterKey].conditions) {
+        const resultingCondition = removeInvalidFilters(condition, validFields)
+        if (Object.keys(resultingCondition).length) {
+          resultingConditions.push(resultingCondition)
+        }
+      }
+      if (resultingConditions.length) {
+        result[filterKey].conditions = resultingConditions
+      } else {
+        delete result[filterKey]
+      }
+      continue
+    }
+
+    const filter = result[filterKey]
+    for (const columnKey of Object.keys(filter)) {
+      const possibleKeys = [columnKey, db.removeKeyNumbering(columnKey)].map(
+        c => c.toLowerCase()
+      )
+      if (!validFields.some(f => possibleKeys.includes(f.toLowerCase()))) {
+        delete filter[columnKey]
+      }
+    }
+    if (!Object.keys(filter).length) {
+      delete result[filterKey]
+    }
+  }
+
+  return result
+}
+
+export const getQueryableFields = async (
+  fields: string[],
+  table: Table
+): Promise<string[]> => {
+  const extractTableFields = async (
+    table: Table,
+    allowedFields: string[],
+    fromTables: string[]
+  ): Promise<string[]> => {
+    const result = []
+    for (const field of Object.keys(table.schema).filter(
+      f => allowedFields.includes(f) && table.schema[f].visible !== false
+    )) {
+      const subSchema = table.schema[field]
+      if (subSchema.type === FieldType.LINK) {
+        if (fromTables.includes(subSchema.tableId)) {
+          // avoid circular loops
+          continue
+        }
+        try {
+          const relatedTable = await sdk.tables.getTable(subSchema.tableId)
+          const relatedFields = await extractTableFields(
+            relatedTable,
+            Object.keys(relatedTable.schema),
+            [...fromTables, subSchema.tableId]
+          )
+
+          result.push(
+            ...relatedFields.flatMap(f => [
+              `${subSchema.name}.${f}`,
+              // should be able to filter by relationship using table name
+              `${relatedTable.name}.${f}`,
+            ])
+          )
+        } catch (err: any) {
+          // if related table is removed, ignore
+          if (err.status !== 404) {
+            throw err
+          }
+        }
+      } else {
+        result.push(field)
+      }
+    }
+    return result
+  }
+
+  const result = [
+    "_id", // Querying by _id is always allowed, even if it's never part of the schema
+  ]
+
+  result.push(...(await extractTableFields(table, fields, [table._id!])))
+
+  return result
+}
--- a/packages/server/src/sdk/app/rows/search.ts
+++ b/packages/server/src/sdk/app/rows/search.ts
@ -14,6 +14,7 @@ import sdk from "../../index"
 import { searchInputMapping } from "./search/utils"
 import { db as dbCore } from "@budibase/backend-core"
 import tracer from "dd-trace"
+import { getQueryableFields, removeInvalidFilters } from "./queryUtils"

 export { isValidFilter } from "../../../integrations/utils"

@ -73,6 +74,18 @@ export async function search(
    const table = await sdk.tables.getTable(options.tableId)
    options = searchInputMapping(table, options)

+    if (options.query) {
+      const tableFields = Object.keys(table.schema).filter(
+        f => table.schema[f].visible !== false
+      )
+
+      const queriableFields = await getQueryableFields(
+        options.fields?.filter(f => tableFields.includes(f)) ?? tableFields,
+        table
+      )
+      options.query = removeInvalidFilters(options.query, queriableFields)
+    }
+
    let result: SearchResponse<Row>
    if (isExternalTable) {
      span?.addTags({ searchType: "external" })
--- a/packages/server/src/sdk/app/rows/search/internal/sqs.ts
+++ b/packages/server/src/sdk/app/rows/search/internal/sqs.ts
@ -297,7 +297,7 @@ export async function search(
    throw new Error("Unable to find table")
  }

-  const relationships = buildInternalRelationships(table)
+  const relationships = buildInternalRelationships(table, allTables)

  const searchFilters: SearchFilters = {
    ...cleanupFilters(query, table, allTables),
--- a/packages/server/src/sdk/app/rows/search/tests/search.spec.ts
+++ b/packages/server/src/sdk/app/rows/search/tests/search.spec.ts
@ -1,4 +1,11 @@
-import { Datasource, FieldType, Row, Table } from "@budibase/types"
+import {
+  AutoColumnFieldMetadata,
+  AutoFieldSubType,
+  Datasource,
+  FieldType,
+  NumberFieldMetadata,
+  Table,
+} from "@budibase/types"

 import TestConfiguration from "../../../../../tests/utilities/TestConfiguration"
 import { search } from "../../../../../sdk/app/rows/search"
@ -32,7 +39,6 @@ describe.each([
  let envCleanup: (() => void) | undefined
  let datasource: Datasource | undefined
  let table: Table
-  let rows: Row[]

  beforeAll(async () => {
    await withCoreEnv({ SQS_SEARCH_ENABLE: isSqs ? "true" : "false" }, () =>
@ -51,16 +57,28 @@ describe.each([
        datasource: await dsProvider,
      })
    }
+  })
+
+  beforeEach(async () => {
+    const idFieldSchema: NumberFieldMetadata | AutoColumnFieldMetadata =
+      isInternal
+        ? {
+            name: "id",
+            type: FieldType.AUTO,
+            subtype: AutoFieldSubType.AUTO_ID,
+            autocolumn: true,
+          }
+        : {
+            name: "id",
+            type: FieldType.NUMBER,
+            autocolumn: true,
+          }

    table = await config.api.table.save(
      tableForDatasource(datasource, {
        primary: ["id"],
        schema: {
-          id: {
-            name: "id",
-            type: FieldType.NUMBER,
-            autocolumn: true,
-          },
+          id: idFieldSchema,
          name: {
            name: "name",
            type: FieldType.STRING,
@ -81,16 +99,13 @@ describe.each([
      })
    )

-    rows = []
    for (let i = 0; i < 10; i++) {
-      rows.push(
      await config.api.row.save(table._id!, {
        name: generator.first(),
        surname: generator.last(),
        age: generator.age(),
        address: generator.address(),
      })
-      )
    }
  })

@ -138,4 +153,100 @@ describe.each([
        )
      })
    })
+
+  it("does not allow accessing hidden fields", async () => {
+    await config.doInContext(config.appId, async () => {
+      await config.api.table.save({
+        ...table,
+        schema: {
+          ...table.schema,
+          name: {
+            ...table.schema.name,
+            visible: true,
+          },
+          age: {
+            ...table.schema.age,
+            visible: false,
+          },
+        },
+      })
+      const result = await search({
+        tableId: table._id!,
+        query: {},
+      })
+      expect(result.rows).toHaveLength(10)
+      for (const row of result.rows) {
+        const keys = Object.keys(row)
+        expect(keys).toContain("name")
+        expect(keys).toContain("surname")
+        expect(keys).toContain("address")
+        expect(keys).not.toContain("age")
+      }
+    })
+  })
+
+  it("does not allow accessing hidden fields even if requested", async () => {
+    await config.doInContext(config.appId, async () => {
+      await config.api.table.save({
+        ...table,
+        schema: {
+          ...table.schema,
+          name: {
+            ...table.schema.name,
+            visible: true,
+          },
+          age: {
+            ...table.schema.age,
+            visible: false,
+          },
+        },
+      })
+      const result = await search({
+        tableId: table._id!,
+        query: {},
+        fields: ["name", "age"],
+      })
+      expect(result.rows).toHaveLength(10)
+      for (const row of result.rows) {
+        const keys = Object.keys(row)
+        expect(keys).toContain("name")
+        expect(keys).not.toContain("age")
+        expect(keys).not.toContain("surname")
+        expect(keys).not.toContain("address")
+      }
+    })
+  })
+
+  !isLucene &&
+    it.each([
+      [["id", "name", "age"], 3],
+      [["name", "age"], 10],
+    ])(
+      "cannot query by non search fields (fields: %s)",
+      async (queryFields, expectedRows) => {
+        await config.doInContext(config.appId, async () => {
+          const { rows } = await search({
+            tableId: table._id!,
+            query: {
+              $or: {
+                conditions: [
+                  {
+                    $and: {
+                      conditions: [
+                        { range: { id: { low: 2, high: 4 } } },
+                        { range: { id: { low: 3, high: 5 } } },
+                      ],
+                    },
+                  },
+                  { equal: { id: 7 } },
+                ],
+              },
+            },
+            fields: queryFields,
+          })
+
+          expect(rows).toHaveLength(expectedRows)
+        })
+      }
+    )
 })
--- a/packages/server/src/sdk/app/rows/tests/queryUtils.spec.ts
+++ b/packages/server/src/sdk/app/rows/tests/queryUtils.spec.ts
@ -0,0 +1,563 @@
+import {
+  FieldType,
+  RelationshipType,
+  SearchFilters,
+  Table,
+} from "@budibase/types"
+import { getQueryableFields, removeInvalidFilters } from "../queryUtils"
+import { structures } from "../../../../api/routes/tests/utilities"
+import TestConfiguration from "../../../../tests/utilities/TestConfiguration"
+
+describe("query utils", () => {
+  describe("removeInvalidFilters", () => {
+    const fullFilters: SearchFilters = {
+      equal: { one: "foo" },
+      $or: {
+        conditions: [
+          {
+            equal: { one: "foo2", two: "bar" },
+            notEmpty: { one: null },
+            $and: {
+              conditions: [
+                {
+                  equal: { three: "baz" },
+                  notEmpty: { forth: null },
+                },
+              ],
+            },
+          },
+        ],
+      },
+      $and: {
+        conditions: [{ equal: { one: "foo2" }, notEmpty: { one: null } }],
+      },
+    }
+
+    it("can filter empty queries", () => {
+      const filters: SearchFilters = {}
+      const result = removeInvalidFilters(filters, [])
+      expect(result).toEqual({})
+    })
+
+    it("does not trim any valid field", () => {
+      const result = removeInvalidFilters(fullFilters, [
+        "one",
+        "two",
+        "three",
+        "forth",
+      ])
+      expect(result).toEqual(fullFilters)
+    })
+
+    it("trims invalid field", () => {
+      const result = removeInvalidFilters(fullFilters, [
+        "one",
+        "three",
+        "forth",
+      ])
+      expect(result).toEqual({
+        equal: { one: "foo" },
+        $or: {
+          conditions: [
+            {
+              equal: { one: "foo2" },
+              notEmpty: { one: null },
+              $and: {
+                conditions: [
+                  {
+                    equal: { three: "baz" },
+                    notEmpty: { forth: null },
+                  },
+                ],
+              },
+            },
+          ],
+        },
+        $and: {
+          conditions: [{ equal: { one: "foo2" }, notEmpty: { one: null } }],
+        },
+      })
+    })
+
+    it("trims invalid field keeping a valid fields", () => {
+      const result = removeInvalidFilters(fullFilters, ["three", "forth"])
+      const expected: SearchFilters = {
+        $or: {
+          conditions: [
+            {
+              $and: {
+                conditions: [
+                  {
+                    equal: { three: "baz" },
+                    notEmpty: { forth: null },
+                  },
+                ],
+              },
+            },
+          ],
+        },
+      }
+      expect(result).toEqual(expected)
+    })
+
+    it("keeps filter key numering", () => {
+      const prefixedFilters: SearchFilters = {
+        equal: { "1:one": "foo" },
+        $or: {
+          conditions: [
+            {
+              equal: { "2:one": "foo2", "3:two": "bar" },
+              notEmpty: { "4:one": null },
+              $and: {
+                conditions: [
+                  {
+                    equal: { "5:three": "baz", two: "bar2" },
+                    notEmpty: { forth: null },
+                  },
+                ],
+              },
+            },
+          ],
+        },
+        $and: {
+          conditions: [{ equal: { "6:one": "foo2" }, notEmpty: { one: null } }],
+        },
+      }
+
+      const result = removeInvalidFilters(prefixedFilters, [
+        "one",
+        "three",
+        "forth",
+      ])
+      expect(result).toEqual({
+        equal: { "1:one": "foo" },
+        $or: {
+          conditions: [
+            {
+              equal: { "2:one": "foo2" },
+              notEmpty: { "4:one": null },
+              $and: {
+                conditions: [
+                  {
+                    equal: { "5:three": "baz" },
+                    notEmpty: { forth: null },
+                  },
+                ],
+              },
+            },
+          ],
+        },
+        $and: {
+          conditions: [{ equal: { "6:one": "foo2" }, notEmpty: { one: null } }],
+        },
+      })
+    })
+
+    it("handles relationship filters", () => {
+      const prefixedFilters: SearchFilters = {
+        $or: {
+          conditions: [
+            { equal: { "1:other.one": "foo" } },
+            {
+              equal: {
+                "2:other.one": "foo2",
+                "3:other.two": "bar",
+                "4:other.three": "baz",
+              },
+            },
+            { equal: { "another.three": "baz2" } },
+          ],
+        },
+      }
+
+      const result = removeInvalidFilters(prefixedFilters, [
+        "other.one",
+        "other.two",
+        "another.three",
+      ])
+      expect(result).toEqual({
+        $or: {
+          conditions: [
+            { equal: { "1:other.one": "foo" } },
+            { equal: { "2:other.one": "foo2", "3:other.two": "bar" } },
+            { equal: { "another.three": "baz2" } },
+          ],
+        },
+      })
+    })
+  })
+
+  describe("getQueryableFields", () => {
+    const config = new TestConfiguration()
+
+    beforeAll(async () => {
+      await config.init()
+    })
+
+    it("returns table schema fields and _id", async () => {
+      const table: Table = await config.api.table.save({
+        ...structures.basicTable(),
+        schema: {
+          name: { name: "name", type: FieldType.STRING },
+          age: { name: "age", type: FieldType.NUMBER },
+        },
+      })
+
+      const result = await getQueryableFields(Object.keys(table.schema), table)
+      expect(result).toEqual(["_id", "name", "age"])
+    })
+
+    it("excludes hidden fields", async () => {
+      const table: Table = await config.api.table.save({
+        ...structures.basicTable(),
+        schema: {
+          name: { name: "name", type: FieldType.STRING },
+          age: { name: "age", type: FieldType.NUMBER, visible: false },
+        },
+      })
+
+      const result = await getQueryableFields(Object.keys(table.schema), table)
+      expect(result).toEqual(["_id", "name"])
+    })
+
+    it("includes relationship fields", async () => {
+      const aux: Table = await config.api.table.save({
+        ...structures.basicTable(),
+        name: "auxTable",
+        schema: {
+          title: { name: "title", type: FieldType.STRING },
+          name: { name: "name", type: FieldType.STRING },
+        },
+      })
+
+      const table: Table = await config.api.table.save({
+        ...structures.basicTable(),
+        schema: {
+          name: { name: "name", type: FieldType.STRING },
+          aux: {
+            name: "aux",
+            type: FieldType.LINK,
+            tableId: aux._id!,
+            relationshipType: RelationshipType.ONE_TO_MANY,
+            fieldName: "table",
+          },
+        },
+      })
+
+      const result = await config.doInContext(config.appId, () => {
+        return getQueryableFields(Object.keys(table.schema), table)
+      })
+      expect(result).toEqual([
+        "_id",
+        "name",
+        "aux.title",
+        "auxTable.title",
+        "aux.name",
+        "auxTable.name",
+      ])
+    })
+
+    it("excludes hidden relationship fields", async () => {
+      const aux: Table = await config.api.table.save({
+        ...structures.basicTable(),
+        name: "auxTable",
+        schema: {
+          title: { name: "title", type: FieldType.STRING, visible: false },
+          name: { name: "name", type: FieldType.STRING, visible: true },
+        },
+      })
+
+      const table: Table = await config.api.table.save({
+        ...structures.basicTable(),
+        schema: {
+          name: { name: "name", type: FieldType.STRING },
+          aux: {
+            name: "aux",
+            type: FieldType.LINK,
+            tableId: aux._id!,
+            relationshipType: RelationshipType.ONE_TO_MANY,
+            fieldName: "table",
+          },
+        },
+      })
+
+      const result = await config.doInContext(config.appId, () => {
+        return getQueryableFields(Object.keys(table.schema), table)
+      })
+      expect(result).toEqual(["_id", "name", "aux.name", "auxTable.name"])
+    })
+
+    it("excludes all relationship fields if hidden", async () => {
+      const aux: Table = await config.api.table.save({
+        ...structures.basicTable(),
+        name: "auxTable",
+        schema: {
+          title: { name: "title", type: FieldType.STRING, visible: false },
+          name: { name: "name", type: FieldType.STRING, visible: true },
+        },
+      })
+
+      const table: Table = await config.api.table.save({
+        ...structures.basicTable(),
+        schema: {
+          name: { name: "name", type: FieldType.STRING },
+          aux: {
+            name: "aux",
+            type: FieldType.LINK,
+            tableId: aux._id!,
+            relationshipType: RelationshipType.ONE_TO_MANY,
+            fieldName: "table",
+            visible: false,
+          },
+        },
+      })
+
+      const result = await config.doInContext(config.appId, () => {
+        return getQueryableFields(Object.keys(table.schema), table)
+      })
+      expect(result).toEqual(["_id", "name"])
+    })
+
+    describe("nested relationship", () => {
+      describe("one-to-many", () => {
+        let table: Table, aux1: Table, aux2: Table
+
+        beforeAll(async () => {
+          const { _id: aux1Id } = await config.api.table.save({
+            ...structures.basicTable(),
+            name: "aux1Table",
+            schema: {
+              name: { name: "name", type: FieldType.STRING },
+            },
+          })
+          const { _id: aux2Id } = await config.api.table.save({
+            ...structures.basicTable(),
+            name: "aux2Table",
+            schema: {
+              title: { name: "title", type: FieldType.STRING },
+              aux1_1: {
+                name: "aux1_1",
+                type: FieldType.LINK,
+                tableId: aux1Id!,
+                relationshipType: RelationshipType.ONE_TO_MANY,
+                fieldName: "aux2_1",
+              },
+              aux1_2: {
+                name: "aux1_2",
+                type: FieldType.LINK,
+                tableId: aux1Id!,
+                relationshipType: RelationshipType.ONE_TO_MANY,
+                fieldName: "aux2_2",
+              },
+            },
+          })
+
+          const { _id: tableId } = await config.api.table.save({
+            ...structures.basicTable(),
+            schema: {
+              name: { name: "name", type: FieldType.STRING },
+              aux1: {
+                name: "aux1",
+                type: FieldType.LINK,
+                tableId: aux1Id!,
+                relationshipType: RelationshipType.ONE_TO_MANY,
+                fieldName: "table",
+              },
+              aux2: {
+                name: "aux2",
+                type: FieldType.LINK,
+                tableId: aux2Id!,
+                relationshipType: RelationshipType.ONE_TO_MANY,
+                fieldName: "table",
+              },
+            },
+          })
+
+          // We need to refech them to get the updated foreign keys
+          aux1 = await config.api.table.get(aux1Id!)
+          aux2 = await config.api.table.get(aux2Id!)
+          table = await config.api.table.get(tableId!)
+        })
+
+        it("includes nested relationship fields from main table", async () => {
+          const result = await config.doInContext(config.appId, () => {
+            return getQueryableFields(Object.keys(table.schema), table)
+          })
+          expect(result).toEqual([
+            "_id",
+            "name",
+            // deep 1 aux1 primitive props
+            "aux1.name",
+            "aux1Table.name",
+
+            // deep 2 aux1 primitive props
+            "aux1.aux2_1.title",
+            "aux1Table.aux2_1.title",
+            "aux1.aux2Table.title",
+            "aux1Table.aux2Table.title",
+
+            // deep 2 aux2 primitive props
+            "aux1.aux2_2.title",
+            "aux1Table.aux2_2.title",
+            "aux1.aux2Table.title",
+            "aux1Table.aux2Table.title",
+
+            // deep 1 aux2 primitive props
+            "aux2.title",
+            "aux2Table.title",
+
+            // deep 2 aux2 primitive props
+            "aux2.aux1_1.name",
+            "aux2Table.aux1_1.name",
+            "aux2.aux1Table.name",
+            "aux2Table.aux1Table.name",
+            "aux2.aux1_2.name",
+            "aux2Table.aux1_2.name",
+            "aux2.aux1Table.name",
+            "aux2Table.aux1Table.name",
+          ])
+        })
+
+        it("includes nested relationship fields from aux 1 table", async () => {
+          const result = await config.doInContext(config.appId, () => {
+            return getQueryableFields(Object.keys(aux1.schema), aux1)
+          })
+          expect(result).toEqual([
+            "_id",
+            "name",
+
+            // deep 1 aux2_1 primitive props
+            "aux2_1.title",
+            "aux2Table.title",
+
+            // deep 2 aux2_1 primitive props
+            "aux2_1.table.name",
+            "aux2Table.table.name",
+            "aux2_1.TestTable.name",
+            "aux2Table.TestTable.name",
+
+            // deep 1 aux2_2 primitive props
+            "aux2_2.title",
+            "aux2Table.title",
+
+            // deep 2 aux2_2 primitive props
+            "aux2_2.table.name",
+            "aux2Table.table.name",
+            "aux2_2.TestTable.name",
+            "aux2Table.TestTable.name",
+
+            // deep 1 table primitive props
+            "table.name",
+            "TestTable.name",
+
+            // deep 2 table primitive props
+            "table.aux2.title",
+            "TestTable.aux2.title",
+            "table.aux2Table.title",
+            "TestTable.aux2Table.title",
+          ])
+        })
+
+        it("includes nested relationship fields from aux 2 table", async () => {
+          const result = await config.doInContext(config.appId, () => {
+            return getQueryableFields(Object.keys(aux2.schema), aux2)
+          })
+          expect(result).toEqual([
+            "_id",
+            "title",
+
+            // deep 1 aux1_1 primitive props
+            "aux1_1.name",
+            "aux1Table.name",
+
+            // deep 2 aux1_1 primitive props
+            "aux1_1.table.name",
+            "aux1Table.table.name",
+            "aux1_1.TestTable.name",
+            "aux1Table.TestTable.name",
+
+            // deep 1 aux1_2 primitive props
+            "aux1_2.name",
+            "aux1Table.name",
+
+            // deep 2 aux1_2 primitive props
+            "aux1_2.table.name",
+            "aux1Table.table.name",
+            "aux1_2.TestTable.name",
+            "aux1Table.TestTable.name",
+
+            // deep 1 table primitive props
+            "table.name",
+            "TestTable.name",
+
+            // deep 2 table primitive props
+            "table.aux1.name",
+            "TestTable.aux1.name",
+            "table.aux1Table.name",
+            "TestTable.aux1Table.name",
+          ])
+        })
+      })
+
+      describe("many-to-many", () => {
+        let table: Table, aux: Table
+
+        beforeAll(async () => {
+          const { _id: auxId } = await config.api.table.save({
+            ...structures.basicTable(),
+            name: "auxTable",
+            schema: {
+              title: { name: "title", type: FieldType.STRING },
+            },
+          })
+
+          const { _id: tableId } = await config.api.table.save({
+            ...structures.basicTable(),
+            schema: {
+              name: { name: "name", type: FieldType.STRING },
+              aux: {
+                name: "aux",
+                type: FieldType.LINK,
+                tableId: auxId!,
+                relationshipType: RelationshipType.MANY_TO_MANY,
+                fieldName: "table",
+              },
+            },
+          })
+
+          // We need to refech them to get the updated foreign keys
+          aux = await config.api.table.get(auxId!)
+          table = await config.api.table.get(tableId!)
+        })
+
+        it("includes nested relationship fields from main table", async () => {
+          const result = await config.doInContext(config.appId, () => {
+            return getQueryableFields(Object.keys(table.schema), table)
+          })
+          expect(result).toEqual([
+            "_id",
+            "name",
+
+            // deep 1 aux primitive props
+            "aux.title",
+            "auxTable.title",
+          ])
+        })
+
+        it("includes nested relationship fields from aux table", async () => {
+          const result = await config.doInContext(config.appId, () => {
+            return getQueryableFields(Object.keys(aux.schema), aux)
+          })
+          expect(result).toEqual([
+            "_id",
+            "title",
+
+            // deep 1 dependency primitive props
+            "table.name",
+            "TestTable.name",
+          ])
+        })
+      })
+    })
+  })
+})
--- a/packages/server/src/utilities/rowProcessor/attachments.ts
+++ b/packages/server/src/utilities/rowProcessor/attachments.ts
@ -44,8 +44,8 @@ export class AttachmentCleanup {
    if (type === FieldType.ATTACHMENTS && Array.isArray(rowData)) {
      return rowData
        .filter(attachment => attachment.key)
-        .map(attachment => attachment.key)
-    } else if ("key" in rowData) {
+        .map(attachment => attachment.key!)
+    } else if ("key" in rowData && rowData.key) {
      return [rowData.key]
    }

--- a/packages/server/src/utilities/rowProcessor/index.ts
+++ b/packages/server/src/utilities/rowProcessor/index.ts
@ -26,8 +26,13 @@ import {
  processOutputBBReferences,
 } from "./bbReferenceProcessor"
 import { isExternalTableID } from "../../integrations/utils"
-import { helpers } from "@budibase/shared-core"
+import {
+  helpers,
+  PROTECTED_EXTERNAL_COLUMNS,
+  PROTECTED_INTERNAL_COLUMNS,
+} from "@budibase/shared-core"
 import { processString } from "@budibase/string-templates"
+import { isUserMetadataTable } from "../../api/controllers/row/utils"

 export * from "./utils"
 export * from "./attachments"
@ -53,9 +58,9 @@ export async function processAutoColumn(
  row: Row,
  opts?: AutoColumnProcessingOpts
 ) {
-  let noUser = !userId
-  let isUserTable = table._id === InternalTables.USER_METADATA
-  let now = new Date().toISOString()
+  const noUser = !userId
+  const isUserTable = table._id === InternalTables.USER_METADATA
+  const now = new Date().toISOString()
  // if a row doesn't have a revision then it doesn't exist yet
  const creating = !row._rev
  // check its not user table, or whether any of the processing options have been disabled
@ -111,7 +116,7 @@ async function processDefaultValues(table: Table, row: Row) {
    ctx.user = user
  }

-  for (let [key, schema] of Object.entries(table.schema)) {
+  for (const [key, schema] of Object.entries(table.schema)) {
    if ("default" in schema && schema.default != null && row[key] == null) {
      const processed = await processString(schema.default, ctx)

@ -165,10 +170,10 @@ export async function inputProcessing(
  row: Row,
  opts?: AutoColumnProcessingOpts
 ) {
-  let clonedRow = cloneDeep(row)
+  const clonedRow = cloneDeep(row)

  const dontCleanseKeys = ["type", "_id", "_rev", "tableId"]
-  for (let [key, value] of Object.entries(clonedRow)) {
+  for (const [key, value] of Object.entries(clonedRow)) {
    const field = table.schema[key]
    // cleanse fields that aren't in the schema
    if (!field) {
@ -268,13 +273,13 @@ export async function outputProcessing<T extends Row[] | Row>(
  }

  // process complex types: attachments, bb references...
-  for (let [property, column] of Object.entries(table.schema)) {
+  for (const [property, column] of Object.entries(table.schema)) {
    if (
      column.type === FieldType.ATTACHMENTS ||
      column.type === FieldType.ATTACHMENT_SINGLE ||
      column.type === FieldType.SIGNATURE_SINGLE
    ) {
-      for (let row of enriched) {
+      for (const row of enriched) {
        if (row[property] == null) {
          continue
        }
@ -299,7 +304,7 @@ export async function outputProcessing<T extends Row[] | Row>(
      !opts.skipBBReferences &&
      column.type == FieldType.BB_REFERENCE
    ) {
-      for (let row of enriched) {
+      for (const row of enriched) {
        row[property] = await processOutputBBReferences(
          row[property],
          column.subtype
@ -309,14 +314,14 @@ export async function outputProcessing<T extends Row[] | Row>(
      !opts.skipBBReferences &&
      column.type == FieldType.BB_REFERENCE_SINGLE
    ) {
-      for (let row of enriched) {
+      for (const row of enriched) {
        row[property] = await processOutputBBReference(
          row[property],
          column.subtype
        )
      }
    } else if (column.type === FieldType.DATETIME && column.timeOnly) {
-      for (let row of enriched) {
+      for (const row of enriched) {
        if (row[property] instanceof Date) {
          const hours = row[property].getUTCHours().toString().padStart(2, "0")
          const minutes = row[property]
@ -343,14 +348,36 @@ export async function outputProcessing<T extends Row[] | Row>(
    )) as Row[]
  }
  // remove null properties to match internal API
-  if (isExternalTableID(table._id!)) {
-    for (let row of enriched) {
-      for (let key of Object.keys(row)) {
+  const isExternal = isExternalTableID(table._id!)
+  if (isExternal) {
+    for (const row of enriched) {
+      for (const key of Object.keys(row)) {
        if (row[key] === null) {
          delete row[key]
        }
      }
    }
  }
+
+  if (!isUserMetadataTable(table._id!)) {
+    const protectedColumns = isExternal
+      ? PROTECTED_EXTERNAL_COLUMNS
+      : PROTECTED_INTERNAL_COLUMNS
+
+    const tableFields = Object.keys(table.schema).filter(
+      f => table.schema[f].visible !== false
+    )
+    const fields = [...tableFields, ...protectedColumns].map(f =>
+      f.toLowerCase()
+    )
+    for (const row of enriched) {
+      for (const key of Object.keys(row)) {
+        if (!fields.includes(key.toLowerCase())) {
+          delete row[key]
+        }
+      }
+    }
+  }
+
  return (wasArray ? enriched : enriched[0]) as T
 }
--- a/packages/string-templates/src/index.ts
+++ b/packages/string-templates/src/index.ts
@ -1,17 +1,18 @@
 import { Context, createContext, runInNewContext } from "vm"
 import { create, TemplateDelegate } from "handlebars"
 import { registerAll, registerMinimum } from "./helpers/index"
-import { preprocess, postprocess } from "./processors"
+import { postprocess, preprocess } from "./processors"
 import {
  atob,
  btoa,
-  isBackendService,
-  FIND_HBS_REGEX,
  FIND_ANY_HBS_REGEX,
+  FIND_HBS_REGEX,
  findDoubleHbsInstances,
+  isBackendService,
+  prefixStrings,
 } from "./utilities"
 import { convertHBSBlock } from "./conversion"
-import { setJSRunner, removeJSRunner } from "./helpers/javascript"
+import { removeJSRunner, setJSRunner } from "./helpers/javascript"

 import manifest from "./manifest.json"
 import { ProcessOptions } from "./types"
@ -23,6 +24,7 @@ export { iifeWrapper } from "./iife"

 const hbsInstance = create()
 registerAll(hbsInstance)
+const helperNames = Object.keys(hbsInstance.helpers)
 const hbsInstanceNoHelpers = create()
 registerMinimum(hbsInstanceNoHelpers)
 const defaultOpts: ProcessOptions = {
@ -45,12 +47,25 @@ function testObject(object: any) {
  }
 }

+function findOverlappingHelpers(context?: object) {
+  if (!context) {
+    return []
+  }
+  const contextKeys = Object.keys(context)
+  return contextKeys.filter(key => helperNames.includes(key))
+}
+
 /**
 * Creates a HBS template function for a given string, and optionally caches it.
 */
 const templateCache: Record<string, TemplateDelegate<any>> = {}
-function createTemplate(string: string, opts?: ProcessOptions) {
+function createTemplate(
+  string: string,
+  opts?: ProcessOptions,
+  context?: object
+) {
  opts = { ...defaultOpts, ...opts }
+  const helpersEnabled = !opts?.noHelpers

  // Finalising adds a helper, can't do this with no helpers
  const key = `${string}-${JSON.stringify(opts)}`
@ -60,7 +75,25 @@ function createTemplate(string: string, opts?: ProcessOptions) {
    return templateCache[key]
  }

-  string = preprocess(string, opts)
+  const overlappingHelpers = helpersEnabled
+    ? findOverlappingHelpers(context)
+    : []
+
+  string = preprocess(string, {
+    ...opts,
+    disabledHelpers: overlappingHelpers,
+  })
+
+  if (context && helpersEnabled) {
+    if (overlappingHelpers.length > 0) {
+      for (const block of findHBSBlocks(string)) {
+        string = string.replace(
+          block,
+          prefixStrings(block, overlappingHelpers, "./")
+        )
+      }
+    }
+  }

  // Optionally disable built in HBS escaping
  if (opts.noEscaping) {
@ -70,6 +103,7 @@ function createTemplate(string: string, opts?: ProcessOptions) {
  // This does not throw an error when template can't be fulfilled,
  // have to try correct beforehand
  const instance = opts.noHelpers ? hbsInstanceNoHelpers : hbsInstance
+
  const template = instance.compile(string, {
    strict: false,
  })
@ -171,7 +205,8 @@ export function processStringSync(
    throw "Cannot process non-string types."
  }
  function process(stringPart: string) {
-    const template = createTemplate(stringPart, opts)
+    // context is needed to check for overlap between helpers and context
+    const template = createTemplate(stringPart, opts, context)
    const now = Math.floor(Date.now() / 1000) * 1000
    const processedString = template({
      now: new Date(now).toISOString(),
--- a/packages/string-templates/src/processors/index.ts
+++ b/packages/string-templates/src/processors/index.ts
@ -29,9 +29,9 @@ export function preprocess(string: string, opts: ProcessOptions) {
      processor => processor.name !== preprocessor.PreprocessorNames.FINALISE
    )
  }
+
  return process(string, processors, opts)
 }
 export function postprocess(string: string) {
-  let processors = postprocessor.processors
-  return process(string, processors)
+  return process(string, postprocessor.processors)
 }
--- a/packages/string-templates/src/processors/postprocessor.ts
+++ b/packages/string-templates/src/processors/postprocessor.ts
@ -1,19 +1,21 @@
 import { LITERAL_MARKER } from "../helpers/constants"

-export const PostProcessorNames = {
-  CONVERT_LITERALS: "convert-literals",
+export enum PostProcessorNames {
+  CONVERT_LITERALS = "convert-literals",
 }

-class Postprocessor {
-  name: string
-  private fn: any
+type PostprocessorFn = (statement: string) => string

-  constructor(name: string, fn: any) {
+class Postprocessor {
+  name: PostProcessorNames
+  private readonly fn: PostprocessorFn
+
+  constructor(name: PostProcessorNames, fn: PostprocessorFn) {
    this.name = name
    this.fn = fn
  }

-  process(statement: any) {
+  process(statement: string) {
    return this.fn(statement)
  }
 }
--- a/packages/string-templates/src/processors/preprocessor.ts
+++ b/packages/string-templates/src/processors/preprocessor.ts
@ -1,25 +1,28 @@
 import { HelperNames } from "../helpers"
 import { swapStrings, isAlphaNumeric } from "../utilities"
+import { ProcessOptions } from "../types"

 const FUNCTION_CASES = ["#", "else", "/"]

-export const PreprocessorNames = {
-  SWAP_TO_DOT: "swap-to-dot-notation",
-  FIX_FUNCTIONS: "fix-functions",
-  FINALISE: "finalise",
-  NORMALIZE_SPACES: "normalize-spaces",
+export enum PreprocessorNames {
+  SWAP_TO_DOT = "swap-to-dot-notation",
+  FIX_FUNCTIONS = "fix-functions",
+  FINALISE = "finalise",
+  NORMALIZE_SPACES = "normalize-spaces",
 }

+type PreprocessorFn = (statement: string, opts?: ProcessOptions) => string
+
 class Preprocessor {
  name: string
-  private fn: any
+  private readonly fn: PreprocessorFn

-  constructor(name: string, fn: any) {
+  constructor(name: PreprocessorNames, fn: PreprocessorFn) {
    this.name = name
    this.fn = fn
  }

-  process(fullString: string, statement: string, opts: Object) {
+  process(fullString: string, statement: string, opts: ProcessOptions) {
    const output = this.fn(statement, opts)
    const idx = fullString.indexOf(statement)
    return swapStrings(fullString, idx, statement.length, output)
@ -56,8 +59,9 @@ export const processors = [
  }),
  new Preprocessor(
    PreprocessorNames.FINALISE,
-    (statement: string, opts: { noHelpers: any }) => {
-      const noHelpers = opts && opts.noHelpers
+    (statement: string, opts?: ProcessOptions) => {
+      const noHelpers = opts?.noHelpers
+      const helpersEnabled = !noHelpers
      let insideStatement = statement.slice(2, statement.length - 2)
      if (insideStatement.charAt(0) === " ") {
        insideStatement = insideStatement.slice(1)
@ -74,7 +78,8 @@ export const processors = [
      }
      const testHelper = possibleHelper.trim().toLowerCase()
      if (
-        !noHelpers &&
+        helpersEnabled &&
+        !opts?.disabledHelpers?.includes(testHelper) &&
        HelperNames().some(option => testHelper === option.toLowerCase())
      ) {
        insideStatement = `(${insideStatement})`
--- a/packages/string-templates/src/types.ts
+++ b/packages/string-templates/src/types.ts
@ -5,4 +5,5 @@ export interface ProcessOptions {
  noFinalise?: boolean
  escapeNewlines?: boolean
  onlyFound?: boolean
+  disabledHelpers?: string[]
 }
--- a/packages/string-templates/src/utilities.ts
+++ b/packages/string-templates/src/utilities.ts
@ -66,3 +66,16 @@ export const btoa = (plainText: string) => {
 export const atob = (base64: string) => {
  return Buffer.from(base64, "base64").toString("utf-8")
 }
+
+export const prefixStrings = (
+  baseString: string,
+  strings: string[],
+  prefix: string
+) => {
+  // Escape any special characters in the strings to avoid regex errors
+  const escapedStrings = strings.map(str =>
+    str.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")
+  )
+  const regexPattern = new RegExp(`\\b(${escapedStrings.join("|")})\\b`, "g")
+  return baseString.replace(regexPattern, `${prefix}$1`)
+}
--- a/packages/string-templates/test/helpers.spec.ts
+++ b/packages/string-templates/test/helpers.spec.ts
@ -483,3 +483,37 @@ describe("uuid", () => {
    expect(output).toMatch(UUID_REGEX)
  })
 })
+
+describe("helper overlap", () => {
+  it("should use context over helpers (regex test helper)", async () => {
+    const output = await processString("{{ test }}", { test: "a" })
+    expect(output).toEqual("a")
+  })
+
+  it("should use helper if no sum in context, return the context value otherwise", async () => {
+    const hbs = "{{ sum 1 2 }}"
+    const output = await processString(hbs, {})
+    expect(output).toEqual("3")
+    const secondaryOutput = await processString(hbs, { sum: "a" })
+    expect(secondaryOutput).toEqual("a")
+  })
+
+  it("should handle multiple cases", async () => {
+    const output = await processString("{{ literal (split test sum) }}", {
+      test: "a-b",
+      sum: "-",
+    })
+    expect(output).toEqual(["a", "b"])
+  })
+
+  it("should work as expected when no helpers are set", async () => {
+    const output = await processString(
+      "{{ sum }}",
+      {
+        sum: "a",
+      },
+      { noHelpers: true }
+    )
+    expect(output).toEqual("a")
+  })
+})
--- a/packages/types/src/documents/app/automation/StepInputsOutputs.ts
+++ b/packages/types/src/documents/app/automation/StepInputsOutputs.ts
@ -111,10 +111,15 @@ export type LoopStepOutputs = {
 }

 export type BranchStepInputs = {
-  conditions: SearchFilters
+  branches: Branch[]
  children?: Record<string, AutomationStep[]>
 }

+export type Branch = {
+  name: string
+  condition: SearchFilters
+}
+
 export type MakeIntegrationInputs = {
  url: string
  body: any
--- a/packages/types/src/documents/app/row.ts
+++ b/packages/types/src/documents/app/row.ts
@ -131,7 +131,7 @@ export interface RowAttachment {
  size: number
  name: string
  extension: string
-  key: string
+  key?: string
  // Populated on read
  url?: string
 }
--- a/packages/types/src/sdk/featureFlag.ts
+++ b/packages/types/src/sdk/featureFlag.ts
@ -1,5 +1,4 @@
 export enum FeatureFlag {
-  LICENSING = "LICENSING",
  PER_CREATOR_PER_USER_PRICE = "PER_CREATOR_PER_USER_PRICE",
  PER_CREATOR_PER_USER_PRICE_ALERT = "PER_CREATOR_PER_USER_PRICE_ALERT",
 }
--- a/packages/worker/Dockerfile
+++ b/packages/worker/Dockerfile
@ -44,7 +44,6 @@ ENV NODE_OPTIONS="--no-node-snapshot"
 ENV CLUSTER_MODE=${CLUSTER_MODE}
 ENV SERVICE=worker-service
 ENV POSTHOG_TOKEN=phc_bIjZL7oh2GEUd2vqvTBH8WvrX0fWTFQMs6H5KQxiUxU
-ENV TENANT_FEATURE_FLAGS=*:LICENSING,*:USER_GROUPS,*:ONBOARDING_TOUR
 ENV ACCOUNT_PORTAL_URL=https://account.budibase.app

 ARG BUDIBASE_VERSION
--- a/packages/worker/scripts/dev/manage.js
+++ b/packages/worker/scripts/dev/manage.js
@ -26,7 +26,6 @@ async function init() {
    APPS_URL: "http://localhost:4001",
    SERVICE: "worker-service",
    DEPLOYMENT_ENVIRONMENT: "development",
-    TENANT_FEATURE_FLAGS: "*:LICENSING,*:USER_GROUPS,*:ONBOARDING_TOUR",
    ENABLE_EMAIL_TEST_MODE: "1",
    HTTP_LOGGING: "0",
    VERSION: "0.0.0+local",
--- a/yarn.lock
+++ b/yarn.lock