From f39edf801db0c3b2fe0768e4be2470ee057dec0c Mon Sep 17 00:00:00 2001
From: steven-mpawulo <stevenmpawulo@gmail.com>
Date: Thu, 25 Jun 2026 12:43:39 +0300
Subject: [PATCH 1/3] feat: makes the composer attachment clickable

---
 src/components/ComposerAttachment.vue  | 10 +++++++++-
 src/components/ComposerAttachments.vue | 11 ++++++++++-
 2 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/src/components/ComposerAttachment.vue b/src/components/ComposerAttachment.vue
index 727c36f013..80f86a49c4 100644
--- a/src/components/ComposerAttachment.vue
+++ b/src/components/ComposerAttachment.vue
@@ -3,7 +3,7 @@
   - SPDX-License-Identifier: AGPL-3.0-or-later
 -->
 <template>
-	<li class="composer-attachment" :class="{ 'composer-attachment--with-error': attachment.error }">
+	<li class="composer-attachment" :class="{ 'composer-attachment--with-error': attachment.error }" @click="onPreview">
 		<div class="attachment-preview">
 			<img :src="previewSrc" class="attachment-preview-image">
 			<span v-if="attachment.type === 'cloud'" class="cloud-attachment-icon">
@@ -87,8 +87,16 @@ export default {
 		onDelete(attachment) {
 			this.$emit('on-delete-attachment', attachment)
 		},
+
+		onPreview() {
+			this.$emit('preview', this.attachment)
+		}
 	},
 
+	mounted() {
+		console.log("attachment", this.attachment)
+	}
+
 }
 </script>
 
diff --git a/src/components/ComposerAttachments.vue b/src/components/ComposerAttachments.vue
index 38c65846b5..fd2912feaf 100644
--- a/src/components/ComposerAttachments.vue
+++ b/src/components/ComposerAttachments.vue
@@ -28,7 +28,9 @@
 				:key="attachment.id"
 				:attachment="attachment"
 				:uploading="uploading"
-				@on-delete-attachment="onDelete(attachment)" />
+				@on-delete-attachment="onDelete(attachment)"
+				@preview="onPreviewAttachment(attachment)"
+			/>
 		</ul>
 
 		<input
@@ -501,6 +503,13 @@ export default {
 		isImage(file) {
 			return file.type && mimes.indexOf(file.type) !== -1
 		},
+
+		onPreviewAttachment(attachment) {
+			if(!attachment.finished) {
+				return
+			}
+		}
+
 	},
 }
 </script>

From 5ba80789d1b24ce9f5d0e5ac86eb76d68cbff2fb Mon Sep 17 00:00:00 2001
From: steven-mpawulo <stevenmpawulo@gmail.com>
Date: Thu, 25 Jun 2026 16:22:39 +0300
Subject: [PATCH 2/3] feat: add preview support for local composer attachments

---
 src/components/ComposerAttachment.vue  |  9 +++----
 src/components/ComposerAttachments.vue | 33 ++++++++++++++++++++++----
 2 files changed, 32 insertions(+), 10 deletions(-)

diff --git a/src/components/ComposerAttachment.vue b/src/components/ComposerAttachment.vue
index 80f86a49c4..712df10060 100644
--- a/src/components/ComposerAttachment.vue
+++ b/src/components/ComposerAttachment.vue
@@ -5,7 +5,9 @@
 <template>
 	<li class="composer-attachment" :class="{ 'composer-attachment--with-error': attachment.error }" @click="onPreview">
 		<div class="attachment-preview">
-			<img :src="previewSrc" class="attachment-preview-image">
+			<img
+				:src="previewSrc"
+				class="attachment-preview-image">
 			<span v-if="attachment.type === 'cloud'" class="cloud-attachment-icon">
 				<Cloud :size="20" />
 			</span>
@@ -92,11 +94,6 @@ export default {
 			this.$emit('preview', this.attachment)
 		}
 	},
-
-	mounted() {
-		console.log("attachment", this.attachment)
-	}
-
 }
 </script>
 
diff --git a/src/components/ComposerAttachments.vue b/src/components/ComposerAttachments.vue
index fd2912feaf..00e42f253a 100644
--- a/src/components/ComposerAttachments.vue
+++ b/src/components/ComposerAttachments.vue
@@ -29,7 +29,7 @@
 				:attachment="attachment"
 				:uploading="uploading"
 				@on-delete-attachment="onDelete(attachment)"
-				@preview="onPreviewAttachment(attachment)"
+				@preview="onPreviewAttachment"
 			/>
 		</ul>
 
@@ -245,7 +245,6 @@ export default {
 			this.uploading = true
 			// BUG - if choose again - progress lost/ move to complete()
 			Vue.set(this, 'uploads', {})
-
 			const toUpload = sumBy(prop('size'), Object.values(e.target.files))
 			const newTotal = toUpload + this.totalSizeOfUpload()
 			logger.debug('checking upload size limit', {
@@ -277,6 +276,7 @@ export default {
 					fileName: file.name,
 					fileType: file.type,
 					imageBlobURL: this.generatePreview(file),
+					previewBlobUrl: this.generatePreviewBlobUrl(file),
 					displayName: trimStart('/', file.name),
 					progress: null,
 					percent: 0,
@@ -427,6 +427,10 @@ export default {
 				attachment.controller.abort()
 			}
 
+			if (attachment.previewBlobUrl) {
+				URL.revokeObjectURL(attachment.previewBlobUrl)
+			}
+
 			const val = {
 				fileName: attachment.fileName,
 				displayName: attachment.displayName,
@@ -500,15 +504,36 @@ export default {
 			}
 		},
 
+		generatePreviewBlobUrl(file) {
+			return this.isPreviewable(file)
+				? URL.createObjectURL(file)
+				: null
+		},
+
+		isPreviewable(file) {
+			return file.type.startsWith('image/')
+				|| file.type.startsWith('video/')
+				|| file.type.startsWith('audio/')
+				|| file.type.startsWith('text/')
+				|| file.type === 'application/pdf'
+				|| file.type === 'application/json'
+
+		},
+
 		isImage(file) {
 			return file.type && mimes.indexOf(file.type) !== -1
 		},
 
 		onPreviewAttachment(attachment) {
-			if(!attachment.finished) {
+			if (!attachment.finished) {
 				return
 			}
-		}
+
+			const url = attachment.previewBlobUrl
+			if (url) {
+				window.open(url, '_blank')
+			}
+		},
 
 	},
 }

From 42818330c7eaace622ca02ae9f57dc796b7294af Mon Sep 17 00:00:00 2001
From: steven-mpawulo <stevenmpawulo@gmail.com>
Date: Fri, 26 Jun 2026 15:23:59 +0300
Subject: [PATCH 3/3] refactor: changes to OCA Viewer for previewing local
 attachments

Signed-off-by: steven-mpawulo <stevenmpawulo@gmail.com>
---
 src/components/ComposerAttachments.vue | 46 +++++++++++++++++++++++---
 1 file changed, 41 insertions(+), 5 deletions(-)

diff --git a/src/components/ComposerAttachments.vue b/src/components/ComposerAttachments.vue
index 00e42f253a..9eb5847c59 100644
--- a/src/components/ComposerAttachments.vue
+++ b/src/components/ComposerAttachments.vue
@@ -159,6 +159,29 @@ export default {
 			}
 			return total
 		},
+
+		previewableFilesInfos() {
+			return this.attachments
+				.filter((attachment) => {
+					const mime = attachment.mime || attachment.fileType
+					return mime &&
+						(
+							mime.startsWith('image/') ||
+							mime.startsWith('video/') ||
+							mime.startsWith('audio/') ||
+							mime === 'application/pdf'
+						)
+				})
+				.map((attachment) => ({
+					filename: attachment.previewBlobUrl,
+					source: attachment.previewBlobUrl,
+					basename: attachment.fileName,
+					mime: attachment.mime || attachment.fileType,
+					etag: 'fixme',
+					hasPreview: false,
+					fileid: parseInt(attachment.id, 10),
+				}))
+		},
 	},
 
 	watch: {
@@ -358,6 +381,7 @@ export default {
 						size: filesFromCloud[i].size,
 
 					}
+
 					const _toAttachmentData = {
 						finished: true,
 						imageBlobURL: this.generatePreview(_cloudFile),
@@ -514,9 +538,7 @@ export default {
 			return file.type.startsWith('image/')
 				|| file.type.startsWith('video/')
 				|| file.type.startsWith('audio/')
-				|| file.type.startsWith('text/')
 				|| file.type === 'application/pdf'
-				|| file.type === 'application/json'
 
 		},
 
@@ -529,10 +551,24 @@ export default {
 				return
 			}
 
-			const url = attachment.previewBlobUrl
-			if (url) {
-				window.open(url, '_blank')
+			if (!attachment.previewBlobUrl) {
+				return
+			}
+
+			let fileInfo = {
+				filename: attachment?.previewBlobUrl,
+				source: attachment?.previewBlobUrl,
+				basename: attachment?.fileName,
+				mime: attachment?.mime || attachment?.fileType,
+				etag: 'fixme',
+				hasPreview: false,
+				fileid: parseInt(attachment.id, 10),
 			}
+
+				OCA.Viewer.open({
+					fileInfo,
+					list: this.previewableFilesInfos
+				})
 		},
 
 	},