{{define "new-deck-modal"}}

{{with CurrentUser}}

<dialog id="new-deck-modal" class="modal">

  <div class="modal-box">

    <h3 class="font-bold text-lg mb-4">Create New Deck</h3>

    <form hx-post="/decks/new" hx-indicator="#new-deck-spinner">

      <div class="form-control">

        <label class="label">

          <span class="label-text">Deck Title</span>

        </label>

        <input type="text" name="title" placeholder="My Awesome Presentation" class="input input-bordered w-full" autofocus />

      </div>

      <div class="modal-action">

        <button type="button" class="btn btn-ghost" onclick="document.getElementById('new-deck-modal').close()">Cancel</button>

        <button type="submit" class="btn btn-primary">

          <span id="new-deck-spinner" class="loading loading-spinner loading-sm htmx-indicator"></span>

          Create

        </button>

      </div>

    </form>

  </div>

  <form method="dialog" class="modal-backdrop">

    <button>close</button>

  </form>

</dialog>

{{end}}

{{end}}