Now the users are able to create performances in karaokes when they have the status in 'ready'

Author: JoseBambora

lib/karaokium_web/live/admin/karaoke_live/show.html.heex

@@ -175,7 +175,7 @@
   </section>
   <div>
     <span>
-      <%= live_patch("New Performance", to: Routes.admin_performance_new_path(@socket, :new, @karaoke.id)) %>
+      <%= live_patch("New Performance", to: Routes.admin_performance_new_path(@socket, :new, @karaoke.id, "admin")) %>
     </span>
   </div>
 <% end %>

lib/karaokium_web/live/admin/performance_live/new.ex

@@ -10,11 +10,12 @@ defmodule KaraokiumWeb.Admin.PerformanceLive.New do
   end
 
   @impl true
-  def handle_params(%{"karaoke_id" => karaoke_id}, _, socket) do
+  def handle_params(%{"karaoke_id" => karaoke_id, "return_to" => return_to}, _, socket) do
     {:noreply,
      socket
      |> assign(:performance, %Performance{})
      |> assign(:page_title, "New Performance")
-     |> assign(:karaoke_id, karaoke_id)}
+     |> assign(:karaoke_id, karaoke_id)
+     |> assign(:return_to, return_to)}
   end
 end

lib/karaokium_web/live/admin/performance_live/new.html.heex

@@ -1,9 +1,21 @@
-<.live_component
-  module={KaraokiumWeb.Admin.PerformanceLive.FormComponent}
-  id={:new}
-  karaoke_id={@karaoke_id}
-  performance={@performance}
-  title="New performance"
-  action={:new}
-  return_to={Routes.admin_karaoke_show_path(@socket, :show, @karaoke_id)}
-/>
+<%= if @return_to == "live" do %>
+  <.live_component
+    module={KaraokiumWeb.Admin.PerformanceLive.FormComponent}
+    id={:new}
+    karaoke_id={@karaoke_id}
+    performance={@performance}
+    title="New performance"
+    action={:new}
+    return_to={Routes.karaoke_show_path(@socket, :show, @karaoke_id)}
+  />
+<% else %>
+  <.live_component
+    module={KaraokiumWeb.Admin.PerformanceLive.FormComponent}
+    id={:new}
+    karaoke_id={@karaoke_id}
+    performance={@performance}
+    title="New performance"
+    action={:new}
+    return_to={Routes.admin_karaoke_show_path(@socket, :show, @karaoke_id)}
+  />
+<% end %>

lib/karaokium_web/live/karaoke_live/show.ex

@@ -90,15 +90,6 @@ defmodule KaraokiumWeb.KaraokeLive.Show do
     """
   end
 
-  def status(%{karaoke: karaoke} = assigns) when karaoke.status == :ready do
-    ~H"""
-    <.status
-      img={Routes.static_path(KaraokiumWeb.Endpoint, "/karaokium/images/illustrations/undraw/happy_music.svg")}
-      text={"#{@karaoke.name} - Starting soon"}
-    />
-    """
-  end
-
   def status(%{karaoke: karaoke} = assigns) when karaoke.status == :finished do
     ~H"""
     <section>

lib/karaokium_web/live/karaoke_live/show.html.heex

@@ -3,22 +3,12 @@
     <%= unless is_nil(@karaoke.performing_id) do %>
       <section style="margin-top: -50px;">
         <aside style="padding: 0;">
-          <img
-            id="cover-album"
-            style="border-radius: 4px 4px 0 0;"
-            alt={@karaoke.performing.song.album.name}
-            src={hd(@karaoke.performing.song.album.images).url}
-            height="285"
-          />
+          <img id="cover-album" style="border-radius: 4px 4px 0 0;" height="285" />
           <div style="padding: 0 0.5rem;">
-            <h3 style="margin: 0;"><%= @karaoke.performing.song.name %></h3>
-            <p>
-              <strong><%= @karaoke.performing.song.album.name %></strong>
-            </p>
             <p>
               <em><%= Enum.map(@karaoke.performing.song.artists, & &1.name) |> Enum.join(", ") %></em>
             </p>
-            <center>
+            <div class="text-center">
               <table style="padding: 0; margin-bottom: 10px;">
                 <tbody>
                   <tr>
@@ -33,7 +23,7 @@
                   <% end %>
                 </tbody>
               </table>
-            </center>
+            </div>
           </div>
         </aside>
       </section>
@@ -45,7 +35,7 @@
               <%= emoji %> <%= reaction_count(@reactions, emoji) %>
             </button>
           <% else %>
-            <div class="button" onmousedown={"reactions(this, '#{emoji}')"}>
+            <div class="button">
               <button
                 phx-throttle="1000"
                 phx-click="react"
@@ -64,15 +54,27 @@
           <header>
             <h2>Vote now!</h2>
           </header>
-          <%= for pontuation <- 1..10 do %>
-            <button phx-click="vote" phx-value-pontuation={pontuation} style="font-size: 30px; margin: 10px;">
-              <%= pontuation %>
-            </button>
-          <% end %>
+          <div class="text-center">
+            <%= for pontuation <- 1..10 do %>
+              <button phx-click="vote" phx-value-pontuation={pontuation} style="font-size: 30px; margin: 10px;">
+                <%= pontuation %>
+              </button>
+            <% end %>
+          </div>
         <% end %>
       </section>
     <% end %>
   <% else %>
-    <.status karaoke={@karaoke} />
+    <%= if @karaoke.status == :ready do %>
+      <.status
+        img={Routes.static_path(KaraokiumWeb.Endpoint, "/karaokium/images/illustrations/undraw/happy_music.svg")}
+        text={"#{@karaoke.name} - Starting soon"}
+      />
+      <span>
+        <%= live_patch("Create Performance", to: Routes.admin_performance_new_path(@socket, :new, @karaoke.id, "live")) %>
+      </span>
+    <% else %>
+      <.status karaoke={@karaoke} />
+    <% end %>
   <% end %>
 </div>

lib/karaokium_web/router.ex

@@ -101,7 +101,7 @@ defmodule KaraokiumWeb.Router do
             live "/:id/show/edit", KaraokeLive.Show, :edit
 
             live "/:karaoke_id/performances", PerformanceLive.Index, :index
-            live "/:karaoke_id/performances/new", PerformanceLive.New, :new
+            live "/:karaoke_id/performances/new/:return_to", PerformanceLive.New, :new
             live "/:karaoke_id/performances/:id/edit", PerformanceLive.Edit, :edit
             live "/:karaoke_id/performances/:id", PerformanceLive.Show, :show
             live "/:karaoke_id/performances/:id/show/edit", PerformanceLive.Show, :edit