From 923bf892a7f23e460b7c59fc260e4ef86939383a Mon Sep 17 00:00:00 2001
From: Christian van der Geer <Christian@2at.nl>
Date: Fri, 26 Jul 2024 15:25:03 +0200
Subject: [PATCH 1/3] feat: added retrieval of file type fields

- Extracted retrieval of note attachments to separate function
- Introduced isAttachmentPdf member to determine PDF type once per file
- inverted conditional logic on isAttachmentPdf not to use negation
- Added function to retrieve any file type fields. Quickest way to prevent large code refactoring was to convert the file blob to Base64 string
- Bumbed version to .2
---
 AttachmentGallery/ControlManifest.Input.xml   |  2 +-
 AttachmentGallery/index.ts                    | 69 +++++++++++++++----
 .../src/Other/Solution.xml                    |  2 +-
 3 files changed, 58 insertions(+), 15 deletions(-)

diff --git a/AttachmentGallery/ControlManifest.Input.xml b/AttachmentGallery/ControlManifest.Input.xml
index 68b5911..dff17da 100644
--- a/AttachmentGallery/ControlManifest.Input.xml
+++ b/AttachmentGallery/ControlManifest.Input.xml
@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="utf-8" ?>
 <manifest>
-  <control namespace="DancingWithCrmControls" constructor="AttachmentGallery" version="0.0.1" display-name-key="AttachmentGallery" description-key="AttachmentGallery description" control-type="standard" >
+  <control namespace="DancingWithCrmControls" constructor="AttachmentGallery" version="0.0.2" display-name-key="AttachmentGallery" description-key="AttachmentGallery description" control-type="standard" >
     <!--external-service-usage node declares whether this 3rd party PCF control is using external service or not, if yes, this control will be considered as premium and please also add the external domain it is using.
     If it is not using any external service, please set the enabled="false" and DO NOT add any domain below. The "enabled" will be false by default.
     Example1:
diff --git a/AttachmentGallery/index.ts b/AttachmentGallery/index.ts
index 8337a26..0f59055 100644
--- a/AttachmentGallery/index.ts
+++ b/AttachmentGallery/index.ts
@@ -1,7 +1,9 @@
 import {IInputs, IOutputs} from "./generated/ManifestTypes";
 import { saveAs } from 'file-saver';
+import { Buffer } from 'buffer';
 
 interface Attachment {
+    isAttachmentPdf: boolean;
 	documentBody: string;
 	mimeType: string;
 	title: string;
@@ -111,7 +113,7 @@ export class AttachmentGallery implements ComponentFramework.StandardControl<IIn
 
 		let notFoundText = document.createElement('p');
 		notFoundText.classList.add('dwc-center');
-		notFoundText.innerText = 'Attachments not found. Press Refresh to try to load them again.';
+		notFoundText.innerText = 'No attachments found in timeline, nor any file field. Press Refresh to try to load them again.';
 
 		this._notFoundContainer.appendChild(notFoundText);
 
@@ -373,6 +375,13 @@ export class AttachmentGallery implements ComponentFramework.StandardControl<IIn
     private generateImageSrcUrl(fileType: string, fileContent: string): string {
         return "data:" + fileType + ";base64, " + fileContent;
     }
+    
+    private async blobtoB64(blob: Blob): Promise<string> {
+        const arrayBuffer = await blob.arrayBuffer();
+        const buffer = Buffer.from(arrayBuffer);
+        const base64 = buffer.toString('base64');
+        return base64;
+    }
 
     private toggleNoteColumn(): void {
         if (this.modalState.isPdfViewerOpen) return;
@@ -400,6 +409,13 @@ export class AttachmentGallery implements ComponentFramework.StandardControl<IIn
     private async GetAttachments(curentRecord: ComponentFramework.EntityReference): Promise<Attachment[]> {
         console.log("GetAttachments started");
 
+        await this.addImagesAndPdfsFromNotes(curentRecord);
+        await this.addImagesfromFileColumns(curentRecord);
+        
+        return this._notes;
+    }
+
+    private async addImagesAndPdfsFromNotes(curentRecord: ComponentFramework.EntityReference) {
         const searchQuery = "?$select=annotationid,documentbody,mimetype,notetext,subject,filename" +
             "&$filter=_objectid_value eq " +
             curentRecord.id +
@@ -418,7 +434,8 @@ export class AttachmentGallery implements ComponentFramework.StandardControl<IIn
                         noteText: result.entities[index].notetext,
                         title: result.entities[index].subject,
                         filename: result.entities[index].filename,
-                        documentBody: result.entities[index].documentbody
+                        documentBody: result.entities[index].documentbody,
+                        isAttachmentPdf: result.entities[index].mimetype.indexOf('pdf') != -1
                     };
                     this._notes.push(item);
                 }
@@ -427,8 +444,38 @@ export class AttachmentGallery implements ComponentFramework.StandardControl<IIn
             console.error("ERROR RETRIEVING ATTACHMENT");
             console.error(error);
         }
+    }
 
-        return this._notes;
+    private async addImagesfromFileColumns(curentRecord: ComponentFramework.EntityReference) {
+        const searchQuery = `?$select=fileattachmentid,regardingfieldname,regardingfieldname,filename,mimetype&$filter=(_objectid_value eq ${curentRecord.id})`;
+        try {
+
+            const result = await this._context.webAPI.retrieveMultipleRecords("fileattachment", searchQuery);
+
+            console.log("Retrieved column file attachments", result);
+            if (result && result.entities) {
+                 for (let index = 0; index < result.entities.length; index++) {
+                    // Retrieve the file contents
+                    const downloadFileUrl = `/api/data/v9.2/${curentRecord.name}s(${curentRecord.id})/${result.entities[index].regardingfieldname}/$value`;
+                    const fileContent = await fetch(downloadFileUrl).then(response => response.blob());
+
+                    console.log("Retrieved file contents", fileContent);
+                     let item: Attachment = {
+                         id: result.entities[index].id,
+                         mimeType: result.entities[index].mimetype,
+                         noteText: result.entities[index].regardingfieldname,
+                         title: result.entities[index].filename,
+                         filename: result.entities[index].filename,
+                         documentBody: await this.blobtoB64(fileContent),
+                         isAttachmentPdf: false
+                     };
+                     this._notes.push(item);
+                 }
+            }
+        } catch (error) {
+            console.error("ERROR RETRIEVING FILE COLUMN DATA");
+            console.error(error);
+        }
     }
 
     private setPdfImage(body:string){
@@ -470,16 +517,14 @@ export class AttachmentGallery implements ComponentFramework.StandardControl<IIn
     }
 
     private setModalImage(note: Attachment) {
-        let isAttachmentPdf = note.mimeType.indexOf('pdf') != -1;
-
-        if (this.modalState.isOpen && !this.modalState.isPdfViewerOpen && isAttachmentPdf) {
+        if (this.modalState.isOpen && !this.modalState.isPdfViewerOpen && note.isAttachmentPdf) {
             this.togglePdfViwer(true);
             this.setPdfViewer(note);
         } else {
-            if (this.modalState.isOpen && this.modalState.isPdfViewerOpen && isAttachmentPdf) {
+            if (this.modalState.isOpen && this.modalState.isPdfViewerOpen && note.isAttachmentPdf) {
                 this.setPdfViewer(note);
             } else {
-                if (this.modalState.isOpen && this.modalState.isPdfViewerOpen && !isAttachmentPdf) {
+                if (this.modalState.isOpen && this.modalState.isPdfViewerOpen && !note.isAttachmentPdf) {
                     this.togglePdfViwer(false);
                 }
                 this._modalImage.src = this._previewImg.src;
@@ -492,11 +537,9 @@ export class AttachmentGallery implements ComponentFramework.StandardControl<IIn
         if (currentNoteNumber < 0) { currentNoteNumber = this._notes.length - 1 }
         let currentNote = this._notes[currentNoteNumber];
 
-        let isAttachmentPdf = currentNote.mimeType.indexOf('pdf') != -1;
-
-        this._previewImg.src = !isAttachmentPdf
-            ? this.generateImageSrcUrl(currentNote.mimeType, currentNote.documentBody)
-            : this.pdfImageSrc;
+        this._previewImg.src = currentNote.isAttachmentPdf
+            ? this.pdfImageSrc
+            : this.generateImageSrcUrl(currentNote.mimeType, currentNote.documentBody);
 
         this._modalHeaderText.innerHTML = (currentNoteNumber + 1).toString() + " / " + this._notes.length.toString()
             + " " + currentNote.title;
diff --git a/Solution/AttachmentGallerySol/src/Other/Solution.xml b/Solution/AttachmentGallerySol/src/Other/Solution.xml
index 7957170..ce1ff57 100644
--- a/Solution/AttachmentGallerySol/src/Other/Solution.xml
+++ b/Solution/AttachmentGallerySol/src/Other/Solution.xml
@@ -8,7 +8,7 @@
       <LocalizedName description="AttachmentGallerySol" languagecode="1033" />
     </LocalizedNames>
     <Descriptions />
-    <Version>1.0.0.1</Version>
+    <Version>1.0.0.2</Version>
     <!-- Solution Package Type: Unmanaged(0)/Managed(1)/Both(2)-->
     <Managed>2</Managed>
     <Publisher>

From 18f8f0e4d4925ce7a2f15cc6dca578ad5278cfee Mon Sep 17 00:00:00 2001
From: Christian van der Geer <Christian@2at.nl>
Date: Mon, 29 Jul 2024 13:10:14 +0200
Subject: [PATCH 2/3] fix: file column mimetype issues and use metadata to
 retrieve plural name

- We notices Dynamics sometimes uses octet-stream mimetype for png/jpg/jpeg images and PDF files in file columns
- First version had hardcoded logicalname+s for plural name (for download API). Now we use the MetaData API to get it
---
 AttachmentGallery/index.ts | 14 +++++++++++---
 1 file changed, 11 insertions(+), 3 deletions(-)

diff --git a/AttachmentGallery/index.ts b/AttachmentGallery/index.ts
index 0f59055..f685daf 100644
--- a/AttachmentGallery/index.ts
+++ b/AttachmentGallery/index.ts
@@ -447,16 +447,24 @@ export class AttachmentGallery implements ComponentFramework.StandardControl<IIn
     }
 
     private async addImagesfromFileColumns(curentRecord: ComponentFramework.EntityReference) {
-        const searchQuery = `?$select=fileattachmentid,regardingfieldname,regardingfieldname,filename,mimetype&$filter=(_objectid_value eq ${curentRecord.id})`;
+        // Dynamics is not always accurate with the Mimetypes, so we need to check the file extension in combination with 'octet-stream' metadata as well
+        const pdfAndImageMimetypeFilter = "startswith(mimetype, 'application%2fpdf') or startswith(mimetype, 'image%2f')";
+        const octetStreamMimetypeFilter = "(endswith(mimetype, 'octet-stream') and (endswith(filename, '.pdf') or endswith(filename, '.png') or endswith(filename, '.jpg') or endswith(filename, '.jpeg')))";
+        const searchQuery = `?$select=fileattachmentid,regardingfieldname,regardingfieldname,filename,mimetype&$filter=(_objectid_value eq ${curentRecord.id} and ((${pdfAndImageMimetypeFilter} or ${octetStreamMimetypeFilter})))`;
         try {
 
+            // Retrieve the file attachments
             const result = await this._context.webAPI.retrieveMultipleRecords("fileattachment", searchQuery);
-
             console.log("Retrieved column file attachments", result);
+
+            // Retrieve the plural name for the entity (is needed for the download url)
+            const entityMetadata = await this._context.utils.getEntityMetadata(curentRecord.name, ["EntitySetName"]);
+            console.log("Retrieved entity Metadata", entityMetadata);
+
             if (result && result.entities) {
                  for (let index = 0; index < result.entities.length; index++) {
                     // Retrieve the file contents
-                    const downloadFileUrl = `/api/data/v9.2/${curentRecord.name}s(${curentRecord.id})/${result.entities[index].regardingfieldname}/$value`;
+                    const downloadFileUrl = `/api/data/v9.2/${entityMetadata.EntitySetName}(${curentRecord.id})/${result.entities[index].regardingfieldname}/$value`;
                     const fileContent = await fetch(downloadFileUrl).then(response => response.blob());
 
                     console.log("Retrieved file contents", fileContent);

From 6bbb8e63e8a53dd7cc430224edee2276325ab46e Mon Sep 17 00:00:00 2001
From: Christian van der Geer <Christian@2at.nl>
Date: Mon, 29 Jul 2024 13:41:06 +0200
Subject: [PATCH 3/3] Fix: Forgot logic for PDF files

---
 AttachmentGallery/index.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/AttachmentGallery/index.ts b/AttachmentGallery/index.ts
index f685daf..40036fb 100644
--- a/AttachmentGallery/index.ts
+++ b/AttachmentGallery/index.ts
@@ -475,7 +475,7 @@ export class AttachmentGallery implements ComponentFramework.StandardControl<IIn
                          title: result.entities[index].filename,
                          filename: result.entities[index].filename,
                          documentBody: await this.blobtoB64(fileContent),
-                         isAttachmentPdf: false
+                         isAttachmentPdf: result.entities[index].filename.indexOf('.pdf') != -1
                      };
                      this._notes.push(item);
                  }