103 lines
2.3 KiB
Svelte
103 lines
2.3 KiB
Svelte
<script>
|
|
import { onMount } from "svelte"
|
|
import { Button, Spacer, Modal } from "@budibase/bbui"
|
|
import { store } from "builderStore"
|
|
import { notifier } from "builderStore/store/notifications"
|
|
import api from "builderStore/api"
|
|
import Spinner from "components/common/Spinner.svelte"
|
|
import DeploymentHistory from "components/deploy/DeploymentHistory.svelte"
|
|
import analytics from "analytics"
|
|
import FeedbackIframe from "components/userInterface/Feedback/FeedbackIframe.svelte"
|
|
|
|
let loading = false
|
|
let deployments = []
|
|
let poll
|
|
let feedbackModal
|
|
|
|
$: appId = $store.appId
|
|
|
|
async function deployApp() {
|
|
loading = true
|
|
const DEPLOY_URL = `/api/deploy`
|
|
|
|
try {
|
|
notifier.info("Starting Deployment..")
|
|
const response = await api.post(DEPLOY_URL)
|
|
const json = await response.json()
|
|
if (response.status !== 200) {
|
|
throw new Error()
|
|
}
|
|
|
|
notifier.info(`Deployment started. Please wait.`)
|
|
loading = false
|
|
analytics.captureEvent("Deployed App", {
|
|
appId,
|
|
})
|
|
|
|
if (analytics.requestFeedbackOnDeploy()) {
|
|
feedbackModal.show()
|
|
}
|
|
} catch (err) {
|
|
analytics.captureEvent("Deploy App Failed", {
|
|
appId,
|
|
})
|
|
analytics.captureException(err)
|
|
notifier.danger("Deployment unsuccessful. Please try again later.")
|
|
loading = false
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<section>
|
|
<div>
|
|
<h4>It's time to shine!</h4>
|
|
<Button secondary medium on:click={deployApp}>
|
|
Deploy App
|
|
{#if loading}
|
|
<Spacer extraSmall />
|
|
<Spinner size="10" />
|
|
{/if}
|
|
</Button>
|
|
</div>
|
|
<img
|
|
src="/_builder/assets/deploy-rocket.jpg"
|
|
alt="Rocket flying through sky" />
|
|
</section>
|
|
<Modal bind:this={feedbackModal}>
|
|
<FeedbackIframe on:finished={() => feedbackModal.hide()} />
|
|
</Modal>
|
|
<DeploymentHistory {appId} />
|
|
|
|
<style>
|
|
img {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
h4 {
|
|
color: white;
|
|
font-size: 18px;
|
|
font-weight: bold;
|
|
margin-bottom: 30px;
|
|
}
|
|
|
|
section {
|
|
position: relative;
|
|
}
|
|
|
|
div {
|
|
position: absolute;
|
|
display: flex;
|
|
text-align: center;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
left: 0;
|
|
right: 0;
|
|
top: 20%;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
width: 50%;
|
|
}
|
|
</style>
|