Use explicit Phoenix 1.8 style layouts

lib/music_library_web.ex

@@ -62,8 +62,7 @@ defmodule MusicLibraryWeb do
 
   def live_view do
     quote do
-      use Phoenix.LiveView,
+      use Phoenix.LiveView
-        layout: {MusicLibraryWeb.Layouts, :app}
 
       unquote(html_helpers())
     end
@@ -102,6 +101,7 @@ defmodule MusicLibraryWeb do
       # HTML escaping functionality
       import Phoenix.HTML
 
+      alias MusicLibraryWeb.Layouts
       # Shortcut for generating JS commands
       alias Phoenix.LiveView.JS
 

lib/music_library_web/components/layouts/app.html.heex

@@ -126,7 +126,7 @@
       toasts_sync={assigns[:toasts_sync]}
       toast_class_fn={&toast_class_fn/1}
     />
-    {@inner_content}
+    {render_slot(@inner_block)}
   </div>
 </main>
 

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

@@ -1,3 +1,4 @@
+<Layouts.app flash={@flash} current_section={@current_section} socket={@socket}>
   <div class="mt-4 px-4 sm:px-6 lg:px-8">
     <header class="mt-1 gap-1">
       <div class="flex items-center justify-between">
@@ -268,3 +269,4 @@
       patch={~p"/artists/#{@artist.musicbrainz_id}"}
     />
   </.structured_modal>
+</Layouts.app>

lib/music_library_web/live/collection_live/index.html.heex

@@ -1,3 +1,4 @@
+<Layouts.app flash={@flash} current_section={@current_section} socket={@socket}>
   <div>
     <header class="gap-6 mb-2">
       <div class="flex items-center justify-between gap-6 mb-2 mt-2">
@@ -107,3 +108,4 @@
   </.structured_modal>
 
   <.pagination id={:bottom_pagination} pagination_params={@record_list_params} />
+</Layouts.app>

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

@@ -1,3 +1,4 @@
+<Layouts.app flash={@flash} current_section={@current_section} socket={@socket}>
   <div class="md:flex mt-4 px-4 md:gap-x-4">
     <div class="drop-shadow-sm md:max-w-[38rem]">
       <.record_cover
@@ -287,7 +288,9 @@
             </dt>
             <dd class="mt-1 text-xs md:text-sm leading-6 text-zinc-700 dark:text-zinc-300 sm:col-span-2 sm:mt-0">
               <ul>
-              <li :for={included_release_group <- Records.Record.included_release_groups(@record)}>
+                <li :for={
+                  included_release_group <- Records.Record.included_release_groups(@record)
+                }>
                   {included_release_group.artists} - {included_release_group.title}
                 </li>
               </ul>
@@ -354,3 +357,4 @@
       patch={~p"/collection/#{@record}"}
     />
   </.structured_modal>
+</Layouts.app>

lib/music_library_web/live/online_store_template_live/index.html.heex

@@ -1,3 +1,4 @@
+<Layouts.app flash={@flash} current_section={@current_section} socket={@socket}>
   <header class="mb-6">
     <div class="flex items-center justify-between">
       <div>
@@ -104,3 +105,4 @@
       patch={~p"/online-store-templates"}
     />
   </.structured_modal>
+</Layouts.app>

lib/music_library_web/live/scrobble_rules_live/index.html.heex

@@ -1,3 +1,4 @@
+<Layouts.app flash={@flash} current_section={@current_section} socket={@socket}>
   <header class="mb-6">
     <div class="flex items-center justify-between">
       <div>
@@ -113,3 +114,4 @@
       patch={~p"/scrobble-rules"}
     />
   </.structured_modal>
+</Layouts.app>

lib/music_library_web/live/scrobbled_tracks_live/index.html.heex

@@ -1,3 +1,4 @@
+<Layouts.app flash={@flash} current_section={@current_section} socket={@socket}>
   <div>
     <header class="gap-6">
       <div class="mb-2 mt-2">
@@ -158,3 +159,4 @@
       patch={back_path(@track_list_params)}
     />
   </.structured_modal>
+</Layouts.app>

lib/music_library_web/live/stats_live/index.html.heex

@@ -1,3 +1,4 @@
+<Layouts.app flash={@flash} current_section={@current_section} socket={@socket}>
   <div>
     <h1 class="mt-5 text-base lg:text-2xl text-zinc-900 dark:text-zinc-200 font-semibold">
       {gettext("Records")}
@@ -415,7 +416,8 @@
                   </.link>
                   <.link
                     :if={
-                    record_id = tracked_record?(@wishlisted_releases, track.album.musicbrainz_id)
+                      record_id =
+                        tracked_record?(@wishlisted_releases, track.album.musicbrainz_id)
                     }
                     navigate={~p"/wishlist/#{record_id}"}
                   >
@@ -535,10 +537,13 @@
           label_fn={fn {genre, _count} -> genre end}
           value_fn={fn {_genre, count} -> count end}
           label_click={
-          fn {genre, _count} -> JS.navigate(~p"/collection?#{%{query: ~s(genre:"#{genre}")}}") end
+            fn {genre, _count} ->
+              JS.navigate(~p"/collection?#{%{query: ~s(genre:"#{genre}")}}")
+            end
           }
           class="w-full"
         />
       </div>
     </div>
   </div>
+</Layouts.app>

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

@@ -1,3 +1,4 @@
+<Layouts.app flash={@flash} current_section={@current_section} socket={@socket}>
   <div>
     <header class="gap-6 mb-2">
       <div class="flex items-center justify-between gap-6 mb-2 mt-2">
@@ -81,3 +82,4 @@
   </.structured_modal>
 
   <.pagination id={:bottom_pagination} pagination_params={@record_list_params} />
+</Layouts.app>

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

@@ -1,3 +1,4 @@
+<Layouts.app flash={@flash} current_section={@current_section} socket={@socket}>
   <div class="md:flex mt-4 px-4 md:gap-x-4">
     <div class="drop-shadow-sm md:max-w-[38rem]">
       <.record_cover
@@ -243,7 +244,9 @@
             </dt>
             <dd class="mt-1 text-xs md:text-sm leading-6 text-zinc-700 dark:text-zinc-300 sm:col-span-2 sm:mt-0">
               <ul>
-              <li :for={included_release_group <- Records.Record.included_release_groups(@record)}>
+                <li :for={
+                  included_release_group <- Records.Record.included_release_groups(@record)
+                }>
                   {included_release_group.artists} - {included_release_group.title}
                 </li>
               </ul>
@@ -315,3 +318,4 @@
       patch={~p"/wishlist/#{@record}"}
     />
   </.structured_modal>
+</Layouts.app>