From f9fe6a2d1163e8130cc61133ced930ca5155feeb Mon Sep 17 00:00:00 2001
From: Yuri Tatishchev <itatishch@gmail.com>
Date: Mon, 9 Feb 2026 23:39:36 -0800
Subject: [PATCH] WIP: global player refactor pt. 2

---
 src/lib/components/player/PlayerMobile.svelte | 20 ++++-----
 src/lib/components/player/PlayerRoot.svelte   | 42 +++++++++----------
 src/lib/components/player/Queue.svelte        |  3 +-
 src/lib/components/player/ctx.svelte.ts       |  2 -
 src/lib/db/import-amq.ts                      |  2 +-
 5 files changed, 32 insertions(+), 37 deletions(-)

diff --git a/src/lib/components/player/PlayerMobile.svelte b/src/lib/components/player/PlayerMobile.svelte
index 05fa63b..af3780e 100644
--- a/src/lib/components/player/PlayerMobile.svelte
+++ b/src/lib/components/player/PlayerMobile.svelte
@@ -21,12 +21,13 @@
     <div
         class="fixed bottom-0 left-0 right-0 z-50 border-t bg-background/95 backdrop-blur shadow-2xl safe-area-pb"
     >
-        <div
-            class="px-4 py-2 flex items-center justify-between gap-4 h-16"
-            onclick={() => (open = true)}
-        >
+        <div class="px-4 py-2 flex items-center justify-between gap-4 h-16">
             <!-- Mini Player Info -->
-            <div class="flex items-center gap-3 overflow-hidden flex-1">
+            <button
+                type="button"
+                class="flex items-center gap-3 overflow-hidden flex-1 text-left bg-transparent border-none p-0 cursor-pointer"
+                onclick={() => (open = true)}
+            >
                 <!-- Placeholder Art -->
                 <div
                     class="h-10 w-10 rounded bg-muted flex items-center justify-center shrink-0"
@@ -34,7 +35,7 @@
                     <Disc class="h-6 w-6 text-muted-foreground" />
                 </div>
 
-                <div class="flex flex-col overflow-hidden text-left">
+                <div class="flex flex-col overflow-hidden">
                     <div class="text-sm font-medium truncate leading-tight">
                         {player.currentTrack.title || "Unknown Title"}
                     </div>
@@ -44,13 +45,10 @@
                         {player.currentTrack.artist || "Unknown Artist"}
                     </div>
                 </div>
-            </div>
+            </button>
 
             <!-- Mini Controls -->
-            <div
-                class="flex items-center gap-1"
-                onclick={(e) => e.stopPropagation()}
-            >
+            <div class="flex items-center gap-1">
                 <Controls />
                 <!-- Actually Controls has too many buttons for mini player. Just Play/Next? -->
                 <!-- We'll reimplement mini controls or pass props to Controls to show fewer buttons -->
diff --git a/src/lib/components/player/PlayerRoot.svelte b/src/lib/components/player/PlayerRoot.svelte
index eccaf3c..d1c43d1 100644
--- a/src/lib/components/player/PlayerRoot.svelte
+++ b/src/lib/components/player/PlayerRoot.svelte
@@ -26,14 +26,12 @@
 
 		// Setup MediaSession
 		if ("mediaSession" in navigator) {
-			navigator.mediaSession.setActionHandler(
-				"play",
-				() => (audioCtx.paused = false),
-			);
-			navigator.mediaSession.setActionHandler(
-				"pause",
-				() => (audioCtx.paused = true),
-			);
+			navigator.mediaSession.setActionHandler("play", () => {
+				audioCtx.paused = false;
+			});
+			navigator.mediaSession.setActionHandler("pause", () => {
+				audioCtx.paused = true;
+			});
 			navigator.mediaSession.setActionHandler("previoustrack", () =>
 				player.prev(),
 			);
@@ -117,20 +115,20 @@
 </script>
 
 <audio
-    bind:this={audioEl}
-    ontimeupdate={onTimeUpdate}
-    ondurationchange={onDurationChange}
-    onplay={onPlay}
-    onpause={onPause}
-    onended={onEnded}
-    class="hidden"
-/>
+	bind:this={audioEl}
+	ontimeupdate={onTimeUpdate}
+	ondurationchange={onDurationChange}
+	onplay={onPlay}
+	onpause={onPause}
+	onended={onEnded}
+	class="hidden"
+></audio>
 
 <div class="contents">
-    <div class="lg:hidden">
-        <PlayerMobile />
-    </div>
-    <div class="hidden lg:block h-full">
-        <PlayerDesktop />
-    </div>
+	<div class="lg:hidden">
+		<PlayerMobile />
+	</div>
+	<div class="hidden lg:block h-full">
+		<PlayerDesktop />
+	</div>
 </div>
diff --git a/src/lib/components/player/Queue.svelte b/src/lib/components/player/Queue.svelte
index 330a66e..cdb0bc6 100644
--- a/src/lib/components/player/Queue.svelte
+++ b/src/lib/components/player/Queue.svelte
@@ -2,12 +2,13 @@
 	import { Play, X } from "@lucide/svelte";
 	import { Button } from "$lib/components/ui/button";
 	import { player } from "$lib/player/store.svelte";
+	import type { Track } from "$lib/player/types";
 
 	function onRemove(id: number) {
 		player.remove(id);
 	}
 
-	function onJump(track: any) {
+	function onJump(track: Track) {
 		player.playNext(track);
 		// Wait, jump usually means play immediately?
 		// "Jump to track" -> set as current.
diff --git a/src/lib/components/player/ctx.svelte.ts b/src/lib/components/player/ctx.svelte.ts
index f0bf43c..4a61833 100644
--- a/src/lib/components/player/ctx.svelte.ts
+++ b/src/lib/components/player/ctx.svelte.ts
@@ -9,8 +9,6 @@ export class AudioContext {
 
 	private audioEl: HTMLAudioElement | null = null;
 
-	constructor() {}
-
 	setElement(el: HTMLAudioElement) {
 		this.audioEl = el;
 	}
diff --git a/src/lib/db/import-amq.ts b/src/lib/db/import-amq.ts
index c35352e..1a555db 100644
--- a/src/lib/db/import-amq.ts
+++ b/src/lib/db/import-amq.ts
@@ -90,7 +90,7 @@ function zodErrorSummary(prefix: string, err: z.ZodError): string {
 	return `${prefix}\n${lines.join("\n")}${more}`;
 }
 
-function categoryNumberToText(
+function _categoryNumberToText(
 	v: number | string | null | undefined,
 ): string | null {
 	if (v === null || v === undefined) return null;