hook up shows page and get skeleton page built

src/main.rs

@@ -92,6 +92,7 @@ async fn main() {
         .route("/shift_reports", get(shift_reports))
         .route("/shifts/:id/drinks", get(drinks))
         .route("/shifts/:id/report", get(shift_report))
+        .route("/shifts/:id/shows", get(shows))
         .fallback_service(fallback_handler)
         .with_state(state);
 
@@ -160,3 +161,7 @@ async fn shift_reports(State(state): State<AppState>) -> impl IntoResponse {
 async fn ada() -> impl IntoResponse {
     render!(ada_html)
 }
+
+async fn shows(Path(id): Path<u32>) -> impl IntoResponse {
+    render!(shows_html, id)
+}

templates/components/home_fragment.rs.html

@@ -7,13 +7,20 @@
   <div class="flex justify-center items-center">
     @:shift_button_html(open_shift.as_ref())
   </div>
-  @if open_shift.is_some() {
+  @if let Some(open_shift) = open_shift {
   <div hx-boost="true" class="flex justify-center items-center">
-    <a href="/shifts/@open_shift.unwrap().id/drinks"
+    <a href="/shifts/@open_shift.id/drinks"
       class="text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 me-2 mb-2 ">
       <button type="button">Sell Drinks</button>
     </a>
   </div>
+
+  <div hx-boost="true" class="flex justify-center items-center">
+    <a href="/shifts/@open_shift.id/shows"
+      class="text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5 me-2 mb-2 ">
+      <button type="button">Sell Shows</button>
+    </a>
+  </div>
   }
   <div hx-boost="true" class="flex justify-center items-center">
     <a href="/management"

templates/shows.rs.html

@@ -0,0 +1,22 @@
+@use super::base_html;
+@use super::components::return_to_main_html;
+
+@(shift_id: u32)
+
+@:base_html({
+
+<div hx-swap="outerHTML" hx-target="this" class="h-full">
+  <div class="fixed right-0 top-0 pr-4 pt-4">
+    @:return_to_main_html()
+  </div>
+
+  <form hx-post="/api/drinks" class="h-full flex items-center justify-center gap-28">
+    <input type="hidden" id="shift" name="shift" value="@shift_id" />
+    <button type="submit"
+      class="focus:outline-none text-white bg-green-700 hover:bg-green-800 focus:ring-4 focus:ring-green-300 font-medium rounded-lg text-sm px-5 py-2.5 dark:bg-green-600 dark:hover:bg-green-700 dark:focus:ring-green-800">
+      Submit
+    </button>
+  </form>
+</div>
+
+})