showing correct front end elements for selected database

packages/builder/src/accessLevels/AccessLevelsRoot.svelte

@@ -2,7 +2,7 @@
   import ButtonGroup from "../common/ButtonGroup.svelte"
   import Button from "../common/Button.svelte"
   import ActionButton from "../common/ActionButton.svelte"
-  import { store } from "../builderStore"
+  import { store, backendUiStore } from "../builderStore"
   import { generateFullPermissions, getNewAccessLevel } from "../common/core"
   import getIcon from "../common/icon"
   import AccessLevelView from "./AccessLevelView.svelte"
@@ -10,7 +10,12 @@
 
   let editingLevel = null
   let editingLevelIsNew = false
-  $: isEditing = editingLevel !== null
+  $: { 
+    if (editingLevel !== null) {
+      backendUiStore.actions.modals.show("ACCESS_LEVELS")
+    }
+  }
+  $: modalOpen = $backendUiStore.visibleModal === 'ACCESS_LEVELS'
 
   let allPermissions = []
   store.subscribe(db => {
@@ -40,6 +45,7 @@
       store.saveLevel(level, editingLevelIsNew, editingLevel)
     }
     editingLevel = null
+    backendUiStore.actions.modals.hide()
   }
 
   const getPermissionsString = perms => {
@@ -83,10 +89,9 @@
   {:else}(no actions added){/if}
 
   <Modal
-    onClosed={() => (isEditing = false)}
+    onClosed={backendUiStore.actions.modals.hide}
-    bind:isOpen={isEditing}
+    bind:isOpen={modalOpen}
-    title={isEditing ? 'Edit Access Level' : 'Create Access Level'}>
+    title={modalOpen ? 'Edit Access Level' : 'Create Access Level'}>
-    {#if isEditing}
       <AccessLevelView
         level={editingLevel}
         {allPermissions}
@@ -94,8 +99,8 @@
         isNew={editingLevelIsNew}
         allLevels={$store.accessLevels.levels}
         hierarchy={$store.hierarchy}
-        actions={$store.actions} />
+        actions={$store.actions} 
-    {/if}
+      />
   </Modal>
 
 </div>
@@ -106,13 +111,4 @@
     position: relative;
     padding: 1.5rem;
   }
-
-  .actions-header {
-    flex: 0 1 auto;
-  }
-
-  .node-view {
-    overflow-y: auto;
-    flex: 1 1 auto;
-  }
 </style>

packages/builder/src/userInterface/CurrentItemPreview.svelte

@@ -1,5 +1,5 @@
 <script>
-  import { store } from "../builderStore"
+  import { store, backendUiStore } from "../builderStore"
   import { map, join } from "lodash/fp"
   import { pipe } from "../common/core"
 
@@ -63,7 +63,7 @@
         ]
       }
     }],
-    appRootPath: `/_builder/instance/${$store.appname}/${$store.currentInstanceId}/`,
+    appRootPath: `/_builder/instance/${$store.appname}/${$backendUiStore.selectedDatabase.id}/`,
   }
 
   $: backendDefinition = {