From 7e1e84adb9cd3971d629469aa877da187853ea44 Mon Sep 17 00:00:00 2001
From: Luka Trovic <luka@nextcloud.com>
Date: Fri, 10 Mar 2023 11:15:27 +0100
Subject: [PATCH] fix: open non-image attachment

Signed-off-by: Luka Trovic <luka@nextcloud.com>
---
 src/components/Editor/MediaHandler.vue |  2 +-
 src/nodes/ImageView.vue                | 36 +++++++++++++++-----------
 2 files changed, 22 insertions(+), 16 deletions(-)

diff --git a/src/components/Editor/MediaHandler.vue b/src/components/Editor/MediaHandler.vue
index 10eca9febac..45797a2904a 100644
--- a/src/components/Editor/MediaHandler.vue
+++ b/src/components/Editor/MediaHandler.vue
@@ -186,7 +186,7 @@ export default {
 			const src = dirname + '/'
 				+ encodeURIComponent(name).replace(/[!'()*]/g, (c) => {
 					return '%' + c.charCodeAt(0).toString(16).toUpperCase()
-				})
+				}) + '?fileId=' + fileId
 			// simply get rid of brackets to make sure link text is valid
 			// as it does not need to be unique and matching the real file name
 			const alt = name.replaceAll(/[[\]]/g, '')
diff --git a/src/nodes/ImageView.vue b/src/nodes/ImageView.vue
index 01f43d4cda4..a6bb72b3c1f 100644
--- a/src/nodes/ImageView.vue
+++ b/src/nodes/ImageView.vue
@@ -34,17 +34,19 @@
 				<transition name="fade">
 					<template v-if="!failed">
 						<div v-if="isMediaAttachment"
-							class="media"
-							@click="handleImageClick(src)">
+							class="media">
 							<div class="media__wrapper">
-								<img v-show="loaded"
-									:src="imageUrl"
-									class="image__main"
-									@load="onLoaded">
-								<div class="metadata">
-									<span class="name">{{ alt }}</span>
-									<span class="size">{{ attachmentMetadata.size }}</span>
-								</div>
+								<a :href="internalLinkOrImage"
+									target="_blank">
+									<img v-show="loaded"
+										:src="imageUrl"
+										class="image__main"
+										@load="onLoaded">
+									<div class="metadata">
+										<span class="name">{{ alt }}</span>
+										<span class="size">{{ attachmentMetadata.size }}</span>
+									</div>
+								</a>
 							</div>
 							<div v-if="showDeleteIcon"
 								class="buttons">
@@ -225,16 +227,13 @@ export default {
 
 			return this.loaded && this.imageLoaded
 		},
-		imageFileId() {
-			return getQueryVariable(this.src, 'fileId')
-		},
 		isSupportedImage() {
 			return typeof this.mime === 'undefined'
 				|| IMAGE_MIMES.indexOf(this.mime) !== -1
 		},
 		internalLinkOrImage() {
-			if (this.imageFileId) {
-				return generateUrl('/f/' + this.imageFileId)
+			if (this.fileId) {
+				return generateUrl('/f/' + this.fileId)
 			}
 			return this.src
 		},
@@ -258,6 +257,9 @@ export default {
 				})
 			},
 		},
+		fileId() {
+			return getQueryVariable(this.src, 'fileId')
+		},
 		t() {
 			return (a, s) => window.t(a, s)
 		},
@@ -464,6 +466,10 @@ export default {
 		border-radius: var(--border-radius-large);
 		padding: 8px;
 
+		a {
+			display: contents;
+		}
+
 		img {
 			width: 44px;
 			height: 44px;