Merge branch 'master' of github.com:Budibase/budibase into chore/hover-nav-stores

examples/nextjs-api-sales/package.json

@@ -10,7 +10,7 @@
   },
   "dependencies": {
     "bulma": "^0.9.3",
-    "next": "14.2.15",
+    "next": "14.2.21",
     "node-fetch": "^3.2.10",
     "sass": "^1.52.3",
     "react": "17.0.2",

examples/nextjs-api-sales/yarn.lock

@@ -46,10 +46,10 @@
   resolved "https://registry.yarnpkg.com/@humanwhocodes/object-schema/-/object-schema-1.2.1.tgz#b520529ec21d8e5945a1851dfd1c32e94e39ff45"
   integrity sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==
 
-"@next/env@14.2.15":
+"@next/env@14.2.21":
-  version "14.2.15"
+  version "14.2.21"
-  resolved "https://registry.yarnpkg.com/@next/env/-/env-14.2.15.tgz#06d984e37e670d93ddd6790af1844aeb935f332f"
+  resolved "https://registry.yarnpkg.com/@next/env/-/env-14.2.21.tgz#09ff0813d29c596397e141205d4f5fd5c236bdd0"
-  integrity sha512-S1qaj25Wru2dUpcIZMjxeMVSwkt8BK4dmWHHiBuRstcIyOsMapqT4A4jSB6onvqeygkSSmOkyny9VVx8JIGamQ==
+  integrity sha512-lXcwcJd5oR01tggjWJ6SrNNYFGuOOMB9c251wUNkjCpkoXOPkDeF/15c3mnVlBqrW4JJXb2kVxDFhC4GduJt2A==
 
 "@next/eslint-plugin-next@12.1.0":
   version "12.1.0"
@@ -58,50 +58,50 @@
   dependencies:
     glob "7.1.7"
 
-"@next/swc-darwin-arm64@14.2.15":
+"@next/swc-darwin-arm64@14.2.21":
-  version "14.2.15"
+  version "14.2.21"
-  resolved "https://registry.yarnpkg.com/@next/swc-darwin-arm64/-/swc-darwin-arm64-14.2.15.tgz#6386d585f39a1c490c60b72b1f76612ba4434347"
+  resolved "https://registry.yarnpkg.com/@next/swc-darwin-arm64/-/swc-darwin-arm64-14.2.21.tgz#32a31992aace1440981df9cf7cb3af7845d94fec"
-  integrity sha512-Rvh7KU9hOUBnZ9TJ28n2Oa7dD9cvDBKua9IKx7cfQQ0GoYUwg9ig31O2oMwH3wm+pE3IkAQ67ZobPfEgurPZIA==
+  integrity sha512-HwEjcKsXtvszXz5q5Z7wCtrHeTTDSTgAbocz45PHMUjU3fBYInfvhR+ZhavDRUYLonm53aHZbB09QtJVJj8T7g==
 
-"@next/swc-darwin-x64@14.2.15":
+"@next/swc-darwin-x64@14.2.21":
-  version "14.2.15"
+  version "14.2.21"
-  resolved "https://registry.yarnpkg.com/@next/swc-darwin-x64/-/swc-darwin-x64-14.2.15.tgz#b7baeedc6a28f7545ad2bc55adbab25f7b45cb89"
+  resolved "https://registry.yarnpkg.com/@next/swc-darwin-x64/-/swc-darwin-x64-14.2.21.tgz#5ab4b3f6685b6b52f810d0f5cf6e471480ddffdb"
-  integrity sha512-5TGyjFcf8ampZP3e+FyCax5zFVHi+Oe7sZyaKOngsqyaNEpOgkKB3sqmymkZfowy3ufGA/tUgDPPxpQx931lHg==
+  integrity sha512-TSAA2ROgNzm4FhKbTbyJOBrsREOMVdDIltZ6aZiKvCi/v0UwFmwigBGeqXDA97TFMpR3LNNpw52CbVelkoQBxA==
 
-"@next/swc-linux-arm64-gnu@14.2.15":
+"@next/swc-linux-arm64-gnu@14.2.21":
-  version "14.2.15"
+  version "14.2.21"
-  resolved "https://registry.yarnpkg.com/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-14.2.15.tgz#fa13c59d3222f70fb4cb3544ac750db2c6e34d02"
+  resolved "https://registry.yarnpkg.com/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-14.2.21.tgz#8a0e1fa887aef19ca218af2af515d0a5ee67ba3f"
-  integrity sha512-3Bwv4oc08ONiQ3FiOLKT72Q+ndEMyLNsc/D3qnLMbtUYTQAmkx9E/JRu0DBpHxNddBmNT5hxz1mYBphJ3mfrrw==
+  integrity sha512-0Dqjn0pEUz3JG+AImpnMMW/m8hRtl1GQCNbO66V1yp6RswSTiKmnHf3pTX6xMdJYSemf3O4Q9ykiL0jymu0TuA==
 
-"@next/swc-linux-arm64-musl@14.2.15":
+"@next/swc-linux-arm64-musl@14.2.21":
-  version "14.2.15"
+  version "14.2.21"
-  resolved "https://registry.yarnpkg.com/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-14.2.15.tgz#30e45b71831d9a6d6d18d7ac7d611a8d646a17f9"
+  resolved "https://registry.yarnpkg.com/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-14.2.21.tgz#ddad844406b42fa8965fe11250abc85c1fe0fd05"
-  integrity sha512-k5xf/tg1FBv/M4CMd8S+JL3uV9BnnRmoe7F+GWC3DxkTCD9aewFRH1s5rJ1zkzDa+Do4zyN8qD0N8c84Hu96FQ==
+  integrity sha512-Ggfw5qnMXldscVntwnjfaQs5GbBbjioV4B4loP+bjqNEb42fzZlAaK+ldL0jm2CTJga9LynBMhekNfV8W4+HBw==
 
-"@next/swc-linux-x64-gnu@14.2.15":
+"@next/swc-linux-x64-gnu@14.2.21":
-  version "14.2.15"
+  version "14.2.21"
-  resolved "https://registry.yarnpkg.com/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-14.2.15.tgz#5065db17fc86f935ad117483f21f812dc1b39254"
+  resolved "https://registry.yarnpkg.com/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-14.2.21.tgz#db55fd666f9ba27718f65caa54b622a912cdd16b"
-  integrity sha512-kE6q38hbrRbKEkkVn62reLXhThLRh6/TvgSP56GkFNhU22TbIrQDEMrO7j0IcQHcew2wfykq8lZyHFabz0oBrA==
+  integrity sha512-uokj0lubN1WoSa5KKdThVPRffGyiWlm/vCc/cMkWOQHw69Qt0X1o3b2PyLLx8ANqlefILZh1EdfLRz9gVpG6tg==
 
-"@next/swc-linux-x64-musl@14.2.15":
+"@next/swc-linux-x64-musl@14.2.21":
-  version "14.2.15"
+  version "14.2.21"
-  resolved "https://registry.yarnpkg.com/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-14.2.15.tgz#3c4a4568d8be7373a820f7576cf33388b5dab47e"
+  resolved "https://registry.yarnpkg.com/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-14.2.21.tgz#dddb850353624efcd58c4c4e30ad8a1aab379642"
-  integrity sha512-PZ5YE9ouy/IdO7QVJeIcyLn/Rc4ml9M2G4y3kCM9MNf1YKvFY4heg3pVa/jQbMro+tP6yc4G2o9LjAz1zxD7tQ==
+  integrity sha512-iAEBPzWNbciah4+0yI4s7Pce6BIoxTQ0AGCkxn/UBuzJFkYyJt71MadYQkjPqCQCJAFQ26sYh7MOKdU+VQFgPg==
 
-"@next/swc-win32-arm64-msvc@14.2.15":
+"@next/swc-win32-arm64-msvc@14.2.21":
-  version "14.2.15"
+  version "14.2.21"
-  resolved "https://registry.yarnpkg.com/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-14.2.15.tgz#fb812cc4ca0042868e32a6a021da91943bb08b98"
+  resolved "https://registry.yarnpkg.com/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-14.2.21.tgz#290012ee57b196d3d2d04853e6bf0179cae9fbaf"
-  integrity sha512-2raR16703kBvYEQD9HNLyb0/394yfqzmIeyp2nDzcPV4yPjqNUG3ohX6jX00WryXz6s1FXpVhsCo3i+g4RUX+g==
+  integrity sha512-plykgB3vL2hB4Z32W3ktsfqyuyGAPxqwiyrAi2Mr8LlEUhNn9VgkiAl5hODSBpzIfWweX3er1f5uNpGDygfQVQ==
 
-"@next/swc-win32-ia32-msvc@14.2.15":
+"@next/swc-win32-ia32-msvc@14.2.21":
-  version "14.2.15"
+  version "14.2.21"
-  resolved "https://registry.yarnpkg.com/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-14.2.15.tgz#ec26e6169354f8ced240c1427be7fd485c5df898"
+  resolved "https://registry.yarnpkg.com/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-14.2.21.tgz#c959135a78cab18cca588d11d1e33bcf199590d4"
-  integrity sha512-fyTE8cklgkyR1p03kJa5zXEaZ9El+kDNM5A+66+8evQS5e/6v0Gk28LqA0Jet8gKSOyP+OTm/tJHzMlGdQerdQ==
+  integrity sha512-w5bacz4Vxqrh06BjWgua3Yf7EMDb8iMcVhNrNx8KnJXt8t+Uu0Zg4JHLDL/T7DkTCEEfKXO/Er1fcfWxn2xfPA==
 
-"@next/swc-win32-x64-msvc@14.2.15":
+"@next/swc-win32-x64-msvc@14.2.21":
-  version "14.2.15"
+  version "14.2.21"
-  resolved "https://registry.yarnpkg.com/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-14.2.15.tgz#18d68697002b282006771f8d92d79ade9efd35c4"
+  resolved "https://registry.yarnpkg.com/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-14.2.21.tgz#21ff892286555b90538a7d1b505ea21a005d6ead"
-  integrity sha512-SzqGbsLsP9OwKNUG9nekShTwhj6JSB9ZLMWQ8g1gG6hdE5gQLncbnbymrwy2yVmH9nikSLYRYxYMFu78Ggp7/g==
+  integrity sha512-sT6+llIkzpsexGYZq8cjjthRyRGe5cJVhqh12FmlbxHqna6zsDDK8UNaV7g41T6atFHCJUPeLb3uyAwrBwy0NA==
 
 "@nodelib/fs.scandir@2.1.5":
   version "2.1.5"
@@ -1253,12 +1253,12 @@ natural-compare@^1.4.0:
   resolved "https://registry.yarnpkg.com/natural-compare/-/natural-compare-1.4.0.tgz#4abebfeed7541f2c27acfb29bdbbd15c8d5ba4f7"
   integrity sha1-Sr6/7tdUHywnrPspvbvRXI1bpPc=
 
-next@14.2.15:
+next@14.2.21:
-  version "14.2.15"
+  version "14.2.21"
-  resolved "https://registry.yarnpkg.com/next/-/next-14.2.15.tgz#348e5603e22649775d19c785c09a89c9acb5189a"
+  resolved "https://registry.yarnpkg.com/next/-/next-14.2.21.tgz#f6da9e2abba1a0e4ca7a5273825daf06632554ba"
-  integrity sha512-h9ctmOokpoDphRvMGnwOJAedT6zKhwqyZML9mDtspgf4Rh3Pn7UTYKqePNoDvhsWBAO5GoPNYshnAUGIazVGmw==
+  integrity sha512-rZmLwucLHr3/zfDMYbJXbw0ZeoBpirxkXuvsJbk7UPorvPYZhP7vq7aHbKnU7dQNCYIimRrbB2pp3xmf+wsYUg==
   dependencies:
-    "@next/env" "14.2.15"
+    "@next/env" "14.2.21"
     "@swc/helpers" "0.5.5"
     busboy "1.6.0"
     caniuse-lite "^1.0.30001579"
@@ -1266,15 +1266,15 @@ next@14.2.15:
     postcss "8.4.31"
     styled-jsx "5.1.1"
   optionalDependencies:
-    "@next/swc-darwin-arm64" "14.2.15"
+    "@next/swc-darwin-arm64" "14.2.21"
-    "@next/swc-darwin-x64" "14.2.15"
+    "@next/swc-darwin-x64" "14.2.21"
-    "@next/swc-linux-arm64-gnu" "14.2.15"
+    "@next/swc-linux-arm64-gnu" "14.2.21"
-    "@next/swc-linux-arm64-musl" "14.2.15"
+    "@next/swc-linux-arm64-musl" "14.2.21"
-    "@next/swc-linux-x64-gnu" "14.2.15"
+    "@next/swc-linux-x64-gnu" "14.2.21"
-    "@next/swc-linux-x64-musl" "14.2.15"
+    "@next/swc-linux-x64-musl" "14.2.21"
-    "@next/swc-win32-arm64-msvc" "14.2.15"
+    "@next/swc-win32-arm64-msvc" "14.2.21"
-    "@next/swc-win32-ia32-msvc" "14.2.15"
+    "@next/swc-win32-ia32-msvc" "14.2.21"
-    "@next/swc-win32-x64-msvc" "14.2.15"
+    "@next/swc-win32-x64-msvc" "14.2.21"
 
 node-domexception@^1.0.0:
   version "1.0.0"

lerna.json

@@ -1,6 +1,6 @@
 {
   "$schema": "node_modules/lerna/schemas/lerna-schema.json",
-  "version": "3.2.29",
+  "version": "3.2.32",
   "npmClient": "yarn",
   "concurrency": 20,
   "command": {

packages/backend-core/src/context/mainContext.ts

@@ -385,17 +385,17 @@ export function getCurrentContext(): ContextMap | undefined {
   }
 }
 
-export function getFeatureFlags<T extends Record<string, any>>(
+export function getFeatureFlags(
   key: string
-): T | undefined {
+): Record<string, boolean> | undefined {
   const context = getCurrentContext()
   if (!context) {
     return undefined
   }
-  return context.featureFlagCache?.[key] as T
+  return context.featureFlagCache?.[key]
 }
 
-export function setFeatureFlags(key: string, value: Record<string, any>) {
+export function setFeatureFlags(key: string, value: Record<string, boolean>) {
   const context = getCurrentContext()
   if (!context) {
     return

packages/backend-core/src/context/types.ts

@@ -20,7 +20,7 @@ export type ContextMap = {
     clients: Record<string, GoogleSpreadsheet>
   }
   featureFlagCache?: {
-    [key: string]: Record<string, any>
+    [key: string]: Record<string, boolean>
   }
   viewToTableCache?: Record<string, Table>
 }

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

@@ -2,9 +2,10 @@ import env from "../environment"
 import * as crypto from "crypto"
 import * as context from "../context"
 import { PostHog, PostHogOptions } from "posthog-node"
-import { FeatureFlag } from "@budibase/types"
 import tracer from "dd-trace"
 import { Duration } from "../utils"
+import { cloneDeep } from "lodash"
+import { FeatureFlagDefaults } from "@budibase/types"
 
 let posthog: PostHog | undefined
 export function init(opts?: PostHogOptions) {
@@ -30,74 +31,6 @@ export function shutdown() {
   posthog?.shutdown()
 }
 
-export abstract class Flag<T> {
-  static boolean(defaultValue: boolean): Flag<boolean> {
-    return new BooleanFlag(defaultValue)
-  }
-
-  static string(defaultValue: string): Flag<string> {
-    return new StringFlag(defaultValue)
-  }
-
-  static number(defaultValue: number): Flag<number> {
-    return new NumberFlag(defaultValue)
-  }
-
-  protected constructor(public defaultValue: T) {}
-
-  abstract parse(value: any): T
-}
-
-type UnwrapFlag<F> = F extends Flag<infer U> ? U : never
-
-export type FlagValues<T> = {
-  [K in keyof T]: UnwrapFlag<T[K]>
-}
-
-type KeysOfType<T, U> = {
-  [K in keyof T]: T[K] extends Flag<U> ? K : never
-}[keyof T]
-
-class BooleanFlag extends Flag<boolean> {
-  parse(value: any) {
-    if (typeof value === "string") {
-      return ["true", "t", "1"].includes(value.toLowerCase())
-    }
-
-    if (typeof value === "boolean") {
-      return value
-    }
-
-    throw new Error(`could not parse value "${value}" as boolean`)
-  }
-}
-
-class StringFlag extends Flag<string> {
-  parse(value: any) {
-    if (typeof value === "string") {
-      return value
-    }
-    throw new Error(`could not parse value "${value}" as string`)
-  }
-}
-
-class NumberFlag extends Flag<number> {
-  parse(value: any) {
-    if (typeof value === "number") {
-      return value
-    }
-
-    if (typeof value === "string") {
-      const parsed = parseFloat(value)
-      if (!isNaN(parsed)) {
-        return parsed
-      }
-    }
-
-    throw new Error(`could not parse value "${value}" as number`)
-  }
-}
-
 export interface EnvFlagEntry {
   tenantId: string
   key: string
@@ -120,7 +53,7 @@ export function parseEnvFlags(flags: string): EnvFlagEntry[] {
   return result
 }
 
-export class FlagSet<V extends Flag<any>, T extends { [key: string]: V }> {
+export class FlagSet<T extends { [name: string]: boolean }> {
   // This is used to safely cache flags sets in the current request context.
   // Because multiple sets could theoretically exist, we don't want the cache of
   // one to leak into another.
@@ -130,34 +63,25 @@ export class FlagSet<V extends Flag<any>, T extends { [key: string]: V }> {
     this.setId = crypto.randomUUID()
   }
 
-  defaults(): FlagValues<T> {
+  defaults(): T {
-    return Object.keys(this.flagSchema).reduce((acc, key) => {
+    return cloneDeep(this.flagSchema)
-      const typedKey = key as keyof T
-      acc[typedKey] = this.flagSchema[key].defaultValue
-      return acc
-    }, {} as FlagValues<T>)
   }
 
   isFlagName(name: string | number | symbol): name is keyof T {
     return this.flagSchema[name as keyof T] !== undefined
   }
 
-  async get<K extends keyof T>(key: K): Promise<FlagValues<T>[K]> {
+  async isEnabled<K extends keyof T>(key: K): Promise<T[K]> {
     const flags = await this.fetch()
     return flags[key]
   }
 
-  async isEnabled<K extends KeysOfType<T, boolean>>(key: K): Promise<boolean> {
+  async fetch(): Promise<T> {
-    const flags = await this.fetch()
-    return flags[key]
-  }
-
-  async fetch(): Promise<FlagValues<T>> {
     return await tracer.trace("features.fetch", async span => {
-      const cachedFlags = context.getFeatureFlags<FlagValues<T>>(this.setId)
+      const cachedFlags = context.getFeatureFlags(this.setId)
       if (cachedFlags) {
         span?.addTags({ fromCache: true })
-        return cachedFlags
+        return cachedFlags as T
       }
 
       const tags: Record<string, any> = {}
@@ -189,7 +113,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[key as keyof FlagValues] = value
+        flagValues[key as keyof T] = value
         tags[`flags.${key}.source`] = "environment"
       }
 
@@ -217,11 +141,11 @@ export class FlagSet<V extends Flag<any>, T extends { [key: string]: V }> {
         tags[`readFromPostHog`] = true
 
         const personProperties: Record<string, string> = { tenantId }
-        const posthogFlags = await posthog.getAllFlagsAndPayloads(userId, {
+        const posthogFlags = await posthog.getAllFlags(userId, {
           personProperties,
         })
 
-        for (const [name, value] of Object.entries(posthogFlags.featureFlags)) {
+        for (const [name, value] of Object.entries(posthogFlags)) {
           if (!this.isFlagName(name)) {
             // We don't want an unexpected PostHog flag to break the app, so we
             // just log it and continue.
@@ -229,19 +153,20 @@ export class FlagSet<V extends Flag<any>, T extends { [key: string]: V }> {
             continue
           }
 
+          if (typeof value !== "boolean") {
+            console.warn(`Invalid value for posthog flag "${name}": ${value}`)
+            continue
+          }
+
           if (flagValues[name] === true || specificallySetFalse.has(name)) {
             // If the flag is already set to through environment variables, we
             // don't want to override it back to false here.
             continue
           }
 
-          const payload = posthogFlags.featureFlagPayloads?.[name]
-          const flag = this.flagSchema[name]
           try {
-            // @ts-expect-error - TS does not like you writing into a generic
+            // @ts-expect-error - TS does not like you writing into a generic type.
-            // type, but we know that it's okay in this case because it's just
+            flagValues[name] = value
-            // an object.
-            flagValues[name] = flag.parse(payload || value)
             tags[`flags.${name}.source`] = "posthog"
           } catch (err) {
             // We don't want an invalid PostHog flag to break the app, so we just
@@ -262,18 +187,12 @@ export class FlagSet<V extends Flag<any>, T extends { [key: string]: V }> {
   }
 }
 
-// This is the primary source of truth for feature flags. If you want to add a
+export const flags = new FlagSet(FeatureFlagDefaults)
-// new flag, add it here and use the `fetch` and `get` functions to access it.
-// 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.
-const flagsConfig: Record<FeatureFlag, Flag<any>> = {
-  [FeatureFlag.DEFAULT_VALUES]: Flag.boolean(true),
-  [FeatureFlag.AUTOMATION_BRANCHING]: Flag.boolean(true),
-  [FeatureFlag.AI_CUSTOM_CONFIGS]: Flag.boolean(true),
-  [FeatureFlag.BUDIBASE_AI]: Flag.boolean(true),
-  [FeatureFlag.USE_ZOD_VALIDATOR]: Flag.boolean(env.isDev()),
-}
-export const flags = new FlagSet(flagsConfig)
 
-type UnwrapPromise<T> = T extends Promise<infer U> ? U : T
+export async function isEnabled(flag: keyof typeof FeatureFlagDefaults) {
-export type FeatureFlags = UnwrapPromise<ReturnType<typeof flags.fetch>>
+  return await flags.isEnabled(flag)
+}
+
+export async function all() {
+  return await flags.fetch()
+}

packages/backend-core/src/features/tests/features.spec.ts

@@ -1,5 +1,5 @@
 import { IdentityContext, IdentityType } from "@budibase/types"
-import { Flag, FlagSet, FlagValues, init, shutdown } from "../"
+import { FlagSet, init, shutdown } from "../"
 import * as context from "../../context"
 import environment, { withEnv } from "../../environment"
 import nodeFetch from "node-fetch"
@@ -7,10 +7,8 @@ import nock from "nock"
 import * as crypto from "crypto"
 
 const schema = {
-  TEST_BOOLEAN: Flag.boolean(false),
+  TEST_BOOLEAN: false,
-  TEST_STRING: Flag.string("default value"),
+  TEST_BOOLEAN_DEFAULT_TRUE: true,
-  TEST_NUMBER: Flag.number(0),
-  TEST_BOOLEAN_DEFAULT_TRUE: Flag.boolean(true),
 }
 const flags = new FlagSet(schema)
 
@@ -19,7 +17,7 @@ interface TestCase {
   identity?: Partial<IdentityContext>
   environmentFlags?: string
   posthogFlags?: PostHogFlags
-  expected?: Partial<FlagValues<typeof schema>>
+  expected?: Partial<typeof schema>
   errorMessage?: string | RegExp
 }
 
@@ -83,22 +81,6 @@ describe("feature flags", () => {
       },
       expected: { TEST_BOOLEAN: true },
     },
-    {
-      it: "should be able to read string flags from PostHog",
-      posthogFlags: {
-        featureFlags: { TEST_STRING: true },
-        featureFlagPayloads: { TEST_STRING: "test" },
-      },
-      expected: { TEST_STRING: "test" },
-    },
-    {
-      it: "should be able to read numeric flags from PostHog",
-      posthogFlags: {
-        featureFlags: { TEST_NUMBER: true },
-        featureFlagPayloads: { TEST_NUMBER: "123" },
-      },
-      expected: { TEST_NUMBER: 123 },
-    },
     {
       it: "should not be able to override a negative environment flag from PostHog",
       environmentFlags: "default:!TEST_BOOLEAN",
@@ -177,7 +159,7 @@ describe("feature flags", () => {
             expect(values).toMatchObject(expected)
 
             for (const [key, expectedValue] of Object.entries(expected)) {
-              const value = await flags.get(key as keyof typeof schema)
+              const value = await flags.isEnabled(key as keyof typeof schema)
               expect(value).toBe(expectedValue)
             }
           } else {

packages/backend-core/src/features/tests/utils.ts

@@ -1,5 +1,6 @@
-import { FeatureFlags, parseEnvFlags } from ".."
+import { FeatureFlags } from "@budibase/types"
 import { setEnv } from "../../environment"
+import { parseEnvFlags } from "../features"
 
 function getCurrentFlags(): Record<string, Record<string, boolean>> {
   const result: Record<string, Record<string, boolean>> = {}

packages/bbui/src/Form/Core/DatePicker/NumberInput.svelte

@@ -51,6 +51,7 @@
   }
   input.hide-arrows {
     -moz-appearance: textfield;
+    appearance: textfield;
   }
   input[type="time"]::-webkit-calendar-picker-indicator {
     display: none;

packages/bbui/src/Form/Core/Slider.svelte

@@ -39,6 +39,7 @@
     padding: 0;
     margin: 0;
     -webkit-appearance: none;
+    appearance: none;
     background: transparent;
   }
   input::-webkit-slider-thumb {

packages/bbui/src/ProgressCircle/ProgressCircle.svelte

@@ -37,7 +37,7 @@
     }
   }
 
-  export let overBackground
+  export let overBackground = false
 </script>
 
 <!-- svelte-ignore a11y-no-static-element-interactions -->

packages/bbui/src/Tabs/Tabs.svelte

@@ -124,8 +124,6 @@
   .spectrum-Tabs-selectionIndicator.emphasized {
     background-color: var(--spectrum-global-color-blue-400);
   }
-  .spectrum-Tabs--horizontal .spectrum-Tabs-selectionIndicator {
-  }
   .noHorizPadding {
     padding: 0;
   }

packages/bbui/src/Tooltip/AbsTooltip.svelte

@@ -134,6 +134,7 @@
   .spectrum-Tooltip-label {
     display: -webkit-box;
     -webkit-line-clamp: 3;
+    line-clamp: 3;
     -webkit-box-orient: vertical;
     overflow: hidden;
     font-size: 12px;

packages/builder/package.json

@@ -94,6 +94,7 @@
     "@sveltejs/vite-plugin-svelte": "1.4.0",
     "@testing-library/jest-dom": "6.4.2",
     "@testing-library/svelte": "^4.1.0",
+    "@types/shortid": "^2.2.0",
     "babel-jest": "^29.6.2",
     "identity-obj-proxy": "^3.0.0",
     "jest": "29.7.0",

packages/builder/src/App.svelte

@@ -3,7 +3,7 @@
   import { routes } from "../.routify/routes"
   import { NotificationDisplay, BannerDisplay } from "@budibase/bbui"
   import { parse, stringify } from "qs"
-  import LicensingOverlays from "components/portal/licensing/LicensingOverlays.svelte"
+  import LicensingOverlays from "@/components/portal/licensing/LicensingOverlays.svelte"
 
   const queryHandler = { parse, stringify }
 </script>

packages/builder/src/analytics/index.js

@@ -1,4 +1,4 @@
-import { API } from "api"
+import { API } from "@/api"
 import PosthogClient from "./PosthogClient"
 import { Events, EventSource } from "./constants"
 

packages/builder/src/api.ts

@@ -3,7 +3,7 @@ import {
   CookieUtils,
   Constants,
 } from "@budibase/frontend-core"
-import { appStore } from "stores/builder"
+import { appStore } from "@/stores/builder"
 import { get } from "svelte/store"
 import { auth, navigation } from "./stores/portal"
 

packages/builder/src/components/ContextMenu.svelte

@@ -1,5 +1,5 @@
 <script>
-  import { contextMenuStore } from "stores/builder"
+  import { contextMenuStore } from "@/stores/builder"
   import { Popover, Menu, MenuItem } from "@budibase/bbui"
 
   let dropdown

packages/builder/src/components/automation/AutomationBuilder/AutomationBuilder.svelte

@@ -1,5 +1,5 @@
 <script>
-  import { selectedAutomation } from "stores/builder"
+  import { selectedAutomation } from "@/stores/builder"
   import Flowchart from "./FlowChart/FlowChart.svelte"
 </script>
 

packages/builder/src/components/automation/AutomationBuilder/DraggableCanvas.svelte

@@ -9,7 +9,7 @@
   } from "svelte"
   import Logo from "assets/bb-emblem.svg?raw"
   import { Utils, memo } from "@budibase/frontend-core"
-  import { selectedAutomation, automationStore } from "stores/builder"
+  import { selectedAutomation, automationStore } from "@/stores/builder"
 
   // CSS classes that, on mouse down, will trigger the view drag behaviour
   export let draggableClasses = []

packages/builder/src/components/automation/AutomationBuilder/FlowChart/ActionModal.svelte

@@ -10,10 +10,10 @@
     Tag,
   } from "@budibase/bbui"
   import { AutomationActionStepId } from "@budibase/types"
-  import { automationStore, selectedAutomation } from "stores/builder"
+  import { automationStore, selectedAutomation } from "@/stores/builder"
-  import { admin, licensing } from "stores/portal"
+  import { admin, licensing } from "@/stores/portal"
   import { externalActions } from "./ExternalActions"
-  import { TriggerStepID, ActionStepID } from "constants/backend/automations"
+  import { TriggerStepID, ActionStepID } from "@/constants/backend/automations"
 
   export let block
   export let modal

packages/builder/src/components/automation/AutomationBuilder/FlowChart/AutomationBlockTagline.svelte

@@ -1,7 +1,7 @@
 <script>
   import { processStringSync } from "@budibase/string-templates"
   import { get } from "lodash/fp"
-  import { tables } from "stores/builder"
+  import { tables } from "@/stores/builder"
 
   export let block
 

packages/builder/src/components/automation/AutomationBuilder/FlowChart/BranchNode.svelte

@@ -1,5 +1,5 @@
 <script>
-  import FilterBuilder from "components/design/settings/controls/FilterEditor/FilterBuilder.svelte"
+  import FilterBuilder from "@/components/design/settings/controls/FilterEditor/FilterBuilder.svelte"
   import {
     Drawer,
     DrawerContent,
@@ -14,11 +14,11 @@
     Modal,
     ModalContent,
   } from "@budibase/bbui"
-  import PropField from "components/automation/SetupPanel/PropField.svelte"
+  import PropField from "@/components/automation/SetupPanel/PropField.svelte"
-  import AutomationBindingPanel from "components/common/bindings/ServerBindingPanel.svelte"
+  import AutomationBindingPanel from "@/components/common/bindings/ServerBindingPanel.svelte"
   import FlowItemHeader from "./FlowItemHeader.svelte"
   import FlowItemActions from "./FlowItemActions.svelte"
-  import { automationStore, selectedAutomation } from "stores/builder"
+  import { automationStore, selectedAutomation } from "@/stores/builder"
   import { QueryUtils, Utils } from "@budibase/frontend-core"
   import { cloneDeep } from "lodash/fp"
   import { createEventDispatcher, getContext } from "svelte"

packages/builder/src/components/automation/AutomationBuilder/FlowChart/FlowChart.svelte

@@ -3,8 +3,8 @@
     automationStore,
     automationHistoryStore,
     selectedAutomation,
-  } from "stores/builder"
+  } from "@/stores/builder"
-  import ConfirmDialog from "components/common/ConfirmDialog.svelte"
+  import ConfirmDialog from "@/components/common/ConfirmDialog.svelte"
   import TestDataModal from "./TestDataModal.svelte"
   import {
     notifications,
@@ -13,8 +13,8 @@
     Button,
     ActionButton,
   } from "@budibase/bbui"
-  import { ActionStepID } from "constants/backend/automations"
+  import { ActionStepID } from "@/constants/backend/automations"
-  import UndoRedoControl from "components/common/UndoRedoControl.svelte"
+  import UndoRedoControl from "@/components/common/UndoRedoControl.svelte"
   import StepNode from "./StepNode.svelte"
   import { memo } from "@budibase/frontend-core"
   import { sdk } from "@budibase/shared-core"

packages/builder/src/components/automation/AutomationBuilder/FlowChart/FlowItem.svelte

@@ -4,7 +4,7 @@
     permissions,
     selectedAutomation,
     tables,
-  } from "stores/builder"
+  } from "@/stores/builder"
   import {
     Icon,
     Divider,
@@ -16,16 +16,16 @@
   } from "@budibase/bbui"
   import { sdk } from "@budibase/shared-core"
   import AutomationBlockSetup from "../../SetupPanel/AutomationBlockSetup.svelte"
-  import CreateWebhookModal from "components/automation/Shared/CreateWebhookModal.svelte"
+  import CreateWebhookModal from "@/components/automation/Shared/CreateWebhookModal.svelte"
   import FlowItemHeader from "./FlowItemHeader.svelte"
-  import RoleSelect from "components/design/settings/controls/RoleSelect.svelte"
+  import RoleSelect from "@/components/design/settings/controls/RoleSelect.svelte"
-  import { ActionStepID, TriggerStepID } from "constants/backend/automations"
+  import { ActionStepID, TriggerStepID } from "@/constants/backend/automations"
   import { AutomationStepType } from "@budibase/types"
   import FlowItemActions from "./FlowItemActions.svelte"
-  import DragHandle from "components/design/settings/controls/DraggableList/drag-handle.svelte"
+  import DragHandle from "@/components/design/settings/controls/DraggableList/drag-handle.svelte"
   import { getContext } from "svelte"
   import DragZone from "./DragZone.svelte"
-  import InfoDisplay from "pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Component/InfoDisplay.svelte"
+  import InfoDisplay from "@/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Component/InfoDisplay.svelte"
 
   export let block
   export let blockRef

packages/builder/src/components/automation/AutomationBuilder/FlowChart/FlowItemHeader.svelte

@@ -1,9 +1,9 @@
 <script>
-  import { automationStore, selectedAutomation } from "stores/builder"
+  import { automationStore, selectedAutomation } from "@/stores/builder"
   import { Icon, Body, AbsTooltip, StatusLight } from "@budibase/bbui"
   import { externalActions } from "./ExternalActions"
   import { createEventDispatcher } from "svelte"
-  import { Features } from "constants/backend/automations"
+  import { Features } from "@/constants/backend/automations"
 
   export let block
   export let open
@@ -22,7 +22,7 @@
   const dispatch = createEventDispatcher()
 
   $: blockRefs = $selectedAutomation?.blockRefs || {}
-  $: stepNames = automation?.definition.stepNames
+  $: stepNames = automation?.definition.stepNames || {}
   $: allSteps = automation?.definition.steps || []
   $: automationName = itemName || stepNames?.[block.id] || block?.name || ""
   $: automationNameError = getAutomationNameError(automationName)
@@ -64,7 +64,7 @@
   const getAutomationNameError = name => {
     const duplicateError =
       "This name already exists, please enter a unique name"
-    if (stepNames && editing) {
+    if (editing) {
       for (const [key, value] of Object.entries(stepNames)) {
         if (name !== block.name && name === value && key !== block.id) {
           return duplicateError

packages/builder/src/components/automation/AutomationBuilder/FlowChart/StepNode.svelte

@@ -3,8 +3,8 @@
   import BranchNode from "./BranchNode.svelte"
   import { AutomationActionStepId } from "@budibase/types"
   import { ActionButton, notifications } from "@budibase/bbui"
-  import { automationStore } from "stores/builder"
+  import { automationStore } from "@/stores/builder"
-  import { environment } from "stores/portal"
+  import { environment } from "@/stores/portal"
   import { cloneDeep } from "lodash"
   import { memo } from "@budibase/frontend-core"
   import { getContext, onMount } from "svelte"

packages/builder/src/components/automation/AutomationBuilder/FlowChart/TestDataModal.svelte

@@ -6,7 +6,7 @@
     notifications,
     ActionButton,
   } from "@budibase/bbui"
-  import { automationStore, selectedAutomation } from "stores/builder"
+  import { automationStore, selectedAutomation } from "@/stores/builder"
   import AutomationBlockSetup from "../../SetupPanel/AutomationBlockSetup.svelte"
   import { cloneDeep } from "lodash/fp"
   import { AutomationEventType } from "@budibase/types"

packages/builder/src/components/automation/AutomationBuilder/TestDisplay.svelte

@@ -1,9 +1,9 @@
 <script>
   import { Icon, Divider, Tabs, Tab, Label } from "@budibase/bbui"
   import FlowItemHeader from "./FlowChart/FlowItemHeader.svelte"
-  import { ActionStepID } from "constants/backend/automations"
+  import { ActionStepID } from "@/constants/backend/automations"
   import { JsonView } from "@zerodevx/svelte-json-view"
-  import { automationStore } from "stores/builder"
+  import { automationStore } from "@/stores/builder"
   import { AutomationActionStepId } from "@budibase/types"
 
   export let automation

packages/builder/src/components/automation/AutomationBuilder/TestPanel.svelte

@@ -1,7 +1,7 @@
 <script>
   import { Icon, Divider } from "@budibase/bbui"
   import TestDisplay from "./TestDisplay.svelte"
-  import { automationStore, selectedAutomation } from "stores/builder"
+  import { automationStore, selectedAutomation } from "@/stores/builder"
 
   export let automation
 </script>

packages/builder/src/components/automation/AutomationPanel/AutomationNavItem.svelte

@@ -4,12 +4,12 @@
     userSelectedResourceMap,
     automationStore,
     contextMenuStore,
-  } from "stores/builder"
+  } from "@/stores/builder"
   import { notifications, Icon } from "@budibase/bbui"
   import { sdk } from "@budibase/shared-core"
-  import ConfirmDialog from "components/common/ConfirmDialog.svelte"
+  import ConfirmDialog from "@/components/common/ConfirmDialog.svelte"
-  import UpdateAutomationModal from "components/automation/AutomationPanel/UpdateAutomationModal.svelte"
+  import UpdateAutomationModal from "@/components/automation/AutomationPanel/UpdateAutomationModal.svelte"
-  import NavItem from "components/common/NavItem.svelte"
+  import NavItem from "@/components/common/NavItem.svelte"
 
   export let automation
   export let icon

packages/builder/src/components/automation/AutomationPanel/AutomationPanel.svelte

@@ -1,11 +1,11 @@
 <script>
   import CreateAutomationModal from "./CreateAutomationModal.svelte"
   import { Modal, notifications, Layout } from "@budibase/bbui"
-  import NavHeader from "components/common/NavHeader.svelte"
+  import NavHeader from "@/components/common/NavHeader.svelte"
   import { onMount } from "svelte"
-  import { automationStore, tables } from "stores/builder"
+  import { automationStore, tables } from "@/stores/builder"
   import AutomationNavItem from "./AutomationNavItem.svelte"
-  import { TriggerStepID } from "constants/backend/automations"
+  import { TriggerStepID } from "@/constants/backend/automations"
 
   export let modal
   export let webhookModal

packages/builder/src/components/automation/AutomationPanel/CreateAutomationModal.svelte

@@ -1,6 +1,6 @@
 <script>
   import { goto } from "@roxi/routify"
-  import { automationStore } from "stores/builder"
+  import { automationStore } from "@/stores/builder"
   import {
     notifications,
     Input,
@@ -11,7 +11,7 @@
     Icon,
     Label,
   } from "@budibase/bbui"
-  import { TriggerStepID } from "constants/backend/automations"
+  import { TriggerStepID } from "@/constants/backend/automations"
 
   export let webhookModal
 

packages/builder/src/components/automation/AutomationPanel/UpdateAutomationModal.svelte

@@ -1,5 +1,5 @@
 <script>
-  import { automationStore } from "stores/builder"
+  import { automationStore } from "@/stores/builder"
   import {
     notifications,
     Icon,

packages/builder/src/components/automation/SetupPanel/AutomationBlockSetup.svelte

@@ -20,9 +20,9 @@
     Icon,
   } from "@budibase/bbui"
 
-  import CreateWebhookModal from "components/automation/Shared/CreateWebhookModal.svelte"
+  import CreateWebhookModal from "@/components/automation/Shared/CreateWebhookModal.svelte"
-  import { automationStore, tables } from "stores/builder"
+  import { automationStore, tables } from "@/stores/builder"
-  import { environment } from "stores/portal"
+  import { environment } from "@/stores/portal"
   import WebhookDisplay from "../Shared/WebhookDisplay.svelte"
   import {
     BindingSidePanel,
@@ -30,24 +30,27 @@
     DrawerBindableInput,
     ServerBindingPanel as AutomationBindingPanel,
     ModalBindableInput,
-  } from "components/common/bindings"
+  } from "@/components/common/bindings"
   import CodeEditorModal from "./CodeEditorModal.svelte"
   import QueryParamSelector from "./QueryParamSelector.svelte"
   import AutomationSelector from "./AutomationSelector.svelte"
   import CronBuilder from "./CronBuilder.svelte"
-  import Editor from "components/integration/QueryEditor.svelte"
+  import Editor from "@/components/integration/QueryEditor.svelte"
-  import CodeEditor from "components/common/CodeEditor/CodeEditor.svelte"
+  import CodeEditor from "@/components/common/CodeEditor/CodeEditor.svelte"
-  import KeyValueBuilder from "components/integration/KeyValueBuilder.svelte"
+  import KeyValueBuilder from "@/components/integration/KeyValueBuilder.svelte"
-  import { BindingHelpers, BindingType } from "components/common/bindings/utils"
+  import {
+    BindingHelpers,
+    BindingType,
+  } from "@/components/common/bindings/utils"
   import {
     bindingsToCompletions,
     hbAutocomplete,
     EditorModes,
-  } from "components/common/CodeEditor"
+  } from "@/components/common/CodeEditor"
-  import FilterBuilder from "components/design/settings/controls/FilterEditor/FilterBuilder.svelte"
+  import FilterBuilder from "@/components/design/settings/controls/FilterEditor/FilterBuilder.svelte"
   import { QueryUtils, Utils, search, memo } from "@budibase/frontend-core"
-  import { getSchemaForDatasourcePlus } from "dataBinding"
+  import { getSchemaForDatasourcePlus } from "@/dataBinding"
-  import { TriggerStepID, ActionStepID } from "constants/backend/automations"
+  import { TriggerStepID, ActionStepID } from "@/constants/backend/automations"
   import { onMount, createEventDispatcher } from "svelte"
   import { writable } from "svelte/store"
   import { cloneDeep } from "lodash/fp"

packages/builder/src/components/automation/SetupPanel/AutomationSelector.svelte

@@ -1,8 +1,8 @@
 <script>
   import { Select, Label } from "@budibase/bbui"
   import { createEventDispatcher } from "svelte"
-  import { automationStore, selectedAutomation } from "stores/builder"
+  import { automationStore, selectedAutomation } from "@/stores/builder"
-  import { TriggerStepID } from "constants/backend/automations"
+  import { TriggerStepID } from "@/constants/backend/automations"
   import DrawerBindableInput from "../../common/bindings/DrawerBindableInput.svelte"
   import AutomationBindingPanel from "../../common/bindings/ServerBindingPanel.svelte"
 

packages/builder/src/components/automation/SetupPanel/CronBuilder.svelte

@@ -8,9 +8,9 @@
     notifications,
   } from "@budibase/bbui"
   import { onMount, createEventDispatcher } from "svelte"
-  import { flags } from "stores/builder"
+  import { flags } from "@/stores/builder"
-  import { featureFlags, licensing } from "stores/portal"
+  import { featureFlags, licensing } from "@/stores/portal"
-  import { API } from "api"
+  import { API } from "@/api"
   import MagicWand from "../../../../assets/MagicWand.svelte"
 
   import { helpers, REBOOT_CRON } from "@budibase/shared-core"

packages/builder/src/components/automation/SetupPanel/QueryParamSelector.svelte

@@ -1,6 +1,6 @@
 <script>
   import { createEventDispatcher } from "svelte"
-  import { queries } from "stores/builder"
+  import { queries } from "@/stores/builder"
   import { Select, Label } from "@budibase/bbui"
   import DrawerBindableInput from "../../common/bindings/DrawerBindableInput.svelte"
   import AutomationBindingPanel from "../../common/bindings/ServerBindingPanel.svelte"

packages/builder/src/components/automation/SetupPanel/QuerySelector.svelte

@@ -1,5 +1,5 @@
 <script>
-  import { queries } from "stores/builder"
+  import { queries } from "@/stores/builder"
   import { Select } from "@budibase/bbui"
 
   export let value

packages/builder/src/components/automation/SetupPanel/RowSelector.svelte

@@ -1,5 +1,5 @@
 <script>
-  import { tables } from "stores/builder"
+  import { tables } from "@/stores/builder"
   import {
     ActionButton,
     Popover,
@@ -13,8 +13,8 @@
   import RowSelectorTypes from "./RowSelectorTypes.svelte"
   import DrawerBindableSlot from "../../common/bindings/DrawerBindableSlot.svelte"
   import AutomationBindingPanel from "../../common/bindings/ServerBindingPanel.svelte"
-  import { FIELDS } from "constants/backend"
+  import { FIELDS } from "@/constants/backend"
-  import { capitalise } from "helpers"
+  import { capitalise } from "@/helpers"
   import { memo } from "@budibase/frontend-core"
   import PropField from "./PropField.svelte"
   import { cloneDeep, isPlainObject, mergeWith } from "lodash"

packages/builder/src/components/automation/SetupPanel/RowSelectorTypes.svelte

@@ -7,16 +7,16 @@
     Toggle,
   } from "@budibase/bbui"
   import { FieldType } from "@budibase/types"
-  import LinkedRowSelector from "components/common/LinkedRowSelector.svelte"
+  import LinkedRowSelector from "@/components/common/LinkedRowSelector.svelte"
   import DrawerBindableInput from "../../common/bindings/DrawerBindableInput.svelte"
   import ModalBindableInput from "../../common/bindings/ModalBindableInput.svelte"
   import AutomationBindingPanel from "../../common/bindings/ServerBindingPanel.svelte"
-  import CodeEditor from "components/common/CodeEditor/CodeEditor.svelte"
+  import CodeEditor from "@/components/common/CodeEditor/CodeEditor.svelte"
-  import KeyValueBuilder from "components/integration/KeyValueBuilder.svelte"
+  import KeyValueBuilder from "@/components/integration/KeyValueBuilder.svelte"
   import {
     readableToRuntimeBinding,
     runtimeToReadableBinding,
-  } from "dataBinding"
+  } from "@/dataBinding"
 
   export let onChange
   export let field

packages/builder/src/components/automation/SetupPanel/TableSelector.svelte

@@ -1,8 +1,8 @@
 <script>
-  import { tables } from "stores/builder"
+  import { tables } from "@/stores/builder"
   import { Select } from "@budibase/bbui"
   import { createEventDispatcher } from "svelte"
-  import { TableNames } from "constants"
+  import { TableNames } from "@/constants"
 
   const dispatch = createEventDispatcher()
 

packages/builder/src/components/automation/Shared/CreateWebhookModal.svelte

@@ -1,6 +1,6 @@
 <script>
   import { Icon, notifications, ModalContent } from "@budibase/bbui"
-  import { automationStore, selectedAutomation } from "stores/builder"
+  import { automationStore, selectedAutomation } from "@/stores/builder"
   import WebhookDisplay from "./WebhookDisplay.svelte"
   import { onMount, onDestroy } from "svelte"
 

packages/builder/src/components/backend/DataTable/RowFieldControl.svelte

@@ -1,5 +1,5 @@
 <script>
-  import { API } from "api"
+  import { API } from "@/api"
   import {
     Input,
     Select,
@@ -13,12 +13,12 @@
     ActionButton,
     notifications,
   } from "@budibase/bbui"
-  import Dropzone from "components/common/Dropzone.svelte"
+  import Dropzone from "@/components/common/Dropzone.svelte"
-  import { capitalise } from "helpers"
+  import { capitalise } from "@/helpers"
-  import LinkedRowSelector from "components/common/LinkedRowSelector.svelte"
+  import LinkedRowSelector from "@/components/common/LinkedRowSelector.svelte"
   import Editor from "../../integration/QueryEditor.svelte"
   import { SignatureModal } from "@budibase/frontend-core/src/components"
-  import { themeStore } from "stores/portal"
+  import { themeStore } from "@/stores/portal"
 
   export let meta
   export let value

packages/builder/src/components/backend/DataTable/Table.svelte

@@ -2,8 +2,8 @@
   import { fade } from "svelte/transition"
   import { goto, params } from "@roxi/routify"
   import { Table, Heading, Layout } from "@budibase/bbui"
-  import Spinner from "components/common/Spinner.svelte"
+  import Spinner from "@/components/common/Spinner.svelte"
-  import { TableNames, UNEDITABLE_USER_FIELDS } from "constants"
+  import { TableNames, UNEDITABLE_USER_FIELDS } from "@/constants"
   import RoleCell from "./cells/RoleCell.svelte"
   import { createEventDispatcher } from "svelte"
   import { canBeSortColumn } from "@budibase/frontend-core"

packages/builder/src/components/backend/DataTable/buttons/DeleteRowsButton.svelte

@@ -1,7 +1,7 @@
 <script>
   import { createEventDispatcher } from "svelte"
   import { Button } from "@budibase/bbui"
-  import ConfirmDialog from "components/common/ConfirmDialog.svelte"
+  import ConfirmDialog from "@/components/common/ConfirmDialog.svelte"
 
   export let selectedRows
   export let deleteRows

packages/builder/src/components/backend/DataTable/buttons/ExistingRelationshipButton.svelte

@@ -2,7 +2,7 @@
   import { ActionButton, notifications } from "@budibase/bbui"
   import CreateEditRelationshipModal from "../../Datasources/CreateEditRelationshipModal.svelte"
 
-  import { datasources, tables as tablesStore } from "stores/builder"
+  import { datasources, tables as tablesStore } from "@/stores/builder"
   import { createEventDispatcher } from "svelte"
 
   export let table

packages/builder/src/components/backend/DataTable/buttons/ExportButton.svelte

@@ -7,9 +7,9 @@
     Button,
   } from "@budibase/bbui"
   import download from "downloadjs"
-  import { API } from "api"
+  import { API } from "@/api"
-  import { ROW_EXPORT_FORMATS } from "constants/backend"
+  import { ROW_EXPORT_FORMATS } from "@/constants/backend"
-  import DetailPopover from "components/common/DetailPopover.svelte"
+  import DetailPopover from "@/components/common/DetailPopover.svelte"
 
   export let view
   export let sorting

packages/builder/src/components/backend/DataTable/buttons/ImportButton.svelte

@@ -1,9 +1,9 @@
 <script>
   import { ActionButton, Button, Body, notifications } from "@budibase/bbui"
-  import DetailPopover from "components/common/DetailPopover.svelte"
+  import DetailPopover from "@/components/common/DetailPopover.svelte"
-  import ExistingTableDataImport from "components/backend/TableNavigator/ExistingTableDataImport.svelte"
+  import ExistingTableDataImport from "@/components/backend/TableNavigator/ExistingTableDataImport.svelte"
   import { createEventDispatcher } from "svelte"
-  import { API } from "api"
+  import { API } from "@/api"
 
   export let tableId
   export let tableType

packages/builder/src/components/backend/DataTable/buttons/ManageAccessButton.svelte

@@ -8,12 +8,12 @@
     ListItem,
     notifications,
   } from "@budibase/bbui"
-  import { permissions as permissionsStore, roles } from "stores/builder"
+  import { permissions as permissionsStore, roles } from "@/stores/builder"
-  import DetailPopover from "components/common/DetailPopover.svelte"
+  import DetailPopover from "@/components/common/DetailPopover.svelte"
   import { PermissionSource } from "@budibase/types"
-  import { capitalise } from "helpers"
+  import { capitalise } from "@/helpers"
-  import InfoDisplay from "pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Component/InfoDisplay.svelte"
+  import InfoDisplay from "@/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Component/InfoDisplay.svelte"
-  import { Roles } from "constants/backend"
+  import { Roles } from "@/constants/backend"
 
   export let resourceId
 

packages/builder/src/components/backend/DataTable/buttons/TableFilterButton.svelte

@@ -1,12 +1,12 @@
 <script>
   import { createEventDispatcher } from "svelte"
   import { ActionButton, Button } from "@budibase/bbui"
-  import FilterBuilder from "components/design/settings/controls/FilterEditor/FilterBuilder.svelte"
+  import FilterBuilder from "@/components/design/settings/controls/FilterEditor/FilterBuilder.svelte"
-  import { getUserBindings } from "dataBinding"
+  import { getUserBindings } from "@/dataBinding"
   import { makePropSafe } from "@budibase/string-templates"
   import { search, Utils } from "@budibase/frontend-core"
-  import { tables } from "stores/builder"
+  import { tables } from "@/stores/builder"
-  import DetailPopover from "components/common/DetailPopover.svelte"
+  import DetailPopover from "@/components/common/DetailPopover.svelte"
 
   export let schema
   export let filters

packages/builder/src/components/backend/DataTable/buttons/grid/ColumnsSettingContent.svelte

@@ -1,6 +1,6 @@
 <script>
   import { getContext } from "svelte"
-  import ToggleActionButtonGroup from "components/common/ToggleActionButtonGroup.svelte"
+  import ToggleActionButtonGroup from "@/components/common/ToggleActionButtonGroup.svelte"
   import { helpers } from "@budibase/shared-core"
   import { SchemaUtils } from "@budibase/frontend-core"
   import { Icon, notifications, ActionButton, Popover } from "@budibase/bbui"

packages/builder/src/components/backend/DataTable/buttons/grid/GridAutomationsButton.svelte

@@ -1,8 +1,8 @@
 <script>
   import { ActionButton, List, ListItem, Button } from "@budibase/bbui"
-  import DetailPopover from "components/common/DetailPopover.svelte"
+  import DetailPopover from "@/components/common/DetailPopover.svelte"
-  import { TriggerStepID } from "constants/backend/automations"
+  import { TriggerStepID } from "@/constants/backend/automations"
-  import { automationStore, appStore } from "stores/builder"
+  import { automationStore, appStore } from "@/stores/builder"
   import { createEventDispatcher, getContext } from "svelte"
 
   const dispatch = createEventDispatcher()

packages/builder/src/components/backend/DataTable/buttons/grid/GridColumnsSettingButton.svelte

@@ -10,7 +10,7 @@
   import { getContext } from "svelte"
   import { ActionButton } from "@budibase/bbui"
   import ColumnsSettingContent from "./ColumnsSettingContent.svelte"
-  import DetailPopover from "components/common/DetailPopover.svelte"
+  import DetailPopover from "@/components/common/DetailPopover.svelte"
 
   const { tableColumns, datasource } = getContext("grid")
 

packages/builder/src/components/backend/DataTable/buttons/grid/GridGenerateButton.svelte

@@ -6,14 +6,14 @@
     tables,
     builderStore,
     viewsV2,
-  } from "stores/builder"
+  } from "@/stores/builder"
-  import { TriggerStepID } from "constants/backend/automations"
+  import { TriggerStepID } from "@/constants/backend/automations"
   import { goto } from "@roxi/routify"
-  import DetailPopover from "components/common/DetailPopover.svelte"
+  import DetailPopover from "@/components/common/DetailPopover.svelte"
   import MagicWand from "./magic-wand.svg"
-  import { AutoScreenTypes } from "constants"
+  import { AutoScreenTypes } from "@/constants"
-  import CreateScreenModal from "pages/builder/app/[application]/design/_components/NewScreen/CreateScreenModal.svelte"
+  import CreateScreenModal from "@/pages/builder/app/[application]/design/_components/NewScreen/CreateScreenModal.svelte"
-  import { getSequentialName } from "helpers/duplicate"
+  import { getSequentialName } from "@/helpers/duplicate"
 
   const { datasource } = getContext("grid")
 

packages/builder/src/components/backend/DataTable/buttons/grid/GridRowActionsButton.svelte

@@ -10,9 +10,9 @@
     ModalContent,
     Input,
   } from "@budibase/bbui"
-  import DetailPopover from "components/common/DetailPopover.svelte"
+  import DetailPopover from "@/components/common/DetailPopover.svelte"
   import { getContext } from "svelte"
-  import { appStore, rowActions } from "stores/builder"
+  import { appStore, rowActions } from "@/stores/builder"
   import { goto, url } from "@roxi/routify"
   import { derived } from "svelte/store"
 

packages/builder/src/components/backend/DataTable/buttons/grid/GridScreensButton.svelte

@@ -1,7 +1,7 @@
 <script>
   import { ActionButton, List, ListItem, Button } from "@budibase/bbui"
-  import DetailPopover from "components/common/DetailPopover.svelte"
+  import DetailPopover from "@/components/common/DetailPopover.svelte"
-  import { screenStore, appStore } from "stores/builder"
+  import { screenStore, appStore } from "@/stores/builder"
   import { getContext, createEventDispatcher } from "svelte"
 
   const { datasource } = getContext("grid")

packages/builder/src/components/backend/DataTable/buttons/grid/GridSizeButton.svelte

@@ -1,7 +1,7 @@
 <script>
   import { getContext } from "svelte"
   import { ActionButton, Label } from "@budibase/bbui"
-  import DetailPopover from "components/common/DetailPopover.svelte"
+  import DetailPopover from "@/components/common/DetailPopover.svelte"
 
   const {
     Constants,

packages/builder/src/components/backend/DataTable/buttons/grid/GridSortButton.svelte

@@ -2,7 +2,7 @@
   import { getContext } from "svelte"
   import { ActionButton, Select } from "@budibase/bbui"
   import { canBeSortColumn } from "@budibase/frontend-core"
-  import DetailPopover from "components/common/DetailPopover.svelte"
+  import DetailPopover from "@/components/common/DetailPopover.svelte"
 
   const { sort, columns } = getContext("grid")
 

packages/builder/src/components/backend/DataTable/buttons/grid/GridUsersTableButton.svelte

@@ -1,6 +1,6 @@
 <script>
   import { ActionButton, Popover, Heading, Body, Button } from "@budibase/bbui"
-  import { builderStore } from "stores/builder"
+  import { builderStore } from "@/stores/builder"
 
   let anchor
   let open = false

packages/builder/src/components/backend/DataTable/buttons/grid/GridViewCalculationButton.svelte

@@ -7,9 +7,9 @@
     Button,
   } from "@budibase/bbui"
   import { CalculationType, canGroupBy, isNumeric } from "@budibase/types"
-  import InfoDisplay from "pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Component/InfoDisplay.svelte"
+  import InfoDisplay from "@/pages/builder/app/[application]/design/[screenId]/[componentId]/_components/Component/InfoDisplay.svelte"
   import { getContext } from "svelte"
-  import DetailPopover from "components/common/DetailPopover.svelte"
+  import DetailPopover from "@/components/common/DetailPopover.svelte"
 
   const { definition, datasource, rows } = getContext("grid")
   const calculationTypeOptions = [

packages/builder/src/components/backend/DataTable/cells/RoleCell.svelte

@@ -1,5 +1,5 @@
 <script>
-  import { roles } from "stores/builder"
+  import { roles } from "@/stores/builder"
 
   export let value
 

packages/builder/src/components/backend/DataTable/formula.js

@@ -1,6 +1,6 @@
 import { FieldType } from "@budibase/types"
-import { FIELDS } from "constants/backend"
+import { FIELDS } from "@/constants/backend"
-import { tables } from "stores/builder"
+import { tables } from "@/stores/builder"
 import { get as svelteGet } from "svelte/store"
 
 // currently supported level of relationship depth (server side)

packages/builder/src/components/backend/DataTable/modals/CalculateModal.svelte

@@ -1,7 +1,7 @@
 <script>
   import { Select, Label, notifications, ModalContent } from "@budibase/bbui"
-  import { tables, views } from "stores/builder"
+  import { tables, views } from "@/stores/builder"
-  import { FIELDS } from "constants/backend"
+  import { FIELDS } from "@/constants/backend"
 
   const CALCULATIONS = [
     {

packages/builder/src/components/backend/DataTable/modals/CreateEditColumn.svelte

@@ -25,32 +25,32 @@
   import { makePropSafe } from "@budibase/string-templates"
   import { createEventDispatcher, getContext, onMount } from "svelte"
   import { cloneDeep } from "lodash/fp"
-  import { tables, datasources } from "stores/builder"
+  import { tables, datasources } from "@/stores/builder"
-  import { featureFlags } from "stores/portal"
+  import { featureFlags } from "@/stores/portal"
-  import { TableNames, UNEDITABLE_USER_FIELDS } from "constants"
+  import { TableNames, UNEDITABLE_USER_FIELDS } from "@/constants"
   import {
     FIELDS,
     RelationshipType,
     PrettyRelationshipDefinitions,
     DB_TYPE_EXTERNAL,
-  } from "constants/backend"
+  } from "@/constants/backend"
-  import { getAutoColumnInformation, buildAutoColumn } from "helpers/utils"
+  import { getAutoColumnInformation, buildAutoColumn } from "@/helpers/utils"
-  import ConfirmDialog from "components/common/ConfirmDialog.svelte"
+  import ConfirmDialog from "@/components/common/ConfirmDialog.svelte"
-  import AIFieldConfiguration from "components/common/AIFieldConfiguration.svelte"
+  import AIFieldConfiguration from "@/components/common/AIFieldConfiguration.svelte"
-  import ModalBindableInput from "components/common/bindings/ModalBindableInput.svelte"
+  import ModalBindableInput from "@/components/common/bindings/ModalBindableInput.svelte"
-  import { getBindings } from "components/backend/DataTable/formula"
+  import { getBindings } from "@/components/backend/DataTable/formula"
   import JSONSchemaModal from "./JSONSchemaModal.svelte"
   import {
     BBReferenceFieldSubType,
     FieldType,
     SourceName,
   } from "@budibase/types"
-  import RelationshipSelector from "components/common/RelationshipSelector.svelte"
+  import RelationshipSelector from "@/components/common/RelationshipSelector.svelte"
   import { RowUtils, canBeDisplayColumn } from "@budibase/frontend-core"
-  import ServerBindingPanel from "components/common/bindings/ServerBindingPanel.svelte"
+  import ServerBindingPanel from "@/components/common/bindings/ServerBindingPanel.svelte"
   import OptionsEditor from "./OptionsEditor.svelte"
-  import { isEnabled } from "helpers/featureFlags"
+  import { isEnabled } from "@/helpers/featureFlags"
-  import { getUserBindings } from "dataBinding"
+  import { getUserBindings } from "@/dataBinding"
 
   export let field
 

packages/builder/src/components/backend/DataTable/modals/CreateEditRow.svelte

@@ -1,10 +1,10 @@
 <script>
   import { createEventDispatcher } from "svelte"
-  import { tables } from "stores/builder"
+  import { tables } from "@/stores/builder"
   import { ModalContent, keepOpen, notifications } from "@budibase/bbui"
   import RowFieldControl from "../RowFieldControl.svelte"
-  import { API } from "api"
+  import { API } from "@/api"
-  import { FIELDS } from "constants/backend"
+  import { FIELDS } from "@/constants/backend"
 
   const FORMULA_TYPE = FIELDS.FORMULA.type
   const AI_TYPE = FIELDS.AI.type

packages/builder/src/components/backend/DataTable/modals/CreateEditUser.svelte

@@ -1,6 +1,6 @@
 <script>
   import { createEventDispatcher } from "svelte"
-  import { tables, roles } from "stores/builder"
+  import { tables, roles } from "@/stores/builder"
   import {
     notifications,
     keepOpen,
@@ -9,8 +9,8 @@
     Link,
   } from "@budibase/bbui"
   import RowFieldControl from "../RowFieldControl.svelte"
-  import { API } from "api"
+  import { API } from "@/api"
-  import ErrorsBox from "components/common/ErrorsBox.svelte"
+  import ErrorsBox from "@/components/common/ErrorsBox.svelte"
   import { goto } from "@roxi/routify"
 
   export let row = {}

packages/builder/src/components/backend/DataTable/modals/FilterModal.svelte

@@ -10,7 +10,7 @@
     notifications,
     Icon,
   } from "@budibase/bbui"
-  import { tables, views } from "stores/builder"
+  import { tables, views } from "@/stores/builder"
 
   const CONDITIONS = [
     {

packages/builder/src/components/backend/DataTable/modals/GroupByModal.svelte

@@ -1,7 +1,7 @@
 <script>
   import { Select, ModalContent, notifications } from "@budibase/bbui"
-  import { tables, views } from "stores/builder"
+  import { tables, views } from "@/stores/builder"
-  import { FIELDS } from "constants/backend"
+  import { FIELDS } from "@/constants/backend"
 
   export let view = {}
 

packages/builder/src/components/backend/DataTable/modals/JSONSchemaModal.svelte

@@ -1,5 +1,5 @@
 <script>
-  import Editor from "components/integration/QueryEditor.svelte"
+  import Editor from "@/components/integration/QueryEditor.svelte"
   import {
     ModalContent,
     Tabs,
@@ -12,8 +12,8 @@
     ActionButton,
   } from "@budibase/bbui"
   import { onMount, createEventDispatcher } from "svelte"
-  import { FIELDS } from "constants/backend"
+  import { FIELDS } from "@/constants/backend"
-  import { generate } from "helpers/schemaGenerator"
+  import { generate } from "@/helpers/schemaGenerator"
 
   export let schema = {}
   export let json

packages/builder/src/components/backend/DataTable/modals/OptionsEditor.svelte

@@ -4,7 +4,7 @@
   import { Icon, Popover } from "@budibase/bbui"
   import { tick } from "svelte"
   import { Constants } from "@budibase/frontend-core"
-  import { getSequentialName } from "helpers/duplicate"
+  import { getSequentialName } from "@/helpers/duplicate"
   import { derived, writable } from "svelte/store"
 
   export let constraints

packages/builder/src/components/backend/DataTable/modals/grid/GridCreateColumnModal.svelte

@@ -1,6 +1,6 @@
 <script>
   import { getContext } from "svelte"
-  import CreateEditColumn from "components/backend/DataTable/modals/CreateEditColumn.svelte"
+  import CreateEditColumn from "@/components/backend/DataTable/modals/CreateEditColumn.svelte"
 
   const { datasource, rows } = getContext("grid")
 

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

@@ -1,12 +1,12 @@
 <script>
   import { isActive } from "@roxi/routify"
-  import { BUDIBASE_INTERNAL_DB_ID } from "constants/backend"
+  import { BUDIBASE_INTERNAL_DB_ID } from "@/constants/backend"
-  import { contextMenuStore, userSelectedResourceMap } from "stores/builder"
+  import { contextMenuStore, userSelectedResourceMap } from "@/stores/builder"
-  import NavItem from "components/common/NavItem.svelte"
+  import NavItem from "@/components/common/NavItem.svelte"
 
-  import IntegrationIcon from "components/backend/DatasourceNavigator/IntegrationIcon.svelte"
+  import IntegrationIcon from "@/components/backend/DatasourceNavigator/IntegrationIcon.svelte"
   import { Icon } from "@budibase/bbui"
-  import UpdateDatasourceModal from "components/backend/DatasourceNavigator/modals/UpdateDatasourceModal.svelte"
+  import UpdateDatasourceModal from "@/components/backend/DatasourceNavigator/modals/UpdateDatasourceModal.svelte"
   import DeleteConfirmationModal from "./DeleteConfirmationModal.svelte"
 
   export let datasource

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

@@ -1,8 +1,8 @@
 <script>
   import { goto } from "@roxi/routify"
-  import { datasources } from "stores/builder"
+  import { datasources } from "@/stores/builder"
   import { notifications } from "@budibase/bbui"
-  import ConfirmDialog from "components/common/ConfirmDialog.svelte"
+  import ConfirmDialog from "@/components/common/ConfirmDialog.svelte"
 
   export let datasource
 

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

@@ -8,12 +8,12 @@
     views,
     viewsV2,
     userSelectedResourceMap,
-  } from "stores/builder"
+  } from "@/stores/builder"
   import QueryNavItem from "./QueryNavItem.svelte"
-  import NavItem from "components/common/NavItem.svelte"
+  import NavItem from "@/components/common/NavItem.svelte"
-  import TableNavigator from "components/backend/TableNavigator/TableNavigator.svelte"
+  import TableNavigator from "@/components/backend/TableNavigator/TableNavigator.svelte"
   import DatasourceNavItem from "./DatasourceNavItem/DatasourceNavItem.svelte"
-  import { TableNames } from "constants"
+  import { TableNames } from "@/constants"
   import { enrichDatasources } from "./datasourceUtils"
   import { onMount } from "svelte"
 

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

@@ -1,6 +1,6 @@
 <script>
   import { getIcon } from "./icons"
-  import CustomSVG from "components/common/CustomSVG.svelte"
+  import CustomSVG from "@/components/common/CustomSVG.svelte"
 
   export let integrationType
   export let schema

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

@@ -3,16 +3,16 @@
     customQueryIconText,
     customQueryIconColor,
     customQueryText,
-  } from "helpers/data/utils"
+  } from "@/helpers/data/utils"
   import { goto as gotoStore, isActive } from "@roxi/routify"
   import {
     datasources,
     queries,
     userSelectedResourceMap,
     contextMenuStore,
-  } from "stores/builder"
+  } from "@/stores/builder"
-  import NavItem from "components/common/NavItem.svelte"
+  import NavItem from "@/components/common/NavItem.svelte"
-  import ConfirmDialog from "components/common/ConfirmDialog.svelte"
+  import ConfirmDialog from "@/components/common/ConfirmDialog.svelte"
   import { notifications, Icon } from "@budibase/bbui"
 
   export let datasource

packages/builder/src/components/backend/DatasourceNavigator/datasourceUtils.js

@@ -1,4 +1,4 @@
-import { TableNames } from "constants"
+import { TableNames } from "@/constants"
 
 const showDatasourceOpen = ({
   selected,

packages/builder/src/components/backend/DatasourceNavigator/icons/index.js

@@ -16,7 +16,7 @@ import Firebase from "./Firebase.svelte"
 import Redis from "./Redis.svelte"
 import Snowflake from "./Snowflake.svelte"
 import Custom from "./Custom.svelte"
-import { integrations } from "stores/builder"
+import { integrations } from "@/stores/builder"
 import { get } from "svelte/store"
 
 const ICONS = {

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

@@ -12,7 +12,7 @@
     TextArea,
     Dropzone,
   } from "@budibase/bbui"
-  import { datasources, queries } from "stores/builder"
+  import { datasources, queries } from "@/stores/builder"
   import { writable } from "svelte/store"
 
   export let navigateDatasource = false

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

@@ -1,8 +1,8 @@
 <script>
   import { get } from "svelte/store"
-  import { datasources, integrations } from "stores/builder"
+  import { datasources, integrations } from "@/stores/builder"
   import { notifications, Input, ModalContent, Modal } from "@budibase/bbui"
-  import { integrationForDatasource } from "stores/selectors"
+  import { integrationForDatasource } from "@/stores/selectors"
 
   let error = ""
   let modal

packages/builder/src/components/backend/Datasources/ConfigEditor/fields/Object.svelte

@@ -1,6 +1,6 @@
 <script>
   import { Label, Button } from "@budibase/bbui"
-  import KeyValueBuilder from "components/integration/KeyValueBuilder.svelte"
+  import KeyValueBuilder from "@/components/integration/KeyValueBuilder.svelte"
 
   export let name
   export let value

packages/builder/src/components/backend/Datasources/ConfigEditor/fields/String.svelte

@@ -1,6 +1,6 @@
 <script>
   import { Label, EnvDropdown } from "@budibase/bbui"
-  import { environment, licensing } from "stores/portal"
+  import { environment, licensing } from "@/stores/portal"
 
   export let type
   export let name

packages/builder/src/components/backend/Datasources/ConfigEditor/index.svelte

@@ -8,12 +8,12 @@
     ModalContent,
   } from "@budibase/bbui"
   import { processStringSync } from "@budibase/string-templates"
-  import CreateEditVariableModal from "components/portal/environment/CreateEditVariableModal.svelte"
+  import CreateEditVariableModal from "@/components/portal/environment/CreateEditVariableModal.svelte"
   import ConfigInput from "./ConfigInput.svelte"
   import { createValidatedConfigStore } from "./stores/validatedConfig"
   import { createValidatedNameStore } from "./stores/validatedName"
   import { get } from "svelte/store"
-  import { environment } from "stores/portal"
+  import { environment } from "@/stores/portal"
 
   export let integration
   export let config

packages/builder/src/components/backend/Datasources/ConfigEditor/stores/validatedConfig.js

@@ -1,6 +1,6 @@
 import { derived, writable, get } from "svelte/store"
 import { getValidatorFields } from "./validation"
-import { capitalise } from "helpers"
+import { capitalise } from "@/helpers"
 import { notifications } from "@budibase/bbui"
 import { object } from "yup"
 

packages/builder/src/components/backend/Datasources/ConfigEditor/stores/validatedName.js

@@ -1,5 +1,5 @@
 import { derived, get, writable } from "svelte/store"
-import { capitalise } from "helpers"
+import { capitalise } from "@/helpers"
 import { string } from "yup"
 
 export const createValidatedNameStore = (name, isVisible) => {

packages/builder/src/components/backend/Datasources/CreateEditRelationship.svelte

@@ -2,7 +2,7 @@
   import {
     RelationshipType,
     PrettyRelationshipDefinitions,
-  } from "constants/backend"
+  } from "@/constants/backend"
   import {
     keepOpen,
     Button,
@@ -13,10 +13,10 @@
     Body,
     Helpers,
   } from "@budibase/bbui"
-  import { tables } from "stores/builder"
+  import { tables } from "@/stores/builder"
   import { RelationshipErrorChecker } from "./relationshipErrors"
   import { onMount } from "svelte"
-  import RelationshipSelector from "components/common/RelationshipSelector.svelte"
+  import RelationshipSelector from "@/components/common/RelationshipSelector.svelte"
 
   export let save
   export let datasource

packages/builder/src/components/backend/Datasources/CreateEditRelationshipModal.svelte

@@ -2,8 +2,8 @@
   import { Modal } from "@budibase/bbui"
   import { get } from "svelte/store"
   import CreateEditRelationship from "./CreateEditRelationship.svelte"
-  import { integrations, datasources } from "stores/builder"
+  import { integrations, datasources } from "@/stores/builder"
-  import { integrationForDatasource } from "stores/selectors"
+  import { integrationForDatasource } from "@/stores/selectors"
 
   export let datasource
   export let tables

packages/builder/src/components/backend/Datasources/TableImportSelection/index.svelte

@@ -6,8 +6,8 @@
     Layout,
     ModalContent,
   } from "@budibase/bbui"
-  import Spinner from "components/common/Spinner.svelte"
+  import Spinner from "@/components/common/Spinner.svelte"
-  import { IntegrationTypes } from "constants/backend"
+  import { IntegrationTypes } from "@/constants/backend"
   import { createTableSelectionStore } from "./tableSelectionStore"
 
   export let integration

packages/builder/src/components/backend/Datasources/TableImportSelection/tableSelectionStore.js

@@ -1,6 +1,6 @@
 import { derived, writable, get } from "svelte/store"
 import { keepOpen, notifications } from "@budibase/bbui"
-import { datasources, tables } from "stores/builder"
+import { datasources, tables } from "@/stores/builder"
 
 export const createTableSelectionStore = (integration, datasource) => {
   const tableNamesStore = writable([])

packages/builder/src/components/backend/RoleEditor/RoleEdge.svelte

@@ -2,7 +2,7 @@
   import { getBezierPath, BaseEdge, EdgeLabelRenderer } from "@xyflow/svelte"
   import { Icon, TooltipPosition } from "@budibase/bbui"
   import { getContext, onMount } from "svelte"
-  import { roles } from "stores/builder"
+  import { roles } from "@/stores/builder"
 
   export let sourceX
   export let sourceY

packages/builder/src/components/backend/RoleEditor/RoleFlow.svelte

@@ -23,9 +23,9 @@
   import { setContext, tick } from "svelte"
   import Controls from "./Controls.svelte"
   import { GridResolution, MaxAutoZoom, ZoomDuration } from "./constants"
-  import { roles } from "stores/builder"
+  import { roles } from "@/stores/builder"
-  import { Roles } from "constants/backend"
+  import { Roles } from "@/constants/backend"
-  import { getSequentialName } from "helpers/duplicate"
+  import { getSequentialName } from "@/helpers/duplicate"
   import { derivedMemo } from "@budibase/frontend-core"
 
   const flow = useSvelteFlow()

packages/builder/src/components/backend/RoleEditor/RoleNode.svelte

@@ -10,8 +10,8 @@
   } from "@budibase/bbui"
   import { NodeWidth, NodeHeight } from "./constants"
   import { getContext } from "svelte"
-  import { roles } from "stores/builder"
+  import { roles } from "@/stores/builder"
-  import ConfirmDialog from "components/common/ConfirmDialog.svelte"
+  import ConfirmDialog from "@/components/common/ConfirmDialog.svelte"
 
   export let data
   export let id

packages/builder/src/components/backend/RoleEditor/utils.js

@@ -9,8 +9,8 @@ import {
   EmptyStateID,
 } from "./constants"
 import { getNodesBounds, Position } from "@xyflow/svelte"
-import { Roles } from "constants/backend"
+import { Roles } from "@/constants/backend"
-import { roles } from "stores/builder"
+import { roles } from "@/stores/builder"
 import { get } from "svelte/store"
 
 // Calculates the bounds of all custom nodes

packages/builder/src/components/backend/TableNavigator/ExistingTableDataImport.svelte

@@ -5,10 +5,10 @@
     SourceName,
   } from "@budibase/types"
   import { Select, Toggle, Multiselect, Label, Layout } from "@budibase/bbui"
-  import { DB_TYPE_INTERNAL } from "constants/backend"
+  import { DB_TYPE_INTERNAL } from "@/constants/backend"
-  import { API } from "api"
+  import { API } from "@/api"
   import { parseFile } from "./utils"
-  import { tables, datasources } from "stores/builder"
+  import { tables, datasources } from "@/stores/builder"
 
   let error = null
   let fileName = null

packages/builder/src/components/backend/TableNavigator/TableDataImport.svelte

@@ -1,9 +1,9 @@
 <script>
   import { Select, Icon, Layout, Label } from "@budibase/bbui"
-  import { FIELDS } from "constants/backend"
+  import { FIELDS } from "@/constants/backend"
   import { utils } from "@budibase/shared-core"
   import { canBeDisplayColumn } from "@budibase/frontend-core"
-  import { API } from "api"
+  import { API } from "@/api"
   import { parseFile } from "./utils"
 
   export let rows = []

packages/builder/src/components/backend/TableNavigator/TableNavItem/DeleteConfirmationModal.svelte

@@ -1,9 +1,9 @@
 <script>
   import { goto, params } from "@roxi/routify"
-  import { appStore, tables, datasources, screenStore } from "stores/builder"
+  import { appStore, tables, datasources, screenStore } from "@/stores/builder"
   import { InlineAlert, Link, Input, notifications } from "@budibase/bbui"
-  import ConfirmDialog from "components/common/ConfirmDialog.svelte"
+  import ConfirmDialog from "@/components/common/ConfirmDialog.svelte"
-  import { DB_TYPE_EXTERNAL } from "constants/backend"
+  import { DB_TYPE_EXTERNAL } from "@/constants/backend"
 
   export let table
 

packages/builder/src/components/backend/TableNavigator/TableNavItem/EditModal.svelte

@@ -1,6 +1,6 @@
 <script>
   import { cloneDeep } from "lodash/fp"
-  import { tables, datasources } from "stores/builder"
+  import { tables, datasources } from "@/stores/builder"
   import { Input, Modal, ModalContent, notifications } from "@budibase/bbui"
 
   export let table

packages/builder/src/components/backend/TableNavigator/TableNavItem/TableNavItem.svelte

@@ -3,14 +3,14 @@
     tables as tablesStore,
     userSelectedResourceMap,
     contextMenuStore,
-  } from "stores/builder"
+  } from "@/stores/builder"
-  import { TableNames } from "constants"
+  import { TableNames } from "@/constants"
-  import NavItem from "components/common/NavItem.svelte"
+  import NavItem from "@/components/common/NavItem.svelte"
   import { isActive } from "@roxi/routify"
   import EditModal from "./EditModal.svelte"
   import DeleteConfirmationModal from "./DeleteConfirmationModal.svelte"
   import { Icon } from "@budibase/bbui"
-  import { DB_TYPE_EXTERNAL } from "constants/backend"
+  import { DB_TYPE_EXTERNAL } from "@/constants/backend"
 
   export let table
   export let idx

packages/builder/src/components/backend/TableNavigator/modals/CreateTableModal.svelte

@@ -1,13 +1,13 @@
 <script>
   import { goto, url } from "@roxi/routify"
-  import { tables, datasources } from "stores/builder"
+  import { tables, datasources } from "@/stores/builder"
   import { notifications, Input, ModalContent } from "@budibase/bbui"
   import TableDataImport from "../TableDataImport.svelte"
   import {
     BUDIBASE_INTERNAL_DB_ID,
     BUDIBASE_DATASOURCE_TYPE,
     DB_TYPE_INTERNAL,
-  } from "constants/backend"
+  } from "@/constants/backend"
 
   $: tableNames = $tables.list.map(table => table.name)
   $: selectedSource = $datasources.list.find(