bugfix - weird field table layout bug when > 4 fields

...hence remove unecessary ActionsHeader

packages/builder/src/database/ActionsHeader.svelte

@@ -1,51 +0,0 @@
-<script>
-  import Button from "../common/Button.svelte"
-  import ActionButton from "../common/ActionButton.svelte"
-  import ButtonGroup from "../common/ButtonGroup.svelte"
-  import { store } from "../builderStore"
-  import Modal from "../common/Modal.svelte"
-  import ErrorsBox from "../common/ErrorsBox.svelte"
-
-  let confirmDelete = false
-
-  const openConfirmDelete = () => {
-    confirmDelete = true
-  }
-
-  const deleteCurrentNode = () => {
-    confirmDelete = false
-    store.deleteCurrentNode()
-  }
-</script>
-
-<div class="root">
-  <div class="button-container">
-    {#if !$store.currentNodeIsNew}
-      <ActionButton alert on:click={deleteCurrentNode}>Delete</ActionButton>
-    {/if}
-
-    <ActionButton color="secondary" on:click={store.saveCurrentNode}>
-      Save
-    </ActionButton>
-
-    <slot />
-  </div>
-
-</div>
-
-<style>
-  .root {
-    display: flex;
-    width: 100%;
-    border-top: 1px solid #ccc;
-    box-sizing: border-box;
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    background: #fafafa;
-  }
-
-  .button-container {
-    padding: 20px;
-  }
-</style>

packages/builder/src/database/DatabaseRoot.svelte

@@ -2,7 +2,6 @@
   import ModelView from "./ModelView.svelte"
   import IndexView from "./IndexView.svelte"
   import ModelDataTable from "./ModelDataTable"
-  import ActionsHeader from "./ActionsHeader.svelte"
   import { store, backendUiStore } from "../builderStore"
   import getIcon from "../common/icon"
   import DropdownButton from "../common/DropdownButton.svelte"

packages/builder/src/database/IndexView.svelte

@@ -4,10 +4,10 @@
   import Button from "../common/Button.svelte"
   import Dropdown from "../common/Dropdown.svelte"
   import { store } from "../builderStore"
-  import ActionsHeader from "./ActionsHeader.svelte"
   import { filter, some, map, compose } from "lodash/fp"
   import { hierarchy as hierarchyFunctions, common } from "../../../core/src"
   import ErrorsBox from "../common/ErrorsBox.svelte"
+  import ActionButton from "../common/ActionButton.svelte"
 
   const SNIPPET_EDITORS = {
     MAP: "Map",
@@ -99,7 +99,14 @@
     <CodeArea bind:text={index.getShardName} label="Shard Name" />
   {/if}
 
-  <ActionsHeader />
+  <ActionButton color="secondary" on:click={store.saveCurrentNode}>
+    Save
+  </ActionButton>
+
+  {#if !$store.currentNodeIsNew}
+    <ActionButton alert on:click={store.deleteCurrentNode}>Delete</ActionButton>
+  {/if}
+
 </form>
 
 <style>

packages/builder/src/database/ModelDataTable/modals/CreateEditModel.svelte

@@ -3,7 +3,6 @@
   import ActionButton from "../../../common/ActionButton.svelte"
   import { backendUiStore } from "../../../builderStore"
   import ModelView from "../../ModelView.svelte"
-  import ActionsHeader from "../../ActionsHeader.svelte"
   import * as api from "../api"
 </script>
 

packages/builder/src/database/ModelDataTable/modals/CreateEditView.svelte

@@ -1,6 +1,5 @@
 <script>
   import IndexView from "../../IndexView.svelte"
-  import ActionsHeader from "../../ActionsHeader.svelte"
   import * as api from "../api"
 </script>
 

packages/builder/src/database/ModelView.svelte

@@ -22,7 +22,6 @@
   import { common, hierarchy } from "../../../core/src"
   import { getNode } from "../common/core"
   import { templateApi, pipe, validate } from "../common/core"
-  import ActionsHeader from "./ActionsHeader.svelte"
   import ErrorsBox from "../common/ErrorsBox.svelte"
 
   let record
@@ -165,23 +164,26 @@
         {/each}
       </tbody>
     </table>
-    {#if modelExistsInHierarchy}
       <div class="uk-margin">
-        <ActionButton color="primary" on:click={store.newChildRecord}>
+        <ActionButton color="secondary" on:click={store.saveCurrentNode}>
-          Create Child Model on {record.name}
+          Save
-        </ActionButton>
-        <ActionButton
-          color="primary"
-          on:click={async () => {
-            backendUiStore.actions.modals.show('VIEW')
-            await tick()
-            store.newChildIndex()
-          }}>
-          Create Child View on {record.name}
         </ActionButton>
+        {#if modelExistsInHierarchy}
+          <ActionButton color="primary" on:click={store.newChildRecord}>
+            Create Child Model on {record.name}
+          </ActionButton>
+          <ActionButton
+            color="primary"
+            on:click={async () => {
+              backendUiStore.actions.modals.show('VIEW')
+              await tick()
+              store.newChildIndex()
+            }}>
+            Create Child View on {record.name}
+          </ActionButton>
+          <ActionButton alert on:click={store.deleteCurrentNode}>Delete</ActionButton>
+        {/if}
       </div>
-    {/if}
-    <ActionsHeader />
   {:else}
     <FieldView
       field={fieldToEdit}