Merge pull request #7768 from nocodb/nc-fix/form-logo-banner-signed-path

Nc fix: add missing signedPath or signedUrl in form attachements

packages/nc-gui/components/general/FormBanner.vue

@@ -1,6 +1,8 @@
 <script lang="ts" setup>
+import type { AttachmentResType } from 'nocodb-sdk';
+
 interface Props {
-  bannerImageUrl?: string | null
+  bannerImageUrl?: AttachmentResType
 }
 const { bannerImageUrl } = defineProps<Props>()
 

packages/nc-gui/components/smartsheet/Form.vue

@@ -12,6 +12,7 @@ import {
   isLinksOrLTAR,
   isSelectTypeCol,
   isVirtualCol,
+type AttachmentResType,
 } from 'nocodb-sdk'
 import type { Permission } from '#imports'
 import {
@@ -372,8 +373,8 @@ function setFormData() {
   systemFieldsIds.value = getSystemColumns(col).map((c) => c.fk_column_id)
 
   formViewData.value = {
-    banner_image_url: '',
+    banner_image_url: null,
-    logo_url: '',
+    logo_url: null,
     ...formViewData.value,
     submit_another_form: !!(formViewData.value?.submit_another_form ?? 0),
     show_blank_form: !!(formViewData.value?.show_blank_form ?? 0),
@@ -503,11 +504,11 @@ onChangeFile((files) => {
   }
 })
 
-const handleOnUploadImage = (data: Record<string, any> = {}) => {
+const handleOnUploadImage = (data: AttachmentResType = null) => {
   if (imageCropperData.value.cropFor === 'banner') {
-    formViewData.value!.banner_image_url = stringifyProp(data) ?? ''
+    formViewData.value!.banner_image_url = data 
   } else {
-    formViewData.value!.logo_url = stringifyProp(data) ?? ''
+    formViewData.value!.logo_url = data
   }
   updateView()
 }
@@ -724,7 +725,7 @@ useEventListener(
                       @click="
                               () => {
                                 if (isEditable) {
-                                  formViewData!.banner_image_url = ''
+                                  formViewData!.banner_image_url = null
                                   updateView()
                                 }
                               }
@@ -787,7 +788,7 @@ useEventListener(
                             @click="
                               () => {
                                 if (isEditable) {
-                                  formViewData!.logo_url = ''
+                                  formViewData!.logo_url = null
                                   updateView()
                                 }
                               }

packages/nocodb/src/models/FormView.ts

@@ -1,5 +1,10 @@
-import type { MetaType } from 'nocodb-sdk';
+import type {
-import type { BoolType, FormType } from 'nocodb-sdk';
+  MetaType,
+  BoolType,
+  FormType,
+  AttachmentResType,
+} from 'nocodb-sdk';
+import { PresignedUrl } from '~/models';
 import FormViewColumn from '~/models/FormViewColumn';
 import View from '~/models/View';
 import { extractProps } from '~/helpers/extractProps';
@@ -9,7 +14,12 @@ import { deserializeJSON, serializeJSON } from '~/utils/serialize';
 import { CacheGetType, CacheScope, MetaTable } from '~/utils/globals';
 import { prepareForDb, prepareForResponse } from '~/utils/modelUtils';
 
-export default class FormView implements FormType {
+type FormViewType = Omit<FormType, 'banner_image_url' | 'logo_url'> & {
+  banner_image_url?: AttachmentResType | string;
+  logo_url?: AttachmentResType | string;
+};
+
+export default class FormView implements FormViewType {
   show: BoolType;
   is_default: BoolType;
   order: number;
@@ -20,8 +30,8 @@ export default class FormView implements FormType {
   redirect_url?: string;
   redirect_after_secs?: string;
   email?: string;
-  banner_image_url?: string;
+  banner_image_url?: AttachmentResType | string;
-  logo_url?: string;
+  logo_url?: AttachmentResType | string;
   submit_another_form?: BoolType;
   show_blank_form?: BoolType;
 
@@ -46,11 +56,21 @@ export default class FormView implements FormType {
       view = await ncMeta.metaGet2(null, null, MetaTable.FORM_VIEW, {
         fk_view_id: viewId,
       });
+
       if (view) {
         view.meta = deserializeJSON(view.meta);
         await NocoCache.set(`${CacheScope.FORM_VIEW}:${viewId}`, view);
       }
     }
+
+    const convertedAttachment = await this.convertAttachmentType({
+      banner_image_url: view?.banner_image_url,
+      logo_url: view?.logo_url,
+    });
+
+    view.banner_image_url = convertedAttachment.banner_image_url || null;
+    view.logo_url = convertedAttachment.logo_url || null;
+
     return view && new FormView(view);
   }
 
@@ -74,6 +94,17 @@ export default class FormView implements FormType {
     if (insertObj.meta) {
       insertObj.meta = serializeJSON(insertObj.meta);
     }
+
+    if (insertObj?.logo_url) {
+      insertObj.logo_url = this.serializeAttachmentJSON(insertObj.logo_url);
+    }
+
+    if (insertObj?.banner_image_url) {
+      insertObj.banner_image_url = this.serializeAttachmentJSON(
+        insertObj.banner_image_url,
+      );
+    }
+
     if (!(view.base_id && view.source_id)) {
       const viewRef = await View.get(view.fk_view_id);
       insertObj.base_id = viewRef.base_id;
@@ -103,6 +134,16 @@ export default class FormView implements FormType {
       'meta',
     ]);
 
+    if (updateObj?.logo_url) {
+      updateObj.logo_url = this.serializeAttachmentJSON(updateObj.logo_url);
+    }
+
+    if (updateObj?.banner_image_url) {
+      updateObj.banner_image_url = this.serializeAttachmentJSON(
+        updateObj.banner_image_url,
+      );
+    }
+
     // update meta
     const res = await ncMeta.metaUpdate(
       null,
@@ -131,4 +172,61 @@ export default class FormView implements FormType {
     await form.getColumns(ncMeta);
     return form;
   }
+
+  static serializeAttachmentJSON(attachment): string | null {
+    if (attachment) {
+      return serializeJSON(
+        extractProps(deserializeJSON(attachment), [
+          'url',
+          'path',
+          'title',
+          'mimetype',
+          'size',
+          'icon',
+        ]),
+      );
+    }
+    return attachment;
+  }
+
+  protected static async convertAttachmentType(
+    formAttachments: Record<string, any>,
+  ) {
+    try {
+      if (formAttachments) {
+        const promises = [];
+
+        for (const key in formAttachments) {
+          if (
+            formAttachments[key] &&
+            typeof formAttachments[key] === 'string'
+          ) {
+            formAttachments[key] = deserializeJSON(formAttachments[key]);
+          }
+
+          if (formAttachments[key]?.path) {
+            promises.push(
+              PresignedUrl.getSignedUrl({
+                path: formAttachments[key].path.replace(/^download\//, ''),
+              }).then((r) => (formAttachments[key].signedPath = r)),
+            );
+          } else if (formAttachments[key]?.url) {
+            if (formAttachments[key].url.includes('.amazonaws.com/')) {
+              const relativePath = decodeURI(
+                formAttachments[key].url.split('.amazonaws.com/')[1],
+              );
+              promises.push(
+                PresignedUrl.getSignedUrl({
+                  path: relativePath,
+                  s3: true,
+                }).then((r) => (formAttachments[key].signedUrl = r)),
+              );
+            }
+          }
+        }
+        await Promise.all(promises);
+      }
+    } catch {}
+    return formAttachments;
+  }
 }

packages/nocodb/src/schema/swagger-v2.json

@@ -5714,7 +5714,12 @@
               "examples": {
                 "Example 1": {
                   "value": {
-                    "banner_image_url": null,
+                    "banner_image_url": {
+                      "mimetype": "image/jpg",
+                      "size": 32903,
+                      "title": "Random-Pictures-of-Conceptual-and-Creative-Ideas-02.jpg",
+                      "path": "download/noco/pm0umqsip16i1u5/m8yn03dncqal6ri//iDL5ednaHz2j2Sa3Cl.jpg"
+                    },
                     "email": "user@example.com",
                     "heading": "My Form",
                     "lock_type": "collaborative",
@@ -5755,7 +5760,13 @@
                   "Example 1": {
                     "value": {
                       "source_id": "ds_g4ccx6e77h1dmi",
-                      "banner_image_url": null,
+                      "banner_image_url": {
+                        "mimetype": "image/jpg",
+                        "size": 32903,
+                        "title": "Random-Pictures-of-Conceptual-and-Creative-Ideas-02.jpg",
+                        "path": "download/noco/pm0umqsip16i1u5/m8yn03dncqal6ri//iDL5ednaHz2j2Sa3Cl.jpg",
+                        "signedPath": "dltemp/lNoLbqB62Jdo5Rmp/1709308800000/noco/pm0umqsip16i1u5/m8yn03dncqal6ri//iDL5ednaHz2j2Sa3Cl.jpg"
+                      },
                       "columns": [
                         {
                           "id": "fvc_ugj9zo5bzocxtl",
@@ -11497,6 +11508,64 @@
           "id": "6cr1iwhbyxncd"
         }
       },
+      "AttachmentRes": {
+        "description": "Model for Attachment Response",
+        "oneOf": [
+          {
+            "type": "object",
+            "x-examples": {
+              "Example 1": {
+                "mimetype": "image/jpg",
+                "size": 32903,
+                "title": "Random-Pictures-of-Conceptual-and-Creative-Ideas-02.jpg",
+                "path": "download/noco/pm0umqsip16i1u5/m8yn03dncqal6ri//iDL5ednaHz2j2Sa3Cl.jpg",
+                "signedPath": "dltemp/lNoLbqB62Jdo5Rmp/1709308800000/noco/pm0umqsip16i1u5/m8yn03dncqal6ri//iDL5ednaHz2j2Sa3Cl.jpg"
+              },
+              "Example 2" :{
+                "mimetype": "image/jpeg",
+                "size": 146143,
+                "title": "2 be loved.jpeg",
+                "url": "https://some-s3-server.com/nc/uploads/2023/10/16/some-key/3niqHLngUKiU2Hupe8.jpeg",
+                "signedUrl": "https://some-s3-server.com/nc/uploads/2023/10/16/signed-url-misc-info"
+              }
+            },
+            "properties": {
+              "mimetype": {
+                "type": "string",
+                "description": "The mimetype of the attachment"
+              },
+              "path": {
+                "type": "string",
+                "description": "The attachment stored path"
+              },
+              "size": {
+                "type": "number",
+                "description": "The size of the attachment"
+              },
+              "title": {
+                "type": "string",
+                "description": "The title of the attachment used in UI"
+              },
+              "url": {
+                "type": "string",
+                "description": "The attachment stored url"
+              },
+              "signedPath": {
+                "type": "string",
+                "description": "Attachment signedPath will allow to access attachment directly"
+              },
+              "signedUrl": {
+                "type": "string",
+                "description": "Attachment signedUrl will allow to access attachment directly"
+              }
+            }
+          },
+          {
+            "type": "null"
+          }
+        ],
+        "title": "Attachment Response Model"
+      },
       "Audit": {
         "description": "Model for Audit",
         "examples": [
@@ -12978,7 +13047,13 @@
         "examples": [
           {
             "source_id": "ds_g4ccx6e77h1dmi",
-            "banner_image_url": null,
+            "banner_image_url": {
+              "mimetype": "image/jpg",
+              "size": 32903,
+              "title": "Random-Pictures-of-Conceptual-and-Creative-Ideas-02.jpg",
+              "path": "download/noco/pm0umqsip16i1u5/m8yn03dncqal6ri//iDL5ednaHz2j2Sa3Cl.jpg",
+              "signedPath": "dltemp/lNoLbqB62Jdo5Rmp/1709308800000/noco/pm0umqsip16i1u5/m8yn03dncqal6ri//iDL5ednaHz2j2Sa3Cl.jpg"
+            },
             "columns": [
               {
                 "id": "fvc_ugj9zo5bzocxtl",
@@ -13002,7 +13077,13 @@
             "fk_model_id": "md_rsu68aqjsbyqtl",
             "heading": "My Form",
             "lock_type": "collaborative",
-            "logo_url": null,
+            "logo_url": {
+              "mimetype": "image/jpg",
+              "size": 32903,
+              "title": "Random-Pictures-of-Conceptual-and-Creative-Ideas-02.jpg",
+              "path": "download/noco/pm0umqsip16i1u5/m8yn03dncqal6ri//iDL5ednaHz2j2Sa3Cl.jpg",
+              "signedPath": "dltemp/lNoLbqB62Jdo5Rmp/1709308800000/noco/pm0umqsip16i1u5/m8yn03dncqal6ri//iDL5ednaHz2j2Sa3Cl.jpg"
+            },
             "meta": null,
             "redirect_after_secs": null,
             "redirect_url": null,
@@ -13024,8 +13105,8 @@
             }
           },
           "banner_image_url": {
-            "$ref": "#/components/schemas/StringOrNull",
+            "$ref": "#/components/schemas/AttachmentRes",
-            "description": "Banner Image URL. Not in use currently."
+            "description": "Banner Image URL"
           },
           "columns": {
             "type": "array",
@@ -13067,8 +13148,8 @@
             "example": "collaborative"
           },
           "logo_url": {
-            "$ref": "#/components/schemas/StringOrNull",
+            "$ref": "#/components/schemas/AttachmentRes",
-            "description": "Logo URL. Not in use currently."
+            "description": "Logo URL."
           },
           "meta": {
             "$ref": "#/components/schemas/Meta",
@@ -13113,7 +13194,12 @@
         "description": "Model for Form Update Request",
         "examples": [
           {
-            "banner_image_url": null,
+            "banner_image_url": {
+              "mimetype": "image/jpg",
+              "size": 32903,
+              "title": "Random-Pictures-of-Conceptual-and-Creative-Ideas-02.jpg",
+              "path": "download/noco/pm0umqsip16i1u5/m8yn03dncqal6ri//iDL5ednaHz2j2Sa3Cl.jpg"
+            },
             "email": "user@example.com",
             "heading": "My Form",
             "logo_url": null,
@@ -13130,8 +13216,15 @@
         "type": "object",
         "properties": {
           "banner_image_url": {
-            "$ref": "#/components/schemas/TextOrNull",
+            "oneOf": [
-            "description": "Banner Image URL. Not in use currently."
+              {
+                "$ref": "#/components/schemas/AttachmentReq"
+              },
+              {
+                "type" : "null"
+              }
+            ],
+            "description": "Banner Image URL"
           },
           "email": {
             "$ref": "#/components/schemas/StringOrNull",
@@ -13144,8 +13237,15 @@
             "type": "string"
           },
           "logo_url": {
-            "$ref": "#/components/schemas/TextOrNull",
+            "oneOf": [
-            "description": "Logo URL. Not in use currently."
+              {
+                "$ref": "#/components/schemas/AttachmentReq"
+              },
+              {
+                "type" : "null"
+              }
+            ],
+            "description": "Logo URL."
           },
           "meta": {
             "$ref": "#/components/schemas/Meta",

packages/nocodb/src/schema/swagger.json

@@ -7426,7 +7426,12 @@
               "examples": {
                 "Example 1": {
                   "value": {
-                    "banner_image_url": null,
+                    "banner_image_url": {
+                      "mimetype": "image/jpg",
+                      "size": 32903,
+                      "title": "Random-Pictures-of-Conceptual-and-Creative-Ideas-02.jpg",
+                      "path": "download/noco/pm0umqsip16i1u5/m8yn03dncqal6ri//iDL5ednaHz2j2Sa3Cl.jpg"
+                    },
                     "email": "user@example.com",
                     "heading": "My Form",
                     "lock_type": "collaborative",
@@ -7467,7 +7472,13 @@
                   "Example 1": {
                     "value": {
                       "source_id": "ds_g4ccx6e77h1dmi",
-                      "banner_image_url": null,
+                      "banner_image_url": {
+                        "mimetype": "image/jpg",
+                        "size": 32903,
+                        "title": "Random-Pictures-of-Conceptual-and-Creative-Ideas-02.jpg",
+                        "path": "download/noco/pm0umqsip16i1u5/m8yn03dncqal6ri//iDL5ednaHz2j2Sa3Cl.jpg",
+                        "signedPath": "dltemp/lNoLbqB62Jdo5Rmp/1709308800000/noco/pm0umqsip16i1u5/m8yn03dncqal6ri//iDL5ednaHz2j2Sa3Cl.jpg"
+                      },
                       "columns": [
                         {
                           "id": "fvc_ugj9zo5bzocxtl",
@@ -17093,6 +17104,64 @@
           "id": "6cr1iwhbyxncd"
         }
       },
+      "AttachmentRes": {
+        "description": "Model for Attachment Response",
+        "oneOf": [
+          {
+            "type": "object",
+            "x-examples": {
+              "Example 1": {
+                "mimetype": "image/jpg",
+                "size": 32903,
+                "title": "Random-Pictures-of-Conceptual-and-Creative-Ideas-02.jpg",
+                "path": "download/noco/pm0umqsip16i1u5/m8yn03dncqal6ri//iDL5ednaHz2j2Sa3Cl.jpg",
+                "signedPath": "dltemp/lNoLbqB62Jdo5Rmp/1709308800000/noco/pm0umqsip16i1u5/m8yn03dncqal6ri//iDL5ednaHz2j2Sa3Cl.jpg"
+              },
+              "Example 2" :{
+                "mimetype": "image/jpeg",
+                "size": 146143,
+                "title": "2 be loved.jpeg",
+                "url": "https://some-s3-server.com/nc/uploads/2023/10/16/some-key/3niqHLngUKiU2Hupe8.jpeg",
+                "signedUrl": "https://some-s3-server.com/nc/uploads/2023/10/16/signed-url-misc-info"
+              }
+            },
+            "properties": {
+              "mimetype": {
+                "type": "string",
+                "description": "The mimetype of the attachment"
+              },
+              "path": {
+                "type": "string",
+                "description": "The attachment stored path"
+              },
+              "size": {
+                "type": "number",
+                "description": "The size of the attachment"
+              },
+              "title": {
+                "type": "string",
+                "description": "The title of the attachment used in UI"
+              },
+              "url": {
+                "type": "string",
+                "description": "The attachment stored url"
+              },
+              "signedPath": {
+                "type": "string",
+                "description": "Attachment signedPath will allow to access attachment directly"
+              },
+              "signedUrl": {
+                "type": "string",
+                "description": "Attachment signedUrl will allow to access attachment directly"
+              }
+            }
+          },
+          {
+            "type": "null"
+          }
+        ],
+        "title": "Attachment Response Model"
+      },
       "FileReq": {
         "description": "Model for File Request",
         "type": "object",
@@ -18620,7 +18689,13 @@
         "examples": [
           {
             "source_id": "ds_g4ccx6e77h1dmi",
-            "banner_image_url": null,
+            "banner_image_url": {
+              "mimetype": "image/jpg",
+              "size": 32903,
+              "title": "Random-Pictures-of-Conceptual-and-Creative-Ideas-02.jpg",
+              "path": "download/noco/pm0umqsip16i1u5/m8yn03dncqal6ri//iDL5ednaHz2j2Sa3Cl.jpg",
+              "signedPath": "dltemp/lNoLbqB62Jdo5Rmp/1709308800000/noco/pm0umqsip16i1u5/m8yn03dncqal6ri//iDL5ednaHz2j2Sa3Cl.jpg"
+            },
             "columns": [
               {
                 "id": "fvc_ugj9zo5bzocxtl",
@@ -18644,7 +18719,13 @@
             "fk_model_id": "md_rsu68aqjsbyqtl",
             "heading": "My Form",
             "lock_type": "collaborative",
-            "logo_url": null,
+            "logo_url": {
+              "mimetype": "image/jpg",
+              "size": 32903,
+              "title": "Random-Pictures-of-Conceptual-and-Creative-Ideas-02.jpg",
+              "path": "download/noco/pm0umqsip16i1u5/m8yn03dncqal6ri//iDL5ednaHz2j2Sa3Cl.jpg",
+              "signedPath": "dltemp/lNoLbqB62Jdo5Rmp/1709308800000/noco/pm0umqsip16i1u5/m8yn03dncqal6ri//iDL5ednaHz2j2Sa3Cl.jpg"
+            },
             "meta": null,
             "redirect_after_secs": null,
             "redirect_url": null,
@@ -18666,8 +18747,8 @@
             }
           },
           "banner_image_url": {
-            "$ref": "#/components/schemas/TextOrNull",
+            "$ref": "#/components/schemas/AttachmentRes",
-            "description": "Banner Image URL. Not in use currently."
+            "description": "Banner Image URL"
           },
           "columns": {
             "type": "array",
@@ -18709,8 +18790,8 @@
             "example": "collaborative"
           },
           "logo_url": {
-            "$ref": "#/components/schemas/TextOrNull",
+            "$ref": "#/components/schemas/AttachmentRes",
-            "description": "Logo URL. Not in use currently."
+            "description": "Logo URL"
           },
           "meta": {
             "$ref": "#/components/schemas/Meta",
@@ -18755,7 +18836,12 @@
         "description": "Model for Form Update Request",
         "examples": [
           {
-            "banner_image_url": null,
+            "banner_image_url": {
+              "mimetype": "image/jpg",
+              "size": 32903,
+              "title": "Random-Pictures-of-Conceptual-and-Creative-Ideas-02.jpg",
+              "path": "download/noco/pm0umqsip16i1u5/m8yn03dncqal6ri//iDL5ednaHz2j2Sa3Cl.jpg"
+            },
             "email": "user@example.com",
             "heading": "My Form",
             "logo_url": null,
@@ -18772,8 +18858,15 @@
         "type": "object",
         "properties": {
           "banner_image_url": {
-            "$ref": "#/components/schemas/StringOrNull",
+            "oneOf": [
-            "description": "Banner Image URL. Not in use currently."
+              {
+                "$ref": "#/components/schemas/AttachmentReq"
+              },
+              {
+                "type" : "null"
+              }
+            ],
+            "description": "Banner Image URL"
           },
           "email": {
             "$ref": "#/components/schemas/StringOrNull",
@@ -18786,8 +18879,15 @@
             "type": "string"
           },
           "logo_url": {
-            "$ref": "#/components/schemas/StringOrNull",
+            "oneOf": [
-            "description": "Logo URL. Not in use currently."
+              {
+                "$ref": "#/components/schemas/AttachmentReq"
+              },
+              {
+                "type" : "null"
+              }
+            ],
+            "description": "Logo URL"
           },
           "meta": {
             "$ref": "#/components/schemas/Meta",