Refactor audio player event

Remove customEventDispatcher in preparation for Svelte 5
Mystler · Sep 14, 2024 · 274ab7b · 274ab7b
1 parent fc05650
commit 274ab7b
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 5 deletions.
diff --git a/src/lib/components/AudioPlayer.svelte b/src/lib/components/AudioPlayer.svelte
@@ -1,6 +1,5 @@
 <script lang="ts">
   import { GlobalAudioVolume } from "$lib/audioplayer";
-  import { createEventDispatcher } from "svelte";
 
   let url: string | null = null;
   let name: string;
@@ -52,8 +51,8 @@
   }
 
   // Provide hook for base layout
-  const dispatch = createEventDispatcher();
-  $: dispatch("urlChanged", { url });
+  export let onUrlChanged: (url: string | null) => void;
+  $: onUrlChanged(url);
 </script>
 
 {#if url}

diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
@@ -64,8 +64,8 @@
   <div class="sticky bottom-0">
     <AudioPlayer
       bind:this={$GlobalAudioPlayer}
-      on:urlChanged={(e) => {
-        GlobalAudioCurrentSong.set(e.detail.url);
+      onUrlChanged={(url) => {
+        GlobalAudioCurrentSong.set(url);
       }}
     />
   </div>