fix: walk-in time input doesn't update the selected times

lib/spazio_solazzo_web/live/admin/walk_in_live.ex

@@ -36,14 +36,14 @@ defmodule SpazioSolazzoWeb.Admin.WalkInLive do
      )}
   end
 
-  def handle_event("update_start_time", %{"value" => time_str}, socket) do
+  def handle_event("update_start_time", %{"start-time" => time_str}, socket) do
     case Time.from_iso8601(time_str <> ":00") do
       {:ok, time} -> {:noreply, assign(socket, start_time: time)}
       _ -> {:noreply, socket}
     end
   end
 
-  def handle_event("update_end_time", %{"value" => time_str}, socket) do
+  def handle_event("update_end_time", %{"end-time" => time_str}, socket) do
     case Time.from_iso8601(time_str <> ":00") do
       {:ok, time} -> {:noreply, assign(socket, end_time: time)}
       _ -> {:noreply, socket}

lib/spazio_solazzo_web/live/admin/walk_in_live.html.heex

@@ -161,7 +161,12 @@
                   </div>
                 <% else %>
                   <%!-- Single-day mode: Show time inputs --%>
-                  <div class="p-4 rounded-xl bg-slate-50 dark:bg-slate-900/50 border border-slate-200 dark:border-slate-700 flex flex-col gap-4">
+                  <.form
+                    for={%{}}
+                    as={:schedule}
+                    id="walk-in-schedule-form"
+                    class="p-4 rounded-xl bg-slate-50 dark:bg-slate-900/50 border border-slate-200 dark:border-slate-700 flex flex-col gap-4"
+                  >
                     <div class="relative">
                       <label
                         class="block text-xs font-semibold text-slate-600 dark:text-slate-300 mb-2"
@@ -173,8 +178,9 @@
                         <span class="absolute inset-y-0 left-0 flex items-center pl-3 text-slate-400 pointer-events-none">
                           <.icon name="hero-clock" class="w-4 h-4" />
                         </span>
-                        <input
+                        <.input
                           id="start-time"
+                          name="start-time"
                           type="time"
                           value={Calendar.strftime(@start_time, "%H:%M")}
                           phx-change="update_start_time"
@@ -194,8 +200,9 @@
                         <span class="absolute inset-y-0 left-0 flex items-center pl-3 text-slate-400 pointer-events-none">
                           <.icon name="hero-clock" class="w-4 h-4" />
                         </span>
-                        <input
+                        <.input
                           id="end-time"
+                          name="end-time"
                           type="time"
                           value={Calendar.strftime(@end_time, "%H:%M")}
                           phx-change="update_end_time"
@@ -203,7 +210,7 @@
                         />
                       </div>
                     </div>
-                  </div>
+                  </.form>
                 <% end %>
               </div>
             </div>

test/spazio_solazzo_web/live/admin/walk_in_live_test.exs

@@ -271,6 +271,58 @@ defmodule SpazioSolazzoWeb.Admin.WalkInLiveTest do
       assert html =~ "Not selected"
       assert html =~ ~s(value="")
     end
+
+    test "updates start and end time", %{conn: conn, user: user, space: space} do
+      conn = log_in_user(conn, user)
+      {:ok, view, _html} = live(conn, "/admin/walk-in")
+
+      tomorrow = Date.add(Date.utc_today(), 1)
+      send(view.pid, {:date_selected, tomorrow, tomorrow})
+      :timer.sleep(50)
+
+      view
+      |> element("input[name='start-time']")
+      |> render_change(%{"start-time" => "10:00"})
+
+      html =
+        view
+        |> element("input[name='end-time']")
+        |> render_change(%{"end-time" => "17:00"})
+
+      assert html =~ "value=\"10:00\""
+      assert html =~ "value=\"17:00\""
+
+      view
+      |> form("form[phx-change='validate_customer_details']", %{
+        "customer_name" => "Time Tester",
+        "customer_email" => "time@test.com"
+      })
+      |> render_change()
+
+      html =
+        view
+        |> element("form[phx-submit='create_booking']")
+        |> render_submit()
+
+      assert html =~ "Walk-in booking created successfully"
+
+      start_search = DateTime.new!(tomorrow, ~T[00:00:00], "Etc/UTC")
+      end_search = DateTime.new!(tomorrow, ~T[23:59:59], "Etc/UTC")
+
+      {:ok, bookings} =
+        BookingSystem.search_bookings(
+          space.id,
+          start_search,
+          end_search,
+          [:accepted],
+          nil
+        )
+
+      assert length(bookings) == 1
+      booking = hd(bookings)
+      assert DateTime.to_time(booking.start_datetime) == ~T[10:00:00]
+      assert DateTime.to_time(booking.end_datetime) == ~T[17:00:00]
+    end
   end
 
   describe "space selection" do