Update routing to serve any builder routes under /app so that envoy can proxy correctly

packages/builder/cypress.json

@@ -1,5 +1,5 @@
 {
-  "baseUrl": "http://localhost:10000/builder/",
+  "baseUrl": "http://localhost:10000/app/",
   "video": true,
   "projectId": "bmbemn",
   "env": {

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

@@ -1,7 +1,7 @@
 <script>
   import { Input, Select, DatePicker, Toggle, TextArea } from "@budibase/bbui"
   import Dropzone from "components/common/Dropzone.svelte"
-  import { capitalise } from "../../../helpers"
+  import { capitalise } from "helpers"
   import LinkedRowSelector from "components/common/LinkedRowSelector.svelte"
 
   export let defaultValue

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

@@ -59,7 +59,7 @@
 
   const selectRelationship = ({ tableId, rowId, fieldName }) => {
     $goto(
-      `/builder/${$params.application}/data/table/${tableId}/relationship/${rowId}/${fieldName}`
+      `/app/builder/${$params.application}/data/table/${tableId}/relationship/${rowId}/${fieldName}`
     )
   }
 

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

@@ -8,7 +8,7 @@
     Body,
     ModalContent,
   } from "@budibase/bbui"
-  import { capitalise } from "../../../../helpers"
+  import { capitalise } from "helpers"
 
   export let resourceId
   export let permissions

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

@@ -1,7 +1,7 @@
 <script>
   import { Label, Input, Layout } from "@budibase/bbui"
   import KeyValueBuilder from "components/integration/KeyValueBuilder.svelte"
-  import { capitalise } from "../../../../helpers"
+  import { capitalise } from "helpers"
 
   export let integration
   export let schema

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

@@ -14,7 +14,7 @@
     getBindableProperties,
     readableToRuntimeBinding,
   } from "builderStore/dataBinding"
-  import { currentAsset, store } from "../../../builderStore"
+  import { currentAsset, store } from "builderStore"
   import { handlebarsCompletions } from "constants/completions"
   import { addToText } from "./utils"
 

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

@@ -10,7 +10,7 @@
   import { createEventDispatcher } from "svelte"
   import { isValid } from "@budibase/string-templates"
   import { handlebarsCompletions } from "constants/completions"
-  import { readableToRuntimeBinding } from "../../../builderStore/dataBinding"
+  import { readableToRuntimeBinding } from "builderStore/dataBinding"
   import { addToText } from "./utils"
 
   const dispatch = createEventDispatcher()

packages/builder/src/components/design/AppPreview/CurrentItemPreview.svelte

@@ -3,7 +3,7 @@
   import { store, currentAsset, selectedComponent } from "builderStore"
   import iframeTemplate from "./iframeTemplate"
   import { Screen } from "builderStore/store/screenTemplates/utils/Screen"
-  import { FrontendTypes } from "../../../constants"
+  import { FrontendTypes } from "constants"
 
   let iframe
   let layout
@@ -82,7 +82,8 @@
     style="height: 100%; width: 100%"
     title="componentPreview"
     bind:this={iframe}
-    srcdoc={template} />
+    srcdoc={template}
+  />
 </div>
 
 <style>

packages/builder/src/components/design/PropertiesPanel/PropertyControls/PropertyControl.svelte

@@ -7,7 +7,7 @@
     runtimeToReadableBinding,
   } from "builderStore/dataBinding"
   import BindingPanel from "components/common/bindings/BindingPanel.svelte"
-  import { capitalise } from "../../../../helpers"
+  import { capitalise } from "helpers"
 
   export let label = ""
   export let bindable = true

packages/builder/src/components/settings/tabs/DangerZone.svelte

@@ -11,7 +11,7 @@
     const id = $params.application
     await del(`/api/applications/${id}`)
     loading = false
-    $goto("/builder/")
+    $goto("/app")
   }
 </script>
 

packages/builder/src/components/start/AppCard.svelte

@@ -36,7 +36,7 @@
 <Layout noPadding gap="XS">
   <div class="preview" use:gradient />
   <div class="title">
-    <Link href={`/builder/${_id}`}>
+    <Link href={`/app/builder/${_id}`}>
       <Heading size="XS">
         {name}
       </Heading>

packages/builder/src/pages/builder/[application]/_reset.svelte → packages/builder/src/pages/app/builder/[application]/_reset.svelte

@@ -6,9 +6,9 @@
   import ThemeEditorDropdown from "components/settings/ThemeEditorDropdown.svelte"
   import FeedbackNavLink from "components/feedback/FeedbackNavLink.svelte"
   import { get } from "builderStore/api"
-  import { isActive, goto, layout, params } from "@roxi/routify"
+  import { isActive, goto, layout } from "@roxi/routify"
   import Logo from "/assets/bb-logo.svg"
-  import { capitalise } from "../../../helpers"
+  import { capitalise } from "helpers"
 
   // Get Package and set store
   export let application

packages/builder/src/pages/builder/[application]/data/datasource/[selectedDatasource]/index.svelte → packages/builder/src/pages/app/builder/[application]/data/datasource/[selectedDatasource]/index.svelte

@@ -5,7 +5,7 @@
   import { notifications } from "@budibase/bbui"
   import IntegrationConfigForm from "components/backend/DatasourceNavigator/TableIntegrationMenu/IntegrationConfigForm.svelte"
   import ICONS from "components/backend/DatasourceNavigator/icons"
-  import { capitalise } from "../../../../../../helpers"
+  import { capitalise } from "helpers"
 
   let unsaved = false
 

packages/builder/src/pages/app/index.svelte

@@ -0,0 +1,4 @@
+<script>
+  import { goto } from "@roxi/routify"
+  $goto("./portal")
+</script>

packages/builder/src/pages/portal/_layout.svelte → packages/builder/src/pages/app/portal/_layout.svelte

@@ -35,15 +35,19 @@
   onMount(getInfo)
 
   let menu = [
-    { title: "Apps", href: "/portal/apps" },
+    { title: "Apps", href: "/app/portal/apps" },
-    { title: "Drafts", href: "/portal/drafts" },
+    { title: "Drafts", href: "/app/portal/drafts" },
-    { title: "Users", href: "/portal/users", heading: "Manage" },
+    { title: "Users", href: "/app/portal/users", heading: "Manage" },
-    { title: "Groups", href: "/portal/groups" },
+    { title: "Groups", href: "/app/portal/groups" },
-    { title: "Auth", href: "/portal/oauth" },
+    { title: "Auth", href: "/app/portal/oauth" },
-    { title: "Email", href: "/portal/email" },
+    { title: "Email", href: "/app/portal/email" },
-    { title: "General", href: "/portal/settings/general", heading: "Settings" },
+    {
-    { title: "Theming", href: "/portal/theming" },
+      title: "General",
-    { title: "Account", href: "/portal/account" },
+      href: "/app/portal/settings/general",
+      heading: "Settings",
+    },
+    { title: "Theming", href: "/app/portal/theming" },
+    { title: "Account", href: "/app/portal/account" },
   ]
 </script>
 

packages/builder/src/pages/index.svelte

@@ -1,4 +1,4 @@
 <script>
   import { goto } from "@roxi/routify"
-  $goto("./portal")
+  $goto("./app")
 </script>

packages/builder/vite.config.js

@@ -56,6 +56,10 @@ export default ({ mode }) => {
           find: "actions",
           replacement: path.resolve("./src/actions"),
         },
+        {
+          find: "helpers",
+          replacement: path.resolve("./src/helpers"),
+        },
       ],
     },
   }