From 324a0ac0373d14fe40c2a80949ce0d15276d5478 Mon Sep 17 00:00:00 2001
From: Tobi <22715034+twobiers@users.noreply.github.com>
Date: Thu, 24 Oct 2024 12:22:48 +0200
Subject: [PATCH] Fix: Allow multiple item selection on macOS with Cmd-click 
 (#378)

* UI: Make multiple tag selection work on macOS

* UI: Allow click+meta key combination to select messages in list
---
 server/ui-src/components/ListMessages.vue | 3 ++-
 server/ui-src/components/NavTags.vue      | 4 ++--
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/server/ui-src/components/ListMessages.vue b/server/ui-src/components/ListMessages.vue
index 915d30f..330c04e 100644
--- a/server/ui-src/components/ListMessages.vue
+++ b/server/ui-src/components/ListMessages.vue
@@ -125,7 +125,8 @@ export default {
 				:id="message.ID"
 				class="row gx-1 message d-flex small list-group-item list-group-item-action border-start-0 border-end-0"
 				:class="message.Read ? 'read' : '', isSelected(message.ID) ? 'selected' : ''"
-				v-on:click.ctrl="toggleSelected($event, message.ID)" v-on:click.shift="selectRange($event, message.ID)">
+				@click.meta="toggleSelected($event, message.ID)" @click.ctrl="toggleSelected($event, message.ID)"
+				@click.shift="selectRange($event, message.ID)">
 				<div class="col-lg-3">
 					<div class="d-lg-none float-end text-muted text-nowrap small">
 						<i class="bi bi-paperclip h6 me-1" v-if="message.Attachments"></i>
diff --git a/server/ui-src/components/NavTags.vue b/server/ui-src/components/NavTags.vue
index 95a8fd8..89c651c 100644
--- a/server/ui-src/components/NavTags.vue
+++ b/server/ui-src/components/NavTags.vue
@@ -99,8 +99,8 @@ export default {
 			</ul>
 		</div>
 		<div class="list-group mt-1 mb-2">
-			<RouterLink v-for="tag in mailbox.tags" :to="toTagUrl(tag)" @click="hideNav"
-				v-on:click="pagination.start = 0" v-on:click.ctrl="toggleTag($event, tag)"
+			<RouterLink v-for="tag in mailbox.tags" :to="toTagUrl(tag)" @click.exact="hideNav"
+				v-on:click="pagination.start = 0" @click.meta="toggleTag($event, tag)" @click.ctrl="toggleTag($event, tag)"
 				:style="mailbox.showTagColors ? { borderLeftColor: colorHash(tag), borderLeftWidth: '4px' } : ''"
 				class="list-group-item list-group-item-action small px-2" :class="inSearch(tag) ? 'active' : ''">
 				<i class="bi bi-tag-fill" v-if="inSearch(tag)"></i>