From 8700fc87a0e1b43d8c12881ffa319cda4961a75d Mon Sep 17 00:00:00 2001
From: Tristan Gosselin-Hane <starcraft66@gmail.com>
Date: Wed, 24 Jan 2024 01:28:50 -0500
Subject: [PATCH] Add UI to cancellation modal to extend reservation duration

---
 .../components/cancellation_modal.ex          | 20 ++++++++++++++++++-
 1 file changed, 19 insertions(+), 1 deletion(-)

diff --git a/lib/lanpartyseating_web/components/cancellation_modal.ex b/lib/lanpartyseating_web/components/cancellation_modal.ex
index 8c83fa5..0879678 100644
--- a/lib/lanpartyseating_web/components/cancellation_modal.ex
+++ b/lib/lanpartyseating_web/components/cancellation_modal.ex
@@ -74,11 +74,29 @@ defmodule CancellationModalComponent do
                   "%H:%M"
                 ) %> *REPLACE WITH COUNTDOWN*</b>
                 </p>
-                <p class="py-4">Enter a reason for canceling the reservation</p>
                 <form method="dialog">
                   <button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2">✕</button>
                 </form>
 
+                <p class="py-4">Enter an amount of minutes to extend the reservation by</p>
+
+                <form phx-submit="extend_reservation">
+                  <input type="hidden" name="station_id" value={"#{@station.id}"}>
+                  <input type="hidden" name="station_number" value={"#{@station.station_number}"}>
+                  <input type="text" placeholder="Minutes to add" value="5" class="w-full max-w-xs input input-bordered" name="minutes_increment"/>
+
+                  <div class="modal-action">
+                    <button
+                      class="btn btn-success"
+                      x-on:click={"$refs.station_modal_#{@station.station_number}.close()"}
+                      type="submit">
+                      Add time to reservation
+                    </button>
+                  </div>
+                </form>
+
+                <p class="py-4">Enter a reason for canceling the reservation</p>
+
                 <form phx-submit="cancel_station">
                   <input type="hidden" name="station_id" value={"#{@station.id}"}>
                   <input type="hidden" name="station_number" value={"#{@station.station_number}"}>