Added the export page
This commit is contained in:
Dean
parent
5a7a348ded
commit
0dda7afee7
|
|
@ -14,6 +14,7 @@
|
||||||
import EditableIcon from "../common/EditableIcon.svelte"
|
import EditableIcon from "../common/EditableIcon.svelte"
|
||||||
|
|
||||||
export let app
|
export let app
|
||||||
|
export let onUpdateComplete
|
||||||
|
|
||||||
const values = writable({
|
const values = writable({
|
||||||
name: app.name,
|
name: app.name,
|
||||||
|
|
@ -54,6 +55,9 @@
|
||||||
color: $values.iconColor,
|
color: $values.iconColor,
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
|
if (typeof onUpdateComplete == "function") {
|
||||||
|
onUpdateComplete()
|
||||||
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error(error)
|
console.error(error)
|
||||||
notifications.error("Error updating app")
|
notifications.error("Error updating app")
|
||||||
|
|
|
||||||
|
|
@ -1,10 +1,17 @@
|
||||||
<script>
|
<script>
|
||||||
import { Content, SideNav, SideNavItem } from "components/portal/page"
|
import { Content, SideNav, SideNavItem } from "components/portal/page"
|
||||||
import { Page, Layout } from "@budibase/bbui"
|
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())
|
// $: $url(), console.log("Hello ", $url())
|
||||||
$: console.log($isActive("./automation-history"))
|
// $: 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>
|
</script>
|
||||||
|
|
||||||
<!-- routify:options index=4 -->
|
<!-- routify:options index=4 -->
|
||||||
|
|
|
||||||
|
|
@ -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>
|
||||||
|
|
@ -13,6 +13,7 @@
|
||||||
import { store } from "builderStore"
|
import { store } from "builderStore"
|
||||||
import { apps } from "stores/portal"
|
import { apps } from "stores/portal"
|
||||||
import UpdateAppModal from "components/start/UpdateAppModal.svelte"
|
import UpdateAppModal from "components/start/UpdateAppModal.svelte"
|
||||||
|
import { API } from "api"
|
||||||
|
|
||||||
let updatingModal
|
let updatingModal
|
||||||
|
|
||||||
|
|
@ -20,6 +21,14 @@
|
||||||
$: app = filteredApps.length ? filteredApps[0] : {}
|
$: app = filteredApps.length ? filteredApps[0] : {}
|
||||||
$: appUrl = `${window.origin}/app${app?.url}`
|
$: appUrl = `${window.origin}/app${app?.url}`
|
||||||
$: appDeployed = app?.status === AppStatus.DEPLOYED
|
$: 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>
|
</script>
|
||||||
|
|
||||||
<Layout noPadding>
|
<Layout noPadding>
|
||||||
|
|
@ -68,7 +77,12 @@
|
||||||
</Layout>
|
</Layout>
|
||||||
|
|
||||||
<Modal bind:this={updatingModal} padding={false} width="600px">
|
<Modal bind:this={updatingModal} padding={false} width="600px">
|
||||||
<UpdateAppModal {app} />
|
<UpdateAppModal
|
||||||
|
{app}
|
||||||
|
onUpdateComplete={async () => {
|
||||||
|
await initialiseApp()
|
||||||
|
}}
|
||||||
|
/>
|
||||||
</Modal>
|
</Modal>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue