From d6d710261f52a5190cc93d34559927882e3c457c Mon Sep 17 00:00:00 2001
From: Edoardo Scibona <12040076+velut@users.noreply.github.com>
Date: Fri, 12 Jul 2024 21:15:58 +0200
Subject: [PATCH] feat: add quick search opener keyboard shortcut for Mac
 platform

---
 src/components/QuickSearchOpener.astro | 3 ++-
 src/scripts/alpine.ts                  | 4 ++++
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/src/components/QuickSearchOpener.astro b/src/components/QuickSearchOpener.astro
index c1c3190..97bce56 100644
--- a/src/components/QuickSearchOpener.astro
+++ b/src/components/QuickSearchOpener.astro
@@ -7,13 +7,14 @@ import LucideFileSearch from "~icons/lucide/file-search";
 	class="btn btn-outline w-full justify-between border-base-content/50"
 	@click="open()"
 	@keydown.ctrl.k.window.prevent="open()"
+	@keydown.cmd.k.window.prevent="open()"
 >
 	<div class="flex items-center gap-2">
 		<LucideFileSearch class="size-6" />
 		Quick search &hellip;
 	</div>
 	<kbd>
-		<kbd class="hidden font-normal text-base-content lg:kbd lg:kbd-sm">Ctrl</kbd>
+		<kbd class="hidden font-normal text-base-content lg:kbd lg:kbd-sm" x-text="cmdSymbol()">⌘</kbd>
 		<kbd class="hidden font-normal text-base-content lg:kbd lg:kbd-sm">K</kbd>
 	</kbd>
 </button>
diff --git a/src/scripts/alpine.ts b/src/scripts/alpine.ts
index 1ec80a5..d1850e6 100644
--- a/src/scripts/alpine.ts
+++ b/src/scripts/alpine.ts
@@ -21,6 +21,7 @@ type QuickSearchOpener = {
 	dialog: HTMLDialogElement | undefined;
 	init(): void;
 	open(): void;
+	cmdSymbol(): string;
 };
 
 const quickSearchOpener = (Alpine: Alpine) => {
@@ -37,6 +38,9 @@ const quickSearchOpener = (Alpine: Alpine) => {
 						this.dialog.showModal();
 					}
 				},
+				cmdSymbol(): string {
+					return navigator.userAgent.includes("Mac") ? "⌘" : "Ctrl";
+				},
 			}) as QuickSearchOpener,
 	);
 };