diff --git a/packages/builder/src/BackendRoot.svelte b/packages/builder/src/BackendRoot.svelte index 3ce1ab508b..722afcfedf 100644 --- a/packages/builder/src/BackendRoot.svelte +++ b/packages/builder/src/BackendRoot.svelte @@ -20,13 +20,13 @@
- {#if activeNav === 'database'} + - {:else if activeNav === 'actions'} +
@@ -43,9 +43,6 @@ .content { flex: 1 1 auto; margin: 80px 60px; - background: #fff; - border-radius: 5px; - box-shadow: 0 0px 6px rgba(0, 0, 0, 0.05); } .nav { diff --git a/packages/builder/src/PackageRoot.svelte b/packages/builder/src/PackageRoot.svelte index 3362e81289..fcdc2d5c71 100644 --- a/packages/builder/src/PackageRoot.svelte +++ b/packages/builder/src/PackageRoot.svelte @@ -6,6 +6,13 @@ import { fade } from "svelte/transition" import { SettingsIcon, PreviewIcon, HelpIcon } from "./common/Icons/" + const TABS = { + BACKEND: "backend", + FRONTEND: "frontend", + } + + let selectedTab = TABS.BACKEND +
@@ -19,37 +26,37 @@ color="var(--slate)" hoverColor="var(--secondary75)"/> --> + on:click={() => selectedTab = TABS.BACKEND}> Backend + on:click={() => selectedTab = TABS.FRONTEND}> Frontend
+ on:click={() => selectedTab === TABS.FRONTEND}> + on:click={() => selectedTab === TABS.FRONTEND}>
- {#if $store.isBackend} + {#if selectedTab === TABS.BACKEND}
diff --git a/packages/builder/src/builderStore/store.js b/packages/builder/src/builderStore/store.js index 6026f782f2..3a8b346a7d 100644 --- a/packages/builder/src/builderStore/store.js +++ b/packages/builder/src/builderStore/store.js @@ -55,7 +55,6 @@ export const getStore = () => { currentComponentProps: null, currentNodeIsNew: false, errors: [], - isBackend: true, hasAppPackage: false, accessLevels: { version: 0, levels: [] }, currentNode: null, @@ -66,6 +65,61 @@ export const getStore = () => { const store = writable(initial) + // store.api = { + // appDefinition: { + // create: () => {}, + // }, + // records: { + // create: () => {}, + // update: () => {}, + // delete: () => {}, + // }, + // indexes: { + // create: () => {}, + // update: () => {}, + // delete: () => {}, + // }, + // pages: { + // create: () => {}, + // update: () => {}, + // delete: () => {}, + // }, + // screens: { + // create: () => {}, + // select: () => {}, + // rename: () => {} + // }, + // accessLevels: { + // create: () => {}, + // update: () => {}, + // delete: () => {}, + // }, + // users: { + // create: () => {}, + // update: () => {}, + // delete: () => {}, + // }, + // actions: { + // update: () => {}, + // delete: () => {} + // }, + // triggers: { + // create: () => {}, + // update: () => {}, + // delete: () => {}, + // }, + // stylesheets: { + // create: () => {}, + // update: () => {}, + // delete: () => {}, + // }, + // components: { + // create: () => {}, + // update: () => {}, + // delete: () => {}, + // } + // } + store.initialise = initialise(store, initial) store.newChildRecord = newRecord(store, false) store.newRootRecord = newRecord(store, true) @@ -94,8 +148,8 @@ export const getStore = () => { store.addStylesheet = addStylesheet(store) store.removeStylesheet = removeStylesheet(store) store.savePage = savePage(store) - store.showFrontend = showFrontend(store) - store.showBackend = showBackend(store) + // store.showFrontend = showFrontend(store) + // store.showBackend = showBackend(store) store.showSettings = showSettings(store) store.useAnalytics = useAnalytics(store) store.createGeneratedComponents = createGeneratedComponents(store) @@ -172,6 +226,7 @@ const initialise = (store, initial) => async () => { initial.builtins = [getBuiltin("##builtin/screenslot")] initial.actions = values(pkg.appDefinition.actions) initial.triggers = pkg.appDefinition.triggers + initial.appInstances = pkg.application.instances if (!!initial.hierarchy && !isEmpty(initial.hierarchy)) { initial.hierarchy = constructHierarchy(initial.hierarchy) @@ -185,9 +240,9 @@ const initialise = (store, initial) => async () => { } const showSettings = store => () => { - store.update(s => { - s.showSettings = !s.showSettings - return s + store.update(state => { + state.showSettings = !state.showSettings + return state }) } @@ -198,20 +253,6 @@ const useAnalytics = store => () => { }) } -const showBackend = store => () => { - store.update(s => { - s.isBackend = true - return s - }) -} - -const showFrontend = store => () => { - store.update(s => { - s.isBackend = false - return s - }) -} - const newRecord = (store, useRoot) => () => { store.update(s => { s.currentNodeIsNew = true @@ -377,10 +418,10 @@ const saveAction = store => (newAction, isNew, oldAction = null) => { } const deleteAction = store => action => { - store.update(s => { - s.actions = filter(a => a.name !== action.name)(s.actions) - saveBackend(s) - return s + store.update(state => { + state.actions = state.actions.filter(a => a.name !== action.name); + saveBackend(state); + return state; }) } diff --git a/packages/builder/src/common/Select.svelte b/packages/builder/src/common/Select.svelte index e360c1c4d6..db24e88b89 100644 --- a/packages/builder/src/common/Select.svelte +++ b/packages/builder/src/common/Select.svelte @@ -14,12 +14,12 @@ \ No newline at end of file + + .table-controls { + display: flex; + justify-content: space-between; + align-items: center; + } + diff --git a/packages/builder/src/nav/BackendNav.svelte b/packages/builder/src/nav/BackendNav.svelte index 77cdc76480..55d35ecb33 100644 --- a/packages/builder/src/nav/BackendNav.svelte +++ b/packages/builder/src/nav/BackendNav.svelte @@ -3,7 +3,7 @@ import { store } from "../builderStore" import HierarchyRow from "./HierarchyRow.svelte" import DatabasesList from "./DatabasesList.svelte" - import DropdownButton from "../common/DropdownButton.svelte" + import UsersList from "./UsersList.svelte" import { hierarchy as hierarchyFunctions } from "../../../core/src" import NavItem from "./NavItem.svelte" import getIcon from "../common/icon" @@ -68,7 +68,7 @@
Databases
- +
@@ -89,11 +89,12 @@
Users
- +
+ diff --git a/packages/builder/src/nav/DatabasesList.svelte b/packages/builder/src/nav/DatabasesList.svelte index 3916361a47..e690959b32 100644 --- a/packages/builder/src/nav/DatabasesList.svelte +++ b/packages/builder/src/nav/DatabasesList.svelte @@ -3,30 +3,12 @@ import getIcon from "../common/icon" import { CheckIcon } from "../common/Icons" - const getPage = (s, name) => { - const props = s.pages[name] - return { name, props } - } - - $: databases = $store.app - - const pages = [ - { - title: "Main", - id: "main", - }, - { - title: "Login", - id: "unauthenticated", - }, - ] - - store.setCurrentPage("main") + $: instances = $store.appInstances
    - {#each pages as { title, id }} + {#each $store.appInstances as { id, name }}
  • {#if id === $store.currentPageName} @@ -37,7 +19,7 @@
    • {/each} diff --git a/packages/builder/src/nav/HierarchyRow.svelte b/packages/builder/src/nav/HierarchyRow.svelte index 13459e53cc..abfe34b134 100644 --- a/packages/builder/src/nav/HierarchyRow.svelte +++ b/packages/builder/src/nav/HierarchyRow.svelte @@ -25,7 +25,8 @@
    store.selectExistingNode(node.nodeId)} - class="budibase__nav-item" + class="budibase__nav-item hierarchy-item" + class:capitalized={type === "record"} style="padding-left: {20 + level * 20}px" class:selected={navActive}> @@ -42,3 +43,14 @@ {/each} {/if}
    + + diff --git a/packages/builder/src/nav/SchemaManagementDrawer.svelte b/packages/builder/src/nav/SchemaManagementDrawer.svelte index 3ac709b49f..b25f36bccb 100644 --- a/packages/builder/src/nav/SchemaManagementDrawer.svelte +++ b/packages/builder/src/nav/SchemaManagementDrawer.svelte @@ -98,6 +98,7 @@ .nav-group-header { display: flex; justify-content: space-between; + align-items: center; padding: 2rem 1rem 1rem 1rem; } diff --git a/packages/builder/src/nav/UsersList.svelte b/packages/builder/src/nav/UsersList.svelte index e69de29bb2..384114d5d1 100644 --- a/packages/builder/src/nav/UsersList.svelte +++ b/packages/builder/src/nav/UsersList.svelte @@ -0,0 +1,83 @@ + + +
    +
      + {#each pages as { title, id }} +
    • + + +
      • + {/each} +
    +
    + +