Fix for Flyio deploy

Author: phonnz

fullstack/assets/js/app.js

@@ -28,8 +28,8 @@ import Map from "./map";
 
 let csrfToken = document.querySelector("meta[name='csrf-token']").getAttribute("content")
 let hooks = {
-  Map 
-  //LiveToast: createLiveToastHook(),
+  Map,
+  LiveToast: createLiveToastHook(),
 } //{ VegaLite }
 let liveSocket = new LiveSocket("/live", Socket, { params: { _csrf_token: csrfToken }, hooks })
 

fullstack/assets/js/map.js

@@ -1,4 +1,5 @@
-import maplibregl from "maplibre-gl";
+// Using global on template for Flyio deploy 
+// import maplibregl from "maplibre-gl";
 const Map = {
     mounted() {
         this.props = { id: this.el.getAttribute("data-id") };

fullstack/config/config.exs

@@ -41,7 +41,7 @@ config :esbuild,
   version: "0.17.11",
   default: [
     args:
-      ~w(js/app.js --bundle --target=es2017 --outdir=../priv/static/assets --external:/fonts/* --external:/images/* --external:vega-embed --external:maplibre-g),
+      ~w(js/app.js --bundle --target=es2017 --outdir=../priv/static/assets --external:/fonts/* --external:/images/* --external:vega-embed --external:maplibre-gl),
     cd: Path.expand("../assets", __DIR__),
     env: %{"NODE_PATH" => Path.expand("../deps", __DIR__)}
   ]

fullstack/lib/fullstack_web/components/map_component.ex

@@ -2,7 +2,7 @@ defmodule FullstackWeb.Live.MapComponent do
   use FullstackWeb, :live_component
   alias MapLibre
 
-  @fill_colour "#ffa8db"
+  @fill_colour "#03fc98"
 
   def render(assigns) do
     ~H"""

fullstack/lib/fullstack_web/live/public/devices.ex

@@ -15,6 +15,8 @@ defmodule FullstackWeb.Public.DevicesLive.Index do
 
   def render(assigns) do
     ~H"""
+      <link href='https://unpkg.com/maplibre-gl@3.6.2/dist/maplibre-gl.css' rel='stylesheet' />
+      <script src='https://unpkg.com/maplibre-gl@3.6.2/dist/maplibre-gl.js'></script>
     <h1>Devices</h1>
     <div :if={@devices.loading}>Loading devices...</div>
     <div :if={devices = @devices.ok? && @devices.result}>