making the onboarding modal inline and shown when you have no apps
This commit is contained in:
parent
ab24e02941
commit
92c4c4ace0
|
@ -1,6 +1,6 @@
|
|||
<script>
|
||||
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 BudiWorldImage from "assets/budiworld.webp"
|
||||
|
@ -17,15 +17,6 @@
|
|||
template = selectedTemplate
|
||||
nextStep()
|
||||
}
|
||||
|
||||
// TODO: mark user as onboarded if they close this?
|
||||
// async function userOnboarded() {
|
||||
// try {
|
||||
// await auth.updateSelf({ onboarded: true })
|
||||
// } catch (error) {
|
||||
// notifications.error("An onboarding error has occurred.")
|
||||
// }
|
||||
// }
|
||||
</script>
|
||||
|
||||
{#if step === 0}
|
||||
|
@ -33,6 +24,8 @@
|
|||
title={`Welcome ${$auth.user?.firstName + "!" || "!"}`}
|
||||
confirmText="Next"
|
||||
onConfirm={nextStep}
|
||||
showCancelButton={false}
|
||||
showCloseIcon={false}
|
||||
>
|
||||
<Body size="S">
|
||||
<p>Welcome to Budibase!</p>
|
||||
|
@ -53,6 +46,8 @@
|
|||
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
|
||||
|
|
|
@ -8,10 +8,8 @@
|
|||
ButtonGroup,
|
||||
Select,
|
||||
Modal,
|
||||
ModalContent,
|
||||
Page,
|
||||
notifications,
|
||||
Body,
|
||||
Search,
|
||||
} from "@budibase/bbui"
|
||||
import CreateAppModal from "components/start/CreateAppModal.svelte"
|
||||
|
@ -35,7 +33,6 @@
|
|||
let updatingModal
|
||||
let deletionModal
|
||||
let unpublishModal
|
||||
let onboardingModal
|
||||
let creatingApp = false
|
||||
let loaded = false
|
||||
let searchTerm = ""
|
||||
|
@ -45,7 +42,6 @@
|
|||
$: filteredApps = enrichedApps.filter(app =>
|
||||
app?.name?.toLowerCase().includes(searchTerm.toLowerCase())
|
||||
)
|
||||
$: loaded && enrichedApps.length === 0 && onboardingModal?.show()
|
||||
|
||||
const enrichApps = (apps, user, sortBy) => {
|
||||
const enrichedApps = apps.map(app => ({
|
||||
|
@ -273,22 +269,7 @@
|
|||
{#if !enrichedApps.length && !creatingApp && loaded}
|
||||
<div class="empty-wrapper">
|
||||
<Modal inline>
|
||||
<ModalContent
|
||||
title="Create your first app"
|
||||
confirmText="Create app"
|
||||
showCancelButton={false}
|
||||
showCloseIcon={false}
|
||||
onConfirm={initiateAppCreation}
|
||||
size="M"
|
||||
>
|
||||
<div slot="footer">
|
||||
<Button on:click={initiateAppImport} secondary>Import app</Button>
|
||||
</div>
|
||||
<Body size="S">
|
||||
The purpose of the Budibase builder is to help you build beautiful,
|
||||
powerful applications quickly and easily.
|
||||
</Body>
|
||||
</ModalContent>
|
||||
<OnboardingModal />
|
||||
</Modal>
|
||||
</div>
|
||||
{/if}
|
||||
|
@ -319,9 +300,6 @@
|
|||
</ConfirmDialog>
|
||||
|
||||
<UpdateAppModal app={selectedApp} bind:this={updatingModal} />
|
||||
<Modal bind:this={onboardingModal}>
|
||||
<OnboardingModal />
|
||||
</Modal>
|
||||
|
||||
<style>
|
||||
.title,
|
||||
|
|
Loading…
Reference in New Issue