Use live_toast instead of built-in flash

Precursor for building better notifications

assets/css/app.css

@@ -3,6 +3,7 @@
 @source "../js";
 @source "../../lib/music_library_web";
 @source "../../deps/fluxon/**/*.*ex";
+@source "../../deps/live_toast/lib/**/*.*ex";
 
 /* A Tailwind plugin that makes "hero-#{ICON}" classes available.
    The heroicons installation itself is managed by your mix.exs */

assets/js/app.js

@@ -24,9 +24,11 @@ import topbar from "../vendor/topbar";
 import { Hooks as FluxonHooks, DOM as FluxonDOM } from "fluxon";
 import BarcodeScannerHook from "./barcode-scanner";
 import confetti from "canvas-confetti";
+import { createLiveToastHook } from "live_toast";
 
 let Hooks = FluxonHooks;
 Hooks.BarcodeScanner = BarcodeScannerHook;
+Hooks.LiveToast = createLiveToastHook();
 
 let csrfToken = document
   .querySelector("meta[name='csrf-token']")

assets/package.json

@@ -1,6 +1,7 @@
 {
   "dependencies": {
     "barcode-detector": "^3.0.0",
-    "canvas-confetti": "^1.9.3"
+    "canvas-confetti": "^1.9.3",
+    "live_toast": "file:../deps/live_toast"
   }
 }