adding template options to create app modal

This commit is contained in:
Martin McKeaveney 2021-10-06 11:38:17 +01:00
parent 92c4c4ace0
commit 50fad056a3
2 changed files with 54 additions and 49 deletions

View File

@ -17,6 +17,7 @@
import { capitalise } from "helpers" import { capitalise } from "helpers"
import { goto } from "@roxi/routify" import { goto } from "@roxi/routify"
import { APP_NAME_REGEX } from "constants" import { APP_NAME_REGEX } from "constants"
import TemplateList from "./TemplateList.svelte"
export let template export let template
@ -40,6 +41,7 @@
let valid = false let valid = false
$: checkValidity($values, validator) $: checkValidity($values, validator)
$: showTemplateSelection = !template?.fromFile && !template?.key
onMount(async () => { onMount(async () => {
await hostingStore.actions.fetchDeployedApps() await hostingStore.actions.fetchDeployedApps()
@ -136,12 +138,35 @@
} }
</script> </script>
<ModalContent {#if showTemplateSelection}
<ModalContent
title={"Start from scratch or select a template"}
confirmText="Start from Scratch"
size="L"
onConfirm={() => {
showTemplateSelection = false
return false
}}
showCancelButton={false}
showCloseIcon={false}
>
<Body size="S">
One of the coolest things about Budibase is that you don't have to start
from scratch. Simply select a template below, and get to work.
</Body>
<TemplateList
onSelect={selected => {
template = selected
}}
/>
</ModalContent>
{:else}
<ModalContent
title={template?.fromFile ? "Import app" : "Create app"} title={template?.fromFile ? "Import app" : "Create app"}
confirmText={template?.fromFile ? "Import app" : "Create app"} confirmText={template?.fromFile ? "Import app" : "Create app"}
onConfirm={createNewApp} onConfirm={createNewApp}
disabled={!valid} disabled={!valid}
> >
{#if template?.fromFile} {#if template?.fromFile}
<Dropzone <Dropzone
error={$touched.file && $errors.file} error={$touched.file && $errors.file}
@ -165,4 +190,5 @@
label="Name" label="Name"
/> />
<Checkbox label="Group access" disabled value={true} text="All users" /> <Checkbox label="Group access" disabled value={true} text="All users" />
</ModalContent> </ModalContent>
{/if}

View File

@ -1,7 +1,6 @@
<script> <script>
import { ModalContent, Body } from "@budibase/bbui" import { ModalContent, Body } from "@budibase/bbui"
import { auth } from "stores/portal" import { auth } from "stores/portal"
import TemplateList from "./TemplateList.svelte"
import CreateAppModal from "./CreateAppModal.svelte" import CreateAppModal from "./CreateAppModal.svelte"
import BudiWorldImage from "assets/budiworld.webp" import BudiWorldImage from "assets/budiworld.webp"
@ -12,11 +11,6 @@
step += 1 step += 1
return false return false
} }
function selectTemplate(selectedTemplate) {
template = selectedTemplate
nextStep()
}
</script> </script>
{#if step === 0} {#if step === 0}
@ -41,21 +35,6 @@
/> />
</ModalContent> </ModalContent>
{:else if step === 1} {:else if step === 1}
<ModalContent
title={"Start from scratch or select a template"}
confirmText="Start from Scratch"
size="L"
onConfirm={nextStep}
showCancelButton={false}
showCloseIcon={false}
>
<Body size="S">
One of the coolest things about Budibase is that you don't have to start
from scratch. Simply select a template below, and get to work.
</Body>
<TemplateList onSelect={selectTemplate} />
</ModalContent>
{:else if step === 2}
<CreateAppModal {template} /> <CreateAppModal {template} />
{/if} {/if}