From 7e748891319d899fa773c42cecbdb65d8d263341 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Tue, 20 Oct 2020 12:23:52 +0100
Subject: [PATCH] Allow binding images to attachment types

---
 .../src/builderStore/fetchBindableProperties.js   |  4 +++-
 packages/standard-components/src/RowDetail.svelte |  9 ++++++++-
 packages/standard-components/src/fetchData.js     | 15 +++++++++++----
 3 files changed, 22 insertions(+), 6 deletions(-)

diff --git a/packages/builder/src/builderStore/fetchBindableProperties.js b/packages/builder/src/builderStore/fetchBindableProperties.js
index 36c40ee754..64755606c3 100644
--- a/packages/builder/src/builderStore/fetchBindableProperties.js
+++ b/packages/builder/src/builderStore/fetchBindableProperties.js
@@ -86,10 +86,12 @@ const contextToBindables = (tables, walkResult) => context => {
   }
 
   const newBindable = ([key, fieldSchema]) => {
-    // Replace link bindings with a new property representing the count
+    // Replace certain bindings with a new property to help display components
     let runtimeBoundKey = key
     if (fieldSchema.type === "link") {
       runtimeBoundKey = `${key}_count`
+    } else if (fieldSchema.type === "attachment") {
+      runtimeBoundKey = `${key}_first`
     }
     return {
       type: "context",
diff --git a/packages/standard-components/src/RowDetail.svelte b/packages/standard-components/src/RowDetail.svelte
index 5489ec0847..1669430e74 100644
--- a/packages/standard-components/src/RowDetail.svelte
+++ b/packages/standard-components/src/RowDetail.svelte
@@ -51,8 +51,15 @@
       // Fetch table schema so we can check for linked rows
       const tableObj = await fetchTable(row.tableId)
       for (let key of Object.keys(tableObj.schema)) {
-        if (tableObj.schema[key].type === "link") {
+        const type = tableObj.schema[key].type
+        if (type === "link") {
           row[`${key}_count`] = Array.isArray(row[key]) ? row[key].length : 0
+        } else if (type === "attachment") {
+          let url = null
+          if (Array.isArray(row[key]) && row[key][0] != null) {
+            url = row[key][0].url
+          }
+          row[`${key}_first`] = url
         }
       }
 
diff --git a/packages/standard-components/src/fetchData.js b/packages/standard-components/src/fetchData.js
index 42f07d3910..59b417a5c8 100644
--- a/packages/standard-components/src/fetchData.js
+++ b/packages/standard-components/src/fetchData.js
@@ -6,11 +6,11 @@ export default async function fetchData(datasource, store) {
   if (name) {
     let rows = []
     if (type === "table") {
-      rows = fetchTableData()
+      rows = await fetchTableData()
     } else if (type === "view") {
-      rows = fetchViewData()
+      rows = await fetchViewData()
     } else if (type === "link") {
-      rows = fetchLinkedRowsData()
+      rows = await fetchLinkedRowsData()
     }
 
     // Fetch table schema so we can check for linked rows
@@ -19,8 +19,15 @@ export default async function fetchData(datasource, store) {
       const keys = Object.keys(table.schema)
       rows.forEach(row => {
         for (let key of keys) {
-          if (table.schema[key].type === "link") {
+          const type = table.schema[key].type
+          if (type === "link") {
             row[`${key}_count`] = Array.isArray(row[key]) ? row[key].length : 0
+          } else if (type === "attachment") {
+            let url = null
+            if (Array.isArray(row[key]) && row[key][0] != null) {
+              url = row[key][0].url
+            }
+            row[`${key}_first`] = url
           }
         }
       })