diff --git a/packages/builder/src/components/start/UpdateAppModal.svelte b/packages/builder/src/components/start/UpdateAppModal.svelte
index 59d2957bf5..3d825003a1 100644
--- a/packages/builder/src/components/start/UpdateAppModal.svelte
+++ b/packages/builder/src/components/start/UpdateAppModal.svelte
@@ -14,6 +14,7 @@
   import EditableIcon from "../common/EditableIcon.svelte"
 
   export let app
+  export let onUpdateComplete
 
   const values = writable({
     name: app.name,
@@ -54,6 +55,9 @@
           color: $values.iconColor,
         },
       })
+      if (typeof onUpdateComplete == "function") {
+        onUpdateComplete()
+      }
     } catch (error) {
       console.error(error)
       notifications.error("Error updating app")
diff --git a/packages/builder/src/pages/builder/app/[application]/settings/_layout.svelte b/packages/builder/src/pages/builder/app/[application]/settings/_layout.svelte
index ec4386a6bd..f9cb8931e9 100644
--- a/packages/builder/src/pages/builder/app/[application]/settings/_layout.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/settings/_layout.svelte
@@ -1,10 +1,17 @@
 <script>
   import { Content, SideNav, SideNavItem } from "components/portal/page"
   import { Page, Layout } from "@budibase/bbui"
-  import { url, isActive } from "@roxi/routify"
+  import { url, isActive, layout } from "@roxi/routify"
+  import { capitalise } from "helpers"
 
-  $: $url(), console.log("Hello ", $url())
-  $: console.log($isActive("./automation-history"))
+  // $: $url(), console.log("Hello ", $url())
+  // $: console.log("is auto", $isActive("./automation-history"))
+  // $: selected = capitalise(
+  //   $layout.children.find(layout => $isActive(layout.path))?.title ?? "settings"
+  // )
+  // $: console.log("Settings Selected ", selected)
+
+  // if updated to Settings and automation-history is not selected, switch to ./automation-history
 </script>
 
 <!-- routify:options index=4 -->
diff --git a/packages/builder/src/pages/builder/app/[application]/settings/export.svelte b/packages/builder/src/pages/builder/app/[application]/settings/export.svelte
new file mode 100644
index 0000000000..30534ece4d
--- /dev/null
+++ b/packages/builder/src/pages/builder/app/[application]/settings/export.svelte
@@ -0,0 +1,62 @@
+<script>
+  import {
+    Layout,
+    Body,
+    Heading,
+    Divider,
+    ActionButton,
+    Helpers,
+    Icon,
+    notifications,
+    Modal,
+  } from "@budibase/bbui"
+  import { AppStatus } from "constants"
+  import { apps } from "stores/portal"
+  import { store } from "builderStore"
+  import ExportAppModal from "components/start/ExportAppModal.svelte"
+
+  $: filteredApps = $apps.filter(app => app.devId == $store.appId)
+  $: app = filteredApps.length ? filteredApps[0] : {}
+  $: appDeployed = app?.status === AppStatus.DEPLOYED
+
+  let exportModal
+  let exportPublishedVersion = false
+
+  const exportApp = opts => {
+    exportPublishedVersion = !!opts?.published
+    exportModal.show()
+  }
+
+  // $: embed = `<iframe width="560" height="315" frameborder="0" allow="clipboard-write" src="${appUrl}" ></iframe>`
+</script>
+
+<Modal bind:this={exportModal} padding={false}>
+  <ExportAppModal {app} published={exportPublishedVersion} />
+</Modal>
+
+<Layout noPadding>
+  <Layout gap="XS" noPadding>
+    <Heading>Export your app</Heading>
+    <Body>Export your latest edited or published app</Body>
+  </Layout>
+  <Divider />
+  <div class="export-body">
+    <ActionButton secondary on:click={() => exportApp({ published: false })}>
+      Export latest edited app
+    </ActionButton>
+    <ActionButton
+      secondary
+      disabled={!appDeployed}
+      on:click={() => exportApp({ published: true })}
+    >
+      Export latest published app
+    </ActionButton>
+  </div>
+</Layout>
+
+<style>
+  .export-body {
+    display: flex;
+    gap: var(--spacing-l);
+  }
+</style>
diff --git a/packages/builder/src/pages/builder/app/[application]/settings/name-and-url.svelte b/packages/builder/src/pages/builder/app/[application]/settings/name-and-url.svelte
index 86af5df3bc..8228739287 100644
--- a/packages/builder/src/pages/builder/app/[application]/settings/name-and-url.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/settings/name-and-url.svelte
@@ -13,6 +13,7 @@
   import { store } from "builderStore"
   import { apps } from "stores/portal"
   import UpdateAppModal from "components/start/UpdateAppModal.svelte"
+  import { API } from "api"
 
   let updatingModal
 
@@ -20,6 +21,14 @@
   $: app = filteredApps.length ? filteredApps[0] : {}
   $: appUrl = `${window.origin}/app${app?.url}`
   $: appDeployed = app?.status === AppStatus.DEPLOYED
+
+  const initialiseApp = async () => {
+    // In order for these changes to make it back into the app, the app package must be reinitialied
+    // could this have negative side affects???
+    console.log("Reinitialise")
+    const applicationPkg = await API.fetchAppPackage(app.devId)
+    await store.actions.initialise(applicationPkg)
+  }
 </script>
 
 <Layout noPadding>
@@ -68,7 +77,12 @@
 </Layout>
 
 <Modal bind:this={updatingModal} padding={false} width="600px">
-  <UpdateAppModal {app} />
+  <UpdateAppModal
+    {app}
+    onUpdateComplete={async () => {
+      await initialiseApp()
+    }}
+  />
 </Modal>
 
 <style>
