record keys as names

packages/builder/src/App.svelte

@@ -5,6 +5,16 @@
   import { routes } from "../routify/routes"
   import { store, initialise } from "builderStore"
   import NotificationDisplay from "components/common/Notification/NotificationDisplay.svelte"
+  import { notifier } from "builderStore/store/notifications"
+
+  function showErrorBanner() {
+    notifier.danger("Whoops! Looks like we're having trouble. Please refresh the page.")
+  }
+
+  onMount(async () => {
+    window.addEventListener("error", showErrorBanner)
+    window.addEventListener("unhandledrejection", showErrorBanner)
+  })
 
   $basepath = "/_builder"
 </script>

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

@@ -68,11 +68,11 @@ export const getBackendUiStore = () => {
           return state
         }),
       save: async ({ model }) => {
-        const updatedModel = cloneDeep(model)
-
         const SAVE_MODEL_URL = `/api/models`
-        await api.post(SAVE_MODEL_URL, updatedModel)
+        const response = await api.post(SAVE_MODEL_URL, model)
+        const json = await response.json()
         await store.actions.models.fetch()
+        store.actions.models.select(json)
       },
       addField: field => {
         store.update(state => {

packages/builder/src/components/common/LinkedRecordSelector.svelte

@@ -60,7 +60,7 @@
 
 <style>
   .fields.selected {
-    background: var(--light-grey);
+    background: var(--grey-1);
   }
 
   h3 {

packages/builder/src/components/database/ModelDataTable/LinkedRecord.svelte

@@ -88,7 +88,7 @@
     position: absolute;
     right: 15%;
     padding: 20px;
-    background: var(--light-grey);
+    background: var(--grey-1);
     border: 1px solid var(--grey);
   }
 

packages/builder/src/components/nav/ModelNavigator/BlockNavigator.svelte

@@ -58,7 +58,7 @@
     border-radius: 3px;
     color: var(--ink-lighter);
     font-size: 14px;
-    background: var(--light-grey);
+    background: var(--grey-1);
   }
 
   span:hover {

packages/builder/src/components/nav/ModelNavigator/EmptyModel.svelte

@@ -2,6 +2,7 @@
   import { backendUiStore } from "builderStore"
   import { uuid } from "builderStore/uuid"
   import { fade } from "svelte/transition"
+  import { notifier } from "builderStore/store/notifications"
   import { FIELDS, BLOCKS, MODELS } from "constants/backend"
   import Block from "components/common/Block.svelte"
 
@@ -12,15 +13,13 @@
   function createModel(model) {
     const { schema, ...rest } = $backendUiStore.selectedModel
 
-    // const newModel = { ...model, schema: {} }
-
     backendUiStore.actions.models.save({
       model: {
         ...model,
-        schema: {},
+        ...rest 
-        ...rest,
       },
     })
+    notifier.success(`${model.name} model created.`)
   }
 </script>
 

packages/builder/src/components/nav/ModelNavigator/ModelNavigator.svelte

@@ -64,13 +64,13 @@
                   on:click={() => selectModel(model)} />
                 {#if model._id === $backendUiStore.selectedModel._id}
                   <div in:slide>
-                    {#each Object.keys(model.schema) as fieldId}
+                    {#each Object.keys(model.schema) as fieldName}
                       <ListItem
-                        selected={model._id === $backendUiStore.selectedModel._id && fieldId === $backendUiStore.selectedField}
+                        selected={model._id === $backendUiStore.selectedModel._id && fieldName === $backendUiStore.selectedField}
                         indented
                         icon="ri-layout-column-fill"
-                        title={model.schema[fieldId].name}
+                        title={model.schema[fieldName].name}
-                        on:click={() => selectModel(model, fieldId)} />
+                        on:click={() => selectModel(model, fieldName)} />
                     {/each}
                   </div>
                 {/if}

packages/builder/src/components/nav/ModelSetupNav/ModelFieldEditor.svelte

@@ -23,17 +23,17 @@
     field.constraints.presence &&
     !constraints.presence.allowEmpty
 
-  function attachModelIdToSchema(evt) {
+  // function attachModelIdToSchema(evt) {
-    const { draftModel } = $backendUiStore
+  //   const { draftModel } = $backendUiStore
-    if ($backendUiStore.selectedField !== evt.target.value) {
+  //   if ($backendUiStore.selectedField !== evt.target.value) {
-      delete draftModel.schema[$backendUiStore.selectedField]
+  //     delete draftModel.schema[$backendUiStore.selectedField]
-      draftModel.schema[evt.target.value] = field
+  //     draftModel.schema[evt.target.value] = field
-      backendUiStore.update(state => {
+  //     backendUiStore.update(state => {
-        state.selectedField = evt.target.value
+  //       state.selectedField = evt.target.value
-        return state
+  //       return state
-      })
+  //     })
-    }
+  //   }
-  }
+  // }
 </script>
 
 <div class="info">
@@ -78,10 +78,7 @@
   {:else if field.type === 'link'}
     <div class="field">
       <label>Link</label>
-      <select
+      <select class="budibase__input" bind:value={field.modelId}>
-        class="budibase__input"
-        bind:value={field.modelId}
-        on:change={attachModelIdToSchema}>
         <option value={''} />
         {#each $backendUiStore.models as model}
           {#if model._id !== $backendUiStore.draftModel._id}

packages/server/src/api/controllers/model.js

@@ -51,7 +51,7 @@ exports.save = async function(ctx) {
     [`all_${modelToSave._id}`]: {
       map: `function(doc) {
         if (doc.modelId === "${modelToSave._id}") {
-          emit(doc[doc.key], doc._id); 
+          emit(doc._id); 
         }
       }`,
     },
@@ -75,7 +75,7 @@ exports.destroy = async function(ctx) {
   // Delete all records for that model
   const records = await db.query(`database/${modelViewId}`)
   await db.bulkDocs(
-    records.rows.map(record => ({ id: record.id, _deleted: true }))
+    records.rows.map(record => ({ _id: record.id, _deleted: true }))
   )
 
   // Delete linked record fields in dependent models

packages/server/src/api/controllers/record.js

@@ -56,8 +56,8 @@ exports.save = async function(ctx) {
         const doc = row.doc
         return {
           ...doc,
-          [model._id]: doc[model._id]
+          [model.name]: doc[model.name]
-            ? [...doc[model._id], record._id]
+            ? [...doc[model.name], record._id]
             : [record._id],
         }
       })