fix optional chaining error and adds guard for no model selected.

packages/builder/src/components/userInterface/ComponentDropdownMenu.svelte

@@ -113,7 +113,6 @@
   </div>
 </div>
 <DropdownMenu
-  class="menu"
   bind:this={dropdown}
   on:click={hideDropdown}
   width="170px"

packages/standard-components/package.json

@@ -16,13 +16,13 @@
     "@budibase/client": "^0.1.25",
     "@rollup/plugin-commonjs": "^11.1.0",
     "lodash": "^4.17.15",
-    "rollup": "^1.11.0",
+    "rollup": "^2.11.2",
     "rollup-plugin-commonjs": "^10.0.2",
     "rollup-plugin-json": "^4.0.0",
     "rollup-plugin-livereload": "^1.0.1",
     "rollup-plugin-node-resolve": "^5.0.0",
     "rollup-plugin-postcss": "^3.1.5",
-    "rollup-plugin-svelte": "^5.0.0",
+    "rollup-plugin-svelte": "^5.0.3",
     "rollup-plugin-terser": "^7.0.2",
     "shortid": "^2.2.15",
     "sirv-cli": "^0.4.4",
@@ -48,4 +48,4 @@
     "svelte-flatpickr": "^2.4.0",
     "svelte-fusioncharts": "^1.0.0"
   }
-}
+}

packages/standard-components/rollup.config.js

@@ -2,6 +2,7 @@ import svelte from "rollup-plugin-svelte"
 import resolve from "rollup-plugin-node-resolve"
 import commonjs from "@rollup/plugin-commonjs"
 import postcss from "rollup-plugin-postcss"
+import { terser } from "rollup-plugin-terser";
 
 const lodash_fp_exports = ["isEmpty"]
 
@@ -16,6 +17,7 @@ export default {
     },
   ],
   plugins: [
+    terser(),
     postcss({
       plugins: [],
     }),

packages/standard-components/src/DataGrid/Component.svelte

@@ -24,29 +24,32 @@
   let model
 
   onMount(async () => {
-    const jsonModel = await _bb.api.get(`/api/models/${datasource.modelId}`)
+    if (datasource.modelId) {
-    model = await jsonModel.json()
+      const jsonModel = await _bb.api.get(`/api/models/${datasource.modelId}`)
-    const { schema } = model
+      model = await jsonModel.json()
-    console.log(schema)
+      const { schema } = model
-    if (!isEmpty(datasource)) {
+      console.log(schema)
-      data = await fetchData(datasource)
+      if (!isEmpty(datasource)) {
-      columnDefs = Object.keys(schema).map((key, i) => {
+        data = await fetchData(datasource)
-        return {
+        columnDefs = Object.keys(schema).map((key, i) => {
-          headerCheckboxSelection: i === 0,
+          return {
-          checkboxSelection: i === 0,
+            headerCheckboxSelection: i === 0,
-          valueSetter: setters.get(schema[key].type),
+            checkboxSelection: i === 0,
-          headerName: key.charAt(0).toUpperCase() + key.slice(1),
+            valueSetter: setters.get(schema[key].type),
-          field: key,
+            headerName: key.charAt(0).toUpperCase() + key.slice(1),
-          hide: shouldHideField(key),
+            field: key,
-          sortable: true,
+            hide: shouldHideField(key),
-          editable:
+            sortable: true,
-            schema[key].type !== "boolean" && schema[key].type !== "attachment",
+            editable:
-          cellRenderer: renderers.get(schema[key].type),
+              schema[key].type !== "boolean" &&
-          autoHeight: schema[key].type === "attachment",
+              schema[key].type !== "attachment",
-        }
+            cellRenderer: renderers.get(schema[key].type),
-      })
+            autoHeight: schema[key].type === "attachment",
+          }
+        })
+      }
+      dataLoaded = true
     }
-    dataLoaded = true
   })
 
   const shouldHideField = name => {