Show confetti when purchasing a record

lib/music_library_web/components/record_components.ex

@@ -166,7 +166,10 @@ defmodule MusicLibraryWeb.RecordComponents do
                 role="menuitem"
                 tabindex="0"
                 id={"actions-#{record.id}-purchase"}
-                phx-click={JS.push("add-to-collection", value: %{id: record.id})}
+                phx-click={
+                  JS.dispatch("music_library:confetti")
+                  |> JS.push("add-to-collection", value: %{id: record.id})
+                }
               >
                 {gettext("Purchased")}
               </.link>

lib/music_library_web/live/wishlist_live/show.html.heex

@@ -125,7 +125,10 @@
           role="menuitem"
           tabindex="0"
           id={"actions-#{@record.id}-purchase"}
-          phx-click={JS.push("add-to-collection", value: %{id: @record.id})}
+          phx-click={
+            JS.dispatch("music_library:confetti")
+            |> JS.push("add-to-collection", value: %{id: @record.id})
+          }
         >
           <.icon
             name="hero-banknotes"