validation for delete index and records

packages/builder/src/builderStore/store/backend.js

@@ -13,6 +13,8 @@ import {
   constructHierarchy,
   templateApi,
   isIndex,
+  canDeleteIndex,
+  canDeleteRecord
 } from "../../common/core"
 
 export const getBackendUiStore = () => {
@@ -202,14 +204,27 @@ export const deleteCurrentNode = store => () => {
       ? state.hierarchy.children.find(node => node !== state.currentNode)
       : nodeToDelete.parent()
 
-    const recordOrIndexKey = hierarchyFunctions.isRecord(nodeToDelete) ? "children" : "indexes";
+    const isRecord = hierarchyFunctions.isRecord(nodeToDelete)
+
+    const check = isRecord
+      ? canDeleteRecord(nodeToDelete)
+      : canDeleteIndex(nodeToDelete)
+
+    if (!check.canDelete) {
+      state.errors = check.errors.map(e => ({ error: e }))
+      return state
+    }
+
+    const recordOrIndexKey = isRecord ? "children" : "indexes"
 
     // remove the selected record or index
-    nodeToDelete.parent()[recordOrIndexKey] = remove(
-      nodeToDelete.parent()[recordOrIndexKey],
-      node => node.nodeId === nodeToDelete.nodeId
+    const newCollection = remove(
+      node => node.nodeId === nodeToDelete.nodeId,
+      nodeToDelete.parent()[recordOrIndexKey]
     )
 
+    nodeToDelete.parent()[recordOrIndexKey] = newCollection
+
     state.errors = []
     saveBackend(state)
     return state

packages/builder/src/common/ErrorsBox.svelte

@@ -5,25 +5,14 @@
 </script>
 
 {#if hasErrors}
-  <div class="error-container">
+  <div uk-alert class="uk-alert-danger">
     {#each errors as error}
-      <div class="error-row">
+      <div>
         {error.field ? `${error.field}: ` : ''}{error.error}
       </div>
     {/each}
-  </div>
+</div>
+
+
 {/if}
 
-<style>
-  .error-container {
-    padding: 10px;
-    border-style: solid;
-    border-color: var(--deletion100);
-    border-radius: var(--borderradiusall);
-    background: var(--deletion75);
-  }
-
-  .error-row {
-    padding: 5px 0px;
-  }
-</style>

packages/builder/src/common/core.js

@@ -9,6 +9,8 @@ import { find, filter, keyBy, flatten, map } from "lodash/fp"
 import { generateSchema } from "../../../core/src/indexing/indexSchemaCreator"
 import { generate } from "shortid"
 
+export { canDeleteIndex } from "../../../core/src/templateApi/canDeleteIndex"
+export { canDeleteRecord } from "../../../core/src/templateApi/canDeleteRecord"
 export { userWithFullAccess } from "../../../core/src/index"
 
 export const pipe = common.$

packages/builder/src/database/ActionsHeader.svelte

@@ -31,9 +31,6 @@
     </ActionButton>
   </div>
 
-  {#if $store.errors && $store.errors.length > 0}
-    <ErrorsBox errors={$store.errors} />
-  {/if}
 </div>
 
 <style>

packages/builder/src/database/IndexView.svelte

@@ -6,6 +6,7 @@
   import { store } from "../builderStore"
   import { filter, some, map, compose } from "lodash/fp"
   import { hierarchy as hierarchyFunctions, common } from "../../../core/src"
+  import ErrorsBox from "../common/ErrorsBox.svelte"
   
   const SNIPPET_EDITORS = {
     MAP: "Map",
@@ -49,6 +50,9 @@
 </heading>
 <form class="uk-form-stacked root">
   <h4 class="budibase__label--big">Settings</h4>
+  {#if $store.errors && $store.errors.length > 0}
+    <ErrorsBox errors={$store.errors} />
+  {/if}
   <div class="uk-grid-small" uk-grid>
     <div class="uk-width-1-2@s">
       <Textbox bind:text={index.name} label="Name" />

packages/builder/src/database/ModelView.svelte

@@ -10,6 +10,7 @@
   import { common, hierarchy } from "../../../core/src"
   import { templateApi, pipe, validate } from "../common/core"
   import ActionsHeader from "./ActionsHeader.svelte"
+  import ErrorsBox from "../common/ErrorsBox.svelte"
 
   let record
   let getIndexAllowedRecords
@@ -99,6 +100,11 @@
   </heading>
   {#if !editingField}
     <h4 class="budibase__label--big">Settings</h4>
+
+    {#if $store.errors && $store.errors.length > 0}
+      <ErrorsBox errors={$store.errors} />
+    {/if}
+
     <form class="uk-form-stacked">
 
       <div class="horizontal-stack">

packages/core/src/templateApi/canDeleteIndex.js

@@ -23,7 +23,7 @@ export const canDeleteIndex = indexNode => {
       }
       return obj
     },[]),
-    map(f => `field ${f.name} on record ${f.record.name} uses this index as a reference`)
+    map(f => `field "${f.name}" on record "${f.record.name}" uses this index as a reference`)
   ])
 
   const lookupIndexes = $(flatHierarchy,[
@@ -37,7 +37,7 @@ export const canDeleteIndex = indexNode => {
       }
       return obj
     },[]),
-    map(f => `field ${f.name} on record ${f.record.name} uses this index as a lookup`)
+    map(f => `field "${f.name}" on record "${f.record.name}" uses this index as a lookup`)
   ])
 
   const errors = [

packages/core/src/templateApi/canDeleteRecord.js

@@ -27,7 +27,7 @@ export const canDeleteRecord = recordNode => {
       filter(i => isAncestorIndex(i) 
                 && belongsToAncestor(i) 
                 && includes(node.nodeId)(i.allowedRecordNodeIds)),
-      map(i => `index ${i.name} indexes this record. Please remove the record from allowedRecordIds, or delete the index`)
+      map(i => `index "${i.name}" indexes this record. Please remove the record from the index, or delete the index`)
     ])
 
     for (let child of node.children) {