pollo/pages/templates/dashboard.html

{{define "title"}}
Pollo // Dashboard
{{end}}

{{define "headercontent"}}
Pollo // Dashboard
{{end}}

{{define "head"}}
<link rel="stylesheet" href="/public/css/styles.css" />
{{end}}

{{define "main"}}
<div class="flex flex-col items-center justify-center gap-8">
  <h1 class="flex flex-row flex-wrap text-center justify-center items-center gap-1 text-4xl font-bold">
    Hi, {{.Name}}!
  </h1>
  <!-- Form to create a new room -->
  <form method="POST" hx-post="/api/room/create" hx-target="#room-list" hx-swap="outerHTML">
    <input type="text" name="roomName" placeholder="Room Name" required>
    <button type="submit" class="btn btn-primary">Create Room</button>
  </form>
  <!-- Section to list rooms -->
  <div class="flex flex-col gap-2" id="room-list" hx-get="/api/room/list" hx-trigger="load">
    <!-- Example of how rooms might be loaded -->
    <!-- <div class="room-name">Room 1</div>
         <div class="room-name">Room 2</div> -->
    <!-- Rooms will be loaded here -->
  </div>
</div>
{{end}}

{{define "foot"}}
<script src="/public/js/htmx.base.js"></script>
<script src="/public/js/htmx.sse.js"></script>
{{end}}