From 48f339215254c92e49a32c993955f55f8c6b8a5c Mon Sep 17 00:00:00 2001
From: Martin McKeaveney <martin@shogunsystems.co.uk>
Date: Thu, 25 Jun 2020 20:04:58 +0100
Subject: [PATCH] record keys as names

---
 packages/builder/src/App.svelte               | 10 +++++++
 .../builder/src/builderStore/store/backend.js |  6 ++---
 .../common/LinkedRecordSelector.svelte        |  2 +-
 .../ModelDataTable/LinkedRecord.svelte        |  2 +-
 .../nav/ModelNavigator/BlockNavigator.svelte  |  2 +-
 .../nav/ModelNavigator/EmptyModel.svelte      |  9 +++----
 .../nav/ModelNavigator/ModelNavigator.svelte  |  8 +++---
 .../nav/ModelSetupNav/ModelFieldEditor.svelte | 27 +++++++++----------
 packages/server/src/api/controllers/model.js  |  4 +--
 packages/server/src/api/controllers/record.js |  4 +--
 10 files changed, 40 insertions(+), 34 deletions(-)

diff --git a/packages/builder/src/App.svelte b/packages/builder/src/App.svelte
index d10c04727f..163a78ac73 100644
--- a/packages/builder/src/App.svelte
+++ b/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>
diff --git a/packages/builder/src/builderStore/store/backend.js b/packages/builder/src/builderStore/store/backend.js
index 130ca0c454..ecb2b6550e 100644
--- a/packages/builder/src/builderStore/store/backend.js
+++ b/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 => {
diff --git a/packages/builder/src/components/common/LinkedRecordSelector.svelte b/packages/builder/src/components/common/LinkedRecordSelector.svelte
index bad03f436d..a494abc805 100644
--- a/packages/builder/src/components/common/LinkedRecordSelector.svelte
+++ b/packages/builder/src/components/common/LinkedRecordSelector.svelte
@@ -60,7 +60,7 @@
 
 <style>
   .fields.selected {
-    background: var(--light-grey);
+    background: var(--grey-1);
   }
 
   h3 {
diff --git a/packages/builder/src/components/database/ModelDataTable/LinkedRecord.svelte b/packages/builder/src/components/database/ModelDataTable/LinkedRecord.svelte
index 8c7d064c0b..dde2c75bec 100644
--- a/packages/builder/src/components/database/ModelDataTable/LinkedRecord.svelte
+++ b/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);
   }
 
diff --git a/packages/builder/src/components/nav/ModelNavigator/BlockNavigator.svelte b/packages/builder/src/components/nav/ModelNavigator/BlockNavigator.svelte
index 13f4a5223e..275a8291de 100644
--- a/packages/builder/src/components/nav/ModelNavigator/BlockNavigator.svelte
+++ b/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 {
diff --git a/packages/builder/src/components/nav/ModelNavigator/EmptyModel.svelte b/packages/builder/src/components/nav/ModelNavigator/EmptyModel.svelte
index cd7024af0a..436f3e8eef 100644
--- a/packages/builder/src/components/nav/ModelNavigator/EmptyModel.svelte
+++ b/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,
+        ...model,
+        ...rest 
       },
     })
+    notifier.success(`${model.name} model created.`)
   }
 </script>
 
diff --git a/packages/builder/src/components/nav/ModelNavigator/ModelNavigator.svelte b/packages/builder/src/components/nav/ModelNavigator/ModelNavigator.svelte
index 19778c278f..55a6610243 100644
--- a/packages/builder/src/components/nav/ModelNavigator/ModelNavigator.svelte
+++ b/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}
-                        on:click={() => selectModel(model, fieldId)} />
+                        title={model.schema[fieldName].name}
+                        on:click={() => selectModel(model, fieldName)} />
                     {/each}
                   </div>
                 {/if}
diff --git a/packages/builder/src/components/nav/ModelSetupNav/ModelFieldEditor.svelte b/packages/builder/src/components/nav/ModelSetupNav/ModelFieldEditor.svelte
index 4f69f156e2..37e8e8ce7a 100644
--- a/packages/builder/src/components/nav/ModelSetupNav/ModelFieldEditor.svelte
+++ b/packages/builder/src/components/nav/ModelSetupNav/ModelFieldEditor.svelte
@@ -23,17 +23,17 @@
     field.constraints.presence &&
     !constraints.presence.allowEmpty
 
-  function attachModelIdToSchema(evt) {
-    const { draftModel } = $backendUiStore
-    if ($backendUiStore.selectedField !== evt.target.value) {
-      delete draftModel.schema[$backendUiStore.selectedField]
-      draftModel.schema[evt.target.value] = field
-      backendUiStore.update(state => {
-        state.selectedField = evt.target.value
-        return state
-      })
-    }
-  }
+  // function attachModelIdToSchema(evt) {
+  //   const { draftModel } = $backendUiStore
+  //   if ($backendUiStore.selectedField !== evt.target.value) {
+  //     delete draftModel.schema[$backendUiStore.selectedField]
+  //     draftModel.schema[evt.target.value] = field
+  //     backendUiStore.update(state => {
+  //       state.selectedField = evt.target.value
+  //       return state
+  //     })
+  //   }
+  // }
 </script>
 
 <div class="info">
@@ -78,10 +78,7 @@
   {:else if field.type === 'link'}
     <div class="field">
       <label>Link</label>
-      <select
-        class="budibase__input"
-        bind:value={field.modelId}
-        on:change={attachModelIdToSchema}>
+      <select class="budibase__input" bind:value={field.modelId}>
         <option value={''} />
         {#each $backendUiStore.models as model}
           {#if model._id !== $backendUiStore.draftModel._id}
diff --git a/packages/server/src/api/controllers/model.js b/packages/server/src/api/controllers/model.js
index 65bc367a08..6fba9f998a 100644
--- a/packages/server/src/api/controllers/model.js
+++ b/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
diff --git a/packages/server/src/api/controllers/record.js b/packages/server/src/api/controllers/record.js
index 4efe1acb73..01b1f6b859 100644
--- a/packages/server/src/api/controllers/record.js
+++ b/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]
-            ? [...doc[model._id], record._id]
+          [model.name]: doc[model.name]
+            ? [...doc[model.name], record._id]
             : [record._id],
         }
       })