From ea37d1a2eea1d9f4247c2b57ed6ca8457cba4dc8 Mon Sep 17 00:00:00 2001
From: John Molakvoæ <skjnldsv@protonmail.com>
Date: Thu, 22 Jun 2023 19:09:16 +0200
Subject: fix(files): sanitize name and ext display
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: John Molakvoæ <skjnldsv@protonmail.com>
Signed-off-by: nextcloud-command <nextcloud-command@users.noreply.github.com>
---
 apps/files/src/components/FileEntry.vue        | 14 +++++++++++---
 apps/files/src/components/FilesListVirtual.vue |  6 ++++++
 2 files changed, 17 insertions(+), 3 deletions(-)

(limited to 'apps')

diff --git a/apps/files/src/components/FileEntry.vue b/apps/files/src/components/FileEntry.vue
index fd61f5e3623..db32f2fab35 100644
--- a/apps/files/src/components/FileEntry.vue
+++ b/apps/files/src/components/FileEntry.vue
@@ -59,7 +59,11 @@
 				</span>
 
 				<!-- File name -->
-				<span class="files-list__row-name-text">{{ displayName }}</span>
+				<span class="files-list__row-name-text">
+					<!-- Keep the displayName stuck to the extension to avoid whitespace rendering issues-->
+					<span class="files-list__row-name-name" v-text="displayName" />
+					<span class="files-list__row-name-ext" v-text="source.extension" />
+				</span>
 			</a>
 		</td>
 
@@ -237,8 +241,12 @@ export default Vue.extend({
 			return this.source?.fileid?.toString?.()
 		},
 		displayName() {
-			return this.source.attributes.displayName
-				|| this.source.basename
+			const ext = (this.source.extension || '')
+			const name = (this.source.attributes.displayName
+				|| this.source.basename)
+
+			// Strip extension from name if defined
+			return !ext ? name : name.slice(0, 0 - ext.length)
 		},
 
 		size() {
diff --git a/apps/files/src/components/FilesListVirtual.vue b/apps/files/src/components/FilesListVirtual.vue
index 866fc6da00d..a982cbc09f9 100644
--- a/apps/files/src/components/FilesListVirtual.vue
+++ b/apps/files/src/components/FilesListVirtual.vue
@@ -299,6 +299,12 @@ export default Vue.extend({
 				// Make some space for the outline
 				padding: 5px 10px;
 				margin-left: -10px;
+				// Align two name and ext
+				display: inline-flex;
+			}
+
+			.files-list__row-name-ext {
+				color: var(--color-text-maxcontrast);
 			}
 		}
 
-- 
cgit v1.2.3