Play: Show next step when there are no options

zoonk · Oct 20, 2023 · 49deb34 · 49deb34
1 parent 1d2711b
commit 49deb34
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 6 deletions.
diff --git a/lib/content/course_live/components/lesson_step.ex b/lib/content/course_live/components/lesson_step.ex
@@ -13,10 +13,10 @@ defmodule UneebeeWeb.Components.Content.LessonStep do
   def lesson_step(assigns) do
     ~H"""
     <section>
-      <p class="text-gray-dark whitespace-pre-wrap py-4"><%= @step.content %></p>
+      <p class="text-gray-dark py-4"><%= @step.content %></p>
 
       <div :if={@step.image} class="text-gray-dark flex w-full justify-center py-4">
-        <img src={@step.image} class="aspect-video w-full object-cover" />
+        <img src={@step.image} class="aspect-video w-2/3 object-cover" />
       </div>
     </section>
     """

diff --git a/lib/content/course_live/play.html.heex b/lib/content/course_live/play.html.heex
@@ -14,6 +14,8 @@
 
   <.lesson_step step={@current_step} selected={@selected_option} />
 
+  <% no_options? = @current_step.options == [] %>
+
   <form id="select-option" phx-submit="next" class="space-y-4" phx-hook="LessonSoundEffect">
     <secion :if={@current_step.options != []} class={["grid gap-4", not long_option?(@current_step.options) && "grid-cols-2"]}>
       <div :for={option <- Enum.shuffle(@current_step.options)} class="relative">
@@ -49,12 +51,12 @@
 
     <.button
       type="submit"
-      color={if @selected_option, do: :success, else: :alert}
-      icon={if @selected_option, do: "tabler-chevron-right", else: "tabler-checks"}
+      color={if @selected_option || no_options?, do: :success, else: :alert}
+      icon={if @selected_option || no_options?, do: "tabler-chevron-right", else: "tabler-checks"}
       phx-disable-with={dgettext("courses", "Confirming...")}
       class="fixed right-4 bottom-4 left-4 sm:sticky sm:w-full"
     >
-      <%= if @selected_option, do: dgettext("courses", "Next step"), else: gettext("Confirm") %>
+      <%= if @selected_option || no_options?, do: dgettext("courses", "Next step"), else: gettext("Confirm") %>
     </.button>
   </form>
 </article>
diff --git a/test/content/play_view_live_test.exs b/test/content/play_view_live_test.exs
@@ -116,7 +116,7 @@ defmodule UneebeeWeb.PlayViewLiveTest do
     lv |> form(@select_form) |> render_submit()
 
     assert has_element?(lv, ~s|section p:fl-icontains("step 4!")|)
-    assert has_element?(lv, ~s|button:fl-icontains("confirm")|)
+    assert has_element?(lv, ~s|button:fl-icontains("next step")|)
 
     step = Enum.at(lessons, 3)