MirrorSave
/
budibase
mirror of https://github.com/Budibase/budibase.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Allow deleting built in layouts and hide layouts tab when no layouts exist

This commit is contained in:
Andrew Kingston 2022-05-13 11:23:27 +01:00
parent c3b39d5953
commit ab27816f08
6 changed files with 51 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
packages/builder/src/pages/builder/app/[application]/design/[screenId]/_layout.svelte
View File

@ -47,12 +47,14 @@
active={$isActive("./navigation")}
on:click={() => $goto("./navigation")}
/>
<IconSideNavItem
icon="Experience"
tooltip="Layouts"
active={$isActive("./layouts")}
on:click={() => $goto("./layouts")}
/>
{#if $store.layouts?.length}
<IconSideNavItem
icon="Experience"
tooltip="Layouts"
active={$isActive("./layouts")}
on:click={() => $goto("./layouts")}
/>
{/if}
</IconSideNav>
</div>

2
packages/builder/src/pages/builder/app/[application]/design/[screenId]/layouts/[layoutId]/_components/LayoutDropdownMenu.svelte
View File

@ -13,7 +13,7 @@
await store.actions.layouts.delete(layout)
notifications.success("Layout deleted successfully")
} catch (err) {
notifications.error("Error deleting layout")
notifications.error(err?.message || "Error deleting layout")
}
}
</script>

36
packages/builder/src/pages/builder/app/[application]/design/[screenId]/layouts/[layoutId]/_components/LayoutListPanel.svelte
View File

@ -1,25 +1,29 @@
<script>
import Panel from "components/design/Panel.svelte"
import { Layout } from "@budibase/bbui"
import NavItem from "components/common/NavItem.svelte"
import { store } from "builderStore"
import LayoutDropdownMenu from "./LayoutDropdownMenu.svelte"
</script>
<Panel title="Layouts" borderRight>
<Layout paddingY="XL" paddingX="">
<div>
{#each $store.layouts as layout (layout._id)}
<NavItem
icon="Experience"
indentLevel={0}
selected={$store.selectedLayoutId === layout._id}
text={layout.name}
on:click={() => ($store.selectedLayoutId = layout._id)}
>
<LayoutDropdownMenu {layout} />
</NavItem>
{/each}
</div>
</Layout>
<div class="layouts">
{#each $store.layouts as layout (layout._id)}
<NavItem
icon="Experience"
indentLevel={0}
selected={$store.selectedLayoutId === layout._id}
text={layout.name}
on:click={() => ($store.selectedLayoutId = layout._id)}
>
<LayoutDropdownMenu {layout} />
</NavItem>
{/each}
</div>
</Panel>
<style>
.layouts {
margin-top: var(--spacing-xl);
overflow: hidden;
}
</style>

12
packages/builder/src/pages/builder/app/[application]/design/[screenId]/layouts/_layout.svelte Normal file
View File

@ -0,0 +1,12 @@
<script>
import { store } from "builderStore"
import { redirect } from "@roxi/routify"
$: {
if (!$store.layouts?.length) {
$redirect("../")
}
}
</script>
<slot />

3
packages/builder/src/pages/builder/app/[application]/design/[screenId]/layouts/index.svelte
View File

@ -6,8 +6,7 @@
onMount(() => {
if ($store.layouts?.length) {
$redirect(`./${$store.layouts[0]._id}`)
} else {
$redirect("../")
}
// The redirection when no layouts exist is handled by the routify layout
})
</script>

22
packages/server/src/api/controllers/layout.js
View File

@ -30,19 +30,15 @@ exports.destroy = async function (ctx) {
const layoutId = ctx.params.layoutId,
layoutRev = ctx.params.layoutRev
if (Object.values(BASE_LAYOUT_PROP_IDS).includes(layoutId)) {
ctx.throw(400, "Cannot delete a built-in layout")
} else {
const layoutsUsedByScreens = (
await db.allDocs(
getScreenParams(null, {
include_docs: true,
})
)
).rows.map(element => element.doc.layoutId)
if (layoutsUsedByScreens.includes(layoutId)) {
ctx.throw(400, "Cannot delete a layout that's being used by a screen")
}
const layoutsUsedByScreens = (
await db.allDocs(
getScreenParams(null, {
include_docs: true,
})
)
).rows.map(element => element.doc.layoutId)
if (layoutsUsedByScreens.includes(layoutId)) {
ctx.throw(400, "Cannot delete a layout that's being used by a screen")
}
await db.remove(layoutId, layoutRev)