wip: changes initialise function to getPackage and runs once you select application instead of at run-time.

packages/builder/src/App.svelte

@@ -7,8 +7,6 @@
     showAppNotification,
   } from "components/common/AppNotification.svelte"
 
-  let init = initialise()
-
   function showErrorBanner() {
     showAppNotification({
       status: "danger",

packages/builder/src/builderStore/index.js

@@ -10,7 +10,6 @@ export const initialise = async () => {
     if (process.env.NODE_ENV === "production") {
       LogRocket.init("knlald/budibase")
     }
-    await store.initialise()
   } catch (err) {
     console.log(err)
   }

packages/builder/src/builderStore/store/index.js

@@ -50,7 +50,7 @@ export const getStore = () => {
 
   const store = writable(initial)
 
-  store.initialise = initialise(store, initial)
+  store.setPackage = setPackage(store, initial)
 
   store.newChildRecord = backendStoreActions.newRecord(store, false)
   store.newRootRecord = backendStoreActions.newRecord(store, true)
@@ -101,22 +101,12 @@ export const getStore = () => {
 
 export default getStore
 
-const initialise = (store, initial) => async () => {
+const setPackage = (store, initial) => async (pkg) => {
-  if (!appname) {
-    initial.apps = await api.get(`/_builder/api/apps`).then(r => r.json())
-    initial.hasAppPackage = false
-    store.set(initial)
-    return initial
-  }
-
-  const pkg = await api
-    .get(`/_builder/api/${appname}/appPackage`)
-    .then(r => r.json())
 
   const [main_screens, unauth_screens] = await Promise.all([
-    api.get(`/_builder/api/${appname}/pages/main/screens`).then(r => r.json()),
+    api.get(`/_builder/api/${pkg.application.name}/pages/main/screens`).then(r => r.json()),
     api
-      .get(`/_builder/api/${appname}/pages/unauthenticated/screens`)
+      .get(`/_builder/api/${pkg.application.name}/pages/unauthenticated/screens`)
       .then(r => r.json()),
   ])
 
@@ -131,12 +121,12 @@ const initialise = (store, initial) => async () => {
     },
   }
 
-  initial.libraries = await loadLibs(appname, pkg)
+  initial.libraries = await loadLibs(pkg.application.name, pkg)
   initial.loadLibraryUrls = pageName => {
     const libs = libUrlsForPreview(pkg, pageName)
     return libs
   }
-  initial.appname = appname
+  initial.appname = pkg.application.name
   initial.pages = pkg.pages
   initial.hasAppPackage = true
   initial.hierarchy = pkg.appDefinition.hierarchy

packages/builder/src/pages/[application]/_layout.svelte

@@ -1,10 +1,27 @@
 <script>
+  import { store } from "builderStore"
+
   import { fade } from "svelte/transition"
-  import { isActive, goto, url, context } from "@sveltech/routify"
+  import { isActive, goto, url, context, params } from "@sveltech/routify"
 
   import { SettingsIcon, PreviewIcon } from "components/common/Icons/"
   import IconButton from "components/common/IconButton.svelte"
 
+  // Get Package and set store
+
+  let promise = getPackage()
+
+  async function getPackage() {
+    const res = await fetch(`/_builder/api/${$params.application}/appPackage`)
+    const pkg = await res.json()
+
+    if (res.ok) {
+      await store.setPackage(pkg)
+      return pkg
+    } else {
+      throw new Error(pkg)
+    }
+  }
   $: ({ component } = $context)
   $: list = component.parent.children.filter(child => child.isIndexable)
 </script>
@@ -48,7 +65,11 @@
     </div>
   </div>
 
+  {#await promise}
+    should probably load this in a nicer way
+  {:then}
     <slot />
+  {/await}
 
 </div>