Merge pull request #11732 from Budibase/budi-7468-save-row-action-will-attempt-to-save-the-image-data-of-the

Save row action S3 Upload fix, and other misc S3 fixes

packages/builder/src/components/design/settings/componentSettings.js

@@ -1,4 +1,4 @@
-import { Checkbox, Select, RadioGroup, Stepper } from "@budibase/bbui"
+import { Checkbox, Select, RadioGroup, Stepper, Input } from "@budibase/bbui"
 import DataSourceSelect from "./controls/DataSourceSelect.svelte"
 import S3DataSourceSelect from "./controls/S3DataSourceSelect.svelte"
 import DataProviderSelect from "./controls/DataProviderSelect.svelte"
@@ -60,6 +60,7 @@ const componentMap = {
   "field/longform": FormFieldSelect,
   "field/datetime": FormFieldSelect,
   "field/attachment": FormFieldSelect,
+  "field/s3": Input,
   "field/link": FormFieldSelect,
   "field/array": FormFieldSelect,
   "field/json": FormFieldSelect,

packages/builder/src/pages/builder/app/[application]/data/datasource/[datasourceId]/_components/EditDatasourceConfigButton.svelte

@@ -27,12 +27,14 @@
     if (datasource.source === IntegrationTypes.COUCHDB) {
       return datasource.config.database
     }
-    if (
-      datasource.source === IntegrationTypes.DYNAMODB ||
-      datasource.source === IntegrationTypes.S3
-    ) {
+    if (datasource.source === IntegrationTypes.DYNAMODB) {
       return `${datasource.config.endpoint}:${datasource.config.region}`
     }
+    if (datasource.source === IntegrationTypes.S3) {
+      return datasource.config.endpoint
+        ? `${datasource.config.endpoint}:${datasource.config.region}`
+        : `s3.${datasource.config.region}.amazonaws.com`
+    }
     if (datasource.source === IntegrationTypes.ELASTICSEARCH) {
       return datasource.config.url
     }

packages/client/manifest.json

@@ -3721,7 +3721,7 @@
     },
     "settings": [
       {
-        "type": "field/attachment",
+        "type": "field/s3",
         "label": "Field",
         "key": "field",
         "required": true

packages/client/src/components/app/forms/S3Upload.svelte

@@ -2,6 +2,7 @@
   import Field from "./Field.svelte"
   import { CoreDropzone, ProgressCircle } from "@budibase/bbui"
   import { getContext, onMount, onDestroy } from "svelte"
+  import { cloneDeep } from "../../../../../bbui/src/helpers"
 
   export let datasourceId
   export let bucket
@@ -14,6 +15,7 @@
 
   let fieldState
   let fieldApi
+  let localFiles = []
 
   const { API, notificationStore, uploadStore } = getContext("sdk")
   const component = getContext("component")
@@ -90,9 +92,17 @@
   }
 
   const handleChange = e => {
-    const changed = fieldApi.setValue(e.detail)
+    localFiles = e.detail
+    let files = cloneDeep(e.detail) || []
+    // remove URL as it contains the full base64 image data
+    files.forEach(file => {
+      if (file.type?.startsWith("image")) {
+        delete file.url
+      }
+    })
+    const changed = fieldApi.setValue(files)
     if (onChange && changed) {
-      onChange({ value: e.detail })
+      onChange({ value: files })
     }
   }
 
@@ -118,7 +128,7 @@
   <div class="content">
     {#if fieldState}
       <CoreDropzone
-        value={fieldState.value}
+        value={localFiles}
         disabled={loading || fieldState.disabled}
         error={fieldState.error}
         on:change={handleChange}