add pro check and default state

This commit is contained in:
Peter Clement 2022-10-24 15:00:00 +01:00
parent 89dd9b259d
commit 146cdaa131
4 changed files with 126 additions and 35 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 314 KiB

View File

@ -1,17 +1,23 @@
<script>
import {
ActionButton,
Button,
DatePicker,
Divider,
Layout,
Modal,
notifications,
Pagination,
Select,
Heading,
Body,
Tags,
Tag,
Table,
Page,
} from "@budibase/bbui"
import { backups } from "stores/portal"
import { backups, licensing, auth, admin } from "stores/portal"
import { createPaginationStore } from "helpers/pagination"
import AppSizeRenderer from "./AppSizeRenderer.svelte"
import CreateBackupModal from "./CreateBackupModal.svelte"
import ActionsRenderer from "./ActionsRenderer.svelte"
@ -19,7 +25,7 @@
import UserRenderer from "./UserRenderer.svelte"
import StatusRenderer from "./StatusRenderer.svelte"
import TypeRenderer from "./TypeRenderer.svelte"
import BackupsDefault from "assets/backups-default.png"
export let app
let backupData = null
@ -30,6 +36,7 @@
let endDate = null
let filters = getFilters()
$: console.log(backupData)
$: page = $pageInfo.page
$: fetchBackups(filterOpt, page, startDate, endDate)
@ -146,6 +153,47 @@
</script>
<div class="root">
{#if !$licensing.backupsEnabled}
<Page wide={false}>
<Layout gap="XS" noPadding>
<div class="title">
<Heading size="M">Backups</Heading>
<Tags>
<Tag icon="LockClosed">Pro plan</Tag>
</Tags>
</div>
<div>
<Body>
Backup your apps and restore them to their previous state.
{#if !$auth.accountPortalAccess && !$licensing.groupsEnabled && $admin.cloud}
Contact your account holder to upgrade your plan.
{/if}
</Body>
</div>
<Divider />
<div class="pro-buttons">
<Button
newStyles
primary
disabled={!$auth.accountPortalAccess && $admin.cloud}
on:click={$licensing.goToUpgradePage()}
>
Upgrade
</Button>
<!--Show the view plans button-->
<Button
newStyles
secondary
on:click={() => {
window.open("https://budibase.com/pricing/", "_blank")
}}
>
View Plans
</Button>
</div>
</Layout>
</Page>
{:else if backupData}
<Layout noPadding gap="M" alignContent="start">
<div class="search">
<div class="select">
@ -177,7 +225,6 @@
>
</div>
</div>
{#if backupData}
<div>
<Table
{schema}
@ -200,8 +247,28 @@
/>
</div>
</div>
{/if}
</Layout>
{:else if !backupData}
<Page wide={false}>
<div class="align">
<img
width="200px"
height="100px"
src={BackupsDefault}
alt="BackupsDefault"
/>
<Layout gap="S">
<Heading>You have no backups yet</Heading>
<div class="opacity">
<Body size="S">You can manually backup your app any time</Body>
</div>
<div class="padding">
<Button cta>Create Backup</Button>
</div>
</Layout>
</div>
</Page>
{/if}
</div>
<Modal bind:this={modal}>
@ -242,4 +309,21 @@
flex: 1;
gap: var(--spacing-xl);
}
.title {
display: flex;
flex-direction: row;
align-items: center;
gap: var(--spacing-m);
}
.align {
margin-top: 5%;
text-align: center;
}
.pro-buttons {
display: flex;
gap: var(--spacing-m);
}
</style>

View File

@ -14,6 +14,7 @@ export const createLicensingStore = () => {
isFreePlan: true,
// features
groupsEnabled: false,
backupsEnabled: false,
// the currently used quotas from the db
quotaUsage: undefined,
// derived quota metrics for percentages used
@ -56,12 +57,17 @@ export const createLicensingStore = () => {
const groupsEnabled = license.features.includes(
Constants.Features.USER_GROUPS
)
const backupsEnabled = license.features.includes(
Constants.Features.BACKUPS
)
store.update(state => {
return {
...state,
license,
isFreePlan,
groupsEnabled,
backupsEnabled,
}
})
},

View File

@ -113,6 +113,7 @@ export const ApiVersion = "1"
export const Features = {
USER_GROUPS: "userGroups",
BACKUPS: "appBackups",
}
// Role IDs