WIP: global player refactor pt. 2

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
+        <div class="px-4 py-2 flex items-center justify-between gap-4 h-16">
-            class="px-4 py-2 flex items-center justify-between gap-4 h-16"
+            <!-- Mini Player Info -->
+            <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)}
             >
-            <!-- Mini Player Info -->
-            <div class="flex items-center gap-3 overflow-hidden flex-1">
                 <!-- 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
+            <div class="flex items-center gap-1">
-                class="flex items-center gap-1"
-                onclick={(e) => e.stopPropagation()}
-            >
                 <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 -->

src/lib/components/player/PlayerRoot.svelte

@@ -26,14 +26,12 @@
 
 		// Setup MediaSession
 		if ("mediaSession" in navigator) {
-			navigator.mediaSession.setActionHandler(
+			navigator.mediaSession.setActionHandler("play", () => {
-				"play",
+				audioCtx.paused = false;
-				() => (audioCtx.paused = false),
+			});
-			);
+			navigator.mediaSession.setActionHandler("pause", () => {
-			navigator.mediaSession.setActionHandler(
+				audioCtx.paused = true;
-				"pause",
+			});
-				() => (audioCtx.paused = true),
-			);
 			navigator.mediaSession.setActionHandler("previoustrack", () =>
 				player.prev(),
 			);
@@ -124,7 +122,7 @@
 	onpause={onPause}
 	onended={onEnded}
 	class="hidden"
-/>
+></audio>
 
 <div class="contents">
 	<div class="lg:hidden">

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.

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;
 	}

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;