From 73bff491e82c1d5a81928d17e3a83d210b6f0b71 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Thu, 18 Mar 2021 15:53:59 +0000
Subject: [PATCH] Update grid to support data providers

---
 packages/standard-components/manifest.json    |  6 ++---
 .../src/grid/Component.svelte                 | 27 +++++--------------
 2 files changed, 10 insertions(+), 23 deletions(-)

diff --git a/packages/standard-components/manifest.json b/packages/standard-components/manifest.json
index 4cda803ffd..c268be3ecd 100644
--- a/packages/standard-components/manifest.json
+++ b/packages/standard-components/manifest.json
@@ -15,9 +15,9 @@
     "styleable": true,
     "settings": [
       {
-        "type": "datasource",
-        "label": "Source",
-        "key": "datasource"
+        "type": "dataProvider",
+        "label": "Data",
+        "key": "dataProvider"
       },
       {
         "type": "detailScreen",
diff --git a/packages/standard-components/src/grid/Component.svelte b/packages/standard-components/src/grid/Component.svelte
index 49754a86a5..c7e0f24d3c 100644
--- a/packages/standard-components/src/grid/Component.svelte
+++ b/packages/standard-components/src/grid/Component.svelte
@@ -18,7 +18,7 @@
   const component = getContext("component")
   const { API, styleable } = SDK
 
-  export let datasource = {}
+  export let dataProvider
   export let editable
   export let theme = "alpine"
   export let height = 500
@@ -33,15 +33,15 @@
       ["--grid-height"]: `${height}px`,
     },
   }
-  $: fetchData(datasource)
+  $: setUpGrid(dataProvider)
+  $: dataLoaded = dataProvider?.loaded
+  $: data = dataProvider?.rows
 
   // These can never change at runtime so don't need to be reactive
   let canEdit = editable && datasource && datasource.type !== "view"
   let canAddDelete = editable && datasource && datasource.type === "table"
 
   let modal
-  let dataLoaded = false
-  let data
   let columnDefs
   let selectedRows = []
   let table
@@ -58,23 +58,12 @@
     pagination,
   }
 
-  async function fetchData(datasource) {
-    if (isEmpty(datasource)) {
+  async function setUpGrid(dataProvider) {
+    if (!dataProvider) {
       return
     }
-    data = await API.fetchDatasource(datasource)
-
-    let schema
-
-    // Get schema for datasource
-    // Views with "Calculate" applied provide their own schema.
-    // For everything else, use the tableId property to pull to table schema
-    if (datasource.schema) {
-      schema = datasource.schema
-    } else {
-      schema = (await API.fetchTableDefinition(datasource.tableId)).schema
-    }
 
+    const { schema } = dataProvider
     columnDefs = Object.keys(schema).map((key, i) => {
       return {
         headerCheckboxSelection: i === 0 && canEdit,
@@ -115,8 +104,6 @@
         },
       ]
     }
-
-    dataLoaded = true
   }
 
   const shouldHideField = name => {