{{ define "repo/pulls/fragments/pullNewComment" }}
<div
  id="pull-comment-card-{{ .RoundNumber }}"
  class="w-full flex flex-col gap-2">
  {{ template "user/fragments/picHandleLink" .LoggedInUser.Did }}
  <form
    hx-post="/{{ .RepoInfo.FullName }}/pulls/{{ .Pull.PullId }}/round/{{ .RoundNumber }}/comment"
    hx-trigger="submit, keydown[(ctrlKey || metaKey) && key=='Enter'] from:#pull-comment-textarea"
    hx-swap="none"
    hx-on::after-request="if(event.detail.successful) this.reset()"
    hx-disabled-elt="#reply-{{ .RoundNumber }}"
    class="w-full flex flex-wrap gap-2 group"
  >
    <textarea
        id="pull-comment-textarea"
        name="body"
        class="w-full p-2 rounded border"
        rows=8
        placeholder="Add to the discussion..."></textarea
    >
    {{ template "replyActions" . }}
    <div id="pull-comment"></div>
  </form>
</div>
{{ end }}

{{ define "replyActions" }}
  <div class="flex flex-wrap items-stretch justify-end gap-2 text-gray-500 dark:text-gray-400 text-sm w-full">
    {{ template "cancel" . }}
    {{ template "reply" . }}
  </div>
{{ end }}

{{ define "cancel" }}
  <button
    type="button"
    class="btn text-red-500 dark:text-red-400 flex gap-2 items-center group"
    hx-get="/{{ .RepoInfo.FullName }}/pulls/{{ .Pull.PullId }}/round/{{ .RoundNumber }}/actions"
    hx-swap="outerHTML"
    hx-target="#actions-{{.RoundNumber}}"
  >
    {{ i "x" "w-4 h-4" }}
    <span>cancel</span>
  </button>
{{ end }}

{{ define "reply" }}
  <button
    type="submit"
    id="reply-{{ .RoundNumber }}"
    class="btn-create flex items-center gap-2">
      {{ i "reply" "w-4 h-4 inline group-[.htmx-request]:hidden" }}
      {{ i "loader-circle" "w-4 h-4 animate-spin hidden group-[.htmx-request]:inline" }}
      reply
  </button>
{{ end }}